/* Theme Name: Pierre-Nicolas */ /* Default styles */ @import "css/reset.css"; /*------------------------------------------------------------------------------------------- INDEX: 1. SETUP -1.1 Defaults -1.2 Hyperlinks 2. SITE STRUCTURE & APPEARANCE -2.1 Containers & Columns -2.2 Navigation -2.2.1 Drop-down menus -2.3 Header -2.4 Content -2.5 Sidebar -2.6 Footer 3. POSTS -3.1 Typographic Elements -3.2 Images -3.3 Pagination / WP-Pagenavi -3.4 Info boxes 4. WIDGETS -4.1 Generic Widgets -4.2 Specific Widgets -4.3 Tabs 5. COMMENTS -5.1 Comments -5.2 Pingbacks / Trackbacks -5.3 Comments Form 6. MISC -6.1 Buttons -6.2 Info Boxes -6.3 Conatct Form 7. LAYOUTS -7.1 Site Width -7.2 two-col-left -7.3 two-col-right -7.4 three-col-left -7.5 three-col-middle -7.6 three-col-right 8. TEMPLATES / SLIDER -8.1 Slider -8.2 Magazine template -8.3 Business template -------------------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------------------*/ /* 1. SETUP */ /*-------------------------------------------------------------------------------------------*/ /* 1.1 Defaults */ body { font: 14px/20px Arial,Helvetica,Sans-serif; color: #555; background-color: #fff; } h1, h2, h3, h4, h5, h6 { margin: 0; font-family:Georgia, serif; color: #222; font-weight:normal; } h1 {font-size: 28px; } h2 {font-size: 24px;} h3 {font-size: 18px;} h4 {font-size: 16px;} h5 {font-size: 14px;} h6 {font-size: 12px;} p {margin: 0; font:16px/24px Georgia, serif; } hr { background-color: #e6e6e6; border:0; height: 1px; margin-bottom: 20px; } input, textarea { padding: 7px 0 7px 7px; border-color: #ccc #efefef #efefef #ccc; border-width:1px; border-style:solid;} /* 1.2 Hyperlinks */ a:link, a:visited { color: #3088ff; text-decoration:none;} a:hover {text-decoration:underline;} h1 a:link, h1 a:visited, h2 a:link, h2 a:visited, h3 a:link, h3 a:visited, h4 a:link, h4 a:visited, h5 a:link, h5 a:visited, h6 a:link, h6 a:visited { text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration: underline;} /*-------------------------------------------------------------------------------------------*/ /* 2. SITE STRUCTURE & APPEARANCE */ /*-------------------------------------------------------------------------------------------*/ /* 2.1 Containers & Columns */ #wrapper { padding:10px 0 40px; } #main{} #sidebar{} .col-left { float: left; } .col-right { float: right; } .col-full { width: 940px; margin: 0 auto; } /* 2.2 Navigation */ #navigation{font:14px/14px Helvetica, Arial, sans-serif;border-top:1px solid #dbdbdb; border-bottom:5px solid #dbdbdb;padding:10px 0; margin-bottom:30px;} #navigation ul.rss{background:url(images/ico-rss.png) no-repeat right 5px;padding:6px 15px 3px 0;margin-right:10px;} #navigation ul.rss li{display:inline;padding:0 10px 0 0;} #navigation ul.rss li a{color:#c63f00;text-decoration:none;} #navigation ul.rss li a:hover{text-decoration:underline;} .nav { z-index:99; margin:0; padding:0; list-style:none; line-height:1; margin-left:10px; } .nav a { position:relative; color:#555; display:block; z-index:100; padding:5px 10px; line-height:18px; text-decoration:none; } .nav a:hover, .nav li.current_page_item, .nav li.current_page_parent { background:#eee; } .nav li li.current_page_item { background:none; } .nav li { float:left; width: auto; } .nav li a.sf-with-ul { padding-right:20px; } /* 2.2.1 Drop-down menus */ .nav li ul { background: #333; position: absolute; left: -999em; width: 180px; border: 1px solid #dbdbdb; border-width:1px 1px 0; z-index:999; } .nav li ul li { background:#000; border-bottom:1px solid #dbdbdb;} .nav li ul li a { width:160px; color:#E2DEDB; font-size:1.8em; line-height:28px; } .nav li ul li a.sf-with-ul { padding:5px 10px; } .nav li ul li a:hover { background:#333;} .nav li ul ul { margin: -30px 0 0 180px; } .nav li ul ul li a { } .nav li ul li ul li a { } .nav li:hover,.nav li.hover { position:static; } .nav li:hover ul ul, .nav li.sfhover ul ul, .nav li:hover ul ul ul, .nav li.sfhover ul ul ul, .nav li:hover ul ul ul ul, .nav li.sfhover ul ul ul ul { left:-999em; } .nav li:hover ul, .nav li.sfhover ul, .nav li li:hover ul, .nav li li.sfhover ul, .nav li li li:hover ul, .nav li li li.sfhover ul, .nav li li li li:hover ul, .nav li li li li.sfhover ul { left:auto; } .nav .sf-sub-indicator {background: url(images/arrow-superfish.png) no-repeat;position:absolute;display:block;right:0.4em;top:0.9em;width:10px;height:10px;text-indent:-999em;overflow:hidden;} .nav li ul .sf-sub-indicator {background:url(images/arrow-superfish-right.png) no-repeat;} /* 2.3 Header */ #header{padding:40px 0 30px;clear:both;position:relative;} #logo { float:left; } #logo img { } #logo .site-title, #logo .site-description { font-family:Georgia, serif; color: #000; display:none; } #logo .site-title a { color:#222; font-size:40px; line-height:40px; text-transform:none; font-weight:normal; text-decoration:none; } #logo .site-title a:hover { text-decoration:underline; } #logo .site-description { color:#999; font:italic 14px Georgia, serif; } #topad {float:right;} /* 2.4 Content */ #content{padding:0 0 -10px; position:relative;} /* 2.5 Sidebar */ #sidebar{overflow:hidden;} #sidebar .primary { } #sidebar .secondary { float:left; margin-right:20px; } #sidebar .tertiary { float:left; margin-right:0; } #sidebar .last { margin:0; } /* 2.6 Footer */ #footer{padding: 20px 0;border-top: 4px solid #e6e6e6; color:#999;} #footer p {font:italic normal 14px Georgia, serif;} #footer #credit img{vertical-align:middle;} #footer #credit span{display:none;} #footer .col-left { padding-left:10px; } #footer .col-right { padding-right:10px; } /*-------------------------------------------------------------------------------------------*/ /* 3. POSTS */ /*-------------------------------------------------------------------------------------------*/ #breadcrumb {} .archive_header { display: block; float: left; width: 100%; margin:0 0 30px; padding:0 0 10px; font-size: 18px; font-weight: bold; border-bottom:#e6e6e6 5px solid; } .archive_header .catrss a { font-size: 14px; text-decoration: none; line-height: 28px; } .post { margin: 0 0 40px;} /* ajout */ .post, #main .page { background:#e2dedb /* url(images/bg-gradient.png) repeat-x */; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; margin-bottom:30px;} #main .page { margin-bottom:0; } .post .title { background:#333; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; margin-bottom:30px;} .page .title { background:#333; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; margin-bottom:30px;} /* fin */ .post .title, .page .title { font:normal bold 24px/24px Arial, Helvetica, sans-serif;position:relative; margin: 0 0 15px; } .page .title { margin: 0 0 20px 0; } .post .title a:link, .post .title a:visited, .page .title a:link, .page .title a:visited{ color:#222; } .post-meta{margin: 10px 0 25px 0;font:11px/11px "Trebuchet MS", Arial, Helvetica, sans-serif; text-transform:uppercase;} .post-meta .comments a { padding: 0 0 0 20px; text-transform: uppercase; } .post-meta .small{text-transform:lowercase;} .post-meta, .post-meta .post-author a, .post-more { color:#868686; } .post-more { clear:both; text-transform:uppercase; border:1px solid #e6e6e6; border-width:4px 0 1px; padding:10px 0; font:11px/16px Arial, Helvetica, sans-serif;} .post-more a, .post-meta a { text-decoration:none; } .post-more a:hover, .post-meta a:hover { text-decoration:underline; } .post p.tags{background:url(images/ico-tag.gif) no-repeat center left;padding-left:25px;clear:both;margin-bottom:20px;} .post .post-embed { margin-bottom:30px; } .entry {} /* 3.1 Typographic Elements */ .entry h1 { border-bottom:1px solid #e6e6e6; margin-bottom:20px; padding-bottom: 20px; } .entry h2 { padding-bottom:20px; } .entry h3 { padding-bottom:10px; } .entry h4 {} .entry h5 {} .entry h6 {} .entry p { margin: 0 0 20px 0; } .entry blockquote { background:url(images/blockquote.png) no-repeat 0 12px; padding: 10px 20px 10px 50px; color: #444; } .entry blockquote p { font-style:italic; } .entry ul { margin: 0 0 15px 0; padding: 0 0 0 30px; } .entry ul ul { margin: 0; } .entry ul li { list-style-type: circle; } .entry ul ul li { list-style-type: disc; } .entry ol { margin: 0 0 15px 0; padding: 0 0 0 30px; } .entry ol ol { margin: 0; } .entry ol li { list-style-type: upper-latin; } .entry ol li ol li { list-style-type: lower-latin; } /* 3.2 Images */ .entry img, img.thumbnail { padding: 5px; border: 1px solid #e6e6e6; background:#F8F8F8; background:rgba(255,255,255,0.7); } img.wp-smiley { padding: 0; border: none; } .alignleft { float: left; width: auto; margin: 5px 15px 5px 0; } .alignright { float: right; width: auto; margin: 5px 0 5px 15px; } .aligncenter { text-align: center; margin-bottom:15px;} img.aligncenter { margin-left:auto; margin-right:auto; display:block; } .entry .wp-caption { padding: 1px; text-align:center; background:#F8F8F8; background:rgba(255,255,255,0.7); border: solid 1px #e6e6e6; } .entry .wp-caption img{ margin:0; padding:4px 0; background:none; border:0; } .entry .wp-caption-text { margin:0; padding:0; font:11px/22px Arial, Helvetica, sans-serif; text-align:center; } /* 3.3 Pagination / WP-Pagenavi */ .nav-entries, .wp-pagenavi { clear:both;font-size:11px; padding:10px 15px; border:1px solid #e6e6e6; background:#fafafa; border-width:1px 0 4px; } .nav-entries a, .wp-pagenavi a:link, .wp-pagenavi a:visited, .wp-pagenavi .current, .wp-pagenavi .on, .wp-pagenavi a:hover, .wp-pagenavi span.extend, .wp-pagenavi span.pages{ display: block; font:italic 12px/16px Georgia, serif; color:#777; text-decoration:none;} .nav-entries a:hover { text-decoration:underline; } .wp-pagenavi { margin: 0 !important; text-align: center !important; } .wp-pagenavi a:link, .wp-pagenavi a:visited { display: inline !important; text-decoration: none !important; background: #EEEEEE !important; background:rgba(0,0,0,0.1) !important; color: #666 !important; padding: 3px 7px !important; border:1px solid #DDDDDD !important; border:1px solid rgba(0,0,0,0.2) !important;} .wp-pagenavi .current, .wp-pagenavi .on, .wp-pagenavi a:hover {display:inline; padding: 3px 7px !important; background: #ddd !important; background:rgba(0,0,0,0.1) !important; border:1px solid #bbb !important; border:1px solid rgba(0,0,0,0.2) !important;} .wp-pagenavi span.extend, .wp-pagenavi span.pages { display:inline;background:none !important; border:none !important; color:#666 !important; } /*-------------------------------------------------------------------------------------------*/ /* 4. WIDGETS */ /*-------------------------------------------------------------------------------------------*/ /* 4.2 Generic Widgets */ .widget { margin: 0 0 30px 0; font-size:12px; /* background:#f8e868 url(images/bg-gradient.png) repeat-x; */ } .widget h3 { margin: 0 0 20px 10px; padding:0 0 15px; text-transform:uppercase; font:normal bold 14px Arial, Helvetica, sans-serif; color:#555; border-bottom:3px solid #e6e6e6; } .widget p { font:12px/20px Arial, Helvetica, sans-serif; margin-bottom:15px; } .widget ul { clear:both; padding-left:10px; list-style-position:inside; list-style-type:none;} .widget ul li {} .widget ul li a { padding: 0 0 0 5px; line-height: 22px; text-decoration: none; } .widget ul li a:hover { text-decoration:underline; } .widget ul ul { padding: 0 0 0 15px; border-top: none; } .widget_recent_comments li, #twitter li { padding: 6px 0; line-height: 18px; border-bottom: 1px solid #eee; } /* RESET LI STYLING FOR RECENT COMMENT & TWITTER */ .widget_recent_comments li a, #twitter a { display: inline; padding: 0; line-height: 18px!important; background: none!important; border: none!important; } /* RESET STYLING FOR RECENT COMMENT & TWITTER */ #footer-widgets { border-top:1px solid #e6e6e6; padding:10px 0; } #footer-widgets .block { padding:0px 0 0 20px; width:210px; float:left; } /* 4.2 Specific Widgets */ /* WIDGET FORMS */ .searchform { } .widget input.s { float:left; width: 60%; padding: 7px 0 7px 7px; margin-right:5px; border-color: #ccc #efefef #efefef #ccc; border-width:1px; border-style:solid;} #footer-widgets .widget input.s { width: 55%; } .widget .screen-reader-text { display: none; } .widget input.submit { margin-left:5px; float:left; } /* LIFESTREAM */ .widget_lifestream ul li { border-bottom: 1px solid #e0e6e6; } .widget_lifestream ul li a { border:none; background:none!important; } .widget_lifestream ul .lifestream_meta { color: inherit; } /* CALENDAR */ #wp-calendar{width:95%;margin-bottom:15px;clear:both;padding:0;} #wp-calendar caption{padding:0 0 10px;} #wp-calendar th,#wp-calendar td{text-align:center;background:rgba(0,0,0,.05);padding:5px;} #wp-calendar td{background:transparent;} #wp-calendar td,table#wp-calendar th{padding:3px 0;} /* 4.3 Tabs */ /*#tabs { background:#f8e868 url(images/bg-gradient.png) repeat-x; height:auto; display: block; padding:5px; margin-bottom:30px; } */ #tabs ul.wooTabs { padding:0px; } #tabs ul.wooTabs li { float: left; display:inline; color: #ffffff; margin:0px; cursor: pointer; } #tabs ul.wooTabs li a.selected, #tabs ul.wooTabs li a:hover { background:#F8F8F8; text-decoration:none; } #tabs ul.wooTabs li a { color:#777; display: block;float: left;padding: 8px; text-transform:uppercase; font:11px/18px "Trebuchet MS", Arial, Helvetica, sans-serif; } #tabs .inside { background:#F8F8F8; padding:5px;} #tabs .inside li { background:#fff; } #tabs #tab-tags { padding:10px; } #tabs .inside ul { margin:0; border: 1px solid #e6e6e6; border-width:1px 0 1px 0; } #tabs .inside li { border:1px solid #e6e6e6; border-width:0 1px 1px 1px; padding:10px; } #tabs .inside li a { color:#555; font:bold 12px/18px Georgia, serif; } #tabs .inside a:hover{} #tabs .inside li span.meta { display:block; font:11px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; text-transform:uppercase; color:#777; } #tabs .inside li img.avatar, #tabs .inside li img.thumbnail { border: 1px solid #ddd; padding: 2px; background-color: #ffffff; float: left; margin: 0 8px 0 0; } /*-------------------------------------------------------------------------------------------*/ /* 5. COMMENTS */ /*-------------------------------------------------------------------------------------------*/ /* 5.1 Comments */ #comments {position:relative;margin:30px 0 0;padding:0 0 0 0; border-top:1px solid #e6e6e6; border-top:1px solid rgba(0,0,0,0.07);} #comments h3 { background:#e2dedb; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; margin-bottom:20px;} #comments .comment.thread-even { background: #fafafa; background: rgba(0,0,0,0.02); border-bottom:1px solid #e6e6e6; border-bottom:1px solid rgba(0,0,0,0.07); } #comments .comment{margin-top:10px;width:100%;list-style-type:none;} #comments .comment .comment-container { position:relative; padding: 20px; background:#e2dedb; } #comments .comment-head { margin: 0 0 15px 0; } #comments .avatar { float:left; margin: 0 15px 10px 0; } #comments .avatar img{margin: 0;vertical-align: middle;border:1px solid #ddd; padding:3px; background:#fff; } #comments .comment-head .name { margin: 0; font-weight: bold; font-size: 15px; } #comments .comment-head .date, #comments .comment-head .edit, #comments .comment-head .perma { font-size: 11px; } #comments .comment-entry p { margin: 0 0 10px 0;} #comments .reply { padding-top:10px; } #comments .reply a { } #comments .reply a:hover { } #comments ul.children{margin:10px 10px 0 25px;padding:0; } #comments ul.children li {border-top:1px solid #e6e6e6; } #comments .cancel-comment-reply{margin:10px 0;} #comments .navigation { } #comments .navigation a{ display: block; margin: 15px 0 0 0; text-decoration: none; } #comments .navigation a:hover{} #comments h3#pings { margin-top:25px; } #comments .pingbacks li.pingback { margin:10px 0; } #comments .pingbacks li.pingback .reply { display:none; } ol.commentlist { margin:0; padding:0; } .commentlist li { list-style:none; margin-bottom:14px; } .commentlist cite { padding: 7px; display:block; font-style:normal; background:url(http://www.yoursite.com/images/bg_comments2_cite.gif); border-top:1px solid #d6e4c1; border-bottom:1px solid #779d42; color:#596e3b; } .commentlist a:link, .commentlist a:visited { color:#596e3b; } .commentlist a:hover, .commentlist a:active { color:#8ec343; } .commentlist cite img { padding:1px; border:1px solid #aab59a; float:left; margin-right:9px; } .commentlist .author { font: small-caps bold 1.2em Georgia, "Times New Roman", Times, serif; text-decoration:underline; } .commentlist .time { background: url(http://www.yoursite.com/images/bg_clock.gif) no-repeat 1px; padding-left:13px; } .commenttext { background: #9bc561 url(http://www.yoursite.com/images/bg_comments2_text.jpg) repeat-x bottom; border-top:1px solid #c5f386; padding: 0 20px 10px 20px; color:#fafcf6; } /* 5.2 Comments Form */ #respond { margin-top: 30px; background:#e2dedb; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; color:#333; font-weight:normal; margin-bottom:20px; } #respond h3 { background:#fff; padding:20px; border:1px solid #fff; border-bottom:1px solid #dbdbdb; color:#333; font-weight:normal; margin-bottom:20px; } #respond .left { float:left; width:200px; margin-right:15px; } #respond .right { float:left; width:380px; } #respond label { font-size:11px; color:#777; } #commentform { margin: 15px 0 0 0; } #commentform input.txt, #commentform textarea { font:14px/14px Arial, Helvetica, sans-serif; border-color: #ccc #efefef #efefef #ccc; border-width:1px; border-style:solid;} #commentform input.txt { color:#666; background: #fcfcfc; width: 170px; margin: 0 5px 10px 0; padding: 5px 7px; } #commentform textarea { color:#666; background: #fcfcfc; width: 95% !important; padding: 5px 7px; } #commentform #submit { margin: 15px 0 0 0; } /* 5.3 Pingbacks / Trackbacks */ h3#pings { margin: 25px 0 10px 0; } .pinglist li { margin: 0 0 0 20px; list-style-type: decimal; } .pinglist li .author { font-weight: bold; font-size: 15px; } .pinglist li .date { font-size: 11px; } .pinglist li .pingcontent { display: block; margin: 10px 0; } /*-------------------------------------------------------------------------------------------*/ /* 6. MISC */ /*-------------------------------------------------------------------------------------------*/ /* 6.1 Buttons */ .button, .button:visited, .reply a{ font-family:Verdana, Geneva, sans-serif; background: url(images/alert-overlay.png); display: inline-block; padding: 5px 10px 6px; color: #fff !important; text-decoration: none; border:none; position: relative; cursor: pointer; } .button, .button:visited, .reply a{ background-color:#555; } .button:hover, .reply a:hover { color: #fff !important; text-decoration:none; } .button:active, .reply a:active { top: 1px; } .small.button, .small.button:visited, .reply a { font-size: 10px; padding: 0px 6px 1px; text-transform:uppercase;} .button, .button:visited, .medium.button, .medium.button:visited { font-size: 13px; font-weight: bold; line-height: 1; } .large.button, .large.button:visited { font-size: 14px; padding: 8px 14px 9px; } /* 6.2 Info Boxes */ p.alert, p.download, p.info, p.note, p.tick { margin:10px 0 20px 0; padding:9px 10px 9px 50px; } p.alert { border-top:1px solid #f0baa2; border-bottom:1px solid #f0baa2; background:#ffd9c8 url(images/ico-alert.png) no-repeat 20px 13px; } p.download { border-top:1px solid #d4ebaf; border-bottom:1px solid #d4ebaf; background:#edfcd5 url(images/ico-download.png) no-repeat 20px 13px; } p.tick { border-top:1px solid #d4ebaf; border-bottom:1px solid #d4ebaf; background:#edfcd5 url(images/ico-tick.png) no-repeat 20px 13px; } p.info { border-top:1px solid #ccc; border-bottom:1px solid #ccc; background:#eee url(images/ico-info.png) no-repeat 20px 13px; } p.note { border-top:1px solid #efe3ae; border-bottom:1px solid #efe3ae; background:#fef6d2 url(images/ico-note.png) no-repeat 20px 13px; } /* 6.3 Contact Form */ #contact-page .screenReader { left: -9999px; position: absolute; top: -9999px; } #contact-page ol.forms{float:left;list-style:none;width:100%;margin:10px 0 0;} #contact-page ol.forms li{clear:both;float:left;margin-bottom:18px;position:relative;width:100%} #contact-page ol.forms label{cursor:pointer;display:block;float:left;font-weight:700;padding-right:20px;width:100px;} #contact-page ol.forms input.txt{width:214px;} #contact-page ol.forms input#sendCopy{border:none;} #contact-page ol.forms textarea{height:300px;width:70%;} #contact-page ol.forms li .error{font-size:12px;display:block;margin-left:120px;color:red;} #contact-page ol.forms li.textarea .error{display:block; margin-left:120px} #contact-page ol.forms li.screenReader{margin-bottom:0;} #contact-page ol.forms li.buttons .submit{margin: 15px 0 0 120px; } #contact-page ol.forms li.inline input{width:auto;margin-left:120px;} #contact-page ol.forms li.inline label{display:inline;float:none;width:auto;} /*-------------------------------------------------------------------------------------------*/ /* 7. LAYOUTS */ /*-------------------------------------------------------------------------------------------*/ /* 7.1 Site width */ .width-980 .col-full { width:980px; } .width-960 .col-full { width:960px; } .width-940 .col-full { width:940px; } .width-880 .col-full { width:880px; } .width-760 .col-full { width:760px; } .width-980 #wrapper { width:980px; margin-left:auto; margin-right:auto; } .width-960 #wrapper { width:960px; margin-left:auto; margin-right:auto; } .width-940 #wrapper { width:940px; margin-left:auto; margin-right:auto; } .width-880 #wrapper { width:880px; margin-left:auto; margin-right:auto; } .width-760 #wrapper { width:760px; margin-left:auto; margin-right:auto; } .width-980 #footer-widgets .block {width:220px} .width-960 #footer-widgets .block {width:215px} .width-880 #footer-widgets .block {width:195px} .width-760 #footer-widgets .block {width:165px} /* 7.2 two-col-left */ .two-col-left #main-sidebar-container { display:inline; } .two-col-left #main-sidebar-container #main{width:610px; float:left; display:inline; } .two-col-left #main-sidebar-container #sidebar{width:320px; float:right; display:inline; } .two-col-left-980 #main-sidebar-container #main { width:630px; } .two-col-left-960 #main-sidebar-container #main { width:610px; } .two-col-left-880 #main-sidebar-container #main { width:530px; } .two-col-left-760 #main-sidebar-container #main { width:460px; } .two-col-left-880 #main-sidebar-container #sidebar { width:320px; } .two-col-left-760 #main-sidebar-container #sidebar { width:270px; } /* 7.3 two-col-right */ .two-col-right #main-sidebar-container { display:inline; } .two-col-right #main-sidebar-container #main{width:610px; float:right; display:inline; } .two-col-right #main-sidebar-container #sidebar{width:300px; float:left; display:inline; } .two-col-right-980 #main-sidebar-container #main { width:650px; } .two-col-right-960 #main-sidebar-container #main { width:630px; } .two-col-right-880 #main-sidebar-container #main { width:550px; } .two-col-right-880 #main-sidebar-container #sidebar { width:300px; } .two-col-right-760 #main-sidebar-container #main { width:480px; } .two-col-right-760 #main-sidebar-container #sidebar { width:250px; } /* 7.4 three-col-left */ .three-col-left #main-sidebar-container { width:760px; float:left; position:relative; display:inline; } .three-col-left #main-sidebar-container #main{width:440px; float:left; display:inline; } .three-col-left #main-sidebar-container #sidebar{width:300px; float:right; display:inline; } .three-col-left #sidebar-alt { float:right; width:160px; margin:0; display:inline; } .three-col-left-980 #main-sidebar-container { width:800px; } .three-col-left-980 #main-sidebar-container #main { width:480px; } .three-col-left-960 #main-sidebar-container { width:780px; } .three-col-left-960 #main-sidebar-container #main { width:460px; } .three-col-left-880 #main-sidebar-container { width:740px; } .three-col-left-880 #main-sidebar-container #main { width:420px; } .three-col-left-880 #main-sidebar-container #sidebar { width:300px; } .three-col-left-880 #sidebar-alt { width:120px; } .three-col-left-760 #main-sidebar-container { width:620px; } .three-col-left-760 #main-sidebar-container #main { width:350px; } .three-col-left-760 #main-sidebar-container #sidebar { width:250px; } .three-col-left-760 #sidebar-alt { width:120px; } /* 7.5 three-col-middle */ .three-col-middle #main-sidebar-container { width:760px; float:right; position:relative; display:inline; } .three-col-middle #main-sidebar-container #main{width:440px; float:left; display:inline; } .three-col-middle #main-sidebar-container #sidebar{width:300px; float:right; display:inline; } .three-col-middle #sidebar-alt { float:left; width:160px; margin:0; display:inline; } .three-col-middle-980 #main-sidebar-container { width:800px; } .three-col-middle-980 #main-sidebar-container #main { width:480px; } .three-col-middle-960 #main-sidebar-container { width:780px; } .three-col-middle-960 #main-sidebar-container #main { width:460px; } .three-col-middle-880 #main-sidebar-container { width:740px; } .three-col-middle-880 #main-sidebar-container #main { width:420px; } .three-col-middle-880 #main-sidebar-container #sidebar { width:300px; } .three-col-middle-880 #sidebar-alt { width:120px; } .three-col-middle-760 #main-sidebar-container { width:620px; } .three-col-middle-760 #main-sidebar-container #main { width:350px; } .three-col-middle-760 #main-sidebar-container #sidebar { width:250px; } .three-col-middle-760 #sidebar-alt { width:120px; } /* 7.6 three-col-right */ .three-col-right #main-sidebar-container { width:760px; float:right; position:relative; display:inline; } .three-col-right #main-sidebar-container #main{width:440px; float:right; display:inline; } .three-col-right #main-sidebar-container #sidebar{width:300px; float:left; display:inline; } .three-col-right #sidebar-alt { float:left; width:160px; margin:0; display:inline; } .three-col-right-980 div#wrapper #main-sidebar-container { width:800px; } .three-col-right-980 div#wrapper #main-sidebar-container #main { width:480px; } .three-col-right-960 div#wrapper #main-sidebar-container { width:780px; } .three-col-right-960 div#wrapper #main-sidebar-container #main { width:460px; } .three-col-right-880 #main-sidebar-container { width:740px; } .three-col-right-880 #main-sidebar-container #main { width:420px; } .three-col-right-880 #main-sidebar-container #sidebar { width:300px; } .three-col-right-880 #sidebar-alt { width:120px; } .three-col-right-760 #main-sidebar-container { width:620px; } .three-col-right-760 #main-sidebar-container #main { width:350px; } .three-col-right-760 #main-sidebar-container #sidebar { width:250px; } .three-col-right-760 #sidebar-alt { width:120px; } /*-------------------------------------------------------------------------------------------*/ /* 8. TEMPLATES / SLIDER */ /*-------------------------------------------------------------------------------------------*/ /* 8.1 Slider */ .one-col-980 #loopedSlider, .one-col-980 #loopedSlider .container { width: 980px; } .one-col-960 #loopedSlider, .one-col-960 #loopedSlider .container { width: 960px; } .one-col-940 #loopedSlider, .one-col-940 #loopedSlider .container { width: 940px; } .one-col-880 #loopedSlider, .one-col-880 #loopedSlider .container { width: 880px; } .one-col-760 #loopedSlider, .one-col-760 #loopedSlider .container { width: 760px; } .two-col-left-980 #loopedSlider, .two-col-left-980 #loopedSlider .container, .two-col-right-980 #loopedSlider, .two-col-right-980 #loopedSlider .container { width: 650px; } .two-col-left-960 #loopedSlider, .two-col-left-960 #loopedSlider .container, .two-col-right-960 #loopedSlider, .two-col-right-960 #loopedSlider .container { width: 630px; } .two-col-left-940 #loopedSlider, .two-col-left-940 #loopedSlider .container, .two-col-right-940 #loopedSlider, .two-col-right-940 #loopedSlider .container { width: 610px; } .two-col-left-880 #loopedSlider, .two-col-left-880 #loopedSlider .container, .two-col-right-880 #loopedSlider, .two-col-right-880 #loopedSlider .container { width: 550px; } .two-col-left-760 #loopedSlider, .two-col-left-760 #loopedSlider .container, .two-col-right-760 #loopedSlider, .two-col-right-760 #loopedSlider .container { width: 480px; } .three-col-left-980 #loopedSlider, .three-col-left-980 #loopedSlider .container, .three-col-middle-980 #loopedSlider, .three-col-middle-980 #loopedSlider .container, .three-col-right-980 #loopedSlider, .three-col-right-980 #loopedSlider .container { width: 480px; } .three-col-left-960 #loopedSlider, .three-col-left-960 #loopedSlider .container, .three-col-middle-960 #loopedSlider, .three-col-middle-960 #loopedSlider .container, .three-col-right-960 #loopedSlider, .three-col-right-960 #loopedSlider .container { width: 460px; } .three-col-left-940 #loopedSlider, .three-col-left-940 #loopedSlider .container, .three-col-middle-940 #loopedSlider, .three-col-middle-940 #loopedSlider .container, .three-col-right-940 #loopedSlider, .three-col-right-940 #loopedSlider .container { width: 440px; } .three-col-left-880 #loopedSlider, .three-col-left-880 #loopedSlider .container, .three-col-middle-880 #loopedSlider, .three-col-middle-880 #loopedSlider .container, .three-col-right-880 #loopedSlider, .three-col-right-880 #loopedSlider .container { width: 420px; } .three-col-left-760 #loopedSlider, .three-col-left-760 #loopedSlider .container, .three-col-middle-760 #loopedSlider, .three-col-middle-760 #loopedSlider .container, .three-col-right-760 #loopedSlider, .three-col-right-760 #loopedSlider .container { width: 350px; } #loopedSlider .container { height:300px; overflow:hidden; position:relative; } #loopedSlider .slides { position:absolute; top:0; left:0; } #loopedSlider { margin:0 auto 40px; padding:0; position:relative;} #loopedSlider .nav-buttons { list-style-type:none; margin:0; padding:0; position:relative;} #loopedSlider .content { position:absolute; left:0px; top:20px; } #loopedSlider .content h2 a { float:left; color:#fff; margin-bottom:0; padding:5px 20px;} #loopedSlider .content h2 a:hover { text-decoration:underline; } #loopedSlider .content p { clear:both; float:left; color:#ccc; padding:5px 20px 10px 20px; } #loopedSlider .content p, #loopedSlider .content h2 a{ background:rgb(0,0,0); background:rgba(0,0,0,.7); max-width:350px; } /* 8.2 Magazine template */ .magazine .block { float:left; width:48%; } .magazine .block.last { float:right; } .magazine #loopedSlider a.previous { position:absolute; bottom:10px; right:50px; opacity:0.8;} .magazine #loopedSlider a.next { position:absolute; bottom:10px; right:15px; opacity:0.8;} .magazine #loopedSlider a.previous:hover, #loopedSlider a.next:hover { opacity:1; } /* 8.2 Business template */ .business #loopedSlider, .business #loopedSlider .container { width:auto; } .business #loopedSlider a.previous { position:absolute; top:45%; left:-40px; opacity:0.8;} .business #loopedSlider a.next { position:absolute; top:45%; right:-40px; opacity:0.8;} .business #loopedSlider a.previous:hover, #loopedSlider a.next:hover { opacity:1; } .business #loopedSlider .entry { padding:0 15px; } .img2 {}