@import "reset.css";

body {
    background: url(images/pattern.png) bottom left repeat-x #2E3C41;
}

#wrapper {
    width: 780px;
    margin: auto;
    padding-top: 10px;
    background: url(images/butterfly.png) 105px 25px no-repeat;
}

#header {
    margin: 8px 0 10px 0;
    font-family: Arial, Vernada;
    color: #FFFFFF;
}

    #header h1 {
        font-size: 30px;
        font-weight: bold;
        margin-bottom: -10px;
    }
        #header h1 a {
            color: #FFFFFF;
        }

    #header p {
        font-size: 14px;
    }

#content {
    margin-top: 20px;
    font-family: "Arial", Vernada;
}
    
    #content a {
        color: #99B297;
        text-decoration: none;
    }

    #content a:hover {
        color: #59D8E5;
    }
    
#left {
    float: left;
    width: 200px;
    margin-right: 20px;
}
    
    #left .widget {
        margin-bottom: 10px;
        font-size: 12px;
        color: #E2F2C6;
    }
    
        .widget h4 {
            color: #FFF;
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 5px;
        }
    
        .widget ul {
            list-style-type: square;
            padding-left: 10px;
            margin-left: 5px;    
        }
         
#right {
    float: right;
    width: 550px;
    margin-right: 10px;
}
    #right .notice {
        padding: 10px;
        margin: 0 0 10px 0;
        background: #E2F2C6;
        color: #2E3C41;
        font-size: 12px;
    }
    
    #right .notice strong {
        font-weight: bold;
    }

    #right .post {
        padding-bottom: 80px;
        margin-bottom: 20px;
        background: url(images/hr.png) center bottom no-repeat;
    }
    
    #right .post h2 a, #right #post h1, #right #page h2 {
        font-size: 18px;
        font-weight: bold;
        color: #FFFFFF;
        margin-bottom: 15px;
    }
        #right .post h2 a:hover {
            color: #59D8E5;
        }

    #right .info {
        margin-bottom: 10px;
        padding-top: 10px;
        font-size: 12px;
        color: #FFF;
    }
    
    #right .entry {
        font-size: 12px;
        line-height: 16px;
        color: #D5FBFF;
        text-align: justify;
    }
    
        #right .entry p {
            margin: 10px 0;
        }

        #right .entry h3 {
            margin: 12px 0 10px 0;
            font-size: 16px;
            font-weight: bold;
            color: #FFF;
        }
        
        #right .entry h4 {
            margin: 10px 0 7px 0;
            font-size: 14px;
            font-weight: bold;
            color: #FFF;
        }

        #right .entry strong {
            font-weight: bold;
        }

        #right .entry em {
            font-style: italic;
        }
    
        #right .entry blockquote {
            padding: 5px 10px;
            margin: 10px 0;
            background: #4F6267;
            color: #252E30;
            font-style: italic;
            font-size: 12px;
            border: 1px solid #263135;
        }
        
        #right .entry ul, #right .entry ol {
            list-style-type: square;
            padding-left: 10px;
            margin-left: 15px;
        }
        
            #right .entry .alignleft {
                float: left;
                margin: 3px 5px 0 0;
                padding: 1px;
                border: 2px solid #445860;
            }

            #right .entry .alignright {
                float: right;
                margin: 3px 0 0 5px;
                padding: 1px;
                border: 2px solid #445860;
            }
            
        #right #pages {
            argin: 10px 0 10px 0;
            font-size: 14px;
            height: 40px;

        }
        
            #right #pages #prev {
                float: left;
            }
            
            #right #pages #next {
                float: right;
            }

     #comments {
         margin-top: 20px;     
     }
         #comments ol {
             margin-bottom: 20px;
         }
         
         #comments h5 {
            font-size: 20px;
            font-weight: bold;
            color: #FFF;
            margin-bottom: 10px;
        }
        
        #comments li {
            padding: 10px 10px 15px 10px;
            margin-bottom: 10px;
            font-size: 11px;
            background: #4F6267;
            color: #252E30;
            border: 1px solid #263135;
        }

        #comments li.odd {
            background: #445459;
        }
            
            #comments li .info {
                margin-bottom: 5px;
                padding-top: 0;
                font-size: 12px;
                color: #8BB280;
            }
            
            #comments li a.author {
                font-weight: bold;
            }

            #comments li img {
                margin-bottom: -3px;
            }

            #comments li img.gravatar {
                width: 40px;
                height: 40px;
                float: right;
                margin-left: 5px;
            }

            #comments .content {
                line-height: 15px;
                font-size: 12px;
                margin: 0 40px 0 0;
            }

            #comments blockquote {
                padding: 5px 10px;
                margin: 10px;
                background: #4D646C;
                color: #252E30;
                font-style: italic;
                font-size: 12px;
                border: 1px solid #FFF;
            }
            
    #tags {
        background: #4D646C;
        border: 1px solid #263135;
        margin-top: 15px;
        padding: 5px 10px;
        font-size: 13px;
        color: #FFF;
        
    }
    
    #comments form {
        background: #4D646C;
        border: 1px solid #263135;
        margin-top: 5px;
        padding: 10px;
    }
    
        #comments #form-left {
            width: 180px;
            float: left;
        }

        #comments #form-right {
            width: 320px;
            float: right;
        }
        
        #comments form label {
            display: block;
            font-size: 13px;
            font-weight: bold;
            margin: 7px 0 5px 0;
            width: 180px;
            color: #FFF;
        }

        #comments form input {
            width: 180px;
            border: 1px solid #E2F2C6;
            font-size: 13px;
            padding: 5px 6px;
        }

        #comments form textarea {
            width: 310px;
            height: 129px;
            float: right;
            font-size: 14px;
            padding: 5px;
            border: 1px solid #E2F2C6;
        }
    
        #comments form #submit {
            margin-top: 10px;
            width: 69px;
            height: 17px;
            border: 0;
        }
        
        #comments small {
            color: #252E30;
            display: block;
            margin-top: 10px;
        }
    
#footer {
    color: #4F6267;
    font-size: 11px;
    clear: both;
    padding: 30px 0 0 220px;
    margin-bottom: 100px;
}

    #footer a {
        color: #4F6267;
        text-decoration: none;
    }

    #footer a:hover {
        text-decoration: underline;
    }