@import url("css/global.css"); /* Theme Name: Aerial Theme URI: http://tester.milentijevic.com/ Description: Corporate Business Portfolio Wordpress Theme. Author: Mladen Milentijevic Author URI: http://www.divinedeveloper.com/ Version: 1.0 License: GNU General Public License License URI: licence.txt Tags: two-columns, fixed-width, custom-background, threaded-comments, sticky-post, translation-ready, microformats, custom-menu */ body { background:#fff url(images/bgr.png) repeat-x; } #page { width: 880px; margin: 0 auto; text-align: left; } a { text-decoration: none; color: #191919; } a:hover { text-decoration: none; color: #336666; } /* **************** Header *************** */ #header { height: 140px; overflow:hidden; positin: relative; margin:0 0 30px; } #logo { width:280px; display:inline; float:right; margin:10px 0 0 20px; } #logo h1 { padding: 0; margin: 20px 0; font-size: 36px; line-height: 40px; } #logo h1 a{ color: #336666; } #logo h2 { padding: 0; margin: 0; font-size: 20px; line-height: 20px; } /* **************** Menu *************** */ .menu-header { position: relative; font-size: 18px; width: 580px; padding:0; margin: 0; border-bottom: 1px solid #cacaca; top: 40px; left: 0px;} /* These styles create the dropdown menus. */ #nav { float: left; } #nav li { list-style: none; float: left; margin: 0 20px 0 0; } #nav li a { display: block; padding: 10px 0; text-decoration: none; color: #484848; } #nav li.current-menu-item a, #nav li.current_page_parent a { color:#336666; } #nav li a:hover { color: #336666; } #nav li ul { display: none; font-size: 14px; } #nav .sub-menu li { margin: 0 15px 0 0; } #nav .sub-menu li a{ padding: 13px 0; } #nav li:hover ul, #nav li.hover ul { position: absolute; display: inline; left: 0; width: 100%; margin: 0; padding: 0; } #nav li:hover li, #nav li.hover li { float: left; } #nav li:hover li a, #nav li.hover li a { color: #484848; } #nav li li a:hover { color: #336666; } /* Coin Slider jQuery plugin CSS styles http://workshop.rs/projects/coin-slider */ #slider { overflow: hidden; height: 280px!important; width: 880px !important; padding: 0 0 50px; } .coin-slider { overflow: hidden; zoom: 1; position: relative; margin:0 0 40px; } .coin-slider a{ text-decoration: none; outline: none; border: none; } .cs-buttons { font-size: 0px; padding: 14px 10px; float: left; } .cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; } .cs-active { background-color: #B8C4CF; color: #FFFFFF; } .cs-title { font-size: 21px;width: 860px; padding: 14px 14px; background-color: #000000; color: #FFFFFF; } #cs-navigation-coin-slider a { cursor:pointer; position:absolute; top:45%; z-index:99; } #cs-navigation-coin-slider a { background:url(images/arrows.png) no-repeat; border:0 none; display:block; height:48px; text-indent:-9999px; width:48px; } a#cs-prev-coin-slider{ background-position:0 0; } a#cs-next-coin-slider { background-position:-48px 0; } /* **************** Kwicks *************** */ ul.kwicks { list-style: none; position: relative; margin: 0 0 40px; padding: 0; top: 0; height: 280px; width: 880px !important; background: #fff; overflow: hidden; } .kwicks li { float: left; width: 172px; height: 280px; margin-right: 5px; display: block; overflow: hidden; padding: 0; cursor: pointer; } .kwicks.horizontal li { margin-right: 0; float: left; } .kwick1, .kwick2, .kwick3, .kwick4, .kwick5 { } .hribbon { display: none; margin: -80px 20px 0; z-index:999; width: auto; padding: 10px 6px; text-align:right; } .kwicks li.active .hribbon { display: block; } .hribbon a { padding: 10px 6px; text-align:center; color: #fff; font-size: 16px; line-height: 38px; background: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } .hribbon a:hover { color: #fff; } /* **************** Cycle *************** */ #featured { margin:0 0 40px; position:relative; width:880px; height: 280px; z-index: 1; } #featured-slideshow { overflow: hidden; height: 280px; } #featured img{ } .ribbon{ position:absolute; top: 200px; left: 10px; z-index:999; background: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; width: auto; } .pribbon a, .smallribbon a{ background: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; width: auto; padding: 10px 6px; position:relative; top: -80px; left: 10px; z-index:999; color: #fff; font-size: 16px; } .smallribbon a { padding:6px; text-align:center; top: -60px; left: 5px; } #numbers { position: absolute; z-index: 999; top: 200px; right: 10px; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; } #numbers a, .ribbon a{ padding: 10px 6px; text-align:center; color: #fff; background: #000; filter:alpha(opacity=70); -moz-opacity:0.7; -khtml-opacity: 0.7; opacity: 0.7; width: auto; font-size: 16px; line-height: 38px; margin-right: 4px; } #numbers a.activeSlide { color: #ffffff; } .ribbon a { margin-right: 0; padding: 10px 13px; background:none; } #numbers a, .ribbon a:hover { color: #fff; } /* **************** Content *************** */ #container, #fullwidth, .bigbox { width:880px; margin:0; padding: 0; text-align:left; } .bigbox { margin:20px 0 0; } #content { width:580px; display:inline; float:left; margin:0 40px 0 0; overflow:hidden; } .mediumbox { width:580px; display:inline; float:left; margin:0 20px 0 0; overflow:hidden; } .half { width:430px; display:inline; float:left; margin:0 20px 0 0; overflow:hidden; } .smallbox { float: left; width:280px; display:inline; margin:0 20px 0 0; position:relative; } h2.post_title, h1.post_title, h1.page_title { font-size: 24px; line-height: 20px; margin: 0; padding: 8px 0 8px; } h1.post_title. h1.page_title { font-size: 30px; margin: 0 ; padding: 7px 0 8px; } h1.page_title { border-bottom: 1px solid #cccccc; } .sticky h2.post_title a{ color: #336666; } .post { margin: 0 0 40px; } .post img, .dd_page_widget img, .page img, img.avatar{ background: #ebebeb; padding: 5px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px;} .post img:hover, .dd_page_widget img:hover, .page img:hover{ background: #cacaca; } .entry_content { margin:0 0 20px; } .entry_meta { background: #ebebeb; padding: 10px; color: #000; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid #cacaca; } .more-link, .reply { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid #cacaca; display: block; background:#ebebeb; margin: 9px 0 0; padding: 3px 6px; color:#666666; line-height: 24px; text-align: center; text-decoration: none; float: right; padding:3px 12px; } .more-link:hover { background: #cacaca; color:#000000; } blockquote { background:url(images/paragraph.png) no-repeat 0 10px transparent; padding-left:40px; } .widget h2 { border-bottom:1px solid #cacaca; display:block; font-size:24px; margin:0 0 10px 0; padding:7px 0 8px; line-height: 20px; } .widget h2 a { } .dd_post_meta{ font-size:10px; color:#999999; } a.feedlink, a.feedcomments { background: url(images/rss.png) no-repeat center left; padding:6px 0 6px 36px; font-size: 14px; text-transform: uppercase;} span.emaildesc { background: url(images/email.png) no-repeat center left; padding:6px 0 6px 38px; font-size: 14px; text-transform: uppercase; } .dd_social_networks .dd_social_networks { margin: 0 1px 0 3px; } .dd_social_networks img { margin: 0; } #flickr { margin: 0 0 0 5px; } .flickr_badge_image { float:left; margin: 10px; } /* Page Navigation */ .wp-pagenavi { padding: 0; text-align: center; margin: 20px 0 0; } .wp-pagenavi span.pages, .wp-pagenavi a, .navigation .alignright a, .navigation .alignleft a { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; padding: 6px 6px; margin: 0 2px; background:#ebebeb ; border: 1px solid #ccc; color: #666666; } .wp-pagenavi a:hover, .wp-pagenavi span.current, .navigation .alignright a:hover, .navigation .alignleft a:hover { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; padding: 6px 6px; margin: 0 2px; color: #000000; background: #cccccc; border: 1px solid #ccc; } .wp-pagenavi span.current, .wp-pagenavi span.extend { padding: 6px 6px; color: #000000; background:#cccccc ; margin: 0 2px; border: 1px solid #cccccc; line-height: 38px; } /* **************** Sidebar *************** */ #sidebar { float: left; width:260px; display:inline; margin:0; position:relative; } #sidebar .widget { margin: 0 0 20px; } #sidebar h3 { border-bottom:1px solid #cacaca; display:block; font-size:21px; margin:0 0 10px 0; padding:10px 0 9px; line-height: 20px; } #sidebar p { } #sidebar ul, #footer ul { margin: 0; list-style-type: none; } #sidebar ul .children { padding: 0 0 0 8px; } #sidebar li, #footer li { margin:0; } #sidebar li a, #footer .widget li a { font-weight:normal; font-size:12px; padding:5px 0 0 15px; display:block; background:transparent url(images/arrow.gif) no-repeat 0 10px; } #sidebar li a:hover { } #sidebar li img{ padding:5px 0 0; } input#s { background:#FFFFFF url(images/search.png) no-repeat right center; border:1px solid #cacaca; height:24px; margin:0; padding:6px 32px 6px 6px; width:222px; } /* **************** Footer *************** */ #footer { background:#ebebeb; padding: 0 0 20px; margin:40px 0 0; float:left; width:100%; color: #333; text-align:left; border-top:5px solid #cacaca; positin: relative; } #footer a{ color: #000; } #footer a:hover{ text-decoration:underline; } .footer_inner{ margin: 15px auto 0; padding: 0; width: 880px; clear: both; } #copy{ margin: 20px auto 0; } /* Lightbox image hover icons */ #container img { z-index: 2; } .lightbox-image { position: absolute; z-index: 1; background: transparent url(images/lightbox_image.png) no-repeat scroll 50% 50%; } .lightbox-video { position: absolute; z-index: 1; background: transparent url(images/lightbox_video.png) no-repeat scroll 50% 50%; } /* Image Loader GIF */ .image-holder { background: transparent url(images/loading.gif) no-repeat scroll 50% 50%; } /* **************** Portfolio Tabber *************** */ /*-------------------------------------------------- REQUIRED to hide the non-active tab content. But do not hide them in the print stylesheet! --------------------------------------------------*/ .tabberlive .tabbertabhide { display:none; } /*-------------------------------------------------- .tabber = before the tabber interface is set up .tabberlive = after the tabber interface is set up --------------------------------------------------*/ .tabbertab { } .tabberlive { } /*-------------------------------------------------- ul.tabbernav = the tab navigation list li.tabberactive = the active tab --------------------------------------------------*/ ul.tabbernav { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid #e5e5e5; } ul.tabbernav:after { /* clearing without presentational markup, IE gets extra treatment */ display: block; clear: both; content: " "; } ul.tabbernav li { float:left; margin:5px 5px 0 0 ; min-width: 64px; /* be nice to Opera */ line-height: 24px; } ul.tabbernav li a { -moz-border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; border-radius: 4px 4px 0 0; display: block; background:#cacaca; margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */ padding: 3px 6px; color:#000000; line-height: 24px; text-align: center; text-decoration: none; white-space: nowrap; /* required in IE 6 */ outline: 0; /* prevent dotted border in Firefox */ } ul.tabbernav li a:hover { background: #ebebeb; color:#666666; } ul.tabbernav li.tabberactive a { background: #ebebeb; color: #666666; padding: 3px 6px; line-height: 24px; } ul.tabbernav li.tabberactive a:hover { color: #000; } /*-------------------------------------------------- .tabbertab = the tab content Add style only after the tabber interface is set up (.tabberlive) --------------------------------------------------*/ .tabberlive .tabbertab { clear:both;/* If you don't want the tab size changing whenever a tab is changed you can set a fixed height */ /* height:200px; */ /* If you set a fix height set overflow to auto and you will get a scrollbar when necessary */ /* overflow:auto; */ } /* If desired, hide the heading since a heading is provided by the tab */ .tabberlive .tabbertab h5 { display:none; } .tabberlive .tabbertab h6 { display:none; } /* Example of using an ID to set different styles for the tabs on the page */ .tabberlive#tab1 { } .tabberlive#tab2 { } .tabberlive#tab2 .tabbertab { height:200px; overflow:auto; } .submit span { display:inline; float:left; margin-left:5px; padding:0 !important; } .stuffbox { padding: 8px; } .stuffbox label { padding: 8px; } .tabberlive { margin: 18px 0 0; } .tabbertab { border-bottom: 1px solid #ebebeb; } ul.tabbernav { float:right; border-bottom: none; } ul.tabbernav li { margin:5px 0 0 5px; } /* **************** Style Shortcodes *************** */ .infobox, .notebox, .successbox, .warningbox, .errorbox { padding: 10px 10px 10px 50px; margin: 20px 0; } .infobox { color: #665B66; border: 1px solid #A2B4EE; background: #DBE3FF url(images/info.png) no-repeat scroll 10px 50%; } .notebox { color: #9E660D; border: 1px solid #E6C555; background: #FDEBAE url(images/note.png) no-repeat scroll 10px 50%; } .successbox { color:#264409; border:1px solid #C6D880; background: #E6EFC2 url(images/success.png) no-repeat scroll 10px 50%; } .warningbox { color:#665D51; border:1px solid #DEBD8E; background: #FFEBCF url(images/warning.png) no-repeat scroll 10px 50%; } .errorbox { color: #8A1F11; border: 1px solid #FBC2C4; background: #FBE3E4 url(images/error.png) no-repeat scroll 10px 50%; } ul.checklist li { padding:0 0 0 25px; margin:0; background:transparent url(images/checkmark.png) no-repeat 0 50%; list-style: none; } ul.arrowlist li { padding:0 0 0 25px; margin:0; background:transparent url(images/br_next.png) no-repeat 0 50%; list-style: none; } /* **************** Forms *************** */ #contactForm { float: left; list-style: none; width: 100%; margin: 20px 0 0; } #contactForm p { float: left; width: 100%; margin: 0 0 20px 0; } #contactForm label{ cursor: pointer; display: block; float: left; margin-right: 20px; width: 200px; } #contactForm input, #contactForm textarea { border:1px solid #cacaca; color:#999999; margin:0 0 10px; padding:6px; width:346px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } #contactForm p .errorbox { display: block; } #contactForm p.form-submit button, input#submitted { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid #cccccc; cursor: pointer; display: block; background:#ebebeb; margin: 9px 0 0; padding: 3px 6px; color:#666666; line-height: 24px; text-align: center; text-decoration: none; float: right; padding:3px 12px; width: auto; } #contactForm p.form-submit button:hover, #contactForm p.form-submit input#submitted:hover { background: #cacaca; color:#000000; } .required { color: #8A1F11; } /* **************** Comments *************** */ #comments h3 { border-bottom:1px solid #cccccc; padding:10px 0 9px; font-size: 1.5em; line-height: 1em; margin:0 0 10px; } #comments ol.commentlist { margin:20px 0; list-style: none; } #comments ol.commentlist .bypostauthor {} #comments ul { list-style-type:none; } #comments ol.commentlist li { margin:0; padding:0; } #comments ol.commentlist li { background: #ebebeb; padding: 10px 10px 0; color: #000; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; margin: 0 0 10px; } #comments ol.commentlist li ul{ margin: 0; clear:both; padding: 0 0 10px; } #comments ol.commentlist li ul li{ margin: 0 0 0 90px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border:1px solid #cccccc; } img.avatar { margin: 0 10px 9px 0; display:block; float:left; background: #ffffff; } .fn{ font-size: 10px; padding: 5px 0 0; text-transform: uppercase; font-weight: bold; } .comment-body { padding: 0 0 0 90px; } .comment-body p { margin: 10px 0; } .reply { background: #ffffff; font-size: 10px; text-transform: uppercase; font-weight: bold; margin: 10px 0; } .alignleft { text-align:left; } .alignright { text-align:right; } .center, .aligncenter { display: block; margin-left: auto; margin-right: auto; text-align:center; }