/* Core CSS StyleSheet */ /* PSS Blue: #009cd9 */ /* Let's load the other StyleSheets first ... */ @import url(/css/globals.css); @import url(/css/cms.css); @import url(/css/pages.css); @import url(/css/tables.css); /* *[accesskey]:after {content:' [' attr(accesskey) ']'} */ #DEVBOXWARNING { display: none; } #canvas { padding: 0px; margin: 0px; background: #00587e url(/gfx/back/canvas.png) repeat-x top center; font: normal 10pt verdana,arial; } #container { display: block; float: left; position: relative; width: 1000px; top: 0; left: 50%; margin-left: -500px; background: transparent url(/gfx/back/container.png) no-repeat bottom left; } #skip { display: none; } #header { position: relative; margin: 0px auto 0px auto; border-bottom: 0px solid red; width: 1000px; height: 215px; background: transparent url(/gfx/back/header.png) repeat-x center top; } #header div#logo { z-index: 1000; position: absolute; top: 60px; left: 20px; width: 167px; height: 121px; background: transparent none repeat-x center center; } #header div#logo img.logo { float: right; width: 167px; height: 121px; background: transparent url(/gfx/logos/power-system-services.png) no-repeat center center; } #header div#logo img.logo:hover { background-image: url(/gfx/logos/hover/power-system-services.png); } #logo a { border: 0px; } #header div#slogan { display: block; z-index: 1000; position: absolute; top: 100px; right: 20px; width: 188px; height: 30px; background: transparent url(/gfx/engineering-solutions.jpg) no-repeat center center; } #header div#exhibition { display: block; z-index: 1000; position: absolute; top: 75px; right: 250px; width: 420px; height: 80px; background: transparent none no-repeat center center; } /* Images ... */ .w230 { width: 230px; } .w250 { width: 250px; } .w300 { width: 300px; } .w350 { width: 350px; } .w400 { width: 400px; } .w450 { width: 450px; } .w500 { width: 500px; } .pad-right-10 { padding-right: 10px; } .pad-right-15 { padding-right: 15px; } .images { clear: right; margin: 0px 0px 20px 20px; } .image { width: inherit; clear: both; text-align: center; margin: 0px 0px 5px 0px; } .image .file { clear: both; margin: 0px auto 0px auto; padding: 24px; border: 1px solid #c0c0c0; background: #FFFFFF none no-repeat center center; } .slim { padding: 12px !important; } .image .file:hover { border-color: #808080; } .image .caption { position: relative; top: 0px; left: 0px; width: inherit; padding: 0px; margin: 3px auto 0px auto; color: #00587e; background: transparent url(/gfx/back/caption.png) repeat-x top center; } .image .caption h2 { padding: 10px; color: #00587e; font: normal 8pt verdana; } /* iFrames... */ #iFrame.slides { width: 100%; height: 220px; background-color: #fafafa; border: 0px; border-top: 0px solid red; padding: 0px; margin: 0px auto 10px auto; } #iFrame.product-partners { position: absolute; top: 45px; right: 45px; width: 190px; height: 60px; background-color: #fafafa; border: 0px; padding: 0px; margin: 0px auto 10px auto; } .iFrame { border: 0px; width: 430px; height: 430px; } .iFrame#Maidstone { } .iFrame#Telford { } /* Search box (top-right)... */ #search { display: none; position: absolute; top: 55px; right: 20px; background-color: #FFFFFF; } #search .inner { padding: 10px; } #search #keywords { width: 200px; margin: 0px 0px 5px 0px; border: 1px solid #009cd9; padding: 2px; color: #009cd9; background: #fafafa none repeat-x; } #search:hover #keywords { border-color: #202020; color: #404040; background-color: #FFFFFF; background-image: none; } #search #go { cursor: pointer; margin: 0px 0px 0px 5px; width: 80px; border: 1px solid #009cd9; padding: 2px; color: #FFFFFF; background-color: #000000; background-image: url(/gfx/back/go.gif); background-repeat: repeat-x; } #search #go:hover { cursor: pointer; background-image: url(/gfx/back/go.gif); background-repeat: repeat-x; background-position: center bottom; } #search #advanced { display: block; color: #808080; font: normal 8pt "MS Sans Serif",verdana; } #search #advanced a { color: #808080; border-color: #c0c0c0;} #search #advanced a:hover { color: #404040; border-color: #808080 !important; } /* Shortcuts menu (top-right) ... */ .menu#shortcuts { position: relative; width: 1000px; height: 30px; padding: 0px; margin: 0px auto 0px auto; background: transparent none no-repeat; } .menu#shortcuts .inner { position: absolute; top: 5px; right: 15px; color: #808080; font-size: 8pt; } .menu#shortcuts .inner span.shortcut { padding-left: 20px; } .menu#shortcuts .inner a { color: #009cd9; border: 0px; border-color: #404040; font-size: 10pt; } .menu#shortcuts .inner a:hover { color: #F0F8FF !important; text-decoration: none; border-bottom: 1px solid #009cd9; } .menu#shortcuts .inner a:visited { color: #009cd9; } /* Main (drop) menus... */ .menu#main { z-index: 500; position: absolute; top: 155px; left: 20px; width: 960px; height: 60px; background: transparent url(/gfx/back/tabs.png) center 20px no-repeat; } .menu#main a { border: none; position: relative; top: 25px; color: #606060; } .menu#main div.tab { float: right; overflow: hidden; text-align: center; width: 150px; height: 50px; margin: 0px 2px 0px 0px; background: transparent url(/gfx/tabs/tab.png) center bottom no-repeat; } .menu#main div.tab:hover { background-image: url(/gfx/tabs/hover/tab.png); font-weight: bold; } .menu#main div.tab a { color: #009cd9 !important; text-decoration: none; border-bottom: 1px solid #009cd9; } .menu#main div.tab:hover a { color: #808080 !important; border: none; } /* Duplicate for use on JS changes to Tab state(s) ... */ .tabHover { float: right; overflow: hidden; text-align: center; width: 150px; height: 50px; margin: 0px 2px 0px 0px; background: transparent url(/gfx/tabs/hover/tab.png) center bottom no-repeat; font-weight: bold; } /* Individual Tabs ... */ #t-Home { width: 35px !important; background-image: url(/gfx/tabs/home.png) !important; } #t-Home img { width: 35px; height: 35px; } .menu#main div.tab#t-Home:hover { background-image: url(/gfx/tabs/hover/home.png) !important; } #t-01 { } #t-02 { } #t-03:hover { background-image: url(/gfx/tabs/hover/tab-mirror.png) !important; } #t-04 { } #t-05 { } .menu#main ul { list-style-type: none; padding: 5px 0px 0px 0px; margin: 0px; } .menu#main ul li { padding: 0px 0px 10px 0px !important; margin: 0px !important; } .menu#main ul li a { color: #808080; border: 0px; text-decoration: underline; } .menu#main ul li a.bold { color: #009cd9; } .menu#main ul li a:hover { color: #009cd9 !important; border-bottom: 1px solid #009cd9 !important; text-decoration: none; } .menu#main ul:hover a { color: #808080 !important; text-decoration: none !important; border: 0px !important; } /* "Child" menus... */ .menu#main div.child { z-index: 2000; position: relative; top: 50px; width: 310px; background-color: transparent; background-image: url(/gfx/back/drop-services.png); background-position: center bottom; background-repeat: no-repeat; } .menu#main div.child h2 { } .menu#main div.child h2 b { font-size: 10pt; color: #009cd9; } .menu#main div.child p { font-size: 10pt; } .menu#main div.child a { font: normal 10pt verdana; color: #009cd9; border-bottom: 1px solid #c0c0c0; text-decoration: none; } .menu#main div.child a.bold { border-color: #009cd9; } .menu#main div.child div.inner { position: absolute; top: 0px; margin: 0px; padding: 0px 15px 10px 15px; font-size: 8pt; } .menu#main div.child div.closer { position: absolute; bottom: 20px; right: 15px; color: #c0c0c0; font-size: 8pt; cursor: pointer; text-decoration: underline; } .menu#main div.child div.closer:hover { text-decoration: none; color: #009cd9; } /* The kids..! */ .menu#main div#about-us { left: 311px; height: 240px; } .menu#main div#our-services { left: 463px; height: 190px; } .menu#main div#case-studies { left: 615px; height: 260px; } .menu#main div#contact-us { left: 615px; height: 160px; } /* Breadcrumb navigation menus ... */ #breadcrumb { color: #c0c0c0; font-size: 8pt; margin-bottom: 0px; } #breadcrumb:hover { color: #404040; } #breadcrumb a { color: #808080; border-color: #c0c0c0; } #breadcrumb a:hover { color: #202020; text-decoration: none; border-bottom: 1px solid #202020; } #breadcrumb span.current { color: #FFFFFF; font: normal 10pt verdana; background-color: #009cd9; padding: 0px 5px 0px 5px; } /* Page content (white block, central etc.) */ #content { float: left; position: relative; margin: 0px auto 0px auto; padding: 0px; width: 1000px; min-height: 400px; background: #FFFFFF url(/gfx/back/content.png) no-repeat bottom center; -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; } #content div.inner { padding: 0px 20px 15px 20px; } #content div.inner p { color: #404040; line-height: 16pt; font-size: 8pt; text-align: justify; } #content div.inner p a { padding-left: 2px; padding-right: 2px; font-size: 10pt; } #content div.inner p a:hover { font-size: 10pt; color: #FFFFFF; background-color: #009cd9; border: 0px; text-decoration: none; } /* Page Footer... */ #footer { float: left; position: relative; margin: 5px auto 5px auto; padding: 0px; text-align: center; width: 1000px; height: 220px; color: #808080; font-size: 8pt; color: #FFFFFF; background: transparent url(/gfx/back/footer.png) repeat-x center -100px; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; } #footer h2 { padding: 0px; margin: 0px; } #footer a { color: #78a8bf !important; border-color: #78a8bf; } #footer a:visited { border-color: #78a8bf; } #footer div#w3c { background-color: transparent; position: absolute; top: 40px; right: 20px; } #footer div#w3c div { float: right; margin: 0px auto 10px 5px; } #footer div#w3c a { border: 0px; } #footer div#w3c #xhtml { } #footer div#w3c #css { display: none; } #footer div#credits { position: absolute; bottom: 0px; right: 20px; color: #78a8bf !important; } #footer div#credits:hover { color: #F0F8FF; } #footer div#credits:hover a { color: #FFFFFF !important; } #footer div#credits a { color: #78a8bf !important; border-color: #78a8bf; } #footer div.copyright { display: none; clear: both; color: #808080; } #footer div#links { position: absolute; top: 5px; left: 20px; margin: 25px auto 0px 0px; background-color: transparent; } #footer div#links div.inner { float: left; margin: 0px 15px 0px 0px; text-align: left; width: 250px; background-color: transparent; } #footer div#links div.inner#address a:hover { color: #FFFFFF !important; background-color: transparent; } #footer div#links div.inner#address h2 { font-weight: bold; } #footer div#links div.inner#address p b { color: #FFFFFF; } #footer h2 { color: #FFFFFF; } #footer ul { list-style-type: none; padding: 0px; margin: 0px; } #footer ul.links { padding-top: 10px !important; } #footer ul.links a:hover { color: #FFFFFF !important; } #footer ul li { margin: 0px 0px 5px 0px; } #footer ul ul { padding: 5px 0px 5px 0px; } /* Gutter! (aka under-da-footer!).. */ #gutter { clear: both; width: 100%; height: 10px; text-align: center; color: #FFFFFF; background: transparent none; } /* Images etc. */ #image { float: right; margin: 0px 0px 15px 15px; width: 240px; height: 240px; } #panorama { position: relative; clear: both; margin: 0px auto 20px auto; width: 910px; height: 240px; background-color: transparent; background-repeat: no-repeat; background-position: center top; } #panorama img.visor { width: 910px; height: 240px; background-image: url(/gfx/back/panorama.png); } #panorama .caption { position: absolute; right: 0px; top: 240px; color: #606060; font: normal 8pt "MS Sans Serif",verdana; background-color: #FFFFFF; } #panorama .caption:hover { color: #202020; background-color: #FFD700; } #panorama .caption .inner { padding: 5px; } /* Product Partner Images... */ /* Google "Plus 1" code block (16-09-2011) ... */ #google-plus-1 { z-index: 50000; position: absolute; top: 5px; left: 10px; } /* End of file */