/******************************************************************************* * Base Styles - DON'T CHANGE THESE!!! * * * * These rules are used to reset the CSS default properties so things render * * identically (or as close we we can get them) in different browsers. * *******************************************************************************/ body { margin: 10px; padding: 0; font-size: 0.948em; line-height: 1.22 } h1, h2, h3, h4, h5, h6, p, ul, ol, dl, form, fieldset, table, address, blockquote { margin: 0 0 1.22em 0; padding: 0; } ul ul, ul ol, ol ol, ol ul { margin-bottom: 0 } ul, ol, blockquote { margin-left: 1.75em } blockquote { margin-right: 2.75em } fieldset { padding: 0.5em } table { border-collapse: collapse; border-spacing:0 } th { text-align: left } select,input,textarea { font: inherit } /******************************************************************************* * Page Structure * *******************************************************************************/ body { border-top:5px solid #063452; margin:0;} #container { margin: auto; background:url("images/body-back.png") 50% 164px no-repeat; font-family:"Verdana"; font-size:.87em; line-height:140%} #content { width: 955px; margin:auto; min-height:450px; } #header { background: #fff; margin:auto; padding-bottom:10px; background:url("images/header-bg.png") bottom left repeat-x; padding-top:23px; ;} #navigation { } #footer { background: url("images/footer-back.png") 0 0 repeat-x #083A5B; clear:both; color:#fff; } .footer-links { background:url("images/footer-cta-back.png") 0 0 repeat-x; border-top:5px solid #DADADA; clear:both; } /******************************************************************************* * Common Styles * *******************************************************************************/ .wrap { width: 955px; margin:auto; } #header .wrap { position:relative } #header h1 { margin: 0 } #header a.client-login { position:absolute; top:0; right:0; width:110px; height:36px; background:url("images/login-button.png") 0 0 no-repeat; display:block; text-indent:-100000em; overflow:hidden;} #header .site-search fieldset { border:none; padding:0; position:absolute; top:50px; right:0; } #header .site-search fieldset input { padding:3px; width:300px; color:#333; font-weight:bold; font-size:120%} #header .site-search fieldset input.button { background:url("images/green-button-w.png") 50% 50% no-repeat; width:40px;color:#fff; text-transform:uppercase; border:none; padding:10px; font-size:100%; cursor:pointer} img { border:none; } h1 { font-size:180%; } h2 { font-size:140%; font-weight:normal } h3 { font-size:120%; color:#A8BF0B; margin-bottom:10px; } #related { width:176px; float:left; margin-bottom:20px; } #substance { float:right; width:760px; margin-bottom:20px; } #substance b { color:#063353; } #navigation a.skip { position: absolute; left:-1000em } #navigation ul { list-style: none; margin-left: 0; text-align:right; width: 795px; margin:auto; text-transform:capitalize; padding-left:150px; position:relative; top:-45px; font-size:105% } #navigation li { display: inline; margin-right: 1em } #navigation ul li a { color:#2462AA; text-decoration:none; font-weight:bold; letter-spacing:-.4px } #navigation ul li:last-child { margin:0; } #form-error { border:3px double #900; padding:10px; background:#FBF5F5; margin-bottom:15px;} #substance #form-error h1 { background:none; color:#900; border:0; padding:0;} #substance h1 { background:url("images/h1-back.png") 0 0 repeat-x #A8BF0B; line-height:115%; padding:10px; color:#fff; margin-bottom:15px;} #substance ul { list-style:none; padding:10px 0; margin:0;} #substance ul ul li { margin-left:20px; background:url("images/bc-arrow.png") 0 .3em no-repeat; padding-left:10px;} #substance ul li { background:url("images/selected-bullet.png") 0 .6em no-repeat; font-weight:bold; padding-left:10px;} #substance h2 { color:#2462AA; border-bottom:1px solid #2462AA; padding-bottom:5px; margin-bottom:10px; } #substance ol { margin-left: 2.5em; } #substance form { border:1px solid #CDE054; padding:20px; margin:0; background:#EFF5C8 } #substance fieldset { border:none; padding:0; margin:0; } #substance fieldset dt { margin:0; color:#707F07; font-weight:bold; } #substance fieldset dd { margin:3px 0 3px 0; } #substance fieldset dd * { width:700px; } #substance fieldset dd input { border:1px solid #CDE054} #substance fieldset dd textarea { height:100px;border:1px solid #CDE054 } #substance form div input { background:url("images/blue-grad.png") 0 0 repeat-x #A8BF0B; cursor:pointer; border:none; color:#fff; padding:10px; font-weight:bold;} #related ul { list-style:none; margin:0; } #related div h2 { background:url("images/related-head.png") 0 0 no-repeat; margin:-30px -15px 0 -15px; padding:15px 15px 5px 15px; margin-bottom:5px; color:#2462AA; font-weight:normal} #related div { background:url("images/related-panel-back.png") bottom left no-repeat; padding:30px 15px 30px 15px; margin-bottom:20px; } /* #related ul { border-bottom:1px solid #E9F0B9; _border-bottom:0;} #related ul li { border-top:1px solid #E9F0B9; margin:0 -14px; _border:1px solid #fff;} #related ul li a { display:block; background:url("images/li-bullet.png") 10px .8em no-repeat; padding-left:13px; color:#063353; text-decoration:none; padding:5px 14px 5px 26px; } #related ul li a.active { background:url("images/selected-bullet.png") 10px .8em no-repeat #F4F7DD; font-weight:bold } #related ul li ul { padding:0; margin:0;} #related ul li ul li { border-top:1px solid #E9F0B9; border:none; margin:0; padding:0 0 0 0; _border:1px solid #fff;} #related ul li ul li a { display:block; padding:5px 0; color:#063353; text-decoration:none; background:#A8BF0B; padding-left:10px; color:#fff;} #related ul li ul li a.active { color:#063353; background:#C4DD0D; } #related ul li ul li ul { padding:0; margin:0;} #related ul li ul li ul li { border-top:1px solid #E9F0B9; border:none; margin:0; padding:0 0 0 0; _border:1px solid #fff;} #related ul li ul li ul li a { display:block; padding:5px 0; color:#063353; text-decoration:none; background:#D0E25E; padding-left:20px; color:#333;} #related ul li ul li ul li a.active { background:#F4F7DD;} */ #related .section-navigation ul a, #related .news-articles ul a, #related .news-categories ul a, #related .news-archive-list ul a { color:#666; display:block; padding:5px 10px; border-bottom: 1px solid #E9F0B9; border-top: 1px solid #E9F0B9; font-size:80%; line-height:125%; margin:0 -14px -1px -14px; text-decoration: none } #related .section-navigation ul ul a { padding-left:20px; color:#000; background:url("images/bullet-3rd-level.png") 10px 9px no-repeat } #related .section-navigation ul ul ul a { padding-left:30px; color:#000; background:url("images/bullet-4th-level.png") 20px 9px no-repeat} #related .section-navigation a.active, #related .news-articles a.active, #related .news-categories a.active, #related .news-archive-list a.active { color:#000; background-color:#E9F0B9; } #related .section-navigation a:hover, #related .news-articles a:hover, #related .news-categories a:hover, #related .news-archive-list a:hover { background-color:#C4DD0D; color:#000 } /******************************************************************************* news-articles * *******************************************************************************/ body.home #related .news-articles { background:url("images/news-panel-back.png") bottom left no-repeat #B8D30B; padding:20px; min-height:250px; position:relative} body.home #related .news-articles h2 { background:url("images/news-panel-header-back.png") 0 0 no-repeat #B8D30B; margin:-20px -20px 0 -20px; padding:20px 20px 15px 20px; color:#fff; } body.home #related .news-articles ul { border:none; } body.home #related .news-articles li { border:none; border-bottom:1px solid #fff; padding:5px 0 10px 0; margin:0 0 5px 0; } body.home #related .news-articles li span { display:block; color:#fff; font-weight:bold; } body.home #related .news-articles a { color:#0A3E5F; text-decoration:none; font-weight:bold; display:block; margin-bottom:5px; background:none; border:none; padding:0; margin:0;} body.home #related .news-articles a.feed { width:67px; height:60px; border:0px solid red; display:block; text-indent:-100000em; overflow:hidden; background:url("images/rss-ico.png") 0 0 no-repeat; position:absolute; top:-13px; right:11px; } /******************************************************************************* Quick Links * *******************************************************************************/ body.home #related .quick-links { background:url("images/quick-links-panel.png") bottom left no-repeat #165883; font-size:90%; padding:20px; min-height:250px; position:relative; margin-bottom:20px;} body.home #related .quick-links h2 { background:url("images/quick-links-panel-top.png") 0 0 no-repeat #B8D30B; margin:-20px -20px 0 -20px; padding:20px 20px 15px 20px; color:#fff; } body.home #related .quick-links ul { border:none; } body.home #related .quick-links li { margin-bottom:5px; /*background:url("images/ql-arrow.png") 0 .4em no-repeat; padding-left:25px; */margin:0px 0; border-bottom:1px solid #457C9F; border-top:0; padding:3px 0 3px 2px; position:relative } body.home #related .quick-links li span { display:block; color:#fff; font-weight:bold; } body.home #related .quick-links a { color:#fff; text-decoration:none; font-weight:bold; display:block; margin-bottom:0 0 5px 0; background:none; border:none; padding:0; } /******************************************************************************* Footer CTAS * *******************************************************************************/ .footer-links { position: relative; } .footer-links .wrap ul { list-style:none; margin:0; overflow:hidden; min-height:110px } .footer-links .wrap ul li { height: 90px; position: relative; float:left; border:0px solid red; width:290px; margin:10px 27px 10px 0} .footer-links .wrap ul li.enquiry { background:url("images/enquiry-form-ico.png") 0 5px no-repeat; } .footer-links .wrap ul li.call-me { background:url("images/call-me-ico.png") 0 5px no-repeat; } .footer-links .wrap ul li.knowledge { background:url("images/knowledge-ico.png") 0 5px no-repeat; margin-right:0;} .footer-links .wrap ul li a { padding: 20px 0 20px 90px; position: absolute; top:0; left:0; color:#063353; text-decoration:none; font-size:90% } .footer-links .wrap ul li strong { display:block; color:#1288D8; font-size:140%; margin-bottom:5px} /******************************************************************************* Footer CSS * *******************************************************************************/ #footer ul { list-style: none; margin-left: 0 } #footer li { display: inline; margin-right: 1em } #footer .wrap { background:url("images/footer-wrap.png") 0 0 no-repeat; padding:20px 0 20px 0; } #footer h2 { color:#98BAE9; } #footer address { font-style:normal; width:300px; float:left; } #footer dl { float:left; } #footer dt { margin-bottom:-1.4em; } #footer dd { padding-left:20px; margin-bottom:15px; } #footer a { color:#F1FE4D; text-decoration:none; } #footer .contact-details { width:642px; float:left; } #footer .footer-nav { width:304px; float:right; } #footer .footer-nav li { margin-bottom:3px; background:url("images/ql-arrow.png") 0 .2em no-repeat; padding-left:20px; margin:3px 0; float:left; width:130px; } #footer .footer-nav a { color:#fff } #footer #legal { clear:both; } #footer form { clear:right; } #footer fieldset { border:none; padding:0; clear:left; } #footer fieldset input { padding:3px; width:300px; color:#333; font-weight:bold; font-size:120%} #footer fieldset input.button { background:url("images/green-button.png") 50% 50% no-repeat; width:40px;color:#fff; text-transform:uppercase; border:none; padding:10px; font-size:100%; cursor:pointer} /******************************************************************************* Breadcrumbs * *******************************************************************************/ .breadcrumbs, .paging { background:#EAEAEA; padding:5px 20px; font-size:90%; color:#444; margin-bottom:20px;} .breadcrumbs a { background:url("images/bc-arrow.png") 100% .3em no-repeat; padding-right:15px; color:#666; text-decoration:none; margin-right:5px; } /******************************************************************************* * News Pages * *******************************************************************************/ body #content #article-rating { clear:both; width:100%; margin:0 ; padding:0; float:left; margin:20px 0;} body #content #article-rating h2 { } body #content #article-rating p { float:right; font-size:90%; padding-top:30px; } body #content #article-rating ul { list-style:none; margin:0; float:left; border:none;} body #content #article-rating ul li { margin:0; padding:0; float:left; } body #content #article-rating ul li a { float:left; display:block; width:50px; margin:0; height:50px; text-indent:-10000em; background:url("images/star.png") 0 0 no-repeat #ccc; } body #content #article-rating ul li a.selected { background-color:#B8D30B; } body #content #article-rating em { color:#B8D30B; font-weight:bold; } body #content #social-bookmarks ul { margin:0 0 20px 0} body #content #social-bookmarks ul li { width:121px; float:left; border:0px solid red; min-height:25px; padding:0; } body #content #social-bookmarks ul li a { color:#444; text-decoration:none; } .news-article-comments { clear:both; } /******************************************************************************* * Page Specific Styles * *******************************************************************************/ #substance img { border:none; } #substance img.center { margin:auto; clear:both; display:block; float:none;} #substance img.right { float:right; margin:0 0 15px 15px; clear:right; } #substance img.left { float:left; margin:0 15px 15px 0; clear:left; } body.home #substance { float:left; width:630px; } body.home #related { float:right; width:304px; } /***************** * gallery * *****************/ body #gallery div#images { border: 1px solid #ddd ; list-style: none; margin: 0 auto 10px auto; padding: 20px 30px; overflow: hidden; line-height:0px; } body #gallery div#images img { margin: 0; padding: 0; position: static; float: none; border: none; } body #gallery ul#thumbnails { list-style: none; margin: 10px auto; overflow:auto; } body #gallery ul#thumbnails li { float: left; margin:10px 4px 0 4px; width:78px; height:62px; line-height:62px; border: 1px solid #ccc; padding: 4px; text-align:center; overflow: hidden; cursor: pointer; } body #gallery ul#thumbnails li img { margin: auto; padding: 0; position: static; float: none; border: none; display: inline-block; vertical-align:middle; } body #gallery ul#thumbnails li.active, body #gallery ul#thumbnails li:hover { padding: 3px; border-width:2px; border-color:#8BDEFE } body #gallery ul#thumbnails li { background:none; } /********************* * CSS 3 * *********************/ #substance h1, #footer fieldset input, #header .site-search fieldset input, .breadcrumbs, #substance form div input { -moz-border-radius: 11px 13px; -webkit-border-radius: 11px 13px; border-radius:11px 13px;}