/* CSS generated by SiteManager at 01:25pm 17/10/2011 - do not edit this file directly */ /* CSS generated by SiteManager at 05:22pm 27/07/2011 - do not edit this file directly */ /*----------------------------------------------------------------------------------------------------------------------------------------------------------- CSS for Reconomy - Main Stylesheet Author: David Ball (david@binaryfold4.com) / BinaryFold4 Ltd Created: 27/07/2011 -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* Global Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ /* commented backslash hack */ html, body { height: 100%; } /* end hack */ body { background: #d3d3ce none ; font: 80% arial, helvetica, verdana, sans-serif; text-align: center; padding: 0; margin: 0; } h1 { font: bold 1.6em arial, helvetica, verdana, sans-serif; color: #323232; margin: 0 0 14px; } h2 { font: bold 1.2em arial, helvetica, verdana, sans-serif; color: #2e6198; margin: 30px 0 10px; } h3 { font: normal 1.1em arial, helvetica, verdana, sans-serif; color: #2e6198; margin: 20px 0 5px; } p { font-size: 1.0em; line-height: 1.5em; color: #4f4f4f; margin: 15px 0; } li { font-size: 1.0em; line-height: 1.5em; color: #4f4f4f; margin: 5px 0; } p.largetext { font-size: 1.3em; line-height: 1.3em; } p.smalltext { font-size: 0.85em; } p.date { font-size: 1.3em; line-height: 1.3em; margin-top: 0; } a:link, a:visited { text-decoration: none; color: #22619b; } a:hover, a:active { text-decoration: none; color: #622567; } hr { height: 1px; background-color: #e8e8e8; color: #e8e8e8; border: 0; margin: 15px 0; } img { border: 0; } form, table { background: transparent; font-size: 1.0em; color: #2E6197; } .tablestyle { width: 100%; } .tablestyle th { background-color: #005293; vertical-align: top; font-size: 1.0em; text-align: center; color: #2E6197; text-transform: uppercase; color: #fff; padding: 3px 5px; } .tablestyle td { background-color: #D3D3CE; vertical-align: top; font-size: 1.0em; text-align: center; color: #2E6197; padding: 3px 5px; } .tableborder { border-collapse: collapse; } .tableborder td, .tableborder th { vertical-align: top; color: #2E6197; padding: 5px; border: 1px solid #e8e8e8; } .clear { height: 1px; clear: both; font-size: 0.1em; line-height: 0.1em; padding: 0; margin: 0; } .right { float: right; } .left { float: left; } .last { margin-right: 0!important; } .widthwrapper { width: 100%; } .padding { padding: 20px; } #accessibility { display: none; } /* Layout Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #container { width: 995px; min-height: 100%; height: auto; background: #fff none; padding: 0; margin: 0 auto -93px; } /* margin-bottom to match #clearfooter */ * html #container { height: 100%; } /* Header Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #header { position: relative; background-color: #005293; text-align: left; padding: 0; margin: 0 auto; height:100px; } #header #sitelogo { display: block; position:absolute; top:20px; left:24px; } #header a#customerlogin { width: 214px; height: 27px; display: block; position: absolute; top: 18px; right: 18px; background:#438bf2 url(/templatefiles/portal_btn_normal.gif); no-repeat top center; text-decoration: none; font-size: 1em; line-height: 27px; text-align: center; color: #fff; border:1px solid #2879eb; -moz-border-radius: 3px; border-radius: 3px; padding:0 0 0 20px; } #header a#customerlogin:hover, #header a#customerlogin:focus, #header a#customerlogin:active { color: #fff; background:#3b85f1 url(/templatefiles/portal_btn_over.gif); border:1px solid #2b5cb6; } #header a#customerlogin .user { display:block; width:8px; height:10px; position:absolute; top:9px; left:10px; background:transparent url(/templatefiles/portal_btn_user.png) no-repeat; } #header #strapline { position:absolute; top:40px; left:230px; color:#fff; font-size:1.5em; text-align:right; } #header #search { position: absolute; top: 67px; right: 18px; margin:0; padding:0; width:214px; } #header #search .taosTextField { width: 139px !important; height:22px; margin: 0; padding:0 0 0 25px; background: #fff url(/templatefiles/search_bg.jpg) no-repeat 0 2px; position: absolute; top: 0; left: 0; border-top:1px solid #ccc; border-left:1px solid #ccc; border-bottom:1px solid #ccc; border-right:0; outline:none; } #header #search .button { width: 75px !important; height:24px; background:url(/templatefiles/btn-search.gif) no-repeat; margin: 0; padding:0; position: absolute; top: 0; right: 0; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-left:0; } /* Main Navigation Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .mainnav { padding: 0; margin: 0 auto; display:block; overflow:hidden; } .mainnav ul { padding: 0; margin: 0; border-bottom:1px solid #b1b1b1; overflow:auto; } .mainnav li { float: left; line-height: 1.0em; list-style-type: none; margin: 0; } .mainnav li a, .mainnav li a:link, .mainnav li a:visited { float: left; display:block; text-decoration: none; color: #4e4e4e; padding: 12px 17px; margin:0; border-left:1px solid #b1b1b1; } .mainnav li a:hover, .mainnav li a:active { text-decoration: none; background:#f0f0ea; } .mainnav li.firstoption a { border-left:none; } .mainnav li.selectedoption a, .mainnav li.selectedoption a:visited { background-color:#005293; text-decoration: none; color: #fff; } .mainnav li.selectedoption a:hover, .mainnav li.selectedoption a:active { } /* Sidecol Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .sidecol { width: 224px; float: left; background-color: #fff; margin-right: 16px; padding:9px 0 0; border-top:3px solid #d3d3ce; } .sidecol #subnav ul { padding: 0; margin: 0; font-size:1.1em; } .sidecol #subnav ul li { display: block !important; list-style-type: none; line-height: 1.5em; padding: 0; margin: 0; } .sidecol #subnav ul li a, .sidecol #subnav ul li a:link, .sidecol #subnav ul li a:visited { display: block; background-color: #fff; text-decoration: none; color: #4e4e4e; padding: 7px 15px; border-bottom: 1px solid #d3d3ce; } .sidecol #subnav ul li a:hover, .sidecol #subnav ul li a:active { background-color: #f0f0ea; text-decoration: none; color: #4e4e4e; } .sidecol #subnav ul li.selectedoption a, .sidecol #subnav ul li.selectedoption a:link, .sidecol #subnav ul li.selectedoption a:visited { background-color: #005293; text-decoration: none; color: #fff; } .sidecol #subnav ul li.selectedoption a:hover, .sidecol #subnav ul li.selectedoption a:active { background-color: #0060ac; color: #f0f0ea; } .sidecol #subnav ul li.selectedoption ul { padding: 0; margin: 0; } .sidecol #subnav ul li.selectedoption ul li { display: block !important; list-style-type: none; line-height: 1.3em; padding: 0; margin: 0; } .sidecol #subnav ul li.selectedoption ul li a, .sidecol #subnav ul li.selectedoption ul li a:link, .sidecol #subnav ul li.selectedoption ul li a:visited { display: block; background-color: #fff; text-decoration: none; color: #005293; padding: 5px 15px 5px 20px; font-size:0.8em; } .sidecol #subnav ul li.selectedoption ul li a:hover, .sidecol #subnav ul li.selectedoption ul li a:active, .sidecol #subnav ul li.selectedoption ul li.selectedoption a, .sidecol #subnav ul li.selectedoption ul li.selectedoption a:link, .sidecol #subnav ul li.selectedoption ul li.selectedoption a:visited { background-color: #f0f0ea; text-decoration: none; } .sidecol #subnav ul li.selectedoption ul li.selectedoption a:hover, .sidecol #subnav ul li.selectedoption ul li.selectedoption a:active { background-color:#F0F0ED; text-decoration: none; color: #622567; } /* Content Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .contentwrapper { text-align: left; margin: 19px auto 0; padding:0 9px; } .blockmenu { background-color: #dbdbdb; } .wrapper { width: 736px; float: right; margin-bottom: 15px; padding:9px 0 0; border-top:3px solid #d3d3ce; } /* .nosubcontent .wrapper { background: none; } .nosubcontent.nosidecol .wrapper { width: 100%; background: none; } */ .withsubcontent .wrapper { } .content { width: 736px; } .withsubcontent .content { width: 464px; } #news .content { width: 464px; } /* .nosubcontent .content { width: 736px; } .nosubcontent.nosidecol .content { width: 100%; background: none; } */ .mainimage { margin-bottom:20px; } .intro { margin-bottom: 15px; } .intro p { font-weight: bold; font-size: 1.2em; margin-top: 0; } .thumbnail img { float: left; margin: 0 14px 20px 0; } ul.arrows { padding: 0; margin: 10px 0; } ul.arrows li { background: transparent url(/templatefiles/arrow.png) no-repeat 0 4px; list-style-type: none; padding-left: 25px; } ul.ticks { padding: 0; margin: 10px 0; } ul.ticks li { background: transparent url(/templatefiles/arrow_tick.jpg) no-repeat 0 4px; list-style-type: none; padding-left: 25px; } #sectorsmenu { border-top:1px solid #ccc; } #sectorsmenu .sector { display:block; border-bottom:1px solid #ccc; overflow:auto; padding:15px 0 15px; position:relative; } #sectorsmenu .sector img { float:left; } #sectorsmenu .sector .summary { margin-left:300px; margin-bottom:25px; } #sectorsmenu .sector h2 { margin:0 0 10px; } #sectorsmenu .sector h2 a, #sectorsmenu .sector h2 a:visited { color:#4e4e4e; } #sectorsmenu .sector h2 a:hover, #sectorsmenu .sector h2 a:active, #sectorsmenu .sector h2 a:focus { color:#22619b; } #sectorsmenu .sector p.more { position:absolute; bottom:0; } #sectorsmenu .sector .arrows { margin-left:300px; } .threecol { } .threecol .col { } .fourcol {} .fourcol .col {} /* News Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #newsmenu {} #newsmenu p.date { font-size:1em; } #newsmenu .newsitem { padding:0 0 15px; border-bottom:1px solid #d2d3ce; margin:0 0 15px; } #newsmenu .newsitem p {} #newsmenu .newsitem h2 { color:#4e4e4e; } #newsmenu .newsitem h2 a, #newsmenu .newsitem h2 a:visited { color:#4e4e4e; } #newsmenu .newsitem h2 a:hover, #newsmenu .newsitem h2 a:active, #newsmenu .newsitem h2 a:focus { color:#005293; } #newsmenu .newsitem.special .summary, #newsmenu .newsitem.special .summary p { color:#005293; font-size:1.1em; font-weight:bold; } #newslettersignup { display:block; border-top:3px solid #d3d3ce; width:224px; padding:15px 0 0; position:relative; overflow:auto; margin-bottom:20px; } #newslettersignup input { border:1px solid #cccccc; display:block; margin:0 0 15px; height:16px; width:214px; padding:4px; } #newslettersignup label { font-size:0.95em; color:#4E4E4E; } #newslettersignup .button { display:block; color:#868585; background:url(/templatefiles/newsletter-signup.png) no-repeat; border:0; width:90px; height:25px; margin:0; padding:3px 30px 6px 15px; float:right; cursor:pointer; } #newslettersignup h2, #newslettersignup h3 { color:#4E4E4E; margin:0 0 5px; padding:0; font-weight:bold; font-size:1.2em; } #newslettersignup p { margin:0 0 10px; } /* Column Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .colwrapper { overflow: auto; } .col { width: 224px; float: left; background-color: #dbdbdb; padding: 0; margin: 20px 0 0 16px; } .col .imgwrapper { width: 224px; height: 190px; overflow: hidden; position: relative; display: block; } .col .imgwrapper .tl { position: absolute; top: 0; left: 0; } .col .imgwrapper .blocktitle { width: 192px; position: absolute; bottom: 0; left: 0; background: transparent url(/templatefiles/overlay_purple.png) repeat 0 0; font-size: 1.2em; color: #fff; padding: 7px 16px; } .col .imgwrapper:hover .blocktitle , .col .imgwrapper:active .blocktitle { background-image: url(/templatefiles/overlay_green.png); color: #fff; } /* Subcontent Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ .subcontent { width: 225px; float: right; margin-left:10px; } .subcontent h2 { background-color:#d3d3ce; color:#323232; padding:10px 16px; margin:0 -9px 0 0; font-size:1.2em; } .contentimg { padding: 0; margin-bottom: 10px; } .contentimg img { display: block; margin: 0 auto; } .contenttextbox { background: transparent url(/templatefiles/diagonalstripe.gif); text-align: left; padding:10px 16px; margin-bottom: 28px; color:#005293; font-size:1.1em; font-weight:bold; } .contenttextbox h2, .contenttextbox h3 { font-weight: bold; font-size:1.2em; } .contenttextbox p { margin:5px 0; color:#005293; } .contenttextbox a, .contenttextbox a:visited { color:#005293; } .contenttextbox a:hover, .contenttextbox a:active, .contenttextbox a:focus { color:#000; } #contactus .contenttextbox { font-size:1em; } /* Footer Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #clearfooter { clear: both; height: 93px; } /* height to match height + padding + margin etc in #footer */ #footer { width: 977px; background-color: #fff; text-align: left; border: 9px solid #fff; border-width: 9px; margin: 0 auto; overflow:hidden; } #footer-left { width: 198px; height: 64px; float: left; background-color: #b1d600; padding: 5px 16px; border-right: 9px solid #fff; } #footer-right { width: 704px; height: 54px; float: right; background-color: #622567; padding: 15px 16px 5px; } #footer p { font-weight: bold; font-size: 0.85em; color: #fff; margin: 0; } #footer-left p { color:#4e4e4e; } #footer a, #footer a:visited { text-decoration: none; color: #fff; } #footer-left a, #footer-left a:visited { color:#4e4e4e; } #footer-left a:hover, #footer-left a:active { text-decoration: none; color: #fff; } #footer-right a:hover, #footer-right a:active { text-decoration: none; color: #b1d600; } #footer p#bf4 { margin-top: 45px; } #footer ul { float: right; padding: 0; margin: 0 0 0 55px; } #footer ul li { font-size: 0.85em; list-style-type: none; font-weight: bold; text-align: right; color: #fff; margin: 0; } #footer ul.first { margin-left:0; } /* Homepage Styles -------------------------------------------------------------------------------------------------------------------------------------------------------------- */ #home #casestudies { margin-bottom:10px; } #home .threecol { padding:0 15px; overflow:auto; margin-bottom:10px; } #home .threecol .col { margin:0 15px 0 0; padding:10px 0 0; border-top:3px solid #D3D3CE; background:none; } #home .threecol .col#summary { width:414px; } #home .threecol .col#summary p { font-size:1.2em; color:#323232; line-height:1.1em; margin:0 0 10px; } #home .threecol .col#summary .readmore a, #home .threecol .col#summary .readmore a:visited { color:#22619B; font-size:0.75em; } #home .threecol .col#summary .readmore a:hover, #home .threecol .col#summary .readmore a:active, #home .threecol .col#summary .readmore a:focus { color:#622567; text-decoration:underline; } #home .threecol .col#news { width:272px; } #home .threecol .col#news h2 { margin:0 0 10px; } #home .threecol .col#news h3 { margin:10px 0 5px; font-size:1.2em; } #home .threecol .col#news a, #home .threecol .col#news a:visited { color:#323232; text-decoration:underline; } #home .threecol .col#news a:active, #home .threecol .col#news a:hover, #home .threecol .col#news a:focus { color:#622567; } #home .threecol .col#news p.date { color:#005293; font-size:0.9em; margin:0 0 10px; } #home .threecol .col#news p.readmore a, #home .threecol .col#news p.readmore a:link, #home .threecol .col#news p.readmore a:visited { color:#22619B; font-size:1em; text-decoration:none; } #home .threecol .col#news p.readmore a:hover, #home .threecol .col#news p.readmore a:active, #home .threecol .col#news p.readmore a:visited { color:#622567; text-decoration:underline; } #home .threecol .col#newsletter { width:224px; } #home .threecol .col#newsletter h2 { margin:0 0 10px;} #home .threecol .col#newsletter #newslettersignup { border:none; padding:0; } #home .fourcol { overflow:hidden; padding:0 15px; margin:0 0 10px; } #home .fourcol .col { width:222px; height:113px; border:1px solid #6DB743; display:block; position:relative; margin:0 15px 0 0; float:left; background:none; } #home .fourcol .col:hover, #home .fourcol .col:active, #home .fourcol .col:focus { width:224px; height:114px; border:none; background:#dfee96; } #home .fourcol .col:nth-child(4), #home .fourcol .col.last { margin-right:0; } #home .fourcol .col .summary a { padding:10px 10px 15px 108px; position:absolute; } #home .fourcol .col:hover .summary a, #home .fourcol .col:active .summary a, #home .fourcol .col:focus .summary a { padding:11px 10px 15px 109px; } #home .fourcol .col a smalltext, #home .fourcol .col a:visited .smalltext { font-size:0.8em; margin:0; color:##22619B; } #home .fourcol .col a:hover .smalltext, #home .fourcol .col a:focus .smalltext, #home .fourcol .col a:active .smalltext { color:#22619B; } #home .fourcol .col a .largetext, #home .fourcol .col a:visited .largetext { color:#47782b; font-size:1.1em; font-weight:bold; margin:0 0 3px; padding:0; display:block; } #home .fourcol .col a:hover .largetext, #home .fourcol .col a:focus .largetext, #home .fourcol .col a:active .largetext { } #home .fourcol .col p.readmore, #home .fourcol .col:visited p.readmore { color:#22619b; position:absolute; bottom:12px; left:108px; margin:0; } #home .fourcol .col:active p.readmore, #home .fourcol .col:focus p.readmore, #home .fourcol .col:hover p.readmore { bottom:11px; left:109px; } #home .fourcol .col .roundedcorner { position:absolute; top:-1px; left:-1px; z-index:1; display:block; width:39px; height:40px; background:url(/templatefiles/roundedcorner-border.png) no-repeat; } #home .fourcol .col:hover .roundedcorner, #home .fourcol .col:focus .roundedcorner, #home .fourcol .col:active .roundedcorner { position:absolute; top:0; left:0; z-index:1; display:block; width:39px; height:40px; background:url(/templatefiles/roundedcorner.png) no-repeat; } #home .fourcol .col img { position:absolute; left:0px; top:0px; } #home .fourcol .col:hover img, #home .fourcol .col:focus img, #home .fourcol .col:active img { position:absolute; left:1px; top:1px; } #home .fourcol .casestudy { position:relative; width:222px; height:115px; } #home #banner { position:relative; text-align:left; } #home #banner .bannerimage { margin-left:331px; } #home #banner #submenu { width:331px; float:left; } #home #banner #submenu ul { margin:0; padding:0; } #home #banner #submenu ul li { margin:0; padding:0; border-bottom:1px solid #6DB743; list-style-type:none; overflow:hidden; } #home #banner #submenu ul li h2 { font-size:1.5em; color:#47782B; font-weight:normal; margin:0; padding:0; } #home #banner #submenu ul li a, #home #banner #submenu ul li a:visited { color:#47782B; margin:0; padding:16px 15px; display:block; height:73px; position:relative; } #home #banner #submenu ul li a:hover, #home #banner #submenu ul li a:active, #home #banner #submenu ul li a:focus { background:#DFEE96; } #home #banner #submenu ul li:nth-child(3) { border-bottom:0; } #home #banner #submenu ul li:nth-child(3) a { height:72px; } #home #banner #submenu .readmore { color:#005293; position:absolute; left:15px; bottom:15px; } #home #footer-left { width: 206px; } #home #footer-right { width: 693px; }