/*----------------------------------------------------------------------------- Clearscape Website version: 1.0 author: Clearscape email: info@clearscape.ie website: http://www.clearscape.ie/ date: May 2009 -----------------------------------------------------------------------------*/ /* =General -----------------------------------------------------------------------------*/ @import url("sIFR-screen.css"); /* Remove padding and margin */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; } /* remember to define focus styles! */ :focus { outline: 0; } ol, ul { list-style: none; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: separate; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } /* Class for clearing floats */ .clear { clear:both; height:0; } .right {float:right;} .left {float:left;} .alignright{text-align:right} /* Remove border around linked images */ img, a img { border: 0; } ul {list-style-type:none;} a:link, a:visited {text-decoration:none; color:#5c8d9b; font-weight:bold} a:hover, a:active {text-decoration:underline; color:#5c8d9b; font-weight:bold } a:link.contact, a:visited.contact {color:#747474; font-weight:normal; text-decoration:none; } a:hover.contact, a:active.contact {color:#CCC; font-weight:normal; text-decoration:none; } /* =Body -----------------------------------------------------------------------------*/ body { margin: 0 auto; position: relative; color: #645951;font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;font-size: 14px;line-height: 1.5; /* Baseline grid of 21px */} /* =Main Content -----------------------------------------------------------------------------*/ #wrapper { margin:20px auto 0 0; padding:47px 0 23px 20px ; background: url(../images/layout/wrap.gif) repeat-y -6px 0; width:98%; position:relative; top:20px; } #content {float:left; background:url(../images/layout/wrapbg.gif) repeat-y;} /* =Headings -----------------------------------------------------------------------------*/ h1 {display:block; width:131px; height:14px; background:url(../images/layout/titles.gif); font-size:1px; text-indent:-5000px;} h4{margin-top:130px} h5{margin-top:15px; font-weight:bold} h3.homepage {font-size:14px; color:#989898; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; margin-bottom:5px; margin-top:-10px; font-weight:bold;} /* =MainNav -----------------------------------------------------------------------------*/ ul#mainNav,ul#mainNav2 {margin-top:50px; font-size:0px;} ul#mainNav a{height:17px;display:block; background:url(../images/layout/titles.gif);width:131px; text-indent:-5000px;} ul#mainNav a.home {display:block; background-position: 0 -20px; } ul#mainNav a.work {display:block; background-position: 0 -38px; } ul#mainNav a.who {display:block; background-position: 0 -56px; } ul#mainNav a.contact {display:block; background-position: 0 -74px; } ul#mainNav2 a{height:17px;display:block;width:82px; text-indent:-5000px;} ul#mainNav2 a:hover, ul#mainNav2 #active{background-position:top right;} ul#mainNav2 .home2 {display:block; background:url(../images/layout/nav/home_both.gif) no-repeat top left; } ul#mainNav2 .work2 {display:block; background:url(../images/layout/nav/ourwork_both.gif) no-repeat top left; } ul#mainNav2 .who2 {display:block; background:url(../images/layout/nav/whoweare_both.gif) no-repeat top left; } ul#mainNav2 .contact2 {display:block; background:url(../images/layout/nav/contact_both.gif) no-repeat top left; } ul#mainNav2 .FAQ2 {display:block; background:url(../images/layout/nav/FAQ.gif) no-repeat top left; } /* =Body -----------------------------------------------------------------------------*/ #header, .subCol {float:left; width:170px; margin:0 18px;} #header {margin-left:0px;} #mainCol {float:left; width:340px; margin:0 20px 0 20px; } #mainCol, .subCol {font-size:0.8em;} #mainCol h2 {background:url(../images/layout/titles.gif) 0 -110px no-repeat; display:block; height:12px; text-indent:-5000px; font-size:0px; margin-bottom:12px;} h2.latest {background:url(../images/layout/titles.gif) 0 -122px no-repeat; display:block; height:12px; text-indent:-5000px; font-size:0px; margin-bottom:12px;} h2.blog {background:url(../images/layout/titles.gif) 0 -134px no-repeat; display:block; height:12px; text-indent:-5000px; font-size:0px; margin-bottom:12px;} .feature {border:1px solid #d4d4d4; margin-bottom:10px;} p {padding-bottom:10px; line-height:1.2em} #inside #content .subCol{width:340px; min-height:450px } #inside #content{float:left; background:url(../images/layout/wrapbg2.gif) repeat-y;} .ourwork li{margin-bottom:5px; display:block; padding-bottom:20px} .breadcrumb{height:18px; } ul#socialnetworking{display:block; height:20px; margin-bottom:10px} #socialnetworking li{float:left; margin-right:5px; /*margin-top:310px*/} a.rss{width:20px; height:20px; display:block; background:url(../images/layout/rss.gif) bottom left no-repeat ; text-indent:-9999px} a.twitter {width:20px; height:20px; display:block; background:url(../images/layout/twitter.gif) bottom left no-repeat ; text-indent:-9999px} a.facebook {width:20px; height:20px; display:block; background:url(../images/layout/facebook.gif) no-repeat bottom left; text-indent:-9999px} a:hover.twitter{background:url(../images/layout/twitter.gif) bottom right no-repeat} a:hover.facebook{background:url(../images/layout/facebook.gif) bottom right no-repeat} a:hover.rss{background:url(../images/layout/rss.gif) bottom right no-repeat} #wrapper #content #inside #mainCol h2.designBranding{border:1px solid #ffffff} #inside #mainCol h2.designBranding{width:203px; height:24px; display:block; background:url(../images/layout/design_branding.gif) no-repeat; text-indent:-9999px; } #inside h2.webdevelopment{width:203px; height:24px; display:block; background:url(../images/layout/webdevelopment.gif) no-repeat; text-indent:-9999px} #inside h2.technology{width:133px; height:27px; display:block; background:url(../images/layout/technology.gif) no-repeat; text-indent:-9999px} #inside #mainCol h2.meetus{width:338px; height:20px; display:block;background:url(../images/layout/meetus.gif); text-indent:-9999px; margin-top:30px;} #inside #mainCol h2.meetus a{ width:338px; height:20px; background:none; display:block} #inside h2.jargon{width:74px; height:24px; display:block; background:url(../images/layout/jargon.gif) no-repeat; text-indent:-9999px} #inside h2.faq{width:45px; height:24px; display:block; background:url(../images/layout/faq.gif) no-repeat; text-indent:-9999px} #inside h2.clientlist{width:265px; height:24px; display:block; background:url(../images/layout/clientlist.gif) no-repeat; text-indent:-9999px} #inside h2.awards{width:89px; height:24px; display:block; background:url(../images/layout/awards.gif) no-repeat; text-indent:-9999px; clear:both} .contactpage .dialogue_contact{margin: 10px 0 50px 0;} .contactpage #mainCol ul{margin-bottom:50px} .contactpage #mainCol ul li{margin-bottom:10px} .contactpage #mainCol ul li img{ vertical-align:middle; margin-right:15px} .contactpage h3, .work h3{font-weight:bold; } .montre li{display:none} .montre ul{margin-top:50px} #mainCol h2.tagline{background:url(../images/tag8.gif) no-repeat; width:352px; height:135px; display:block; text-indent:-9999px; /*margin-bottom:20px*/} .work #content #mainCol ul.cols{width:46%; float:left; margin-right:5px; margin-bottom:20px} /* =Footer -----------------------------------------------------------------------------*/ #footer {clear:both;} .email {background:url(../images/layout/titles.gif) 0 -91px; display:block; width:131px; height:18px; text-indent:-9999px; clear:both; } /* =Forms -----------------------------------------------------------------------------*/ /* Removes fieldset borders. even on Opea 7 */ fieldset { border: 1px solid transparent; } form {margin:0;padding:0;} select {height:20px; font-size:12px; color: #666666; } /* =Tables -----------------------------------------------------------------------------*/ td { text-align: left; font-weight: normal; } /* background stuff */ /* pushes the page to the full capacity of the viewing area */ html {height:100%;} body {height:100%; margin:0; padding:0;} /* prepares the background image to full capacity of the viewing area */ #bg {position:fixed; top:0; left:0; width:100%; height:100%;} /* places the content ontop of the background image */ #overlay {position:fixed; top:0; left:0; width:100%; height:100%; background:url(../images/layout/overlay.png);} /* places the content ontop of the background image */ #content {position:relative; z-index:1;} /* end background stuff */