@import 'reset.css';
@import 'text.css';
@import '960.css';

@import 'syntaxhighlighter/shCore.css';
@import 'syntaxhighlighter/shThemeDefault.css';

body { font: 77%/1.6em verdana, sans-serif; text-align: justify; color: #505050; background: #f0f3f2; }

a { color: #505050; text-decoration: underline; }
a:hover { text-decoration: none; }

h1, h2, h3, h4, h5, h6 { font-family: Helvetica, Arial, sans-serif; text-align: left; }
h2 { font-size: 1.9em; line-height: 1.3em; margin: 0; }
h3 { font-size: 1.5em; line-height: 1.2em; margin-bottom: 10px; }
h4 { font-size: 1.3em; line-height: 1.2em; margin-bottom: 10px; }

big { font-size: 1.1em; }
small { font-size: 0.9em; }

ul, ol { margin-left: 20px; }
code, pre { font-size: 1em; }

input, textarea, select { font: 95%/1.6em verdana, sans-serif; color: #505050; }
.error_list, .required { color: #ff0000; }

.syntaxhighlighter .line .content, .syntaxhighlighter .ruler { border-color: #A9A9A9 !important; }

.container_12 { position: relative; }

.erase { display: block; text-indent: -5000px; font-size: 0; }

.floatleft { float: left; }
.floatright { float: right; }

.border { border: 1px solid #8f8f8f; }

/**
 * Link category style
 */
.category { padding: 2px 6px; color: #fff; font-weight: bold; background: #769693; text-decoration: none; font-size: 0.9em; line-height: 1.4em; }
    .category-php { background: #778898; }
    .category-css { background: #926d6f; }
    .category-javascript { background: #738672; }
    .category-webdesign { background: #8e7e70; }

/**
 * Tags
 */
.tag { width: 16px; height: 16px; background: url(../images/tag.png) 0 -16px; }
    .tag-php { background-position: 0 -176px; }
    .tag-css { background-position: 0 -112px; }
    .tag-javascript { background-position: 0 -144px; }
    .tag-webdesign { background-position: 0 -176px; }

.link { display: block; background: #f1f2f1; border: 1px solid #dee0de; border-bottom-width: 3px; padding: 3px 17px 1px 0; text-align: right; font-size: 1.1em; font-weight: bold; color: #505050 !important; text-decoration: none; font-family: Helvetica, Arial, sans-serif; }

/**
 * Header
 */
#quick-links { display: none; }
#header { background: url(../images/bg-header.jpg) repeat-x; height: 121px; }

    /* logo */
    #header h1 { position: absolute; top: 68px; left: 13px; background: url(../images/bg-logo.png); width: 263px; height: 32px; }
        #header h1 a { display: block; height: 32px; }
    
    /* search form */
    #header #search-form { position: absolute; top: 23px; right: 0; width: 175px; height: 30px; }
        #header #search-form label { display: none; }
        #header #search-form #search { position: absolute; top: 1px; left: 0; width: 146px; background: #eee; border: 1px solid #d7dedd; padding: 5px 8px 4px 8px; }
        #IE6 #header #search-form #search,
        #IE7 #header #search-form #search { padding: 2px 8px 7px 8px; }
        #header #search-form #search-submit { position: absolute; top: 0; right: 0; background: url(../images/btn-search-submit.png); width: 26px; height: 30px; border: 0; cursor: pointer; }
    
    /* menu */
    #header #nav { position: absolute; top: 69px; right: 10px; margin: 0; list-style: none; font: 1.4em Helvetica, Arial, sans-serif; }
        #header #nav li { margin: 0; font-weight: bold; float: left; margin-left: 60px; }
            #header #nav li a { display: block; color: #666; text-decoration: none; line-height: 30px; border-bottom: 4px solid #9da6a0; }
            #header #nav li a:hover,
            #header #nav li.current a { border-bottom-color: #666; }
        
        #header #nav li#rss-link { margin: 7px 0 0 40px; }
            #header #nav li#rss-link a { border: 0; }

/**
 * Featured post (homepage)
 */
#featured { background: #93b1ae; border-bottom: 3px solid #7e9b9a; color: #fff; padding: 10px 0 5px 0; }
    #featured a { color: #fff; }
    #featured .pic { border: 10px solid #fff; margin: 5px 0; }
    #featured big { font-size: 1.3em; }

/**
 * Content
 */
#content { background: #fff; padding-bottom: 40px; }
#content.article { padding-bottom: 0; }

    /* post styles */
    .post h2 a,
    .post h3 a,
    .post h4 a { text-decoration: none; }
    .post h2 a:hover,
    .post h3 a:hover,
    .post h4 a:hover { color: #222; }
    .post h3 { height: 41px; overflow: hidden; }
    
    .post .informations { margin: 10px 0; }
        .post .informations .category { float: left; margin-right: 15px; }
        .post .informations .tag-list { margin: 0; list-style: none; font-size: 0.9em; text-align: left; }
            .post .informations .tag-list li { margin: 0 5px 0 0; padding: 0; display: inline; }
            .post .informations .tag-list li.tag { display: block; float: left; margin-top: 3px; }
    .post .extract { margin-bottom: 8px; }
    .post a.comments { text-decoration: none; }
    
    /* news & article summary styles */
    .post.news,
    .post.sumarticle { margin-bottom: 20px; border-bottom: 1px dotted #505050; }
        .post.news h3,
        .post.sumarticle h3 { height: auto; overflow: auto; }
        .post.news .informations,
        .post.sumarticle .informations { margin: 0; }
            .post.news .informations .tag-list,
            .post.sumarticle .informations .tag-list { margin-bottom: 15px; }
                .post.news .informations .tag-list li,
                .post.sumarticle .informations .tag-list li { line-height: 1.2em; }
                .post.news .informations .tag-list li.tag,
                .post.sumarticle .informations .tag-list li.tag { margin-top: 0; }
    
    /* article styles */
    .article.prefix_3 { padding: 30px 0 40px 10px; margin-left: 240px; }
    #IE6 .article { padding-left: 0; }
    .article { border-left: 1px solid #dfdfdf; }
        .article blockquote.alignleft,
        .article h3,
        .article h4,
        .article h5,
        .article h6 { position: absolute; left: 0; width: 227px; padding: 10px 10px 10px 0; text-align: right; border-right: 3px solid #A9A9A9; }
        .article blockquote { padding: 0 60px 0 30px; margin: 0 20px 20px 0; text-align: left; background: url(../images/bg-blockquote.png) no-repeat right bottom; }
    
    .tab1 { border-collapse: collapse; width: 100%; }
        .tab1 td, .tab1 th { padding: 4px 5px; border: 1px solid #999; }
        .tab1 tr.odd td, .tab1 th { background: #eee; }
    
    .important { background: #f6f5f5; margin-bottom: 20px; padding-bottom: 10px; }
        .important .title { background: #eee; font-size: 1.1em; font-weight: bold; padding: 8px; margin-bottom: 10px; }
    
    /* titles (home page) / page separation(s) */
    #titles,
    .separation { background: #eef2f1; border-top: 1px solid #f2f2f2; border-bottom: 3px solid #dce3e1; height: 30px; padding-top: 11px; margin-bottom: 20px; }
    .separation { border-top: 2px solid #dce3e1; border-bottom: 2px solid #dce3e1; }
        #titles h4,
        .separation h4 { font-size: 1.2em; line-height: 1.4em; text-transform: uppercase; }
            #titles h4 a,
            .separation h4 a { text-decoration: none; }
    
    /* recent news */
    #recent-news .post,
    #recent-articles-mini .post { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dotted #505050; }
        #recent-news .post p,
        #recent-articles-mini .post p { margin: 0; }
    
    /* archives */
    #archives { width: 640px; float: left; }
        #archives h2 { position: absolute; left: 0; width: 105px; padding: 19px 10px 0 10px; text-align: right; font-size: 1.5em; }
        #IE6 #archives h2,
        #IE7 #archives h2 { position: relative; }
        #archives h3 { height: auto; overflow: auto; }
        #archives .grid_6 { margin-left: 125px; padding: 20px 0 10px 10px; border-left: 1px solid #dfdfdf; border-bottom: 1px dotted #dfdfdf; }
            #archives .grid_6 p { margin-bottom: 10px; }
        #recent-news.archives .post { border-bottom: 1px dotted #dfdfdf; }
        
        /* tags cloud */
        #tags-cloud { list-style: none; margin: 0 0 20px 0; text-align: center; }
            #tags-cloud li { display: inline; margin: 0 20px 0 0; white-space: nowrap; }
            #IE6 #tags-cloud li,
            #IE7 #tags-cloud li { display: block; float: left; margin: 0 20px 0 0; }
            #tags-cloud li.level2 { font-size: 1.4em; }
            #tags-cloud li.level3 { font-size: 1.7em; }
            #tags-cloud li.level4 { font-size: 2em; }
    
    /* articles archives */
    #articles-archives { width: 640px; }
    
    /* category archives */
    #category-archives { padding-top: 20px; }
    
    /* latest comments */
    #latest-comments { text-align: left; }
        #latest-comments ul { list-style: none; margin: 0; }
        #latest-comments li { padding-bottom: 10px; margin: 0 0 10px 0; border-bottom: 1px dotted #505050; }
            #latest-comments li p { margin: 0; }
    
    /* pagination */
    .pagination { margin-left: 100px; }
        .pagination .floatleft { padding-top: 4px; margin-right: 20px; }
        .pagination ul { list-style: none; }
            .pagination li { display: block; border: 1px solid #dee0de; margin: 0 10px 0 0; float: left; }
                .pagination li a, .pagination li span, .pagination li strong { display: block; padding: 4px 8px; }
                .pagination li:hover, .pagination li.current { background: #f1f2f1; }
    
    /**
     * comments
     */
    #comments,
    #comment-form { background: #fff; }
    
    /* comment list */
    #comments .comment-list { margin-left: 240px; border-left: 1px solid #eee; }
        #comments .comment { margin: 0 150px 30px -3px; text-align: left; min-height: 90px; }
            #comments .comment .comment-informations { position: absolute; left: 0; width: 227px; padding: 0 10px 0 0; text-align: right; }
                #comments .comment .comment-informations img { padding: 1px; border: 1px solid #8f8f8f; }
            #comments .comment .content  { padding-left: 10px; border-left: 3px solid #A9A9A9; }
    
    /* comment form */
    #comment-form-fields { margin-left: 240px; border-left: 1px solid #eee; list-style: none; }
        #comment-form-fields li { min-height: 40px; margin-bottom: 3px; }
        #comment-form-fields label { position: absolute; left: 0; width: 227px; padding: 3px 10px 0 0; text-align: right; line-height: 1.1em; }
        #comment-form-fields input,
        #comment-form-fields textarea { width: 200px; background: #f1f2f1; border: 1px solid #dee0de; padding: 4px 6px 3px 6px; }
        #comment-form-fields textarea { width: 400px; height: 115px; }
        #comment-form-fields .submit { width: 85px; }
        
        #comment-form-fields .error_list { margin: 0; list-style: none; }
            #comment-form-fields .error_list li { min-height: 0; margin: 0; }
    
    /* contact form */
    #contact-form-fields { list-style: none; margin: 0; }
        #contact-form-fields li { min-height: 40px; margin: 0 0 3px 0; }
        #contact-form-fields label { display: block; text-align: left; }
        #contact-form-fields input,
        #contact-form-fields textarea { width: 230px; background: #eef2f1; border: 1px solid #dce3e1; padding: 4px 6px 3px 6px; }
        #contact-form-fields textarea { width: 230px; height: 115px; }
        #contact-form-fields .submit { width: 85px; }
        
        #contact-form-fields .error_list { margin: 0; list-style: none; }
            #contact-form-fields .error_list li { min-height: 0; margin: 0; }
    
    /* error 404 */
    #error404 { text-align: center; }
        #error404 h2 { text-align: center; font-size: 100px; margin: 30px 0 20px 0; }
    
    /**
     * Portfolio
     */
    .reference .informations { margin: 7px 0; font-size: 1.1em; }
    .reference .extract { margin: 15px 0 20px 0; }
    #references .pic { border: 10px solid #f1f1f1; margin: 5px 0; }

/**
 * Footer
 */
#footer { background: url(../images/bg-footer.png) repeat-x; padding: 25px 0 50px 0; }
    #footer h3 { font-size: 1.1em; line-height: 1.5em; border-bottom: 3px solid #c3c2c2; padding-bottom: 7px; }
        #footer h3 a { text-decoration: none; }
        #footer h3 a:hover { text-decoration: underline; }
    
    #footer #latest-posts { /*list-style: none;*/ margin: 0; }
        /*#footer #latest-posts li { padding-bottom: 5px; margin: 0 0 5px 0; border-bottom: 1px dotted #505050; text-align: left; }*/
    
    #footer .category-list { list-style: none; margin: 0; }
        #footer .category-list li { margin: 0 20px 0 0; float: left; }
    
    #footer .tags-cloud { list-style: none; margin: 0 0 20px 0; text-align: center; }
        #footer .tags-cloud li { display: inline; margin: 0 20px 0 0; white-space: nowrap; }
        #IE6 #footer .tags-cloud li,
        #IE7 #footer .tags-cloud li { display: block; float: left; margin: 0 20px 0 0;  }
        #footer .tags-cloud li.level2 { font-size: 1.3em; }
        #footer .tags-cloud li.level3 { font-size: 1.6em; }
        #footer .tags-cloud li.level4 { font-size: 1.9em; }
    
    #footer .flickr-feed { list-style: none; margin: 0; }
        #footer .flickr-feed li { display: block; float: left; margin: 0; padding: 0; line-height: 0; }

/**
 * Themes
 */
.theme-php body { background: #f0f3f2; }
.theme-php #header { background-position: 0 -121px; }
.theme-php #featured { background: #90a2b4; border-bottom-color: #7c8b9d; }
.theme-php #titles,
.theme-php .separation,
.theme-php #comment-form-fields input,
.theme-php #comment-form-fields textarea { background: #eceff0; border-color: #dce1e4; }

.theme-css body { background: #f1f4f1; }
.theme-css #header { background-position: 0 -363px; }
.theme-css #featured { background: #c08386; border-bottom-color: #a9706f; }
.theme-css #titles,
.theme-css .separation,
.theme-css #comment-form-fields input,
.theme-css #comment-form-fields textarea { background: #f5eeef; border-color: #e6d9dc; }

.theme-javascript body { background: #f1f4f1; }
.theme-javascript #header { background-position: 0 -242px; }
.theme-javascript #featured { background: #90b49b; border-bottom-color: #7c9d89; }
.theme-javascript #titles,
.theme-javascript .separation,
.theme-javascript #comment-form-fields input,
.theme-javascript #comment-form-fields textarea { background: #f0f4f1; border-color: #dce4dd; }

.theme-webdesign body { background: #f1f4f1; }
.theme-webdesign #header { background-position: 0 -484px; }
.theme-webdesign #featured { background: #a2a2a2; border-bottom-color: #8c8c8c; }
.theme-webdesign #titles,
.theme-webdesign .separation,
.theme-webdesign #comment-form-fields input,
.theme-webdesign #comment-form-fields textarea { background: #f1f1f1; border-color: #e0e0e0; }