/* RESET - Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */ *, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 } table { border-collapse:collapse; border-spacing:0 } fieldset, img { border:0 } address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal } ol, ul, li { list-style:none } caption, th { text-align:left } h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal } q:before, q:after { content:''} a, a:hover {text-decoration: none; } /* Global reset-RESET *//* The below restores some sensible defaults */ strong { font-weight:bold; } em { font-style:italic; } a img { border:none; } /* Gets rid of IE's blue borders */ /* GENERAL----------------------*/ body { background:#4c5e68 url("../images/bgbluestripes.jpg") repeat; font: normal .8em/1.5em "Lucida Grande","Lucida Sans Unicode", Tahoma, sans-serif; color:#736357; } p { margin-bottom: 10px; } .divider { border-top:1px dashed #ddd; margin:20px 0;clear:both; } .alignleft { float: left; margin: 0 20px 20px 0;} .alignright { float: right; margin: 0 0 20px 20px;} .strong {font-weight: bold; } #blockquote { background-color:#f4f2ea; padding:15px; font:1.5em/1.5 normal Georgia, serif; font-style: italic; color:#736357; } blockquote { clear:both; font-size:120%; line-height:1.3; font-family:Georgia, serif; font-style:italic; margin-bottom:10px; padding: 20px; border-top:1px solid #c68d47;} blockquote .footer {font-style: normal; font-size: 90%; font-weight:bold; padding-bottom:20px; float:right; text-align:right;} .totheportfolio a:link, .totheportfolio a:visited { border: 1px solid #b2bb7d; font-family: "georgia", serif; font-size: 1em; font-style: italic; text-transform: none; color: #b2bb7d; padding: 2px 4px; } .totheportfolio a:hover { border: 1px solid #b2bb7d; background: #b2bb7d; color: #fff; } .citylinefeature { font-family: "Georgia", serif; font-style: italic; font-size: 1em; text-transform: none; color: #fff; background-color: #7da7bb; padding: 2px 6px; float:right; } /* HEADINGS-----------------------------*/ h1, h2, h3, h4 { font-family: "Georgia", serif; font-weight: normal; margin-bottom: 10px; } h1 { font-size: 150%; text-transform:uppercase; margin-bottom: 10px; } h2 { font-size: 140%; line-height: 1.2em; text-transform:capitalize; } h2.sidebar-title { color:#4c5e68; } h2.readmore { color: #9ab275; text-transform:lowercase; } h3 { font-size: 130%; line-height:1.5em; text-transform: capitalize; } h3.bars { margin:0; text-transform: none; } h4 { font-size: 100%; } /* LINKED HEADINGS -----------------------------------------*/ a:hover h2.blue { text-decoration: underline; } a:hover h2.green { text-decoration: underline; } a:hover h2.purple { text-decoration: underline; } a:hover h2.pink { text-decoration: underline; } a:hover h3.blue { text-decoration: underline; } a.linkedh2:link, a.linkedh2:visited { font: 130% Georgia, serif; text-decoration: none; text-transform: lowercase; text-align:right; } a.linkedh2:hover { text-decoration: underline; } /* LISTS ---------------------------*/ ul { margin:0;padding:0; list-style: none;} ul li { list-style-type: circle inside; padding:0; } /* used on Homepage */ ul#featured li { list-style: inside; list-style-type: circle; line-height: 1.5em; } /* COLOURS ---------------------------*/ .darkblue { color:#4c5e68; } .blue { color:#7da7bb; } .orange { color:#c68d47; } .purple { color:#9879b0; } .pink { color:#c27474; } .green { color:#9ab275; } .brown { color:#563a0d; } /* LINKS---------------------------*/ a:link, a:visited { color:#c68d47; text-decoration:none; } a:hover, a:active { text-decoration: underline; border-bottom: none; } /* LINKs - faux button --------------------*/ a.button { background: #b49b71; font-size:90%; color:#fff ; padding:4px 6px; margin-right:3px;text-decoration: none; -moz-border-radius: 5px; border-radius:5px; line-height: 2.5em; } a:hover.button { background: #9e8862; color: #fff;} /* IMAGES---------------*/ img { border:0; margin:0; padding:0;} img.arrow { position:relative; top:3px; left:3px; } img.thumbleft { float:left;height:80px; border:1px #ccc solid; padding:8px; margin:0 10px 10px 0; } img.thumbleft2 { float:left;height:120px; width:175px; border:1px #ccc solid; padding:8px; margin:0 10px 10px 0; } img.thumbright { float:right; height:80px; border:1px #ccc solid; padding:8px; margin:0 0 10px 10px; } img.framed { background-color:#fff; padding:8px; margin: 0 15px 10px 0; border:1px solid #ddd; } img.framedleft { float:left; background-color:#fff; padding:8px; margin: 0 15px 10px 0; border:1px solid #ddd;} img.framedright { float:right;background-color:#fff; padding:8px; margin: 0 0 10px 15px; border:1px solid #ddd; float:right; } a img { border:0;} a:hover img, a:hover img.picthumb { background:#ddd;} /* MENU NAV---------------*/ #wrapper { background:#fff; text-align:left; height:100%; width:950px; margin:0 auto 20px } #page-wrap { width: 950px; height: 216px; background: #fff url("../images/bgheader950.png") no-repeat; } #header { background:#ffffff url("../images/nav/SDIplain.gif") no-repeat 5px ; float:left; width:281px; height:120px; padding: -5px 0 0 0px; margin:90px 0 0 20px; } .clear:after, li.comment:after, #sidebar ul li:after { clear:both; content:"."; display:block; height:0; visibility:hidden; } a:link .logoshim { width:280px; height:120px; background:transparent; border:none; margin:0; padding:0; } #navigation { font-size:120%; float:right; margin-top: 181px; } #nav,#nav ul { float:right; position:relative; margin:2px 15px 0 0; } #nav li { font-family:"Georgia", serif; text-transform:lowercase; font-size:.9em; font-weight: 700 ; float:left; } #nav a { color:#ccc; display:block; border-top:2px solid transparent; text-transform:lowercase; text-decoration:none; padding:3px 8px; } li.bu1 a, li.bu2 a, li.bu3 a, li.bu4 a, li.bu5 a, li.bu6 a { color:#ccc; margin-top:-2px; text-decoration:none; float:left; border-top:2px solid transparent; border-bottom:1px solid transparent; padding:3px 8px } #nav li.bu1 a:hover, #nav li.bu1 a.current {color:#7da7bb; border-top:2px solid #7da7bb; }/*blue*/ #nav li.bu2 a:hover, #nav li.bu2 a.current { color:#dca059; border-top:2px solid #dca059; }/*peach*/ #nav li.bu3 a:hover, #nav li.bu3 a.current { color:#e9b800; border-top:2px solid #e9b800; }/*gold*/ #nav li.bu4 a:hover, #nav li.bu4 a.current { color:#9879b0; border-top:2px solid #9879b0; }/*purple*/ #nav li.bu5 a:hover, #nav li.bu5 a.current { color:#c27474; border-top:2px solid #c27474; }/*pink*/ #nav li.bu6 a:hover, #nav li.bu6 a.current { color:#9ab275; border-top:2px solid #9ab275; }/*green*/ #nav ul { left:-999em; position:absolute; width:100px; z-index:99999;} /* adjusted values for IE6 */ * html*li.bu1 a, * html*li.bu2 a, * html*li.bu3 a, * html*li.bu4 a, * html*li.bu5 a, * html*li>bu6 a { bottom: -1px; } /* TIFF Feature on homepage */ .tiffheader {height: 35px; width:auto; border-bottom: 1px solid #fff; margin-bottom: 10px;} .tiffbox { width: auto; min-height: 190px; background:#f18300; padding: 10px; margin-bottom: 20px; } .tiffbox p {color:#fff;} .tiffbox a:link {color: #5c3b00;} .tiffbox a:hover {color: #fff;} .tiffbox a.button {background: #fff; color:#e97000;} .tiffbox a:hover.button { color:#714b0a;} /* LAYOUT -------------------*/ #wrapper { width: 950px; height: 100%; background: transparent; margin: 0 auto; } #content { background-color: #fff; width: 950px; overflow: auto; } #main {/*with sidebar*/ width: 615px; float: left; margin:30px 10px 0 25px; } #mainfull {/*without sidebar*/ width:910px; margin:30px 20px 0 25px; } #featured { clear:both; } #featured img { padding: 8px; margin: 0 0 20px 20px; border: 1px solid #ddd; max-width:250px; height:auto; float:right;} #highlight {background:#ffefba; -moz-border-radius: 5px; border-radius:5px; padding:10px; } /* SIDEBAR ------------------*/ #sidebar { width: 270px; margin: 30px 20px 20px 0; float: right;} #sidebar img { width: 150px; height: 150px; background-color:#fff; padding:8px; margin: 0 10px 10px 0; border:1px solid #ddd; } #sidebar ul { font:100% "Lucida Grande","Lucida Sans Unicode", Tahoma, Arial, sans-serif; text-transform: capitalize; padding:.1em; } #sidebar ul li { list-style:none; list-style-position: outside; margin: 0 0 5px 0; } .sidebar { background: #f1e8cf; border: 1px solid #ccc; padding: 15px; margin:0 0 10px 0; overflow: auto;} .sidebar h1, .sidebar h2 {font-family: "Lucida Grande","Lucida Sans Unicode", Tahoma, Arial, sans-serif;text-transform: capitalize; line-height:1.3em;} /* E-DESIGN ---*/ .badge {background: #9ab275; color:#fff; padding: 10px; margin: 0 0 10px 10px; width: 100px; float:right; -moz-border-radius: 5px; border-radius: 5px; font-family: Georgia; font-size: 120%;} ul.points li {list-style-type: lower-alpha; list-style: inside;} #register { display: table; } #register .required {color: red;} #register .label {height:20px; margin: 0 5px 0 0; padding: 5px; float: left; width: 150px; } #register .labelleft {float:left; width:190px;} #register .field {height: 15px; } #register input { height: 20px; width: 300px; padding: 3px; font-size: 110%; } #register input .submit {width: 50px; height: 20px;} #register textarea { width: 98%;border: 1px solid #ccc; font-size: 110%; padding: 5px;} #register .button {clear:both; min-height: 52px; max-width: 150px; color:#fff; background:#9aaa62; -moz-border-radius: 5px; border-radius:5px; border: 1px solid #ccc;} #register .button:hover {background: #f18300;} #send {clear:both; margin: 20px 0;} #paypal {clear:both; float:right; margin: 0 0 0 10px;} #paypal input { border: 0;} #edesign { width: 615px; height: 150px; background: red;} /* E-Design Submission ---*/ .wpcf7 { width: 600px;} .wpcf7 .labelleft {clear:both; float:left; width:200px; margin-top:15px; text-align: right;} .wpcf7 .fieldright {float:right; width:375px; margin: 5px; padding:5px 0;} .wpcf7 input {padding: 3px; width:370px;} .wpcf7 .uploadblock {clear:both; margin: 10px 0; } .wpcf7 .uploadblock .fieldright2 {float:right; margin: 5px; padding:5px 0; background: #ddd;} .wpcf7 textarea {width: 370px; height: 100px; padding: 3px; font-size: 110%;} .wpcf7 .wpcf7-file { border-color: transparent; margin-bottom: 0;} .wpcf7 .wpcf7-submit {clear:both; min-height: 52px; max-width: 100px; color:#fff; background:#9aaa62; -moz-border-radius: 5px; border-radius:5px; border: 1px solid #ccc;} .wpcf7 .wpcf7-submit:hover {background: #f18300;} /* BOTTOMBAR - Articles (on homepage) ---------------- */ .articles-home { background:#d9e1b1; clear:both; margin: 0 10px; padding: 10px 15px; } .articles-home ul {} .articles-home li {list-style: none; display: inline-table; font-size: 88%; margin: 2px 0; } .articles-home a:link, .articles-home a:visited { background:#b0c06f; color:#fff; padding: 3px 4px; text-decoration: none;-moz-border-radius: 5px; border-radius:5px; } .articles-home a:hover {background:#fff; color:#8b9856;} /* CALENDAR NEWSBLOCK ------------------*/ .events {} .news {margin-bottom: 5px; } .newsblock {clear:both; padding-top: 10px; margin-bottom: 10px; clear: both; border-top:2px solid #fff;} h2.eventtitle { margin-bottom:5px; line-height: 1.3em; font-size: 120%; font-weight: bold;} .calendar { float:right; width:35px; padding:5px; margin:0 0 5px 10px; background:#714b0a; color: #fff; text-transform: uppercase; text-align:center; -moz-border-radius: 5px; border-radius: 5px; } /* TWITTER------------------------------*/ .twitter {background-color: #CFE3ED;text-transform: none;} .twitter li {text-transform: none; padding: 4px; background: rgba(300, 300, 300, 0.5);; margin-bottom: 5px; -moz-border-radius: 5px; border-radius:5px;} .twitter a {color:#2084B1;} .sidebarfooter { padding-top:10px; width:100%; text-align: right; } /* NEWS - Recent Articles ---------------*/ .newsleft { float: left; width: 46%; padding-right: 20px; margin-bottom: 20px; border-right: 1px dashed #ddd;} .newsright { float: right; width:400px; padding-right: 35px; margin-bottom: 20px; } .nblock {border-bottom:1px dotted #ccc; padding-bottom: 10px; margin-bottom: 10px; width:auto; min-height: 260px; } .nblock img.newsthumb { float:left; max-height:150px; max-width:160px; padding:10px; margin:0 10px 10px 0; background:#fff; border:1px solid #ccc; text-decoration:none;} a:hover img.newsthumb { background:#ddd; } .articles { line-height: normal; } .articles p { padding: 0 0 5px 60px; line-height: normal; margin: 0; text-transform: capitalize; } .articles li { line-height:1.5em; list-style: inside;list-style-type: circle; margin-left: 20px;} /* NEWS - ITLounge ------------------------*/ .ITthumb {width: auto; max-height: 100px; padding: 10px; border: 1px solid #ccc;} /* PORTFOLIO - Photos ---------------------*/ #caption { overflow: auto; float: left; margin: 0 20px 6px 0; text-transform: uppercase; font-size: 75%; text-align: center; background: #736357; color: #fff; } .block { clear:both; border-bottom:1px dotted #ccc; padding-bottom: 10px; margin-bottom: 10px; min-height: 260px; } .block img.picthumb { float:left; max-height:160px; max-width:200px; padding:10px; background:#fff; border:1px solid #ccc; text-decoration:none; } /* PORTFOLIO - Videos ---------------------*/ #Col1 { float:left; width:150px; height:160px; margin:0 30px 5px 0; padding:0; font-size:80%; text-align:center; line-height: 1.2; } .clearfix:after { /* slightly enhanced, universal clearfix hack */ visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .clearfix { display: inline-block; } /* start commented backslash hack \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /* close commented backslash hack */ img.vidthumb { width:120px; height:auto; padding:10px; margin: 0 0 5px 0 ; background:#fff; border:1px solid #ccc; text-decoration:none;} a:hover img.vidthumb { background:#ddd; } .videoblock { height:120px; padding:10px 0; border-bottom:1px dashed #ddd; clear: none; } .videoblock img.picthumb { float:right; max-height: 160px; max-width: 150px; padding:10px; margin:0 10px 5px 0; background:#fff; border:1px solid #ccc; text-decoration:none; } /* Q&A VIDEOS LIST- Home Experts----------------*/ .morevideos { width: 165px; overflow: visible; padding:0 5px 0 10px; height: 495px; } .morevideos ul li { margin-bottom: 10px; } .morevideos ul li a:hover {color:#5f5043;} /* FAQ page - Accordions -----------------------*/ #basic-accordian{ width:620px; position:relative; float:left; } .accordion_headings{padding:5px; cursor:pointer; margin-bottom: 5px; border: 1px solid #ffefba;} .accordion_headings:hover{background: #ffefba; color:#714b0a;} .accordion_child{padding:15px; } .header_highlight{background: #ffefba; color:#714b0a;} /* COMPANY PAGE -------------------*/ ul#bullets li { list-style: circle inside; margin-left:10px; } #sidebar h2, #sidebar h3 { font-family: "Lucida Grande","Lucida Sans Unicode", Tahoma, sans-serif; } #topbar { font-size:100%; line-height:1.4em; margin-bottom:20px } #topbar a { color:#c27474; margin-right:1px; border:1px solid #c27474; padding:5px; text-transform: capitalize;} #topbar a:hover { text-decoration: none; background:#c27474; color:#fff;} /* CONTACT FORM -------------------*/ #contactform { width: 500px; background: yellow; display: table; font-size: 110%;} .contactlabel { width: 35%; float:left; padding-top:5px;} .contactfield { width: 65%; float:right; } .required_star {color: red;} input { height: 30px; border: 1px solid #ccc; font-size: 120%; } /* BLOG */ img.blogpic {max-width:600px; max-height: 300px;} /* SUMMER HOME page only -------------------*/ #sidebar-sh {float:right; width: 245px; margin:0 0 20px 20px; padding:5px; border:1px solid #ccc;} #sidebar-sh h2.title { font-size: 140%; color: #666; text-align: center;} #sidebar-sh h3 { margin-top: 10px; line-height: 1.3em; } #sidebar-sh .date { text-transform: uppercase; font-size: 90%; margin-left: 10px; } #sidebar-sh .title {text-transform: capitalize; padding-bottom:10px; font-size:110%; border-bottom: 1px dashed #ccc; margin-bottom: 10px; } #sidebar-sh p {margin:0; } .articles-SH, .articles-SH ul {list-style: none; width:630px; float: left; } .articles-SH li {display: inline-table; visibility:visible; margin: 5px 0; } .articles-SH a:link, .articles-SH a:visited, .articles-SH a:active {background: #de9e2e; color:#fff ; padding:5px 7px; margin-right:3px; text-decoration: none; -moz-border-radius: 5px; border-radius:5px; } .articles-SH a:hover {background: #8faab4;} .synopsis {min-height:170px;} /* SECOND BASE page only -------------------*/ #sidebar-sb {float:right; width: 300px; margin:0 0 20px 30px; } #sidebar-sb img.logo {max-height:70px; max-width:130px;} #sidebar-sb .meta { text-align: left; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px dashed #ccc; } #sidebar-sb p {margin:0 0 10px 0; text-align: justify;} #sidebar-sb .picthumbSB {max-width: 125px; margin:0 0 5px 5px; } #suppliers { } #suppliers img {border: 0; max-height: 80px; max-width:160px; margin-bottom: 5px;} #suppliers a:link img, #suppliers a:hover img {border:0; background: none;} #suppliers a:hover img {border: 0} #block { font-size:85%; line-height:1.3em; float:left; min-height: 125px; width:160px; margin: 0 10px 10px 0; padding: 5px; border-bottom: 1px solid #ccc;} /* FOOTER ----------------------------*/ #footer { clear: both; width: 950px; height: 140px; overflow: hidden; font-size: 85%; color: #fff; line-height: 1.5em; background: transparent url(../images/bgfooter950.png) no-repeat; } #footer p { margin:30px 0 0 60px; } #footer a:link, #footer a:visited { color:#A0C3DF; text-decoration: none; } #footer a:hover { color: #fff; text-decoration: underline; } #footer a.current { text-transform: uppercase; color: #fff; text-decoration: none; }