/*----------------------------------------------------------------------------------------------------------------------------------------------------------- CSS for Protocol - Main Stylesheet Author: Alison Lee (alisonlee@silktide.com) / Silktide Ltd Created: 27/06/2008 -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Global Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* commented backslash hack \*/ html, body { height: 100%; } /* end hack */ body { background-color: #fff; font: 80% verdana, arial, helvetica, sans-serif; text-align: center; padding: 0; margin: 0; } h1 { font: normal 3.0em verdana, arial, helvetica, sans-serif; color: #1C436E; margin: 0 0 15px; } h2 { font: normal 1.8em verdana, arial, helvetica, sans-serif; color: #1C436E; margin: 10px 0; } h3 { font: normal 1.5em verdana, arial, helvetica, sans-serif; color: #1C436E; margin: 10px 0; } p, li { font-size: 1.0em; line-height: 1.9em; } .smalltext { font-size: 0.85em; } #content ul li { list-style-type: square; } a, a:visited { color: #02A0C7; text-decoration: none; } a:hover, a:active { color: #1C436E; } .link1378 a:link, .link1378 a:visited { color: #02A0C7; } .link1379 a:link, .link1379 a:visited { color: #6FD0E1; } .link1380 a:link, .link1380 a:visited { color: #6657AC; } .link1381 a:link, .link1381 a:visited { color: #4470C9; } .link1382 a:link, .link1382 a:visited { color: #9986EB; } .link1383 a:link, .link1383 a:visited { color: #78B0FA; } .link1378 a:hover, .link1378 a:active, .link1379 a:hover, .link1379 a:active, .link1380 a:hover, .link1380 a:active, .link1381 a:hover, .link1381 a:active, .link1383 a:hover, .link1383 a:active { color: #1C436E; } hr { height: 1px; background-color: #e8e8e8; color: #e8e8e8; border: 0; margin: 15px 0; } img { border: 0; } form, table { background: transparent; font-size: 1.0em; } .tablestyle { border-collapse: collapse; } .tablestyle td, .tablestyle th { vertical-align: top; padding: 5px 5px 5px 0; } .tableborder td, .tableborder th { vertical-align: top; padding: 5px; border: 1px solid #e8e8e8; } .clear { height: 0; clear: both; font-size: 0.1em; line-height: 0.1em; padding: 0; margin: 0; } .right { float: right; } .left { float: left; } .widthwrapper { width: 100%; } .padding { padding: 20px; } #accessibility { display: none; } /* Layout Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #container { width: 990px; min-height: 100%; height: auto; position: relative; text-align: left; margin: 0 auto -120px; } /* margin-bottom to match #clearfooter */ * html #container { height: 100%; } #header { height: 180px; position: relative; text-align: left; } #header #logo { position: absolute; left: 20px; top: 40px; } #contentwrapper { min-height: 500px; } #content { width: 300px; margin-left: 20px; } #mainimage { width: 400px; float: right; text-align: center; padding-top: 30px; } #home #mainimage { width: auto; float: right; padding-top: 150px; } #mainimage img { margin: 0 auto; } #clearfooter { clear: both; height: 120px;} /* height to match height + padding + margin etc in #footer */ #footer { width: 100%; height: 100px; clear: both; background-color: #1C436E; text-align: center; margin-top: 20px; } #footer div { width: 960px; text-align: left; margin: auto; } /* Navigation Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #mainnav { float: right; margin-right: 20px; } #mainnav p { width: 90px; height: 50px; position: relative; float: left; line-height: 1.5em; border-right: 3px solid #fff; margin: 0; } #mainnav a, #mainnav a:visited { width: 60px; height: 40px; display: block; background-color: #1C436E; font-size: 1.2em; color: #fff; padding: 5px 25px 5px 5px; border-top: 100px solid #1C436E; margin-top: -40px; } #mainnav a:hover, #mainnav a:active, #mainnav .selected a { color: #fff; margin-top: 0; } #subnav { width: 220px; float: right; margin-top: 10px; } #subnav ul { padding: 0; margin: 0; } #subnav ul li { list-style-type: none; font-size: 0.85em; color: #fff; margin: 0 0 1px 0; } #subnav ul li a, #subnav ul li a:visited { display: block; background-color: #1C436E; color: #fff; padding: 2px 5px; margin-left: 20px; } #subnav ul li a:hover, #subnav ul li a:active { margin-left: 0; } #subnav ul { margin-top: 1px; } #subnav ul ul li a, #subnav ul ul li a:visited { margin-left: 30px; } #subnav ul ul li a:hover, #subnav ul ul li a:active { margin-left: 10px; } #subnav ul li.selected a, #subnav ul li.selected a:visited { margin-left: 0; } #subnav ul li.selected ul li a, #subnav ul li.selected ul li a:visited { margin-left: 10px; } #subnav ul li.selected ul li a:hover, #subnav ul li.selected ul li a:active { margin-left: 0; } #subnav ul li.selected ul li.selected a, #subnav ul li.selected ul li.selected a:visited { margin-left: 0; } /* Home */ .nav556 a, .nav556 a:visited { background-color: #1C436E!important; border-color: #1C436E!important; } /* What we do */ .nav1378 a, .nav1378 a:visited { background-color: #02A0C7!important; border-color: #02A0C7!important; } /* How we do it */ .nav1379 a, .nav1379 a:visited { background-color: #6FD0E1!important; border-color: #6FD0E1!important; } #subnav.nav1379 a, #subnav.nav1379 a:visited { color: #1C436E!important; } /* Our work */ .nav1380 a, .nav1380 a:visited { background-color: #6657AC!important; border-color: #6657AC!important; } /* Our Culture */ .nav1381 a, .nav1381 a:visited { background-color: #4470C9!important; border-color: #4470C9!important; } /* Client Zone */ .nav1382 a, .nav1382 a:visited { background-color: #9986EB!important; border-color: #9986EB!important; } /* Contact us */ .nav1383 a, .nav1383 a:visited { background-color: #78B0FA!important; border-color: #78B0FA!important; } #subnav.nav1383 a, #subnav.nav1383 a:visited { color: #1C436E!important; } /* Footer Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #footer img { float: left; margin-top: 10px; } #footer p { font-size: 0.85em; line-height: 1.5em; color: #fff; text-align: right; margin: 10px 0; } #footer p.smalltext { font-size: 0.7em; } #footer p strong { color: #6FD0E1; } #footer p a, #footer p a:visited { color: #fff; } #footer p a:hover, #footer p a:active { color: #6FD0E1; }