/* Theme Name: ATOM Theme URI: http://digitalnature.ro/projects/atom-test/ Description: Basic/Test theme for ATOM (internal) framework. Check out the project page for a full list of features, there are too many to mention here :) -- Developed by digitalnature Version: 1.1.2 Author: digitalnature Author URI: http://digitalnature.ro/ Tags: light, white, two-columns, three-columns, one-column, fixed-width, flexible-width, right-sidebar, left-sidebar, theme-options, threaded-comments, translation-ready, custom-header, editor-style Theme designed by digitalnature. See the project page for more info and updates Both the design and code are released under GPL. http://www.opensource.org/licenses/gpl-license. */ /* DO NOT EDIT THIS FILE! (OR ANY OTHER FILES FROM THIS PACKAGE). CREATE A CHILD THEME OR USE THE THEME OPTIONS TO MAKE CSS CHANGES! */ /* These are Core styles -- with few exceptions, no visual properties like color, fonts etc here (makemesexy/*.css will handle those) */ /* reset */ html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,label,input,textarea,p,blockquote,table,th,td{margin:0;padding:0;} html,body{min-height:100%;} body{ background:transparent none no-repeat scroll center top; /* "none" will be replaced with the image url if set */ } .page-content{ max-width:1200px; /* option overrides it */ min-width:400px; margin:0 auto !important; position:relative; } /* fluid width page */ body.fluid .page-content{ padding:0 10px; width:auto; } /* fixed width page - 960gs */ body.fixed .page-content{ width:960px; } /*** GENERAL ELEMENTS ***/ /* links */ a{outline:none;} /* headings */ h1,h2,h3,h4,h5,h6{ font-weight:normal; margin:.75em 0 .25em; padding:0; } /* tables */ table{ margin:1em 0 2em 0; width:100%; border-collapse:collapse; border-spacing:0; } td, th{padding:5px;} th{font-weight:bold;} caption, th{text-align:left;} /* forms */ form{margin:1em 0 2em 0;} input, select, textarea{ display:block; margin-bottom:5px; padding:5px 10px; } optgroup{ font-style: italic; font-weight: normal; } textarea{ width:75%; height: 160px; } input[type="checkbox"], input[type="radio"]{ padding: 0; display:inline; vertical-align:-1px; } input[type="submit"]{cursor:pointer;} label{ font-weight:normal; display:block; margin-top:5px; } fieldset{margin:1em 0 2em 0;} /* lists */ ul, ol{ list-style-type:disc; list-style-position:outside; margin:0 0 10px 15px; line-height: 150%; } dl{margin:1em 0 2em 0;} dt{font-weight:bold;} /* other */ p{ margin:.25em 0 .75em 0; line-height:150%; } img{border:0;} small{font-size:80%;} code{font:12px "Courier New", Courier, "Lucida Console", Monaco, "DejaVu Sans Mono", "Nimbus Mono L", "Bitstream Vera Sans Mono", monospace;} pre{ font:12px "Courier New", Courier, "Lucida Console", Monaco, "DejaVu Sans Mono", "Nimbus Mono L", "Bitstream Vera Sans Mono", monospace; overflow:auto; white-space:pre-wrap;/* <- css3 */ white-space:0;/* <- ff */ margin:.25em 0 .75em 0; } blockquote { margin:1.5em 10px; quotes:"\201C""\201D""\2018""\2019"; } blockquote:before { content:open-quote; font-size:4em; line-height:.1em; margin-right:.25em; vertical-align:-.4em; } blockquote p{ display:inline; font-style:italic; } /*** MAIN LAYOUT ***/ /* masks are required to make sidebars extend all the way down (useful if they have a background). */ #mask-3{ position:relative; z-index:2; overflow:hidden; /* all content outside this area is hidden - need to find a way without overflow, because some plugins */ } #mask-1, #mask-2{ float:left; position:relative; right:0; width:100%; } #primary-content, #sidebar, #sidebar2{ width:100%; top:0; left:0; position:relative; float:left; min-height:150px; } #primary-content{min-height:540px;} /* hide sidebar(s) based on current layout -- only needed by the preview doc., since sidebars don't appear in the front-end unless required */ body.col-1 #sidebar, body.col-1 #sidebar2, body.col-2-left #sidebar2, body.col-2-right #sidebar2{display: none;} /*** LOGO & HEADLINE ***/ #site-title{padding:1em 0 2em 0;} #logo{ margin:0; padding:0; } /* NAVIGATION: common */ .nav{position:relative;} .nav ul, .nav li{ list-style-type:none; padding:0; margin:0; } .nav li{ position:relative; float:left; line-height: normal; } .nav a{ display:block; position:relative; } .nav ul ul{ position:absolute; z-index:15; display:none; width:300px; top:29px; } /* level 3+ */ .nav ul ul ul{ top:10px; left:280px; } .nav li li{ float: none; } .nav li:hover ul ul, .nav li:hover ul ul ul, .nav li:hover ul ul ul ul{display:none;} .nav li:hover ul, .nav li li:hover ul, .nav li li li:hover ul, .nav li li li li:hover ul{display:block;} /* add extra padding on menus with children, to make space for the arrows we're inserting with jquery (we just need this for 1st level horizontal menus) */ .nav .extends a{padding-right: 30px;} .nav .arrow{ position:absolute; right:10px; top:15px; height:8px; width:8px; /* graphic -- styles should override if necessary */ background:transparent url(i/a.gif) no-repeat 0 0; } .nav li li .arrow{top: 10px;} .nav .current-menu-item > a .arrow, .nav .current-menu-ancestor > a .arrow, .nav li.hover > a .arrow, .nav li:hover > a .arrow{background-position:0 -8px;} .nav li li .arrow{background-position:-16px 0;} .nav li .current-menu-item > a .arrow, .nav li .current-menu-ancestor > a .arrow, .nav li li.hover > a .arrow, .nav li li:hover > a .arrow{background-position:-16px -8px;} /*** BLOCKS (usually widgets) ***/ .blocks, .block{ list-style-type:none; padding:0; } .blocks{margin:1em 0 0 0;} .block{margin:0 0 2em 0;} /* remove styling on nested blocks (eg. in tabs or arbitrary widgets inside posts, pages etc.) */ .block .block{ float: none !important; margin: 0 !important; padding: 0 !important; width: auto !important; border: 0 !important; } /* common menu style used by many widgets */ .block ul.menu, .block ul.menu li, .block .box, .block ul.box .entry{ margin:0; padding:0; list-style-type:none; } .block ul.menu, .block ul.menu li{line-height: normal;} .block ul.menu li, .block ul.box .entry{position:relative;} .block ul.menu a, .block ul.box .entry{ display:block; padding:5px 0; } /* level 2+ (submenus) */ .block ul.menu ul{ position:absolute; z-index: 15; display:none; top:-1px; right: 100%; padding: 10px; margin: 0; min-width: 250px; line-height:normal; } .block ul.menu li li a{padding:5px;} /* submenu position adjustments based on the layout type */ body.col-2-left #sidebar .block ul.menu ul, body.col-3 #sidebar .block ul.menu ul, body.col-3-left #sidebar .block ul.menu ul, body.col-3-left #sidebar2 .block ul.menu ul{ right:auto; left: 100%; } .block ul.menu li:hover ul ul, .block ul.menu li:hover ul ul ul, .block ul.menu li:hover ul ul ul ul{display:none;} .block ul.menu li:hover ul, .block ul.menu li li:hover ul, .block ul.menu li li li:hover ul, .block ul.menu li li li li:hover ul{display:block;} .block ul.menu .arrow{ position:absolute; right:6px; top:10px; height:8px; width:8px; background:transparent url(i/a.gif) no-repeat -16px 0px; } .block ul.menu .avatar, .block ul.menu .wp-post-image, .block ul.menu .no-img{ float:left; display:block; margin-right:5px; } /* information block (left side) */ .block ul.menu .base{ overflow:hidden; display:block; } /* titles */ .block ul.menu .tt{display:block;} /* content - primary */ .block ul.menu .c1{ display:block; line-height: 150%; } /* content - secondary */ .block ul.menu .c2{ display:block; margin:5px 0 0 0; } /* country flag */ .block ul.menu .flag{margin-top:4px;} /* thumbnail mode */ /* extra margin - useful if you want the avatars alinged perfectly. for eg. 72px avatars on the default fixed layout (2 cols) */ .block ul.menu.images{margin-right:-4px;} .block ul.menu.images li{ float:left; margin:4px 4px 0 0; border:0; } .block ul.menu.images a{padding:0;} /* float is moved on
  • */ .block ul.menu.images .avatar, .block ul.menu.images .no-img{ float:none; margin:0; } /* used for link ratings */ .block ul.menu .rating{ display:block; width:50%; margin:5px 0; } .block ul.menu .rating .bar{ display:block; text-indent:-9999px; height:5px; } /* more link */ .block a.more{display:block;} /*** POST ***/ .hentry{ margin-bottom: 2em; position: relative; } /* using shrinkwrap method - thanks Ray: http://www.css-lab.com/lab-work/auto-width/shrink-wrap-col.html */ .hentry .post-details{overflow:hidden;} .hentry.thumb-left .post-details, .hentry.thumb-right .post-details{min-height:140px;} /* adjust this dynamically? */ /* thumbnail-only based post previews (looks pretty cool) */ .hentry.thumb-only{float:left;} .hentry h2.title{ margin:0; padding:0 0 5px 0; } .hentry.thumb-left .post-thumb{ float:left; margin-right:10px; } .hentry.thumb-right .post-thumb{ float:right; margin-left:10px; } .hentry.thumb-left .post-details{padding-left: 10px;} .hentry.thumb-right .post-details{padding-right: 10px;} /* float is moved to the parent element in thumb-only mode */ .hentry.thumb-only .post-thumb{ float:none; margin:0 10px; } .hentry .post-thumb img{display:block;} .hentry .post-content{line-height:130%;} .hentry .post-extra{overflow:hidden;} .hentry .post-tags{overflow:hidden;} .hentry .post-tags a{display:inline-block;} .hentry .comments{float:right;} /* this class should not have any graphic styles on it, because the element that has it could be empty */ .post-controls{ display: none; position: absolute; z-index: 5; right: 10px; top:5px; } .post-controls a{float: right;} .hentry:hover > .post-controls{display:block;} /*** COMMENTS/PINGS ***/ #comments, #pings, #related-posts, #about-the-author, #comments li, #pings li, #related-posts li, #about-the-author li, #comments .navi{ list-style-type:none; margin:0; padding:0; } #comments, #pings, #related-posts, #about-the-author{margin:1em 0 2em 0;} li .ping{ list-style-type:decimal; margin-left:25px; } li .comment{ margin:1em 0 0 0; position:relative; } li li .comment{margin:0 0 0 40px;} .comment .avatar{ position:absolute; top:5px; left:5px; } .comment .avatar img{display:block;} .comment.with-avatars .comment-head{padding-left:80px;} .comment.with-avatars .comment-body{margin-left:70px;} .comment .comment-content{ position:relative; min-height:68px; height:68px; height:auto !important; } .comment.new form{margin: 0;} .comment .controls{ display:none; position:absolute; right:15px; bottom:15px; } .comment:hover .controls{display:block;} .comment.new .button.alignleft{margin-right:5px;} /*** SINGLE PAGES ***/ h1.title{margin:.25em 0 .5em 0;} h5.title{margin: 2em 0 .25em 0;} /* next/previous post links */ .post-links div{ display:block; max-width:45%; line-height:normal; } .post-links .alignright{text-align:right;} /* post meta */ .post-meta{ margin:1em 0 0 0; overflow: hidden; } .post-meta .details{overflow: hidden;} .post-meta .details p{ margin:0; line-height:125%; } ul.share-this, ul.share-this li{ list-style-type: none; margin: 0; padding: 0; } ul.share-this, ul.share-this li{float: left;} ul.share-this a{display: block;} /* PAGE/COMMENT NAVIGATION */ /* align to right on col-3-left layout, looks better */ body.col-3-left .page-navi{float:right;} .page-navi a, .page-navi .current, .page-navi .dots, .page-navi .pages{float:left;} /*** FEATURED BLOCK ***/ .block-featured .prev, .block-featured .next{ position:absolute; top:60px; cursor:pointer; z-index: 15; } .block-featured .prev{left:-30px;} .block-featured .next{right:-30px;} .block-featured .block-content{ position:relative; z-index:5; } .block-featured ul, .block-featured li.item{ margin:0; padding:0; list-style-type:none; } .block-featured li.item{ width:188px; height:188px; display:block; float:left; overflow:hidden; } .hentry.featured{ margin:0; overflow:hidden; } .block-featured .post-thumb, .block-featured .post-thumb img{display:block;} .block-featured .post-thumb .cover{ position:absolute; bottom:-100px; left:0; width: 100%; opacity:0; } .block-featured .post-thumb .cover p{ margin: 0; display: block; line-height: 150%; } /*** RELATED POSTS ***/ #related-posts .hentry{ margin:1em 0; overflow:hidden; } #related-posts .hentry .post-details{ overflow:hidden; min-height:none !important; } #related-posts .hentry h2.title{padding: 0;} /*** SOCIAL MEDIA LINKS ***/ .social-media, .social-media li{ list-style-type:none; margin:0; padding:0; } /*** TABS ***/ .tabs, .tabs li{ list-style-type:none; padding:0; margin:0; } .tabs li{float:left;} .tabs a{display:block;} .sections, .section{position:relative;} .section{width:100%;} /*** FOOTER ***/ #footer .block{ list-style-type:none; margin:0; float:left; } /* needed for preview mode (areas show even if they don't have visible widgets) */ #footer .count-0 .block{width:100%;} #footer .count-1 .block{width:100%;} #footer .count-2 .block{width:50%;} #footer .count-3 .block{width:33%;} #footer .count-4 .block{width:25%;} #footer .count-5 .block{width:20%;} #footer .count-6 .block{width:15%;} /* adjust width of 1st block in 3-block-footer mode */ #footer .count-3 .block:first-child{width:34%;} #footer .block h4.title{margin:0 0 5px 0;} /* copyright & other info */ #footer #copyright{ padding:1em 0; line-height:150%; } /*** 404 PAGE ***/ .error404 #logo{ padding:60px 0 10px 0; z-index:5; position:relative; } .error404 h1.title{ font-size:2400%; z-index:4; position:relative; margin:0; padding:0; } .error404 #footer{ position:absolute; width:100%; bottom:0; } /*** MISC ***/ .wide{width:100%;} .hidden{display:none;} /* smiley adjustment */ img.wp-smiley{vertical-align:-15%;} /* clearfix */ .clear-block:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0;} /* fading */ .fadeThis{ position:relative; z-index:1; } .fadeThis .hover{ position:absolute; top:0; left:0; display:block; height:100%; width:100%; z-index:-1; } /* tooltips */ .tip{ position:absolute; z-index:20; max-width:400px; display:none; min-width:50px; max-width:500px; } .large{font-size:115%;} /* pr */ .pagerank{ display:inline-block; margin:0 3px; } .pagerank-frame{ height:8px; width:35px; margin-left:2px; display:inline-block; } .pagerank-bar{height:8px;} /* thumbnail placeholder */ .no-img{ display:block; background:transparent url(i/x.png) no-repeat center center; position:relative; } .no-img.loading{ background:transparent url(i/loader-w.gif) no-repeat center center; display:block; position:relative; } /* fancybox */ #fancybox-loading{ position:fixed; top:50%; left:50%; height:40px; width:40px; margin-top:-20px; margin-left:-20px; cursor:pointer; overflow:hidden; z-index:1104; display:none} * html #fancybox-loading{/* IE6 */ position:absolute; margin-top:0} #fancybox-loading div{ position:absolute; top:0; left:0; width:40px; height:480px; background-image:url('i/fancybox.png')} #fancybox-overlay{ position:fixed; top:0; left:0; bottom:0; right:0; background:#000 url(i/light-mask.png) no-repeat 50% 10%; z-index:1100; display:none} * html #fancybox-overlay{/* IE6 */ position:absolute; width:100%} #fancybox-tmp{ padding:0; margin:0; border:0; overflow:auto; display:none} #fancybox-wrap{ position:absolute; top:0; left:0; margin:0; padding:20px; z-index:1101; display:none} #fancybox-outer{ position:relative; width:100%; height:100%; background:#FFF} #fancybox-inner{ position:absolute; top:0; left:0; width:1px; height:1px; padding:0; margin:0; outline:none; overflow:hidden} #fancybox-hide-sel-frame{ position:absolute; top:0; left:0; width:100%; height:100%; background:transparent} #fancybox-close{ position:absolute; top:-15px; right:-15px; width:30px; height:30px; background-image:url('i/fancybox.png'); background-position:-40px 0px; cursor:pointer; z-index:1103; display:none} #fancybox_error{ color:#444; font:normal 12px/20px Arial; padding:7px; margin:0} #fancybox-content{ height:auto; width:auto; padding:0; margin:0} #fancybox-img{ width:100%; height:100%; padding:0; margin:0; border:none; outline:none; line-height:0; vertical-align:top; -ms-interpolation-mode:bicubic} #fancybox-frame{ position:relative; width:100%; height:100%; border:none; display:block} #fancybox-title{ position:absolute; bottom:0; left:0; font-family:Arial; font-size:12px; z-index:1102} .fancybox-title-inside{ padding:10px 0; text-align:center; color:#333} .fancybox-title-outside{ padding-top:5px; color:#FFF; text-align:center; font-weight:bold} .fancybox-title-over{ color:#FFF; text-align:left} #fancybox-title-over{ padding:10px;background-color:#333;background-color:rgba(0,0,0, 0.5); display:block} #fancybox-title-wrap{ display:inline-block} #fancybox-title-wrap span{ height:32px; float:left} #fancybox-left,#fancybox-right{ position:absolute; bottom:0px; height:100%; width:35%; cursor:pointer; outline:none; z-index:1102; display:none} #fancybox-left{ left:0px} #fancybox-right{ right:0px} #fancybox-left-ico,#fancybox-right-ico{ position:absolute; top:50%; left:-9999px; width:30px; height:30px; margin-top:-15px; cursor:pointer; z-index:1102; display:block} #fancybox-left-ico{ background-image:url('i/fancybox.png'); background-position:-40px -30px} #fancybox-right-ico{ background-image:url('i/fancybox.png'); background-position:-40px -60px} #fancybox-left:hover,#fancybox-right:hover{ visibility:visible;/* IE6 */} #fancybox-left:hover span{ left:20px} #fancybox-right:hover span{ left:auto; right:20px} .fancy-bg{ position:absolute; padding:0; margin:0; border:0; width:20px; height:20px; z-index:1001} /*** SUPPORT FOR OTHER NON-GENERIC WIDGETS ***/ .calendar-block .top{ position: relative; padding: 5px 0 5px 70px; } .calendar-block h4{margin: 0;} .calendar-block .control{ position: absolute; line-height: 28px; left: 0; top: 0; height: 100%; width: 60px; text-align: center; } .calendar-block .control.next{ left: auto; right: 0; } table.calendar{margin:0;} table.calendar td, table.calendar th{ text-align:center; padding: 0; } table.calendar a, table.calendar span{ padding: 5px; display: block; text-align: center; } /* tag cloud */ .tag-cloud{ text-align:justify; line-height:150%; padding: 10px 0; } .tag-cloud a{ vertical-align:middle; text-decoration:none; padding:0 0.2em; letter-spacing:-0.02em; } /* latest tweets */ .latest-tweets .avatar{float:left;} .latest-tweets .avatar img{display:block;} .latest-tweets .info{padding:5px 0;} .latest-tweets .details{ display:block; margin-left:66px; } .latest-tweets .details a{display:block;} .latest-tweets .details span{ display:block; padding-top:4px; } .latest-tweets .date{display:block;} /* login */ .login-block{margin:5px 0;} .login-block .status{margin:4px 0;} .login-block a.forgot_pass, .login-block a.register{display:block;} .login-block label.remember{margin-top:12px;} .login-block .avatar{float:left;} .login-block .avatar img{ display:block; padding: 0; } .login-block ul.menu{ display:block; margin-left:116px; } .login-block input.text{width:50%;} .login-block input.text.wide{width:75%;} /* search */ .search-form{ overflow:hidden; margin: 0; } .search-form fieldset{ border:0; margin:0; padding: 0; overflow:hidden; display:block; } .search-form a.submit{float:right;} /* image captions */ a.caption{position:relative;} img.alignleft,img.alignright{ padding:3px; margin-top:5px; margin-bottom:5px; } .alignleft{float:left;margin-right:10px;} .alignright{float:right;margin-left:10px;} .aligncenter{display:block;margin-left:auto;margin-right:auto;text-align:center;} a.go-top{ display: none; position:fixed; right:10px; bottom:10px; cursor: pointer; z-index: 99; } .no-js .hide-if-no-js{display: none;} /* [column] shortcode -- @todo: remove this and add a real interface for adding columns in the editor */ .col{ float: left; width: 100%; margin-bottom: 10px; } .col.c-2{width: 50%;} .col.c-3{width: 33%;} .col.c-4{width: 25%;} .col.c-5{width: 20%;} .col.c-6{width: 16.5%;} .col.c-7{width: 14%;} .col.c-8{width: 12.5%;} .col.c-9{width: 11%;} .col.c-10{width: 10%;} .col .cc{ padding: 0 10px; border-right: 1px solid #ddd; } .col.last .cc{ padding-right: 0; border:0; } .col.first .cc{padding-left: 0;}