/* Theme Name: SendToPrint Table of contents: ------------------ 1. STRUCTURE a.header b.main c.footer 2. TYPOGRAPHY 3. HEADER a. Social Bar b. Logo c. Main Navigation 4. SLIDER 5. MAIN 6. GRID (columns) 7. BASIC ELEMENTS 8. LAYOUTS a. Post layout 1 b. Post layout 2 c. Post layout 3 d. gallery layout 1 e. gallery layout 2 */ /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 1. STRUCTURE --- ///////////////////////////////////////////////////////////////////////////////////////////// */ body { background: #FFF; color: #545454; font: 13px/21px "Helvetica Neue", Helvetica, Arial, sans-serif; -webkit-transition-property: font-size; -moz-transition-property: font-size; -o-transition-property: font-size; transition-property: font-size; -webkit-transition-duration: 0.5s, 0.5s; -moz-transition-duration: 0.5s, 0.5s; -o-transition-duration: 0.5s, 0.5s; transition-duration: 0.5s, 0.5s; -webkit-transition-timing function: linear, ease-in; -moz-transition-timing function: linear, ease-in; -o-transition-timing function: linear, ease-in; transition-timing function: linear, ease-in; -webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; } .boxed{ margin:20px auto; width:100%; max-width:960px; } .stretched{ background: #fff; } /* -------------------------- Custom text font -------------------------- */ body.hevetica_text{ font-family:"Helvetica Neue", "Helvetica", Arial, sans-serif !important; } body.lucida_text{ font-family:"Lucida Sans Unicode", "Lucida Grande", Arial, sans-serif !important; } body.georgia_text{ font-family:Georgia, "Times New Roman", Times, serif !important; } body.times_text{ font-family:"Times New Roman", Times, Georgia, serif !important; } body.arial_text{ font-family:Arial, Helvetica, sans-serif !important; } body.geneva_text{ font-family:Geneva, Tahoma, sans-serif !important; } body.tahoma_text{ font-family:Tahoma, Geneva, sans-serif !important; } /* -------------------------- Custom backgrounds -------------------------- */ .bg-square{ background:#e2e2e2 url(../images/backgrounds/square.png) repeat 50% top; } .bg-square2{ background:#e2e2e2 url(../images/backgrounds/square2.png) repeat 50% top; } .bg-pixel{ background:#e2e2e2 url(../images/backgrounds/pixel.png) repeat 50% top; } .bg-paper{ background:#e2e2e2 url(../images/backgrounds/paper.jpg) repeat 50% top; } .bg-plaid{ background:#e2e2e2 url(../images/backgrounds/plaid.png) repeat 50% top; } .bg-noise{ background:#e2e2e2 url(../images/backgrounds/bgnoise_lg.png) repeat 50% top; } .bg-aluminium{ background:#e2e2e2 url(../images/backgrounds/aluminium.png) repeat 50% top; } .bg-type{ background:#e2e2e2 url(../images/backgrounds/type.png) repeat 50% top; } .bg-diagonal{ background:#e2e2e2 url(../images/backgrounds/diagonal.png) repeat 50% top; } .bg-deboss{ background:#e2e2e2 url(../images/backgrounds/fancy_deboss.png) repeat 50% top; } .bg-white{ background:#e2e2e2 url(../images/backgrounds/white.png) repeat 50% top; } .bg-wall{ background:#e2e2e2 url(../images/backgrounds/wall.png) repeat 50% top; } .bg-freckles{ background:#e2e2e2 url(../images/backgrounds/freckles.png) repeat 50% top; } .bg-mathematics{ background:#e2e2e2 url(../images/backgrounds/mathematics.png) repeat 50% top; } .bg-pinstripe{ background:#e2e2e2 url(../images/backgrounds/pinstripe.png) repeat 50% top; } .bg-carbon{ background:#e2e2e2 url(../images/backgrounds/white_carbon.png) repeat 50% top; } .bg-grain{ background:#C4C4C4 url(../images/backgrounds/bg_grain.png) repeat 50% top; } .bg-office{ background:#C4C4C4 url(../images/backgrounds/office_bg.png) repeat 50% top; } .bg-stone{ background:#C4C4C4 url(../images/backgrounds/stone_bg.jpg) repeat 50% top; } .bg-grid{ background:#C4C4C4 url(../images/backgrounds/cross.png) repeat 50% top; } .bg-cunn{ background:#FFFFFF url(../images/backgrounds/bg_cunn.png) repeat 50% top; } .bg-cross{ background:#000 url(../images/backgrounds/bg_cross.jpg) repeat 50% top !important;} .bg-fiber{background:url(../images/backgrounds/texture-fiber.jpg) repeat;} .bg-canson{background:url(../images/backgrounds/texture-canson.jpg) repeat;} .bg-school{background:url(../images/backgrounds/texture-school.jpg) repeat;} .bg-vichy{background:url(../images/backgrounds/texture-vichy.jpg) repeat;} .bg-brushed{background:url(../images/backgrounds/texture-brushed.jpg) repeat;} .bg-crossed{background:url(../images/backgrounds/texture-crossed.jpg) repeat;} .bg-line{background:url(../images/backgrounds/texture-line.jpg) repeat;} .bg-lined{ background:#000 url(../images/backgrounds/bg_lined.jpg) fixed repeat 50% top !important;} .bg-wood{ background:#000 url(../images/backgrounds/texture-wood.jpg) fixed repeat 50% top !important;} .bg-woodlight{ background:#000 url(../images/backgrounds/texture-woodlight.jpg) fixed repeat 50% top !important;} .bg-space{ background:#000 url(../images/backgrounds/space.jpg) fixed repeat 50% top !important;} .bg-dot_black{ background:#000 url(../images/backgrounds/dot_black.jpg) fixed repeat 50% top !important;} .bg-dk_stripes{ background:#000 url(../images/backgrounds/dk_stripes.jpg) fixed repeat 50% top !important;} /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 2. TYPOGRAPHY --- ///////////////////////////////////////////////////////////////////////////////////////////// */ h1, h2, h3, h4, h5, h6 { color: #242424; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: normal; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; color: #242424; font-weight: bold; -webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-out; /* FF4+ */ -ms-transition: all 0.3s ease-out; /* IE10 */ -o-transition: all 0.3s ease-out; /* Opera 10.5+ */ transition: all 0.3s ease-out; } h1 { font-size: 42px; line-height: 48px; margin-bottom: 16px;} h2 { font-size: 36px; line-height: 42px; margin-bottom: 14px; } h3 { font-size: 24px; line-height: 36px; margin-bottom: 8px; } h4 { font-size: 18px; line-height: 24px; margin-bottom: 2px; } h5 { font-size: 14px; line-height: 18px; } h6 { font-size: 12px; line-height: 18px; } .section_title{ border-top:2px solid #ededed; text-transform:uppercase; font-size:18px; font-weight:bold; } .section_title:before{ content:'[ '; } .section_title:after{ content:' ]'; } p { margin:0 0 11px 0} p a {color:#029fc6;} p a:inactive {color:#007997;} p a:hover {text-decoration:underline;} p img { margin: 0; } em { font-style: italic; } strong { font-weight: bold; color: #333; } small { font-size: 80%; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 3. HEADER --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #header{ background: #FFFFFF; border-bottom: 5px solid #ededed; } #header .content{ margin:0 auto; width:100%; max-width:960px; position: relative; } /* -------------------------- a. Top Bar -------------------------- */ #header #top_bar{ background:#f6f6f6; border-bottom:1px solid #ededed; height:32px; } .info_bar{ float:left; line-height:32px; font-weight:bold; font-style:italic; padding:0 0 0 20px; } #top_bar ul.social_links { float:right; list-style:none; margin:0; padding:0; text-align:center; } #top_bar ul.social_links li { display:block; float:left; list-style:none; margin:0; padding:0; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #top_bar ul.social_links li a { display:block; width:32px; height:32px; text-indent:-9999px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } #top_bar ul.social_links .facebook{ background: transparent url(../images/social/social_network_facebook.png) 0 center no-repeat;} #top_bar ul.social_links .twitter{ background: transparent url(../images/social/social_network_twitter.png) 0 center no-repeat;} #top_bar ul.social_links .linkedin{ background: transparent url(../images/social/social_network_linkedin.png) 0 center no-repeat;} #top_bar ul.social_links .youtube{ background: transparent url(../images/social/social_network_youtube.png) 0 center no-repeat;} #top_bar ul.social_links .vimeo{ background: transparent url(../images/social/social_network_vimeo.png) 0 center no-repeat;} #top_bar ul.social_links .dribbble{ background: transparent url(../images/social/social_network_dribbble.png) 0 center no-repeat;} #top_bar ul.social_links .envato{ background: transparent url(../images/social/social_network_envato.png) 0 center no-repeat;} #top_bar ul.social_links .myspace{ background: transparent url(../images/social/social_network_myspace.png) 0 center no-repeat;} #top_bar ul.social_links .googleplus{ background: transparent url(../images/social/social_network_googleplus.png) 0 center no-repeat;} #top_bar ul.social_links .deviantart{ background: transparent url(../images/social/social_network_devianart.png) 0 center no-repeat;} #top_bar ul.social_links .behance{ background: transparent url(../images/social/social_network_behance.png) 0 center no-repeat;} #top_bar ul.social_links .skype{ background: transparent url(../images/social/social_network_skype.png) 0 center no-repeat;} #top_bar ul.social_links .tumblr{ background: transparent url(../images/social/social_network_tumblr.png) 0 center no-repeat;} #top_bar ul.social_links .flickr{ background: transparent url(../images/social/social_network_flickr.png) 0 center no-repeat;} #top_bar ul.social_links .digg{ background: transparent url(../images/social/social_network_diggk.png) 0 center no-repeat;} #top_bar ul.social_links .facebook:hover{ background-position: -32px center; background-color:#37589b;} #top_bar ul.social_links .twitter:hover{ background-position: -32px center; background-color:#46d4fe;} #top_bar ul.social_links .linkedin:hover{ background-position: -31px center; background-color:#419cca;} #top_bar ul.social_links .youtube:hover{ background-position: -32px center; background-color:#ff3333;} #top_bar ul.social_links .vimeo:hover{ background-position: -32px center; background-color:#37589b;} #top_bar ul.social_links .dribbble:hover{ background-position: -32px center; background-color:#e44885;} #top_bar ul.social_links .envato:hover{ background-position: -32px center; background-color:#528036;} #top_bar ul.social_links .myspace:hover{ background-position: -32px center; background-color:#24a7ff;} #top_bar ul.social_links .googleplus:hover{ background-position: -32px center; background-color:#de5a49;} #top_bar ul.social_links .deviantart:hover{ background-position: -32px center; background-color:#506256;} #top_bar ul.social_links .behance:hover{ background-position: -32px center; background-color:#008cff;} #top_bar ul.social_links .skype:hover{ background-position: -32px center; background-color:#00aff0;} #top_bar ul.social_links .tumblr:hover{ background-position: -32px center; background-color:#2b4964;} #top_bar ul.social_links .flickr:hover{ background-position: -32px center; background-color:#37589b;} #top_bar ul.social_links .digg:hover{ background-position: -32px center; background-color:#14589e;} #top_bar ul.social_links li:hover a{background: transparent url(../images/layout/icon-social-reflect.png) 0 top no-repeat;} /* -------------------------- b. Logo -------------------------- */ #header #header_logo{ text-align:center; } #header #header_logo h1{ display:block; float:left; margin:0 auto; padding:0 0 0 0; } #header #header_logo h1 img{ margin:0; } #header #header_logo h1 a{ display:inline-block; margin:0 auto -7px auto; } /* -------------------------- c. Main Navigation -------------------------- */ #header #navigation{ text-align:center; position: absolute; bottom: 0; right: 0; } #header #navigation ul{ margin:0; padding:0;} #header #navigation ul li{ display:inline-block; margin:0; position:relative; } #header #navigation ul li a{ color:#545454; font-size: 16px; padding: 10px 10px 15px 10px; display: block; font-weight:bold; text-transform:uppercase; margin-bottom:-5px; border-bottom: 5px solid #ededed; -webkit-transition: all 0.3s ease; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease; /* FF4+ */ -ms-transition: all 0.3s ease; /* IE10 */ -o-transition: all 0.3s ease; /* Opera 10.5+ */ transition: all 0.3s ease; } #header #navigation ul li a:hover{ } #header #navigation ul li a .subline{ color:#545454; display: block; font-weight: normal; font-style: italic; opacity: 0.7; font-size: 14px; text-transform:none; } #navigation ul ul{ position:absolute; top:-99999px; left:0; opacity: 0; /* Hide sub level */ -webkit-transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; z-index:497; background:#fff; box-shadow:#666 0 1px 2px; text-align:left; /* CSS3 ROUND CORNER */ -webkit-border-radius: 0px 3px 3px 0px; -khtml-border-radius: 0px 3px 3px 0px; -moz-border-radius: 0px 3px 3px 0px; -o-border-radius: 0px 3px 3px 0px; border-radius: 0px 3px 3px 0px; } #navigation ul ul ul { position:absolute; top:-99999px; left:100%; opacity: 0; -webkit-transition: opacity .5s ease-in-out; /* Hide sub levels */ -moz-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; } #navigation ul ul li{ display: block; padding:0 0 0 0; width:160px;} #navigation ul li:hover>ul{ opacity: 1; position:absolute; top:99%; left:0; } #navigation ul ul li:hover>ul{ position:absolute; top:0; left:100%; opacity: 1; z-index:497; } #header #navigation ul ul li a{ color:#545454; font-size: 13px; padding: 8px; display: block; font-weight:bold; text-transform:none; margin:0px 10px 0 0; border-left: 5px solid #ededed; border-bottom:none; } #header nav select { display: none; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 4. SLIDER --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #slider{ border-bottom: 5px solid #ededed; } #slider{padding:0;position:relative; overflow:hidden;} #slider li{ margin:0; padding:0;} #slider li{ background-position:50% top;} .flex-container a:active,.flexslider a:active,.flex-container a:focus,.flexslider a:focus{outline:0} .slides,.flex-control-nav,.flex-direction-nav{margin:0;padding:0;list-style:none} .flexslider{width:100%;margin:0;padding:0} .flexslider .slides>li{display:none;-webkit-backface-visibility:hidden} .flexslider .slides img{max-width:100%;display:block} .slides:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0} html[xmlns] .slides{display:block} * html .slides{height:1%} .no-js .slides>li:first-child{display:block} .flexslider{background:#fff;position:relative;zoom:1} .flexslider .slides{zoom:1} .flexslider .slides>li{position:relative;} .flex-container{zoom:1;position:relative} .flex-caption{background:0;-ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);zoom:1} .flex-caption { width: 940px; padding: 10px; margin: 0 0 0 -480px; position: absolute; left: 50%; bottom: 25px; color: white; text-shadow: 0 -1px 0 rgba(0, 0, 0, .3); font-size: 14px; line-height: 18px; } .flex-direction-nav{height:0} .flex-direction-nav li a{ width:40px; height:80px; margin:-40px 0 0; display:block; position:absolute; top:50%; cursor:pointer; text-indent:-9999em; -webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-out; /* FF4+ */ -ms-transition: all 0.3s ease-out; /* IE10 */ -o-transition: all 0.3s ease-out; /* Opera 10.5+ */ transition: all 0.3s ease-out; } .flex-direction-nav li .next{ background:#FFF; background:rgba(255, 255, 255, 0.8) url(../images/slider_arrows.png) right top; right:-40px; } .flex-direction-nav li .prev{ background:#FFF; background:rgba(255, 255, 255, 0.8) url(../images/slider_arrows.png) left top; left:-40px; } .flex-direction-nav li .next:hover{ } .flex-direction-nav li .prev:hover{ } .flexslider:hover .next{ right:0px; } .flexslider:hover .prev{ left:0px; } .flex-direction-nav li .disabled{opacity:.3;filter:alpha(opacity=30);cursor:default} .flex-control-nav{width:930px;position:absolute;text-align:right;margin-top:-54px; left:50%; margin-left:-460px;} .flex-control-nav li{margin:0 0 0 10px;display:inline-block;zoom:1;*display:inline; text-align:left;} .flex-control-nav li:first-child{margin:0} .flex-control-nav li a{width:10px;height:10px;display:block;cursor:pointer;text-indent:-999em; margin:0 3px; -webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;border-radius:5px;background-color:white} .flex-control-nav li a:hover{background-position:0 -13px} .flex-control-nav li a.active{cursor:default; background:#333;} section.space{padding-bottom:0} .flex-control-nav{display:none} .convention-slide{background-size:cover;height:220px;position:relative} .js .space .infobox{display:none} @media only screen and (min-width:37em){ .convention-slide{min-height:440px;height:100%;} .flex-control-nav{display:block} .flex-direction-nav li .next,.flex-direction-nav li .prev{background-size:auto;} } .space-slide-1 { background-image: url(../tmp/slider-1.jpg); } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 5. PAGE TITLE --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #page_title{ background:#f6f6f6; border-bottom:1px solid #EDEDED; } #page_title .content{ margin:0 auto; padding:20px 0 20px 0; width:100%; max-width:960px; } .page_title_overlay{ background:#FFF; background:rgba(255, 255, 255, 0.7); padding:10px 20px; } .page_title_overlay h2{ margin-bottom:0; } .subtitle{ color: #222; font-style: italic; padding: 0 0 10px 0; opacity: 0.9; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 5. GOOGLE MAP TITLE --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #google_map_title{ background:#f6f6f6; border-bottom:1px solid #EDEDED; position:relative; } #google_map_title .content{ margin:0 auto; padding:0; width:100%; max-width:960px; position:relative; } #google_map_title .content .page_title_overlay{ position:absolute; width: 95.9%; bottom: -280px; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 5. MAIN --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #main{} .stretched #main{padding-bottom: 20px;} #main .content{ background:#FFF; margin:0 auto; padding:20px 0; width:100%; max-width:960px; } .is_home{ margin-top:-30px !important; position:relative; z-index:1; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 6. GRID --- ///////////////////////////////////////////////////////////////////////////////////////////// */ .container{ padding:0 20px; } .col{ -webkit-transition-property: width; -moz-transition-property: width; transition-property: width; -webkit-transition-duration: 0.5s, 0.5s; -moz-transition-duration: 0.5s, 0.5s; transition-duration: 0.5s, 0.5s; -webkit-transition-timing function: linear, ease-in; -moz-transition-timing function: linear, ease-in; transition-timing function: linear, ease-in; margin-bottom:10px; } .one-half, .one-third, .two-third, .one-fourth, .two-fourth, .three-fourth, .one-fifth, .two-fifth, .three-fifth, .four-fifth{ float: left; margin-right: 20px; } .one-half.last, .one-third.last, .two-third.last, .one-fourth.last, .two-fourth.last, .three-fourth.last, .one-fifth.last, .two-fifth.last, .three-fifth.last, .four-fifth.last { margin-right: 0px; } .one-half { width: 450px; } .one-third { width: 293px; } .two-third { width: 605px; } .one-fourth { width: 215px; } .two-fourth { width: 450px; } .three-fourth { width: 685px; } .one-fifth { width: 168px; } .two-fifth { width: 356px; } .three-fifth { width: 544px; } .four-fifth { width: 730px; } #page_content .one-half { width: 332px; } #page_content .one-third { width: 215px; } #page_content .two-third { width: 450px; } #page_content .one-fourth { width: 156px; } #page_content .two-fourth { width: 332px; } #page_content .three-fourth { width: 509px; } #page_content .one-fifth { width: 121px; } #page_content .two-fifth { width: 262px; } #page_content .three-fifth { width: 403px; } #page_content .four-fifth { width: 544px; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 7. FORM --- ///////////////////////////////////////////////////////////////////////////////////////////// */ .form_design{ } .form_design .field{} .form_design .field label{ width:100%; display:block; font-weight:bold; } .form_design .error{ color:#F00 !important; } .form_design .label_check{ float:left; width:50% !important;} .form_design .field input{ width:100%; max-width: inherit; display:block; } .form_design .field input[type=checkbox], .form_design .field input[type=radio]{ padding:4px; width:24px; max-width: inherit; display:block; float:left; } .form_design .field textarea{ width:100%; height:150px; max-width: inherit; display:block; } .form_design .the-fix { padding: 0; padding-right: 30px; marign: 0; display: block; } .form_design .submit_col .the-fix { padding: 0; padding-right: 10px; marign: 0; display: block; } .form_design .submit_col input{ background:#f6f6f6; font-weight:bold; text-transform:uppercase; letter-spacing:1px; font-size:11px; padding:3px; } .form_design .dsgn{ border:1px solid #d4d4d4; background:#F6F6F6; color:#666; padding:8px; /* CSS3 ROUND CORNER */ -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; /* CSS3 SHADOW */ -webkit-box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.1), 0px 0px 5px 0px rgba(0, 0, 0, 0.05); -moz-box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.1), 0px 0px 5px 0px rgba(0, 0, 0, 0.05); -o-box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.1), 0px 0px 5px 0px rgba(0, 0, 0, 0.05); box-shadow: inset 1px 1px 0px 0px rgba(0, 0, 0, 0.1), 0px 0px 5px 0px rgba(0, 0, 0, 0.05); /* CSS3 Tranistion */ -webkit-transition: all 0.3s ease; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease; /* FF4+ */ -ms-transition: all 0.3s ease; /* IE10 */ -o-transition: all 0.3s ease; /* Opera 10.5+ */ transition: all 0.3s ease; } .form_design input.error, .form_design textarea.error{ background:#f6f6f6 url(../images/error_form.png) no-repeat right top; } .half_col{ float:left; width:50%; margin-bottom:9px; } .full_col{ margin-bottom:9px; } .submit_col{ float:right; min-width: 20%; margin-bottom:9px; text-align:right; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 7. BASIC ELEMENTS --- ///////////////////////////////////////////////////////////////////////////////////////////// */ /* -------------------------- Slogan -------------------------- */ .slogan{ padding:10px 20px 0 20px; text-align:center; } .slogan .first-line{ font-size:30px; font-weight:bold; } .slogan .second-line{ font-style:italic; font-size:16px; } /* -------------------------- Break Lines -------------------------- */ hr.break-line{ border:0; border-bottom:2px solid #ededed; height:20px; margin-top:0px; margin-bottom:22px; display:block; width:100%; } hr.space-line{ border: 1px solid #ededed; border-width:1px 0 0 0; margin-bottom:10px; display:block; width:100%; } /* -------------------------- Teasing Block -------------------------- */ .teasing_block{ background:#fafafa; border:1px solid #ededed; padding:10px; margin:0 0 30px 0; font-size:14px; /* CSS3 ROUND CORNER */ -webkit-border-radius: 6px 6px 6px 6px; -khtml-border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -o-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; } .teasing_block p{ float:left; display:block; padding:0 20px 0 0; margin:0; width:80%; } .teasing_block p:first-line{ font-weight:bold; } .teasing_block a.nice_button{ margin-left:20px; float:left; } /* -------------------------- nice_button -------------------------- */ .nice_button{ display:block; float:right; padding:6px 8px; text-align:center; background-color: #d7d7d7; background-image: -webkit-gradient(linear, left top, left bottom, from(rgb(215, 215, 215)),to(rgb(249, 249, 249))); background-image: -webkit-linear-gradient(top, rgb(215, 215, 215), rgb(249, 249, 249)); background-image: -moz-linear-gradient(top, rgb(215, 215, 215), rgb(249, 249, 249)); background-image: -o-linear-gradient(top, rgb(215, 215, 215), rgb(249, 249, 249)); background-image: -ms-linear-gradient(top, rgb(215, 215, 215), rgb(249, 249, 249)); background-image: linear-gradient(top, rgb(215, 215, 215), rgb(249, 249, 249)); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#d7d7d7', EndColorStr='#f9f9f9'); /* CSS3 ROUND CORNER */ -webkit-border-radius: 6px 6px 6px 6px; -khtml-border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -o-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; -webkit-box-shadow: 0px 1px 0px 0px #fff; -moz-box-shadow: 0px 1px 0px 0px #fff; -o-box-shadow: 0px 1px 0px 0px #fff; box-shadow: 0px 1px 0px 0px #fff; } .nice_button span{ display:block; background:#ededed; padding:4px 10px; /* CSS3 ROUND CORNER */ -webkit-border-radius: 6px 6px 6px 6px; -khtml-border-radius: 6px 6px 6px 6px; -moz-border-radius: 6px 6px 6px 6px; -o-border-radius: 6px 6px 6px 6px; border-radius: 6px 6px 6px 6px; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2); } /* Blockquotes */ blockquote{ font-family:Georgia,"Times New Roman",Times,serif; clear:both; font-size:1.5em; /* font-style:italic; */ line-height:1.4em; margin:20px 0 20px 54px; quotes:"\201C""\201D"; position: relative; } blockquote:before{ content:open-quote; font-size:5em; line-height:.1em; margin-right:.25em; vertical-align:-0.5em; display:block; position: absolute; top: 40px; left: -50px; opacity: 0.5; width: 50px; font-family: "Georgia", "Times New Roman", Helvetica, Arial, sans-serif; } blockquote p{position: relative; padding:5px 0; margin:0; } blockquote cite:before { content: "\2014 \0020"; padding:0px 3px; } blockquote small, blockquote cite, blockquote small a, blockquote cite a, blockquote a small, blockquote a cite{font-size: 12px;} /* ------------ FLICKR */ #flickr_badge_wrapper{ padding:10px 0 0 0; } #flickr_badge_wrapper a{ display:block; float:left; margin:0 10px 10px 5px; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); -o-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); } #footer #flickr_badge_wrapper a{ margin:0 8px 10px 5px; } #flickr_badge_wrapper img{ width:58px; height:58px; } /* ------------ Twitter widget */ .twitter_update{ font-style:italic; margin:0; padding:0; } .twitter_update li{ margin:0 0 10px 0; padding:0 0 10px 0; border-bottom:1px solid #ededed; } .twitter_update span{ display:block; font-style:normal; } .twitter_update .twit_avatar{ float: left; margin-right: 10px; width: 40px; } .twitter_update .twit_status{ clear:right; } .twitter_update li a{ display:inline !important; padding:0 !important; } #twitter_update_list_bt li { background:url(../images/twitter_icon.png) no-repeat left 50%; list-style: none; padding-left:40px; } #twitter_update_list_bt li a{ padding:3px !important; } #twitter_update_list_bt li a:hover{ background:#fff; } #twitter_update_list_bt .twit_avatar{ display:none; } #twitter_update_list_bt .twit_date{ font-size:12px; } /* -------------------------- { share_bar } */ .share_bar{ padding:0; margin:0px; } .share_bar span{ text-align:center; display:block; float:left; margin:0 18px 0px 0px; } /* ------------ Tags */ .tagcloud a { font-size: 12px !important; display: block; float: left; padding: 3px 8px; margin-right: 10px; margin-top: 10px; border-width: 1px; border-style: solid; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-image: none; border-color: inherit; border-radius: 3px 3px 3px 3px; } /* -------------------------- { ABOUT THE AUTHOR } */ #author-info{ border-top: 5px solid #EDEDED; padding: 10px; background: #FAFAFA; border-bottom: 5px solid #EDEDED; margin-bottom:20px; } #author-image{ float: left; margin: 0 20px 0 0; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 8. LAYOUTS --- ///////////////////////////////////////////////////////////////////////////////////////////// */ .date_post{ font-size:11px; } .date_post a{ font-weight:bold; } /* -------------------------- a. post layout 1 -------------------------- */ .post_layout_1{ position:relative; overflow:hidden; height:100%; border-bottom:5px solid #ededed; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .post_layout_1 .thumbnail_post{ display:block; } .post_layout_1 .infos_post{ background:url(../images/pixel-white-80.png) repeat; padding:20px 0; width:100%; text-align:center; position:absolute; bottom:-400px; left:0; z-index:200; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.6); -moz-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.6); -o-box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.6); box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.6); -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .post_layout_1:hover .infos_post{ bottom:50px; } /* -------------------------- b. post layout 2 -------------------------- */ .post_layout_2{ } .post_layout_2 .thumbnail_post{ display:block; float:left; margin:0 20px 0 0; position:relative; overflow:hidden; width:215px; } .post_layout_2 .thumbnail_post span{ background:url(../images/post-icon-link.png) no-repeat; width:35px; height:35px; position:absolute; bottom:-35px; right:-35px; z-index:200; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .post_layout_2 .thumbnail_post:hover span{ bottom:0px; right:0px; } .post_layout_2 .infos_post{ display:block; float:left; width:215px; } .post_layout_2:hover .infos_post{ } /* -------------------------- c. post layout 3 -------------------------- */ .post_layout_3{ border-bottom:5px solid #ededed; padding-bottom:10px; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .post_layout_3 .thumbnail_post{ display:block; float:left; margin:0 0 10px 0; position:relative; overflow:hidden; width:215px; } .post_layout_3 .thumbnail_post span{ background:url(../images/post-icon-link.png) no-repeat; width:35px; height:35px; position:absolute; bottom:-35px; right:-35px; z-index:200; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .post_layout_3 .thumbnail_post:hover span{ bottom:0px; right:0px; } .post_layout_3 .infos_post{ display:block; float:left; width:215px; } .post_layout_3:hover .infos_post{ } .thumbnail_post a img { opacity:1; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .thumbnail_post a:hover img { opacity:0.5; } .thumbnail_post a:hover img.effect { opacity:0.5; -webkit-transform: scale(1.1) rotate(3deg); -moz-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); -o-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); filter: progid:DXImageTransform.Microsoft.Matrix( M11=0.9999025240093042, M12=-0.013962180339145272, M21=0.013962180339145272, M22=0.9999025240093042,SizingMethod='auto expand'); zoom: 1; } #single_title{ min-height:500px;} #single_title .content{ margin:0 auto; padding:20px 0 80px 0; width:100%; max-width:960px; } .title_floatr{ height:0px; position:relative; } .single_title_overlay{ background:#FFF; background:rgba(255, 255, 255, 0.7); padding:10px 20px; position:absolute; bottom:25px; left:0; z-index:300; width:96%; } .single_title_overlay h2{ margin-bottom:0; } /* -------------------------- d. post layout Classic -------------------------- */ .post_layout_classic{ border-bottom: 5px solid #EDEDED; margin-bottom: 20px; } .post_layout_classic .thumbnail_post{ float: left; margin-right: 20px; margin-bottom: 20px; position:relative; overflow:hidden; width:50%; } .post_layout_classic .date_post{ margin-bottom:10px; display:block; } /* -------------------------- e. Portfolio Posts -------------------------- */ .portfolio_block .thumbnail_post{ position:relative; overflow:hidden; } .thumbnail_post span{ background:url(../images/post-icon-link.png) no-repeat; width:35px; height:35px; position:absolute; bottom:-35px; right:-35px; z-index:200; -webkit-transition: all 0.3s ease-in-out; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease-in-out; /* FF4+ */ -ms-transition: all 0.3s ease-in-out; /* IE10 */ -o-transition: all 0.3s ease-in-out; /* Opera 10.5+ */ transition: all 0.3s ease-in-out; } .thumbnail_post:hover span{ bottom:0px; right:0px; } .the_gallery_item{ margin-bottom:4px !important; } .portfolio_item{ padding:10px 0 0 0; } /* -------------------------- f. Filters -------------------------- */ #sort-by { text-align:center; padding:0 0 20px 0; } .ie7 #sort-by { position: relative; top: -20px; right: -18px; } #sort-by li { padding: 0 5px; height: 25px; float:left; text-transform:uppercase; list-style:none; } #sort-by li:last-child { background: none; } #sort-by a { background:#f9f9f9; border-bottom: none; color: #999 !important; padding: 5px 5px; margin: 0; font-size:11px; /* CSS TRANSITION */ -webkit-transition-property: color, background; -webkit-transition-duration: 0.25s, .25s; -webkit-transition-timing-function: linear, ease-in; /* CSS TRANSITION - Mozilla hack */ -moz-transition-property: color, background; -moz-transition-duration: 0.25s, .25s; -moz-transition-timing-function: linear, ease-in; /* CSS TRANSITION - Opera hack */ -o-transition-property: color, background; -o-transition-duration: 0.25s, .25s; -o-transition-timing-function: linear, ease-in; /* CSS3 ROUND CORNER */ -moz-border-radius: 2px 2px 2px 2px; -webkit-border-radius: 2px 2px 2px 2px; -o-border-radius: 2px 2px 2px 2px; -khtml-border-radius: 2px 2px 2px 2px; border-radius: 2px 2px 2px 2px; } #sort-by a:hover, #sort-by a.active, #sort-by a.active:hover { background:#c20101; color:#333 !important; } /* -------------------------- g. Isotop effects -------------------------- */ .isotope-item{ margin-bottom:20px !important; margin-right: 7px !important; margin-left: 6px !important; } .isotope{ display:block; } .isotope, .isotope .isotope-item { /* change duration value to whatever you like */ -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; } .isotope { min-height:100%; -webkit-transition-property: height, width; -moz-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -o-transition-property: top, left, opacity; transition-property: transform, opacity; } #comments{ border-top:5px solid #ededed; margin-top:30px; padding-top:20px; } #comment-form{ margin:0;} #comments li{background-image:none;} #comment-caption, #respond-caption { } #commentsbox { margin:0; } /* -------------------------- { List Style } */ .commentlist { margin:0 0 20px 0; list-style-type: none; } li.comment{ padding-left:0 !important; position:relative; } .children { list-style-type: none; margin: 0 0 0 30px; } .children li.comment{ padding-left:0 !important; } .children li .comment-body p{ padding:0 0 0 45px; margin:0; } .comment-body { border-bottom: 1px solid #ededed; padding: 20px; position:relative; } .children .comment-body { } .comment-body p{ padding:0 0 0 80px; margin:0; } .thread-odd{ background:#fafafa;} .pinglist { margin: 20px 0 0 0; list-style-type: decimal; } #commentform input { margin-right: 20px; width: 45%; } .comment-author{} .contactform button, .submitter, #commentform #submit-button { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; width: 120px; padding: 0 10px 0; margin-right:30px; line-height: 12px; height: 28px; font-size: 12px; font-weight: bold; cursor: pointer; background:#f2f2f2; border-bottom:1px solid #ccc; text-align:center; } .contactform button, #commentform #submit-button { background: url(images/submit_button.png); color: #555555; } .submitter{ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; width: 120px !important; padding: 0 10px 0 !important; line-height: 12px !important; height: 28px !important; font-size: 12px !important; font-weight: bold !important; cursor: pointer !important; background:#181818 !important; border:none !important; color: #FFF !important; float:right; } .submitter:hover{ background:#222 !important; border:none !important; color: #CCC !important; } #commentform textarea { width: 97%; } ol #commentform textarea { width: 95%; } .comment .avatar { border: 2px solid #F4F4F4; position: absolute; left: 20px; top: 20px; width: 64px; height: 64px; } .children li.comment .avatar { border: 2px solid #F4F4F4; position: absolute; left: 20px; top: 20px; width: 32px; height: 32px; } .comment a.avatar-link.author-link { border: 2px solid #9e9e9e; } .comment-meta a { color: #7b7b7b; font-size: 11px; } .comment-author, .comment-meta, .comment-awaiting-moderation { padding-left:80px; } .children .comment-author, .children .comment-meta, .children .comment-awaiting-moderation { padding-left:45px; } .comment-author a { } .comment-meta a:hover { } .comment-author a:hover { } .nocomments { } .comment-body ul { list-style-type: disc; } .comment-body ol { list-style-type: decimal; } .comment .reply{ background:#efefef; text-transform:uppercase; font-size:9px; position: absolute; top: 0px; right: 0px; z-index: 200; } .comment .reply a{ display:block; padding:4px 6px;} .comment .reply:hover{ background:#efefef; color:#FFF; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 9. FOOTER --- ///////////////////////////////////////////////////////////////////////////////////////////// */ #footer{ background:#202020; color:#999999; } #footer .content{ margin:0 auto; width:100%; max-width:960px; } #footer h4, #footer h5, #footer h6{ color:#FFF; } #footer a{ color:#ddd; } /* -------------------------- a. Twitter Update -------------------------- */ #twitter_update{ padding:20px 0 20px 0px; font-size:16px; font-style:italic; } #twitter_update .content{ margin:0 auto; width:100%; max-width: 940px; } #twitter_update #twitter_update_list{ padding-left:50px; background:url(../images/twitter_icon.png) no-repeat left 50%; } /* -------------------------- b. Widgets -------------------------- */ #widgetized_footer{ padding:20px 0; } #widgetized_footer .content{ margin:0 auto; width:100%; max-width:920px; } /* -------------------------- Footer list -------------------------- */ #widgetized_footer li{ border-bottom:1px dashed #454545; list-style:none; } #widgetized_footer li a{ padding:4px 8px; display:block; -webkit-transition: all 0.3s ease; /* Saf3.2+, Chrome */ -moz-transition: all 0.3s ease; /* FF4+ */ -ms-transition: all 0.3s ease; /* IE10 */ -o-transition: all 0.3s ease; /* Opera 10.5+ */ transition: all 0.3s ease; } #widgetized_footer li a:hover{ padding:4px 8px 4px 12px; } /* -------------------------- c. Copyright -------------------------- */ #copyright{ background:#1a1a1a; color:#5a5a5a; line-height:40px; font-size:11px; font-weight:bold; padding:10px 0; } #copyright .content{ margin:0 auto; width:100%; max-width:910px; } /* -------------------------- Left and right -------------------------- */ #copyright .left{ width:50%; float:left; } #copyright .right{ width:50%; float:right; } /* -------------------------- bottom_navigation -------------------------- */ #bottom_navigation li{ display:inline; } #bottom_navigation li:after{ content:'\00a0\00a0\002F\00a0\00a0'; } #bottom_navigation li:last-child:after{ content:' '; } /* ///////////////////////////////////////////////////////////////////////////////////////////// --- 9. SHORTCODES --- ///////////////////////////////////////////////////////////////////////////////////////////// */ /* -------------------------- { NOTIFICATION BLOCKS } */ .notification_title{ background:url(../images/notification_title.jpg) repeat-x; line-height:34px; height:34px; border:1px solid #e0e0e0; border-width:1px 1px 1px 0; font-size:16px; margin:0; padding:0 0 0 10px; /* CSS3 ROUND CORNER */ -webkit-border-radius: 0px 5px 5px 0px; -khtml-border-radius: 0px 5px 5px 0px; -moz-border-radius: 0px 5px 5px 0px; -o-border-radius: 0px 5px 5px 0px; border-radius: 0px 5px 5px 0px; } .notification_block{ padding:0 0 0 40px; margin-bottom:20px; } .notification_text{ background:url(../images/notification_text.png) repeat; line-height:24px; padding:0 10px; margin:0 5px 0 1px; font-size:11px; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); -o-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3); } .notification_block.success{ background:url(../images/notification_valid.png) no-repeat left top;} .notification_block.error{ background:url(../images/notification_error.png) no-repeat left top;} .notification_block.warning{ background:url(../images/notification_warning.png) no-repeat left top;} .notification_block.infos{ background:url(../images/notification_infos.png) no-repeat left top;} /* --------------------------------------- [ TABS ] */ .tabs { margin: 0 !important; padding: 0 !important; float: left; list-style: none; height: 31px; /*--Set height of tabs--*/ border-left: 1px solid #101010; width: 100%; } ul.tabs li { background:#101010; float: left; display:block; margin: 0; padding: 0; height: 31px; /*--Subtract 1px from the height of the unordered list--*/ line-height: 31px; /*--Vertically aligns the text within the tab--*/ cursor:pointer; border-left: none; border-bottom: none; margin-bottom: -1px; /*--Pull the list item down 1px--*/ overflow: hidden; position: relative; } ul.tabs li a { text-decoration: none; display: block; padding: 0 20px; outline: none; background: #101010; border-bottom: 1px solid #101010; color:#e9e9e9 !important; } ul.tabs li a:hover { color:#FFF; border-bottom: 1px solid #101010 !important; } a.selected { /*--Makes sure that the active tab does not listen to the hover properties--*/ background: #555 !important; color:#FFF !important; border-bottom: 1px solid #101010; height: 32px !important; display:block; } ul.tabs li a:hover { background: #333; color:#FFF !important; border-bottom: 1px solid #101010; } .panes { border: 1px solid #dedede; overflow: hidden; clear: both; float: left; width: 100%; background: #e9e9e9; } .tab-content{ padding: 20px; display:none; } #tab_1.tab-content{ padding: 20px; display:block; } /* --------------------------------------- [ SLIDER ] */ .main_view { position: relative; border:1px solid #101010; } .window { overflow: hidden; /*--Hides anything outside of the set width/height--*/ position: relative; } .image_reel { position: absolute; top: 0; left: 0; } .image_reel img {float: left;} /*--Paging Styles--*/ .paging { position: absolute; bottom: 4px; right: 4px; z-index: 100; /*--Assures the paging stays on the top layer--*/ text-align: center; line-height: 20px; display: none; /*--Hidden by default, will be later shown with jQuery--*/ } .paging a { background: #101010; padding: 5px 6px; cursor:pointer; text-decoration: none; color: #FFF; font-size:11px; } .paging a.active { background: #FFF; color:#101010 !important; } .paging a:hover {} /* --------------------------------------- [ ACCORDION ] */ .accordion .over { background: #222 !important; color:#FFF !important; } .accordion .on { background: #333 !important; color:#FFF !important; } .accordion h5{ color:#FFF !important; margin-bottom:0 !important; padding:0;} .accordion .accordionButton { background: #181818; border-bottom: 1px solid #000; border-top: 1px solid #222; cursor: pointer; padding:5px 10px; color:#e9e9e9 !important; } .accordion .accordionContent { background: #e9e9e9; border-bottom: 1px solid #dedede; padding: 20px; } /* --------------------------------------- [ TOGGLER ] */ .toggler .plus_minus{ background:url(../images/plus_minus.png) no-repeat right 2px; padding:5px;} .toggler .minus_plus{ background:url(../images/minus_plus.png) no-repeat right 2px !important; padding:5px;} /* --------------------------------------- [ FAQ ] */ .faq{ padding:10px; margin:0 20px; display:block; border-bottom:1px dotted #d4d4d4; } .faq_question{ margin-bottom:0; } .faq_answer{ padding:10px 10px 0 10px; display:block; height:100%; } /* --------------------------------------- [ TOP ] */ .go_top_short{ border-bottom: 1px solid rgba(0, 0, 0, 0.3); text-align:right; padding:0; } .go_top_short a{ padding:0px 4px; font-size:9px; text-transform:uppercase; float:right; display:block; } /* ------------------- { Pre Code */ pre, code{ font-family:"Courier New", Courier, monospace; color:#444; } pre { font-size: 12px; margin: 10px auto 20px auto; background:url(../images/pre_bg.jpg) repeat left top; border:1px solid; border-color:#C4C4C4 #dedede #dedede #C4C4C4; line-height: 18px; width: 100%; overflow: auto; overflow-Y: hidden; } pre.html{ border-color:#ccc #e9e9e9 #e9e9e9 #ffe4c6; border-width:1px 1px 1px 5px;} pre.php{ border-color:#ccc #e9e9e9 #e9e9e9 #c4ddff; border-width:1px 1px 1px 5px;} pre.css{ border-color:#ccc #e9e9e9 #e9e9e9 #eeffc6; border-width:1px 1px 1px 5px;} pre.javascript{ border-color:#ccc #e9e9e9 #e9e9e9 #ffc6c6; border-width:1px 1px 1px 5px;} pre code { margin: 0 0 0 15px; /*--Left Margin--*/ padding: 0 0; display: block; } /* --------------------------------------- [ biglines ] */ .biglines{ font-size:16px; line-height:26px; font-weight:bold; text-shadow:#aaa 0 1px 2px; margin:0 0 10px 0; } /* --------------------------------------- [ HIGHLIGHTED TEXT ] */ .highlight_yellow { background:#FC0; color:#000; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: none; padding: 3px; margin: 0px 4px 0px 2px; } .highlight_blue { background:#BDE5F8; color:#00529B; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: none; padding: 3px; margin: 0px 4px 0px 2px; } .highlight_pink { background:#F06; color:#FFF; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: none; padding: 3px; margin: 0px 4px 0px 2px; } .highlight_red { background:#F00; color:#FFF; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: none; padding: 3px; margin: 0px 4px 0px 2px; } .highlight_green { background:#6C0; color:#FFF; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: none; padding: 3px; margin: 0px 4px 0px 2px; } /* --------------------------------------- [ LIST TYPES ] */ ul.square{ margin-bottom: 20px; } ul.square li { list-style-type: square; list-style-position: inherit; padding-left: 20px; margin-left: 20px; } ul.circle{ margin-bottom: 20px; } ul.circle li { list-style-type: circle; list-style-position: inherit; padding-left: 20px; margin-left: 20px; } ul.numbered{ margin-bottom: 20px; } ul.numbered li { list-style-type: decimal; list-style-position: inherit; padding-left: 17px; margin-left: 23px; } /* --------------------------------------- [ IMAGE ALIGN ] */ .img_left{ float:left; margin:4px 15px 0 0; } .img_right{ float:right; margin:4px 0 0 15px; } /* --------------------------------------- [ GO TOP ] */ .go_top_short{ display:block; width:100%; text-align:right; border-bottom:1px solid #e2e2e2; margin:10px 0; } .go_top_short a{ color:#aaa;} .go_top_short a:hover{ color:#666;} /* --------------------------------------- [ DROPCAP ] */ .dropcap{ float:left; font-size:40px; line-height:0px; margin:5px 0px 0 0; padding:18px 5px 5px 5px; font-weight:bold; } .dropcap2{ background:#000; color:#fff !important; float:left; font-size:30px; line-height:40px; margin:0 5px 0 0; text-align:center; border-radius: 50%; width: 40px; height: 40px; font-weight:bold; } .dropcap3{ float:left; font-size:80px; line-height:60px; margin:0 5px 0 0; text-align:center; font-weight:bold; } /* --------------------------------------- [ PULL QUOTES ] */ .pullquote{ float: left; width: 200px; padding: 10px 15px; margin:10px 15px 10px 0; border-right: 5px solid #d4d4d4; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; color:#666; background:#f9f9f9; } .pullquote_right{ float: right; width: 200px; padding: 10px 15px; margin:10px 0 10px 15px; border-left: 5px solid #d4d4d4; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic; color:#666; background:#f9f9f9; } /* --------------------------------------- [ BREAK and SEPARATORS ] */ .break{ display:block; clear:both; height:30px; } .break_line{ background:#f9f9f9; border-bottom:1px solid #e2e2e2; display:block; clear:both; height:5px; margin:10px 20px; } /* --------------------------------------- [ IMAGES FRAMED ] */ .framed{ padding:5px; color: #999; background: #F9F9F9; border: 1px solid #E9E9E9; -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); } .framed_left{ float:left; margin:0 20px 0 0; padding:5px; color: #999; background: #F9F9F9; border: 1px solid #E9E9E9; -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); } .framed_right{ float:right; margin:0 0 0 20px; padding:5px; color: #999; background: #F9F9F9; border: 1px solid #E9E9E9; -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); } #sidebar .framed{ padding:2px; color: #999; background: #F9F9F9; border: 1px solid #E9E9E9; -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); } /* --------------------------------------- [ WP GALLERY ] */ .gallery-item{ float:left; margin:0 20px 0 0; padding:5px; color: #999; background: #F9F9F9; border: 1px solid #E9E9E9; -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; -webkit-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); -o-box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); } /* --------------------------------------- [ LISTs ] */ .list_simple li{ list-style:square; background:none; padding:3px 0 3px 23px;} .list_arrow li{ list-style:none !important; background:url(../images/grey_small_arrow.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_square li{ list-style:none !important; background:url(../images/icons/list_square.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type1 li{ list-style:none !important; background:url(../images/icons/user_business_boss.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type2 li{ list-style:none !important; background:url(../images/icons/user_black_female.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type3 li{ list-style:none !important; background:url(../images/icons/doc_music_playlist.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type4 li{ list-style:none !important; background:url(../images/icons/clock.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type5 li{ list-style:none !important; background:url(../images/icons/mobile_phone.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type6 li{ list-style:none !important; background:url(../images/icons/key.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type7 li{ list-style:none !important; background:url(../images/icons/medal_gold_1.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type8 li{ list-style:none !important; background:url(../images/icons/link.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type9 li{ list-style:none !important; background:url(../images/icons/money_euro.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type10 li{ list-style:none !important; background:url(../images/icons/money_dollar.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type11 li{ list-style:none !important; background:url(../images/icons/arrow_right.png) no-repeat left 50%; padding:3px 0 3px 23px;} .list_type12 li{ list-style:none !important; background:url(../images/icons/tag_blue.png) no-repeat left 50%; padding:3px 0 3px 23px;} .heart li{ list-style:none !important; background:url(../images/icons/heart-16.png) no-repeat left 48%; padding:3px 0 3px 23px; } .comment li{ list-style:none !important; background:url(../images/icons/comment-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .mail li{ list-style:none !important; background:url(../images/icons/email-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .user li{ list-style:none !important; background:url(../images/icons/person-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .redcross li{ list-style:none !important; background:url(../images/icons/cross-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .pencil li{ list-style:none !important; background:url(../images/icons/pencil-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .check li{ list-style:none !important; background:url(../images/icons/check-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .arrow-right li{ list-style:none !important; background:url(../images/icons/arrow-right-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .arrow-down li{ list-style:none !important; background:url(../images/icons/arrow-down-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .badgecheck li{ list-style:none !important; background:url(../images/icons/badge-circle-check-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .plus li{ list-style:none !important; background:url(../images/icons/plus-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .search_list_icon li{ list-style:none !important; background:url(../images/icons/search-16.png) no-repeat left 48%; padding:3px 0 3px 23px;} .icon_dcb_check li{ list-style:none !important; background:url(../images/icons/icon_dcb_check.png) no-repeat left 48%; padding:3px 0 3px 23px;} .icon_dcb_dl li{ list-style:none !important; background:url(../images/icons/icon_dcb_dl.png) no-repeat left 48%; padding:3px 0 3px 23px;} .icon_dcb_links li{ list-style:none !important; background:url(../images/icons/icon_dcb_links.png) no-repeat left 48%; padding:3px 0 3px 23px;} .icon_dcb_arrow li{ list-style:none !important; background:url(../images/icons/icon_dcb_arrow_right.png) no-repeat left 48%; padding:3px 0 3px 23px;} /* --------------------------------------- [ BUTTONS ] */ a.the_button{ display:block; float:left; color:#FFF !important; margin:0 5px;} a:hover.nice_button{ } a.the_button .linker{ background-position:left top; display:block; float:left; padding:0 0 0 15px; height:39px; line-height:38px;} a.the_button .end{ background-position:right top !important; display:block; float:left; width:15px; height:39px;} a.the_button.red .linker{background:url(../images/button_red.png) no-repeat;} a.the_button.red .end{background:url(../images/button_red.png) no-repeat;} a.the_button.red2 .linker{background:url(../images/button_red_light.png) no-repeat;} a.the_button.red2 .end{background:url(../images/button_red_light.png) no-repeat;} a.the_button.blue .linker{background:url(../images/button_blue.png) no-repeat;} a.the_button.blue .end{background:url(../images/button_blue.png) no-repeat;} a.the_button.blue2 .linker{background:url(../images/button_blue_light.png) no-repeat;} a.the_button.blue2 .end{background:url(../images/button_blue_light.png) no-repeat;} a.the_button.green .linker{background:url(../images/button_green.png) no-repeat;} a.the_button.green .end{background:url(../images/button_green.png) no-repeat;} a.the_button.green2 .linker{background:url(../images/button_green_light.png) no-repeat;} a.the_button.green2 .end{background:url(../images/button_green_light.png) no-repeat;} a.the_button.pink .linker{background:url(../images/button_pink.png) no-repeat;} a.the_button.pink .end{background:url(../images/button_pink.png) no-repeat;} a.the_button.pink2 .linker{background:url(../images/button_pink_light.png) no-repeat;} a.the_button.pink2 .end{background:url(../images/button_pink_light.png) no-repeat;} a.the_button.orange .linker{background:url(../images/button_orange.png) no-repeat;} a.the_button.orange .end{background:url(../images/button_orange.png) no-repeat;} a.the_button.orange2 .linker{background:url(../images/button_orange_light.png) no-repeat;} a.the_button.orange2 .end{background:url(../images/button_orange_light.png) no-repeat;} a.the_button.yellow .linker{ color:#000 !important; background:url(../images/button_yellow.png) no-repeat;} a.the_button.yellow .end{background:url(../images/button_yellow.png) no-repeat;} a.the_button.black .linker{background:url(../images/button_black.png) no-repeat;} a.the_button.black .end{background:url(../images/button_black.png) no-repeat;} a.the_button.black2 .linker{background:url(../images/button_black_light.png) no-repeat;} a.the_button.black2 .end{background:url(../images/button_black_light.png) no-repeat;} a.the_button.brown .linker{background:url(../images/button_brown.png) no-repeat;} a.the_button.brown .end{background:url(../images/button_brown.png) no-repeat;} a.the_button.brown2 .linker{background:url(../images/button_brown_light.png) no-repeat;} a.the_button.brown2 .end{background:url(../images/button_brown_light.png) no-repeat;} a.the_button.grey .linker{ color:#000 !important; background:url(../images/button_grey.png) no-repeat;} a.the_button.grey .end{background:url(../images/button_grey.png) no-repeat;} a:hover.the_button .linker{ background-position:left -51px; color:#FFF !important;} a:hover.the_button .end{ background-position:right -51px !important;} a:active.the_button .linker{ background-position:left bottom;} a:active.the_button .end{ background-position:right bottom !important;} /* List on two columns */ .ul_columns{ clear:both; height:100%; overflow:hidden; margin:0; } .ul_columns li{ float: left; width: 50%; margin:0; padding:6px 0; } .ul_columns li a{ display: block; } .ul_columns li a:hover{ display: block; border:none!important; } .ul_columns.social_links li{ width: 38% !important; padding: 6px 0 6px 24px !important; } .ul_columns.social_links .facebook{ background: transparent url(../images/social/social_network_facebook.png) -32px center no-repeat !important;} .ul_columns.social_links .twitter{ background: transparent url(../images/social/social_network_twitter.png) -32px center no-repeat;} .ul_columns.social_links .linkedin{ background: transparent url(../images/social/social_network_linkedin.png) -32px center no-repeat;} .ul_columns.social_links .youtube{ background: transparent url(../images/social/social_network_youtube.png) -32px center no-repeat;} .ul_columns.social_links .vimeo{ background: transparent url(../images/social/social_network_vimeo.png) -32px center no-repeat;} .ul_columns.social_links .dribbble{ background: transparent url(../images/social/social_network_dribbble.png) -32px center no-repeat;} .ul_columns.social_links .envato{ background: transparent url(../images/social/social_network_envato.png) -32px center no-repeat;} .ul_columns.social_links .myspace{ background: transparent url(../images/social/social_network_myspace.png) -32px center no-repeat;} .ul_columns.social_links .googleplus{ background: transparent url(../images/social/social_network_googleplus.png) -32px center no-repeat;} .ul_columns.social_links .deviantart{ background: transparent url(../images/social/social_network_devianart.png) -32px center no-repeat;} .ul_columns.social_links .behance{ background: transparent url(../images/social/social_network_behance.png) -32px center no-repeat;} .ul_columns.social_links .skype{ background: transparent url(../images/social/social_network_skype.png) -32px center no-repeat;} .ul_columns.social_links .tumblr{ background: transparent url(../images/social/social_network_tumblr.png) -32px center no-repeat;} .ul_columns.social_links .flickr{ background: transparent url(../images/social/social_network_flickr.png) -32px center no-repeat;} .ul_columns.social_links .digg{ background: transparent url(../images/social/social_network_digg.png) -32px center no-repeat;} /* --------------------------------------- [ CALENDAR ] */ /* calendar widget */ .widget_calendar {float: left;} #wp-calendar {width: 100%; } #wp-calendar caption { text-align: center; font-size: 14px; margin-top: 10px; margin-bottom: 5px; font-weight:bold; } #wp-calendar thead { font-size: 10px; } #wp-calendar thead th { padding-bottom: 10px; } #wp-calendar tbody { color: #888; } #wp-calendar tbody td { background: rgba(0, 0, 0, 0.1); border: 1px solid #333; text-align: center; padding:3px 8px;} #wp-calendar tbody td a{ display:block; text-decoration:underline;} #wp-calendar tbody td:hover { background: rgba(255, 255, 255, 0.1); } #wp-calendar tbody .pad { background: none; } #wp-calendar tfoot #next { font-size: 10px; text-transform: uppercase; text-align: right; } #wp-calendar tfoot #prev { font-size: 10px; text-transform: uppercase; padding-top: 10px; } #wp-calendar #today{ background:rgba(255, 255, 255, 0.2); color:#FFF; } /* --------------------------------------- [ wp-paginate ] */ .wp-paginate{ margin:20px 20px 0 20px !important; text-align:center !important; } .wp-paginate .current{ background:#000 !important; border:none !important; padding:6px 8px !important; /* CSS3 ROUND CORNER */ -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); } .wp-paginate a{ background: #d4d4d4 !important; border:none !important; color: #333 !important; padding:4px 6px !important; /* CSS3 ROUND CORNER */ -webkit-border-radius: 3px 3px 3px 3px; -khtml-border-radius: 3px 3px 3px 3px; -moz-border-radius: 3px 3px 3px 3px; -o-border-radius: 3px 3px 3px 3px; border-radius: 3px 3px 3px 3px; /* CSS3 SHADOW */ -webkit-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); -o-box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.2); } .wp-paginate .current, .wp-paginate a:hover{ background: #000 !important; border:none !important; color: #FFF !important; } #sidebar ul{ list-style:none; margin:10px 0 20px 0; padding:0; } /* ------------ RECENT POST */ #widget_post_list{ padding-top:10px; } #widget_post_list li{ list-style:none; border-bottom:1px solid #ededed; padding:0 0 5px 0; margin-bottom:15px; } #footer #widget_post_list li{ border-bottom:1px dashed #454545 !important; } #widget_post_list li:last-child{ margin-bottom:0px; } #widget_post_list .widget_post_list-thumbnail{ margin-right:15px; float:left; } #widget_post_list .widget_post_list-thumbnail a, #widget_post_list .widget_post_list-thumbnail img{ display:block; } #widget_post_list .widget_post_list-thumbnail img{ width:50px; height:50px; } #widget_post_list .widget_post_list-infos h5{ margin-bottom:5px; } #widget_post_list .widget_post_list-infos p{ margin-bottom:0px; } /* -------------------------- { search_form } */ #search_form{ color: #444 !important; background:#fafafa; border: 1px solid #ededed; padding: 1px 0 1px 1px; font-size: 11px; width: 100%; height:36px; margin-bottom:20px; } #search_form .field{ display: block; float: left; width: 85%; } #search_form .field input{ background: none; border: none; display: block; float: left; width: 100%; height: 36px; padding: 0 0 0 2%; } #search_form .button_search{ background:url(../images/search_icon.png) no-repeat left 50%; display: block; float: right; width: 20%; height: 36px; cursor: pointer; max-width: 30px; margin-right: 1px; } #search_form .button_search input{ background:none; border:none; display:block; float:left; width: 100%; height:36px; text-indent:-9999px; cursor:pointer; }