/* Theme Name: The IDArchive Theme URI: interactivedesignarchive.com Description: A theme once upon a time that was based on FolioGrid Version: 2.0 Author: Visual Advance Author URI: http://www.visualadvance.com Tags: simple, clean, single column, grid, portfolio, dark */ /** Global reset * ------------------------------------------------------------------- */ html, body, div, li, dl, dt, dd, h1, h2, h3, h4, h5, pre, form, blockquote, fieldset, input { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, th { font-size: 1em; font-weight: normal; font-style: normal; } fieldset, img { border: none } caption, th { text-align: left } table { border-collapse: collapse; border-spacing: 0; margin-bottom: 10px; width: 100%; } table td { padding: 0 10px 0 0 } .hidden, .screen_reader, hr { display: none } /* ===[ Paragraph default styling, amend as desired ]=== */ p { margin: 0 0 1em 0; padding: 0; } /* ===[ Default link styling ]=== */ a { color: #4baceb; text-decoration: none; outline: none; } a:hover { color: #FFFFFF; text-decoration: none; } /* ===[ Float an element left with a margin ]=== */ blockquote { padding: 20px; margin: 0 40px 20px 20px; border-left: 3px solid #fff; clear: both; } .upper { text-transform: uppercase } /* ===[ Italisise ]=== */ .hideText { text-indent: -3000em; overflow: hidden; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .divlink { display: block } .center { text-align: center } /** Default * ------------------------------------------------------------------- */ html, body { font: 12px/1.4em "Droid Sans", Verdana, sans-serif; color: #9f9f9f; height: 100%; } body { width: 100%; height: 100%; background: #000; background-image: url(images/pattern.jpg); background-repeat: repeat; padding: 0; margin: 0; } h1, h2, h3, h4 { color: #fff; font-family: "Cardo", Georgia, serif; line-height: 1.2em; margin: 0; padding: 0; } h1 { font-size: 30px; } h2 { font-size: 24px; } h3 { font-size: 18px; } h4 { font-size: 12px; } ul { padding: 0; margin: 0; } label { display: block; font-size: 0.9em; } .left { float: left } .right { float: right } .clear { clear: both } .grey { color:#9F9F9F; } /** Main Template * ------------------------------------------------------------------- */ #nav-wrap { width: 280px; height: 100%; min-height: 520px; background-image: url(images/pattern-nav.jpg); background-repeat: repeat-y; position: fixed; top: 0; left: 0; z-index: 100; overflow: hidden; } #content-wrap { margin-left:280px; margin-top: 37px; } #page-wrap { width: 640px; margin: 17px 20px 0 20px; } #posts-wrap { margin: 17px 20px 0 20px; } #page-wrap h1, #content-wrap h1, .singlepost h1 { margin:17px 0 0 20px; } #blue-bar { background-color:#4BACEB; height:20px; } #navigation {margin-left:20px; margin-right:20px; } /** Nav Wrap * ------------------------------------------------------------------- */ #logo, #logo a { background: url(images/logo.png) no-repeat; width: 99px; height: 50px; display: block; text-indent: -9000px; font-size: 36px; line-height: 1.2em; margin: 0 0 0px 0; text-decoration: none; } .navinnerwrap { margin-left: 20px; margin-top: 20px; font-size: 18px; font-family: "Droid Sans", Verdana, sans-serif; color: #d6d6d6; } #logo { width: 99px; height: 49px; text-transform: uppercase; margin-bottom: 4px; } #logo h4 { color: #9f9f9f; font-family: "Droid Sans", Verdana, sans-serif; } #tagline { background-image: url(images/logo-bluebar.jpg); background-repeat: none; width: 280px; height: 20px; margin-bottom: 50px; } #tagline h4 { text-transform: uppercase; margin-left: 20px; font-family: "Droid Sans", Verdana, sans-serif; font-size: 11px; text-shadow: 1px 1px 1px #387fae; padding-top: 3px; } #search { margin-bottom: 30px } .searchfield { width: 195px; height: 25px; padding: 5px 0 0 10px; background: #fff; margin-right: 4px; border: 0; font-size: 18px; font-family: "Droid Sans", Verdana, sans-serif; color: #555; float: left; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; -moz-box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); -webkit-box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); } #filter { margin-bottom: 5px; width: 260px; height: 36px; } #filtertext { padding: 11px 0 0 10px; width: 85px; float: left; } #filtermenu { padding: 8px 0 0 10px; float: left; background-image: url(images/navitem-short-background.png); background-repeat: no-repeat; width: 155px; height: 36px; } .postform { width: 149px; font-size: 13px; font-family: "Droid Sans", Verdana, sans-serif; color: #555; } .navitem { font-size: 18px; font-family: "Droid Sans", Verdana, sans-serif; color: #d6d6d6; background-image: url(images/navitem-background.png); background-repeat: no-repeat; padding: 11px 0 0 10px; width: 260px; height: 36px; text-shadow: 1px 1px 1px #3a86b6; } .navitem:hover { color: #000 } #pages { margin-bottom: 25px } #pages li { position: relative; left: 0; font-size: 18px; font-family: "Droid Sans", Verdana, sans-serif; color: #d6d6d6; background-image: url(images/navitem-background.png); background-repeat: no-repeat; padding: 10px 0 0 10px; width: 260px; height: 26px; text-shadow: 1px 1px 1px #3a86b6; margin-left: 0px; margin-bottom: 5px; list-style-type: none; } #pages li a:hover { color: #000 } #pages li a { padding: 8px 200px 8px 0; color: #d6d6d6; } #quicksubmit { font-size: 12px; text-transform: uppercase; } .submitfield { width: 195px; height: 22px; padding: 8px 0 0 10px; background: #fff; margin-right: 4px; border: 0; font-size: 12px; font-family: "Droid Sans", Verdana, sans-serif; color: #555; float: left; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; -moz-box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); -webkit-box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); box-shadow: inset 3px 3px 1px rgba(0, 0, 0, 0.4); } /** About Template * ------------------------------------------------------------------- */ #page-content { width:400px; float:left; margin-right:10px; } #page-right { width:230px; float:left; } #page-right h3 { margin-bottom:10px; } /** Footer elements * ------------------------------------------------------------------- */ #footer { position: absolute; bottom: 15px; left: 20px; text-transform: uppercase; font-size: 10px; } #footer-icons { margin-bottom: 4px } #footer-icons img { position: relative; top: 0px; } .social-icon { padding-right: 5px; float: left; } /* page Wrap ------------------------------------------------------------------- */ #pagecontent { width: 430px } .page-item { padding: 10px 10px 0 10px; margin-bottom: 20px; background: #232323; background-color: rgba(35,35,35,.65); border: 1px solid #333; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; } .date { font-size: 10px; margin-bottom: 10px; } .page-content { color: #fff } #page-wrap input { margin-bottom: 10px; width: 360px; } #page-wrap textarea { margin-bottom: 10px; width: 360px; } /** Post * ------------------------------------------------------------------- */ .submission { height:305px; } .post-title h2 { font-size: 16px; margin-bottom: 7px; } .post-title h2 a { color: #4BACEB } .post-title h2 a:hover { color: #FFF } .post { margin-right: 10px; margin-bottom: 10px; float: left; } .post-inner { width:300px; padding:10px; background: #232323; background-color: rgba(35,35,35,.65); border: 1px solid #333; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4); box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.4); } .post-header { height:197px; margin-bottom: 7px; overflow: hidden; } .post-header-ad { height:197px; margin-bottom: 7px; } .post-link { height: 17px; overflow: hidden; margin: 0 0 4px 0; } .post-description { height: 45px; overflow: hidden; font-size: 10px; } .post-description p { line-height: 1.3em } .post-image-wrap { width: 300px; height: 170px; background-color: #42aced; text-align: center; } .post-image { width: 300px; height: 170px; margin: 0 auto; overflow: hidden; } .post-image img { position: relative; top: 0; left: 0; } .post-header h3 { margin: 0 0 8px 0; text-transform: uppercase; color: #FFF; } .post-content a { text-transform: capitalize } .post-content a:hover { text-decoration: none } .post-content h3 a { text-decoration: none; text-transform: uppercase; font-style: normal; } .post-content h3 a:hover { text-decoration: underline } .post-footer { padding-top: 7px } .post-footer a { text-decoration: none } .post-footer .right { text-decoration: none; text-transform: lowercase; } .post-footer a:hover { text-decoration: none } .info { height: 10px; background: #000; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; padding: 5px 6px 13px 5px; } .categories { margin-right: 3px; width: 128px; overflow: hidden; } .categories small { line-height: 2 } .details { margin-right: 3px; padding-top: 6px; height: 9px; } .like { margin-right: 3px } .share { text-align: center; overflow: hidden; } .categories-drop { height: 13px; text-align: center; } .navi { width:100%; color: #aaa; font-size: 14px; } .navi h3 { margin: 0 0 10px } .copyright { color: #aaa; font-size: 10px; } .copyright p { margin: 0 } .whiteBlock { background: #fff; -moz-border-radius: 3px; -khtml-border-radius: 3px; color: #666; -webkit-border-radius: 3px; border: 1px solid #444; font-size: 125%; line-height: 1.6em; margin: 0 0 20px 0; } .whiteBlock > div { padding: 30px; _padding: 0; } #coreContent .whiteBlock h2, #coreContent .whiteBlock h3, #coreContent .whiteBlock h4 { color: #232323; text-shadow: none; } #coreContent .whiteBlock a { color: #000 } #postContent { width: 650px } #postContent p { } .main-image img { margin: 0 0 20px 0; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 1); } .main-image h2 { font-size: 12px } .whiteBlock h1 { border-bottom: 1px dotted #ccc; padding-bottom: 20px; text-shadow: none; } .whiteBlock h1, .whiteBlock h1 a { text-shadow: none; color: #232323; } .whiteBlock h1 a:hover { text-decoration: underline } .whiteBlock a img { background-color: #fff; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #444; } .dividerHor { border-bottom: 1px #444444; border-bottom-style: dotted; } .dividerVert { border-right: 1px #444444; border-right-style: dotted; } .singlepost { margin: 17px 0 } .singlepost img { -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 1); } .singlepost h2 { font-family: "Droid Sans", Verdana, sans-serif; margin-bottom: 30px; margin-top: 3px; font-size: 12px; } .singlepost a img:hover, .singlepost a img:active { -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0.8); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.8); } .archiveTitle h2 { font-size: 14px; color: #f0eeee; margin: 0; } .archiveTitle .currentCat { margin: 0 0 10px 0 } .archiveTitle .currentCat span { font-weight: bold } .archiveTitle .spaced { margin: 0 0 30px 0 } .archiveTitle h3 { font-size: 24px; color: #FFF; margin: 10px 0 20px 0; } .archiveTitle ul { list-style: none; padding: 0; margin: 0 0 30px 0; } .archiveTitle ul ul { margin: 0 } .archiveTitle ul li { padding: 0 0 0 20px } .archiveTitle ul ul li { padding: 0 } .archiveTitle p { margin: 0 0 30px 0 } .archiveTitle .back { margin: 0 } .alignleft { float: left; margin: 0 30px 30px 0; } .alignright { float: right; margin: 0 0 30px 30px; } .pagination { border-top: 1px dotted #444; border-bottom: 1px dotted #444; } .prevpost { float: left } .nextpost { float: right } .prevpost a, .nextpost a { background: #000; padding: 10px 15px; margin: 0; display: block; } .prevpost a:hover, .nextpost a:hover { background: #000; color: #f0eeee; font-size: 1.4em; text-shadow: none; font-weight: bold; } .more-link { text-align: right } /** Sidebar elements * ------------------------------------------------------------------- */ ul.sidebar_list { list-style: none; padding: 0; } ul.sidebar_list li.widget, ul.sidebar_list li.linkcat { margin: 0 0 2.5em 0; line-height: 1.4em; border: 0; } li.widget h3 { line-height: 1.2em; margin: 0; border: 0; padding: 0 0 10px 0; } li.widget p { margin: 0 0 1.5em 0; padding: 0; } li.widget ul { list-style: none; margin: 0; padding: 0; } li.widget ol { list-style: none; margin: 0; padding: 0; } /** Comments * ------------------------------------------------------------------- */ #comments { clear: both } #comments h4 { font-size: 24px; line-height: 1.2em; margin: 0; color: #f0eeee; } .commentForm input { margin-bottom: 10px; width: 400px; } .commentForm textarea { margin-bottom: 10px; width: 400px; } .comment-entry { padding: 15px 0; border-top: 1px dotted #444; border-bottom: 1px dotted #444; margin-bottom: -1px; } .avatar { float: left; background: #fff; padding: 10px; margin: 0 30px 15px 0; -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #444; } .commentContent { float: left; width: 500px; padding: 5px; color: #f0eeee; } .commentMeta { border-top: 1px dotted #444; font-size: 0.9em; font-style: normal; padding: 12px 0 0 140px; clear: both; } .commentMeta a { } .nocomments { font-size: 1.2em; padding: 25px 0; } .leaveComment { padding-bottom: 19px } /** Comment form * --------------- */ .commentForm { text-transform: uppercase; margin: 0; padding: 15px 0; } .commentForm em { text-transform: lowercase; color: #f0eeee; font-size: 0.9em; } .commentFormLeft { float: left; width: 450px; } .commentFormRight { width: 450px } #content .commentFormLeft, #content .commentFormRight { float: none; width: auto; } #content input[type=text], #content textarea { width: 500px; clear: both; } #content .commentMeta { padding: 12px 0 0 0 } #sidebar input[type=text], #sidebar textarea { width: 248px } #content .contactform input[type=text], #content .contactform textarea { width: 530px }