@import url("cms.css"); /* ~~ PAGE ELEMENTS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ * { margin:0px; padding:0px; font-family:Arial,Helvetica,sans-serif; line-height:1.6em; text-indent:0px; list-style:outside; list-style:none; text-decoration:none; border-collapse:collapse; vertical-align:top; color:#000000; outline:none;} body { font-size:0.7em; background-position:center 98px; background-repeat:no-repeat; } body.blue { background-image:url(../images/bgrndTest.jpg); } body.green { background:url(../images/bgrndGreen3.jpg); } body.red { background:url(../images/bgrndRed.jpg); } body.purple { background:url(../images/bgrndPurple.jpg); } body.contentCyan { background-image:url(../images/bgrndContentCyan.jpg); } *html body { padding-left:10px; background-position:center 98px; background-repeat:no-repeat; } *html body.contentCyan { background:url(../images/bgrndContentCyan.jpg) center 98px no-repeat; padding-left:0px!important; } p { padding-bottom: 0.5em; color:#717171; } p span { color: #717171; } td.centre li a { line-height:inherit; background:none!important; padding:0px!important; border-bottom:1px dotted #0b3c8f!important} td.centre li a.inline { border:none!important; padding:0px 0px 0px 0px!important; } td.centre li a:hover.inline { border-bottom:1px dotted #717171!important; color:#717171; } p a { line-height:inherit; background:none!important; padding:0px!important; border-bottom:1px dotted #0b3c8f!important;} p a:hover { color:#000000; border-bottom:1px dotted #000000!important;} p a:active { color:#717171; border-bottom:1px dotted #717171!important;} td.centre .siteMap ul { border-left:1px dotted #0b3c8f; margin: 0px 0px 5px 5px; padding:0px; } td.centre .siteMap ul li { background: url(../images/lineHorizDots.gif) no-repeat 0px 10px!important; font-size:110%;} td.centre .siteMap ul li a { padding:0px 0px 0px 4px; border:none;} a img { border:none; } p b, p strong { padding-right:80px; text-align:left; color:#717171;} b, strong { line-height:inherit; color:inherit;} s { font-weight: bold; text-decoration: none!important; } ul, ol { font-size:100%; padding-bottom:1em;} ol { margin-left:18px; font-size:110%!important;} li { list-style: none; background:url(../../images/.gif) no-repeat 0px 6px; padding-left:10px; color:#717171;} ol li { list-style:decimal; background:none; margin:0px 0px 0px 18px; padding:0px 0px 0px 0px; text-indent:0px;} html>body ol li { *padding:0px; *margin:0px 0px 0px 25px; } a:link, a:visited { color:#0b3c8f; text-decoration: none; outline:none; border-bottom:1px dotted #999999; background:none; } a:hover, a:active { color:#0b3c8f; outline:none; border-bottom:1px dotted #3c5488; background:#f0fbfd; } select { border:1px solid #CCCCCC; margin-bottom:10px;} select optgroup { font-style:normal; color:#0b3c8f; background:#E5E5E5; } select option { outline:none;} form { padding:0px; margin:0px; } label { cursor: pointer; } blockquote { font-style: italic; margin: 0px 0px 0px 20px;} .hr { border-top: 1px solid #c4c4c4; height: 1px; width: 100%; margin: 0px 0px 15px 0px; display:block; font-size:1px; } div.clear { float:none; clear:both; } .align-left { text-align: left; } .align-right { text-align: right; } /* ~~ INPUT ELEMENTS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ input { border-collapse:separate; margin-top:-2px; } .clear { clear: both; float: none; } .float-left { float: left; } .float-right { float: right; } .accessKey { text-decoration: underline;} td.centre div.wrap img.float-left { float: left; margin: 0 10px 10px 0 } td.centre div.wrap img.float-right { float: right; margin: 0 0 10px 10px } /* ~~ CONTROL THE OVERALL CONTENT HEIGHT OF THE SITE HERE! ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #siteWrapper { width:960px; margin:0px auto; position:relative; } *html #siteWrapper { width:960px; } /* ~~ HEADER STYLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #header { height:83px;height:65px; position:relative; width:960px; margin:0px auto; } a#logo { position:absolute; top:14px; left:26px; width:286px; height:34px; background:url(../images/sbLogo.gif) no-repeat; border:none; } /* ~~ TOP MENU STYLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #topNav { height:33px; position:relative; background:url(../images/menuGrad_X2.gif) repeat-x; z-index:30; } #menuL { position:absolute; width:10px; height:33px; background:url(../images/menuGrad_edge2.gif); } #menuR { position:absolute; top:0px; right:0px; width:10px; height:33px; background:url(../images/menuGrad_edge2.gif) 0px -33px no-repeat; } #topNav ul { position:absolute; height:33px; padding:0px 2px 0px 10px; width:auto; } #topNav li { float:left; margin:0px; padding:0px 0px 0px 2px; } #topNav li a { display:block; float:left; line-height:33px; height:33px; border:none; padding:0px; } #topNav li a span { display:block; float:left; } #topNav li a span span { display:block; float:left; height:33px; color:transparent; line-height:0px; border:none; padding:0px 15px; cursor:pointer; background:none; font-size:1px; } #topNav li a:hover { background:url(../images/menuGrad_X2.gif) repeat-x 0px -33px; } #topNav li a:hover span { background:url(../images/menuGrad_spanEdge.gif) top right no-repeat; } #topNav li a:hover span span { background:url(../images/menuGrad_spanEdge.gif) left -33px no-repeat; color:transparent; } #topNav li a:active { background:url(../images/menuGrad_X2.gif) repeat-x 0px -66px; } #topNav li a:active span { background:url(../images/menuGrad_spanEdge.gif) right -66px no-repeat; } #topNav li a:active span span { background:url(../images/menuGrad_spanEdge.gif) left -99px no-repeat; color:#d4d4d4 } .liTopNav1 a { background:url(../images/menuGrad_X2.gif) repeat-x 0px -33px!important; } .liTopNav1 a span { background:url(../images/menuGrad_spanEdge.gif) top right no-repeat!important; } .liTopNav1 a span span { background:url(../images/menuGrad_spanEdge.gif) left -33px no-repeat!important; } .liTopNav1 ul li a { background:none!important;} .liTopNav1 ul li a span { background:none!important;} .liTopNav1 ul li a span span { background:none!important;} .liTopNav1 ul li a span span span { background:none!important;} #topNav li a span span span.services { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px 0px ; width:52px;} #topNav li a:hover span span span.services { background:url(../images/textHeaders.png) no-repeat 0px 0px ;} .liTopNav1 a span span span.services { background:url(../images/textHeaders.png) no-repeat 0px 0px !important; } #topNav li a span span span.applications { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -33px; width:78px;} #topNav li a:hover span span span.applications { background:url(../images/textHeaders.png) no-repeat 0px -33px; } .liTopNav1 a span span span.applications { background:url(../images/textHeaders.png) no-repeat 0px -33px !important; } #topNav li a span span span.news { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -66px; width:36px;} #topNav li a:hover span span span.news { background:url(../images/textHeaders.png) no-repeat 0px -66px; } .liTopNav1 a span span span.news { background:url(../images/textHeaders.png) no-repeat 0px -66px !important; } #topNav li a span span span.about { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -231px; width:43px;} #topNav li a:hover span span span.about { background:url(../images/textHeaders.png) no-repeat 0px -231px; } .liTopNav1 a span span span.about { background:url(../images/textHeaders.png) no-repeat 0px -231px !important; } #topNav li a span span span.contact { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -132px; width:52px;} #topNav li a:hover span span span.contact { background:url(../images/textHeaders.png) no-repeat 0px -132px; } .liTopNav1 a span span span.contact { background:url(../images/textHeaders.png) no-repeat 0px -132px !important; } #topNav li a span span span.casestudies { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -198px; width:80px;} #topNav li a:hover span span span.casestudies { background:url(../images/textHeaders.png) no-repeat 0px -198px; } .liTopNav1 a span span span.casestudies { background:url(../images/textHeaders.png) no-repeat 0px -198px !important; } #topNav li a span span span.clients { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -264px; width:43px;} #topNav li a:hover span span span.clients { background:url(../images/textHeaders.png) no-repeat 0px -264px; } .liTopNav1 a span span span.clients { background:url(../images/textHeaders.png) no-repeat 0px -264px !important; } #topNav li a span span span.home { padding:0px; margin:0px; background:url(../images/textHeaders.png) no-repeat 0px -165px; width:42px; behavior:url(/js/iepngfix.htc);} #topNav li a:hover span span span.home { background:url(../images/textHeaders.png) no-repeat 0px -165px; } .liTopNav1 a span span span.home { background:url(../images/textHeaders.png) no-repeat 0px -165px !important; } *html #topNav li a span span span.services, *html #topNav li a:hover span span span.services, *html .liTopNav1 a span span span.services, *html #topNav li a span span span.applications, *html #topNav li a:hover span span span.applications, *html .liTopNav1 a span span span.applications, *html #topNav li a span span span.news, *html #topNav li a:hover span span span.news, *html .liTopNav1 a span span span.news, *html #topNav li a span span span.about, *html #topNav li a:hover span span span.about, *html .liTopNav1 a span span span.about, *html #topNav li a span span span.contact, *html #topNav li a:hover span span span.contact, *html .liTopNav1 a span span span.contact, *html #topNav li a span span span.home, *html #topNav li a:hover span span span.home, *html .liTopNav1 a span span span.home, *html #topNav li a span span span.casestudies, *html #topNav li a:hover span span span.casestudies, *html .liTopNav1 a span span span.casestudies, *html #topNav li a span span span.clients, *html #topNav li a:hover span span span.clients, *html .liTopNav1 a span span span.clients { background:none!important; color:#FFFFFF!important;} *html #topNav li a span span { color:#FFFFFF; line-height:30px!important; border:none; padding:0px 15px; cursor:pointer; background:none; font-size:110%!important; } *html #topNav li a:hover span span { color:#FFFFFF!important;} /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~ STYLED UP FORM ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #topNav form { width:300px; padding:0px; position:absolute; top:6px; right:59px; height:33px; } /*#topNav form select { color:#959494; width:140px; position:absolute; top:7px; background:#FFFFFF; } #topNav form a { background:none; border:none; cursor:pointer!important; }*/ *html #topNav form { width:300px; padding:0px; position:absolute; top:5px; right:10px!important; height:33px; } /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~ Dropdown Lists ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* Menu Bar */ #nav ul /* all lists */ { position:relative; padding:0px; height:auto; background:url(../images/menuSideGrads.png) bottom left no-repeat; behavior:url(/js/iepngfix.htc);} #nav li /* all list items */ { position: relative; z-index:20;} #nav li ul li { padding:0px; margin:0px; display:block; clear:both; width:auto; margin:0px 5px; width:161px; background:url(../images/lineB_50.png) no-repeat bottom left; behavior:url(/js/iepngfix.htc); } #nav li ul /* 2nd-level lists */ { display:none; } #nav li>ul /* leave in */ { top:auto; left:auto; width:auto;} #nav li:hover ul, #nav li.over ul /* nested hover */ { display:block; position:absolute; top:33px; left:-3px; border:none; width:170px; padding-bottom:15px; } #nav li ul li a.sub { height:auto; display:block; width:161px;} #nav li ul li a.sub span { font-size:110%; line-height:1.5em; padding:3px 16px; margin:0px; color:#FFFFFF; display:block; } #nav li ul li a.sub:hover { cursor:pointer; } #nav li ul li a.sub:hover span { color:#FFFFFF; /*background:#666666!important;*/ background:url(../images/subGradOver.png) top left no-repeat!important; width:129px; cursor:pointer; line-height:1.5em; cursor:pointer; } #nav li ul li a.sub:active span { background:#666666!important; width:129px; } *html #nav ul { background:#FFFFFF!important;} *html #nav li ul li a.sub span { color:#FFFFFF!important;} *html #nav li ul li a.sub:hover span { color:#FFFFFF!important;} *html #liservices ul, *html #liapplications ul, *html #linews ul, *html #liabout ul,*html #licontact ul , *html #licasestudies ul, *html #liclients ul { position:absolute!important; background:#696969!important; top:33px!important; left:0px!important;} *html #liServices ul li, *html #liapplications ul li, *html #linews ul li, *html #licompany ul li, *html #liclients ul li, *html #licontact ul li { border-top:none!important;} /* ~~ CONTENT STYLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #introHead { height:230px; width:960px; background:url(../images/homeOverlayGrad.png) no-repeat; } *html #introHead { background:url(../images/homeOverlayGrad.png) no-repeat; behavior:url(/js/iepngfix.htc);} #contentHead { height:90px; width:960px; } #contentHead h1 { color:#01c2f5; font-weight:normal; font-size:170%; padding:15px 0px 0px 47px;/* padding:15px 0px 0px 225px*/;} #contentHead h1 span { color:#797a7a; font-weight:bold; text-transform: capitalize; } #content { min-height:400px; padding:0px 28px;} #content h2 { color:#797979; font-size:130%; } #driverWrap { width:943px; height:280px; padding:0px 0px 0px 17px} #driverWrap ul { padding:0px 0px;} #driverWrap ul li { padding:0px 0px 0px 0px; } *html #driverWrap ul li { display:inline; } #driverWrap ul li a { padding:0px 0px 3px 30px; border-bottom:1px solid #efefef; display:block; color:#494949; font-size:120%; background:url(../images/ftArrowGrey.gif) no-repeat 5px 4px;} #driverWrap ul li a:hover { color:#4996d8;} .wrapNews ul { padding:10px; } .wrapNews ul li { display:block!important; padding:0px 0px 0px 0px!important; margin:0px!important; background:none!important; } .wrapNews ul li a { padding:0px!important; margin:0px!important; padding:0px 0px 0px 20px!important; border-bottom:none!important;background:url(../images/news+.gif) no-repeat 0px 6px!important;} .wrapNews ul li a:hover { color:#b80000!important;} .wrapNews ul li p { padding:0px 0px 0px 20px;} .column { width:300px; float:left; margin:0px 13px 0px 0px; position:relative; background: url(../images/columnTopGradY.gif) #fcfcfc repeat-y -4px 0px;} .column .wrap, .column .wrapNews { padding:10px 15px 10px 15px;} .column .wrap .noBg * { background: none!important; } .columnWrap { background: url(../images/columnTopGradY.gif) repeat-y 296px 0px; height:280px; display:block; border:none; } .columnFoot { position:absolute; bottom:0px; width:300px; height:15px; background:url(../images/columnFooterX.gif) bottom left repeat-x; font-size:1px;} .columnFootBL { height:15px; width:15px; position:absolute; bottom:0px; left:0px; background:url(../images/columnFootCorners.gif) bottom left; font-size:1px;} .columnFootBR { height:15px; width:15px; position:absolute; bottom:0px; right:0px; background:url(../images/columnFootCorners.gif) bottom right; font-size:1px;} .columnFoot a.tools, .columnFoot a.news, .columnFoot a.web { font-size:12px!important; color:#5e5e5e!important; border-bottom:none; position:absolute; bottom:15px; right:13px; width:auto; height:12px; z-index:3; padding:0px 0px 0px 20px; line-height:12px!important;} .columnFoot a.tools { background:url(../images/columnArrows.gif) no-repeat 0px 0px;} .columnFoot a.news { background:url(../images/columnArrows.gif) no-repeat 0px -24px;} .columnFoot a.web { background:url(../images/columnArrows.gif) no-repeat 0px -12px;} .columnFoot a.tools:hover { color:#01c2f5!important;} .columnFoot a.news:hover { color:#b80000!important;} .columnFoot a.web:hover { color:#8cbf00!important;} .columnFoot a.tools:active, .columnFoot a.news:active, .columnFoot a.web:active { color:#5e5e5e!important; background:url(../images/columnArrows.gif) no-repeat 0px -36px;} *html .columnFootBL { bottom:-1px; left:0px; } *html .columnFootBR { bottom:-1px; right:0px;} a.headerFT { background:url(../images/headerFT.gif) no-repeat 10px 6px !important; display:block; height:24px; font-size:0px; border:none!important; height:38px; color:#eeeeee!important;} a.headerRecent { background:url(../images/headerRecentWeb.gif) no-repeat 10px 6px !important; display:block; height:24px; font-size:0px; border:none!important; height:38px; color:#eeeeee!important;} a.headerNews { background:url(../images/headerNews.gif) no-repeat 10px 6px !important; display:block; height:24px; font-size:0px; border:none!important; height:38px; color:#eeeeee!important;} .headerGrad { height:37px; background:url(../images/columnTopGrad.gif) repeat-x;} .headerLeft { position:absolute; width:4px; height:54px; top:0px; left:0px; background:url(../images/columnTopEdges.gif) no-repeat;} .headerRight { position:absolute; width:4px; height:54px; top:0px; right:0px; background:url(../images/columnTopEdges.gif) bottom no-repeat;} .flash { position:relative; left:4px; width:292px; height:155px; } .flash .wrap { padding:0px 15px 0px 15px;} .flash .wrap p { padding:0px; position:absolute; bottom:-40px; width: 260px;} *html .flash .wrap p { bottom: 40px; } .display, #displayTwo, #displayThree, #displayFour { float: right; width: 35px; height: 205px; margin:0; cursor:pointer; border:none; } #displayHome { display: none; } #displayOne { background: url(../images/buttonDesign.gif) no-repeat; border:none; width:36px;} #displayOne:hover { background: url(../images/buttonDesign.gif) no-repeat bottom; border:none; width:36px;} #displayTwo { background: url(../images/buttonDev.gif) no-repeat top; border:none; width:36px; } #displayTwo:hover { background: url(../images/buttonDev.gif) no-repeat bottom; border:none; width:36px; } #displayThree { background: url(../images/buttonMarketing.gif) no-repeat top; border:none; width:33px; } #displayThree:hover { background: url(../images/buttonMarketing.gif) no-repeat bottom; border:none; width:33px; } #displayFour { background: url(../images/buttonPlanning.gif) no-repeat top; border:none; width:36px; } #displayFour:hover { background: url(../images/buttonPlanning.gif) no-repeat bottom; border:none; width:36px; } .stretcher { float: right; width: 300px; height:205px; } .stretcher .wrap { height:205px; overflow:hidden; padding:15px; position:relative;} .stretcher p { display:block; } #introHead p { font-size:100%; display:block; overflow:hidden; } #introHead a { position:absolute; bottom:45px; left:15px; height:22px; width:130px; border:none; background: url(../images/cyanB_moreM.gif) repeat-x; padding:0px; font-size:120%;} #introHead a span { display:block; background:url(../images/cyanB_moreR.gif) no-repeat top right; height:22px;} #introHead a span span { display:block; background:url(../images/cyanB_moreL.gif) no-repeat;color:#FFFFFF; padding:0px 13px 0px 30px; cursor:pointer;} #introHead a:hover { background: url(../images/cyanB_moreM.gif) repeat-x 0px -22px; } #introHead a:hover span { background: url(../images/cyanB_moreR.gif) no-repeat right -22px; } #introHead a:hover span span { background: url(../images/cyanB_moreL.gif) no-repeat 0px -22px; } #introHead a:active { background: url(../images/cyanB_moreM.gif) repeat-x 0px -44px; } #introHead a:active span { background: url(../images/cyanB_moreR.gif) no-repeat right -44px; } #introHead a:active span span { background: url(../images/cyanB_moreL.gif) no-repeat 0px -44px; } #introHead a.yellow { background:url(../images/yellowB_moreM.gif) repeat-x;} #introHead a.yellow span { display:block; background:url(../images/yellowB_moreR.gif) no-repeat top right;} #introHead a.yellow span span { display:block; background:url(../images/yellowB_moreL.gif) no-repeat; color:#000000;} #introHead a.yellow:hover { background: url(../images/yellowB_moreM.gif) repeat-x 0px -22px; } #introHead a.yellow:hover span { background: url(../images/yellowB_moreR.gif) no-repeat right -22px; } #introHead a.yellow:hover span span { background: url(../images/yellowB_moreL.gif) no-repeat 0px -22px; } #introHead a.yellow:active { background: url(../images/yellowB_moreM.gif) repeat-x 0px -44px; } #introHead a.yellow:active span { background: url(../images/yellowB_moreR.gif) no-repeat right -44px; } #introHead a.yellow:active span span { background: url(../images/yellowB_moreL.gif) no-repeat 0px -44px; } #introHead a.green { background:url(../images/greenB_moreM.gif) repeat-x;} #introHead a.green span { display:block; background:url(../images/greenB_moreR.gif) no-repeat top right;} #introHead a.green span span { display:block; background:url(../images/greenB_moreL.gif) no-repeat;} #introHead a.green:hover { background: url(../images/greenB_moreM.gif) repeat-x 0px -22px; } #introHead a.green:hover span { background: url(../images/greenB_moreR.gif) no-repeat right -22px; } #introHead a.green:hover span span { background: url(../images/greenB_moreL.gif) no-repeat 0px -22px; } #introHead a.green:active { background: url(../images/greenB_moreM.gif) repeat-x 0px -44px; } #introHead a.green:active span { background: url(../images/greenB_moreR.gif) no-repeat right -44px; } #introHead a.green:active span span { background: url(../images/greenB_moreL.gif) no-repeat 0px -44px; } #introHead a.purple { background:url(../images/purpleB_moreM.gif) repeat-x;} #introHead a.purple span { display:block; background:url(../images/purpleB_moreR.gif) no-repeat top right;} #introHead a.purple span span { display:block; background:url(../images/purpleB_moreL.gif) no-repeat;} #introHead a.purple:hover { background: url(../images/purpleB_moreM.gif) repeat-x 0px -22px; } #introHead a.purple:hover span { background: url(../images/purpleB_moreR.gif) no-repeat right -22px; } #introHead a.purple:hover span span { background: url(../images/purpleB_moreL.gif) no-repeat 0px -22px; } #introHead a.purple:active { background: url(../images/purpleB_moreM.gif) repeat-x 0px -44px; } #introHead a.purple:active span { background: url(../images/purpleB_moreR.gif) no-repeat right -44px; } #introHead a.purple:active span span { background: url(../images/purpleB_moreL.gif) no-repeat 0px -44px; } #introHead h2 { font-size:145%; font-weight:bold; color:#00d3ff;} #introHead h2.yellow { color:#f2c200;} #introHead h2.green { color:#90bf46;} #introHead h2.purple { color:#d01e7a;} #introHwrapper { height:200px; overflow:hidden; position:relative; padding:0px 20px 0px 0px; } #introHwrapper h1#home { position:absolute; font-size:1px; color:transparent; behavior:url(/js/iepngfix.htc); width:360px; height:67px; top:60px; left:30px; background: url(../images/strapline_01.png) no-repeat;} *html #introHwrapper h1#home { color:#5bb4c1; } table#threeCol { width:100%; } table#threeCol td.LHS { width:200px;} td.LHS .wrap { padding:0px 20px 10px 0px; height:400px;} td.LHS .wrap ul { padding:0px 20px 0px 0px; } td.LHS .wrap ul li { padding:3px 0px 2px 0px; margin:0px; border-bottom:1px solid #f0f0f0;} td.LHS .wrap ul li a { color:#717171; border:none; padding:0px 0px 0px 20px; margin:0px; font-size:105%; background:none; display:block; } td.LHS .wrap ul li a:hover { background:url(../images/ftArrowGrey.gif) no-repeat 7px 2px; } td.LHS .wrap ul li a:active, td.LHS .wrap ul li a.onstate { background:url(../images/ftArrowGrey.gif) no-repeat 7px 2px; color:#01c2f5 } table#threeCol td.centre .wrap { padding:0px 25px 30px 0px;} table#threeCol td.centre .wrap a { padding:0px 0px 0px 8px; margin:0px; display:inline; border-bottom:none; background:url(../images/arrowInline.gif) no-repeat 0px 3px; } table#threeCol td.centre .wrap a strong, table#threeCol td.centre .wrap strong { padding:0px;} table#threeCol td.centre ul li { background:url(../images/arrowInline.gif) no-repeat 0px 6px; font-size:110%;} table#threeCol td.centre p { font-size:110%;} table#threeCol td.RHS { width:200px;} table#threeCol td.RHS .column { padding:0px; margin:0px 0px 15px; width:200px;} table#threeCol td.RHS .column .columnWrap { background: url(../images/columnTopGradY.gif) 196px 0px repeat-y; height:auto; } table#threeCol td.RHS .columnFoot { width:200px; } #frameWrap { padding:10px; border:1px #666666 solid; width:400px; background:#FFFFFF; position:relative; margin-bottom:10px!important;} /* ~~ FOOTER STYLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #footer * { line-height:20px; padding:0px; color:#6f6f6f; } #footer { padding:0px 20px; color:#717171; } #footer ul { float:right; padding:0px; } #footer ul li { float:left; margin:0px; padding:0px 0px 0px 10px; } #footer ul li a { background:none; border:none; } #footer ul li a:hover { color:#000000; border-bottom:1px dotted #000000!important; } #footer ul li a:active { color:#717171; border-bottom:1px dotted #717171!important; } /* ~~ NICE FORM STYLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ /*Forms defaults - change as needed*/ input, textarea { color:#404040; } label { color:#999999; cursor:pointer; padding-left:2px; line-height:16px; } label.chosen { color:#333333; } /*Transparent items*/ .outtaHere { position:absolute; left:-3000px; } /*Radio buttons*/ .radioArea, .radioAreaChecked { display:block; float:left; clear:left; width:15px; height:14px; font-size:0px; cursor:pointer;} .radioArea { background:url(../images/radio.gif) no-repeat left top; } .radioAreaChecked { background:url(../images/radio.gif) no-repeat left bottom; } /*Checkboxes*/ .checkboxArea, .checkboxAreaChecked { display:block; float:left; clear:left; width:13px; height:13px; font-size:0px; padding:0px; margin:0px; cursor:pointer; } .checkboxArea { background:url(../images/checkbox.gif) no-repeat left top; } .checkboxAreaChecked { background:url(../images/checkbox.gif) no-repeat left bottom; } .focused { border:1px dotted #dddddd; } /*Text inputs*/ .textinput, .textinputHovered { height:15px; background:url(../images/input_bg.gif) repeat-x left top; border:none; padding:4px 0px; vertical-align:bottom; } .textinputHovered { background-position:left bottom; } .inputCorner { padding-bottom:0px; vertical-align:middle; } /*Text areas*/ .txtarea .tr, .txtarea .tr_xon { background:url(../images/txtarea_tr.gif) no-repeat top right;} .txtarea .tr_xon { background:url(../images/txtarea_tr_xon.gif) no-repeat top right; height:5px; } .txtarea img.txt_corner { width:5px; height:5px; display:block; } .txtarea .br, .txtarea .br_xon { background:url(../images/txtarea_br.gif) no-repeat top right; } .txtarea .br_xon { background:url(../images/txtarea_br_xon.gif) no-repeat top right; } .txtarea .cntr { background:url(../images/txtarea_cntr.gif) repeat-y right top; } .txtarea .cntr_xon { background:url(../images/txtarea_cntr_xon.gif) repeat-y right top; } .txtarea .cntr_l, .txtarea .cntr_l_xon { width:5px; background:url(../images/txtarea_l.gif) repeat-y left top; float:left; } .txtarea .cntr_l_xon { background:url(../images/txtarea_l_xon.gif) repeat-y left top; } .txtarea textarea { border:0px; background:none; padding:0px; margin:5px; font-size:110%; } /*Search function - TOPNAV */ /*FIREFOX*/ #topNav .niceform { top:2px; right:0px; width:250px; } #topNav .niceform .textinput { width:150px!important; background: url(../images/inputT.png) repeat-x;} #topNav .niceform .textinputHovered { width:150px!important; background:url(../images/inputT.png) 0px -23px repeat-x!important} /*SAFARI*/ @media screen and (-webkit-min-device-pixel-ratio:0) { #topNav .niceform { right:-50px; top:8px; } } /*ie7*/ html>body #topNav .niceform { *top:4px; *right:5px; *width:260px;} html>body #topNav .niceform .textinput { *position:relative; *top:-2px;} html>body #topNav .niceform .textinputHovered { *position:relative; *top:-2px;} /*Button*/ #topNav .buttonSubmit { } .niceform img{behavior:url(/js/iepngfix.htc);} .buttonSubmit, .buttonSubmitHovered { width:auto; height:28px; color:#FFFFFF; font-weight:bold; padding:2px; background:url(../images/button_bg.png) repeat-x 0px 2px; height:28px; cursor:pointer; border:none!important; } .buttonSubmitHovered { background-position:0px 2px; background:url(../images/button_bg.png) repeat-x 0px -24px; } .buttonImg { vertical-align:bottom; } table.contact { font-size:110%; } span.red { color:red; font-size:150%; font-weight:bold; position: relative; bottom: 0.23em; } td.required { padding-right:10px;} .txtarea { width:350px!important; height:200px;} .txtAddress { width:100%; height:200px;} div.tr { height:5px; background:url(../images/txtarea_tr.gif) repeat-x bottom left;} div.br { height:15px!important; width:100%; margin:0px!important; padding:0px!important; display:block!important; background:../images/txtarea_br.gif) no-repeat right top!important; } *html .textinput { position:relative; top:-1px;padding:1px 0px 0px 0px; height:21px!important; margin:0px;} *html .textinputHovered { position:relative; top:0px!important; height:21px!important; padding:1px 0px 0px 0px; margin:0px;} *html .textinputHoveredIE6 { top:-2px!important;} html>body .textinput { *padding:0px; *line-height:20px; *height:22px; *position:relative; *top:0px } html>body .textinputHovered { *padding:0px; *line-height:20px; *height:22px; *position:relative; *top:1px } #txtEnquiry, #txtAddress { overflow-y:auto!important;} /* ~~ ADMIN EDIT ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #admin { background: #999999; border-bottom: 1px solid #000000; height: 16px; line-height: 16px; padding: 2px 20px; font-size: 11px;} #admin a, #admin p { color: #FFFFFF !important; border: 0px !important; } #admin a:hover { text-decoration: underline !important; border: 0px !important; } #admin a.editHome { background: url(../../images/admin_home.png) no-repeat !important; padding: 2px 0px 2px 20px !important; margin: 1px; } #admin a.editPage { background: url(../../images/admin_edit.png) no-repeat !important; padding: 2px 0px 2px 20px !important; margin: 1px; } #admin a.xmlView { background: url(../../images/admin_xml.png) no-repeat !important; padding: 2px 0px 2px 20px !important; margin: 1px; } .clear { clear: both; font-size: 1px; line-height: 1px; } #overlay { background: #fff; /*min-height:768px; height:auto !important;*/ height:225px; width: /*961px*/100%; position: absolute; top:98px; left:0px; z-index: 2000; } *html #overlay { height:225px;} #overlay h3 { color: #01C2F5; text-align:center; } #preloader { margin:6% auto; width:350px;} #overlay #preloader img { margin:0px auto; padding:0px 0px 10px 15px; } .ajaxLoader { background:url(../images/ajax-loader.gif) top center no-repeat; height:50px;} /* ~~ SELECTS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ #topNav form div.selectWrapper * { margin: 0px; padding: 0px;} #topNav form div.selectWrapper { position: relative; height: 21px; right: -15px; } *html #topNav form div.selectWrapper { right: 10px; } #topNav form div.selectWrapper a.selectOpen, #topNav form div.selectWrapper a.selectOpen span, #topNav form div.selectWrapper a.selectOpen span span { height: 21px; display: block; line-height:22px; cursor:pointer; } #topNav div.selectWrapper a.selectOpen { background: url(../images/select_bg.gif) repeat-x; width: 165px; position: relative; border: 0px; } #topNav div.selectWrapper a.selectOpen span { background: url(../images/select_left.gif) no-repeat top left; } #topNav div.selectWrapper a.selectOpen span span{ background: url(../images/select_right.gif) no-repeat top right; } #topNav form div.selectWrapper ul { position: absolute; width: 163px; top: 20px; left: 0px; background-color: #FFFFFF; border: solid 1px #CCCCCC; display: none; z-index: 100; height: 350px; overflow: hidden; overflow-y: auto; } #topNav form div.selectWrapper ul > li { float: none; clear: both; } #topNav form div.selectWrapper ul a { display: block; padding: 0px 5px; text-decoration: none; color:#0099CC; background: #FFFFFF; height: 23px; line-height: 23px; width: 100%;} #topNav form div.selectWrapper ul a:hover { color: #FFFFFF; background:#666; } #banner { position:absolute; width:294px; height:34px; background:url(../images/exchangeBanner.gif) no-repeat; right:0px; top:15px; border:none!important;} table#search { width:85%;} table#search tr th, table#search tr td { text-align:left; padding:5px 10px 5px 0px;} /* ~~ HIDDEN - used to hide the original form elements ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */ .hidden { display: none; } .cyan { color:#00d3ff;} div.caseStudy { margin: 5px 0; } div.caseStudy table td { padding: 5px; } div.caseStudy table td.thumb a { border: 0 !important; background-image: none !important; } div.caseStudy table td.thumb a img { margin-top:5px; } noscript { color: Red; }