/* Theme Name: VG Universe Design Theme URI: http://vguniverse.com Description: Custom Theme for VG Universe Design Version: 3.0 Author: VG Universe Design (Vivien / @inspirationbit) Author URI: http://www.vguniverse.com/ */ /* GRID --------*--------*--------*--------*--------*--------*--------*--------*--------* 12 cols; 980 px; 1 col = 60px; gap = 20px; 2 cols = 140px; 3 cols = 220px; 4 cols = 300px; 5 cols = 380px; 6 cols = 460px; 7 cols = 540px; 8 cols = 620px; 9 cols = 700px; 10 cols = 780px; 11 cols = 860px; --------*--------*--------*--------*--------*--------*--------*--------*--------*/ /* COLOURS --------*--------*--------*--------*--------*--------*--------*--------*--------* orange - #ffa666 --------*--------*--------*--------*--------*--------*--------*--------*--------*/ /* TYPOGRAPHY --------*--------*--------*--------*--------*--------*--------*--------*--------* font-family: "museo-sans-1","museo-sans-2", "Lucida Sans", "Lucida Grande", sans-serif; font-family: "museo-slab-1","museo-slab-2","American Typewriter",Georgia,serif; font-family: "Adobe Garamond Pro", "Adobe Caslon Pro", Baskerville, Palatino, "Palatino Linotype", serif; --------*--------*--------*--------*--------*--------*--------*--------*--------*/ /* RESET --------*--------*--------*--------*--------*--------*--------*--------*--------*/ html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, small, strike, strong, sub, sup, a, abbr, code, em, img, li, ol, ul, form, label, fieldset, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; vertical-align: baseline; } html{font-size:100%;} ol, ul {list-style: none;} * {margin:0pt; padding:0pt;} a img, :link img, :visited img {border: 0;} .clear {clear: both;} .clearfix {display: inline-block;} a {text-decoration: none;} /* Holly Hack Targets IE Win only \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End Holly Hack */ /* Grid based on http://hashgrid.com/ --------*--------*--------*--------*--------*--------*--------*--------*--------*/ #grid{ /* Vertical grid lines */ background: url(images/vg-grid-980.png) repeat-y 0 0; /* Dimensions - same width as your grid with gutters */ width: 980px; /* Grid (centered) */ position: absolute; top: 0; left: 50%; margin-left: -490px; } #grid div.horiz{ /* 24px line height */ height: 23px; border-bottom: 1px dotted #ccc; margin: 0; padding: 0; } /* FOUNDATION --------*--------*--------*--------*--------*--------*--------*--------*--------*/ body {background: #333 url(images/pagebg.jpg); font-size: 1em; font-family: "museo-sans-1","museo-sans-2", "Lucida Sans", "Lucida Grande", sans-serif; line-height: 24px; color: #fff;} html>body{ font-size: 16px; } header, hgroup, nav, section, article, aside, footer {display: block;} h1, h2, h3, h4, h5, h6 { font-family: "museo-slab-1","museo-slab-2","American Typewriter",Georgia,serif; font-weight: 400; } h1, h2, h3 {margin-bottom: 24px;} h1 {font-size: 30px; line-height: 48px;} h2 {font-size: 24px; line-height: 24px;} h3 {font-size: 18px; line-height: 24px;} p {margin-bottom: 24px;} /* MAIN STRUCTURE --------*--------*--------*--------*--------*--------*--------*--------*--------*/ #access {position: absolute; left: -9999em; top:0;} #wrap { margin:24px auto; width:980px;} #wrap-container {background: #fff; padding: 24px 20px;} #pagewrap {background: #555; } header {overflow: hidden;} hgroup {float: left;} header h1#logo {line-height: 24px; margin: 24px 0 0 20px; } header h1#logo a {color: #ffa666;} header h2#desc {font-size: 12px; margin-left: 20px; color: #ccc; } nav ol {float: right; overflow: hidden;} nav ol li {float: left; padding: 12px; font-size: 14px; line-height: 12px; text-transform: uppercase;} nav ol li a {color: #fff;} nav ol li a:hover {border-bottom: 1px dotted #fff;} nav ol li.current_page_item a {color: #ffa666;} .emph {font-family: "Adobe Garamond Pro", "Adobe Caslon Pro", Baskerville, Palatino, "Palatino Linotype", serif; font-size: 1.125em; font-style: italic;} #content {padding: 0 20px 24px; overflow: hidden;} form#quoteform input#tricky {display: none;} /* HOMEPAGE CONTENT --------*--------*--------*--------*--------*--------*--------*--------*--------*/ section#quote_request {float: right; width: 300px;} section#quote_request h3 {color: #ffa666; word-spacing: 0.08em; margin-bottom: 0;} section#quote_request h4 {font-family: "Adobe Garamond Pro", "Adobe Caslon Pro", Baskerville, Palatino, "Palatino Linotype", serif;} section#quote_request form#quoteform {margin: 24px 0 0 0;} section#quote_request p {margin: 0; background: transparent url(images/dotted_ongray.gif) repeat-x bottom right; } section#quote_request form#quoteform label {font-size: 14px; line-height: 14px; } form#quoteform input, form#quoteform textarea {border: none; font-size: 12px; font-family: "museo-slab-1","museo-slab-2","American Typewriter",Georgia,serif; background: #555; word-spacing: 0.08em; padding: 0 5px; color: #fff;} form#quoteform select {font-size: 12px; background: #555; word-spacing: 0.08em; color: #fff; border: none;} form#quoteform input:hover, form#quoteform select:hover {background: #666;} form#quoteform input {width: 220px;} form#quoteform input:focus, form#quoteform textarea:focus{ outline: none; } form#quoteform textarea {display: block; background: #666; width: 300px; line-height: 18px; } form#quoteform input#submitform {width: 150px; background: #ffa666; padding: 2px; margin: 12px 0; font-size: 1em; color: #000; height: 24px; overflow: hidden;} section#quote_request a {color: #fff; border-bottom: 1px solid #ccc; } /*MUST FIX ISSUES WITH IE6 div:hover doesn't work in IE6, fix the padding and 980px width - not extending full length in ie6*/ #featuredProjects {margin-left: -20px; padding-bottom: 24px;} section#featured_projects {} section#featured_projects h3 {margin:0 0 0 320px; font-size: 14px;} section#featured_projects ul {background: #f58b41; width: 980px; overflow: hidden;} section#featured_projects ul li {display:inline; float: left; width: 160px; height: 144px; background: #ff6b00;} section#featured_projects ul li .projectPreview {height: 144px;} section#featured_projects ul li .projectPreview img {height:auto;} section#featured_projects ul li.p1 {margin-left: 20px;} section#featured_projects ul li .projectInfo {position: absolute; width: 140px; height: 134px; background: #ff6b00; color: #fff; padding: 5px 10px; visibility: hidden;} section#featured_projects ul li.projectBit:hover {cursor: pointer;} section#featured_projects ul li.projectBit:hover .projectInfo {visibility: visible; background: rgba(255, 107, 0, 0.9) none;} section#featured_projects ul li .projectInfo p {font-size: 10px; line-height: 14px; word-spacing: 0.08em;} section#featured_projects ul li .projectInfo a {color: #fff; font-size: 12px; line-height: 11px;} section#featured_projects ul li .projectInfo a:hover {border-bottom: 1px solid #fff;} section#featured_projects ul li .quickinfo {height: 144px; text-indent: -9999px; padding: 5px 10px;} /* section#featured_projects ul li div.quickinfo:hover {text-indent: 0; color: #555; background: rgba(255, 107, 0, 0.7) none; cursor:pointer;}*/ section#featured_projects ul li .quickinfo h4 {margin-bottom: 23px; } section#featured_projects ul li .quickinfo h4 a {color: #fff;} section#featured_projects .ptypes {font-size: 10px; line-height: 14px; word-spacing: 0.08em;} /* section#featured_projects ul li .quickinfo h4 a:hover {border-bottom: 1px solid #fff;} section#featured_projects .quickinfo:hover .ptypes {border-top: 1px dotted #555; } */ section#featured_projects .ptypes a {color: #000;} section#featured_projects .ptypes a:hover {border-bottom: 1px solid #555;} section#featured_projects ul li.project1 { /*margin-left: 20px; background: transparent url(images/projects/stylestatement160x144.jpg) no-repeat center; */ } /* section#featured_projects ul li.project2 {background: transparent url(images/projects/nydidi160x144.jpg) no-repeat center;} section#featured_projects ul li.project3 {background: transparent url(images/projects/thunderbirdglass160x144.jpg) no-repeat center;} section#featured_projects ul li.project4 {background: transparent url(images/projects/cupidcab160x144.jpg) no-repeat center;} section#featured_projects ul li.project5 {background: transparent url(images/projects/wpajax160x144.jpg) no-repeat center;} section#featured_projects ul li.project6 {background: #f58b41;} section#featured_projects ul li.project6 .quickinfo {text-align: center;} */ /* About Page CONTENT --------*--------*--------*--------*--------*--------*--------*--------*--------*/