/** ---------------------------- * Version: 1.0 * * Table of Contents * ================= * 1. Common Styling * 2. Header Styling * 3. Content/Main Styling * 4. Content/Modules Styling * 5. Navigation Styling * 6. Footer Styling * * -----------------------------/ /** * 1. Common Styling * ================= */ body {background: #EDF0F2; font: 0.78em/1.333 Verdana, sans-serif; margin: 0; padding: 0; width: 100%; text-align: center; padding-bottom: 10px} #container{ width: 760px; padding: 0 2px; margin: 3px auto 0 auto; text-align: left; position: relative; padding-top: 165px; border: 1px solid #D5D8D9; border-width: 1px 0; background-color: #fff; background-image: url(../Images/css_content_container_bg_AClightgrey_tcm19-15581.GIF); background-repeat: repeat-y; background-position: left top; } /* main size: 58em: max width on a 800x600 screen */ * {font-size: 100%; padding: 0; margin: 0} /* -- clear stuff -- */ div, ul, ol, li, table, td, th, tr, p, blockquote, form, img, dl, dt, dd{margin: 0; padding: 0; border: none} table{font-size: 90%} /* -- default links behavior -- */ a:link, a:active, a:visited, a:hover{color: #0099CC} a:hover{text-decoration: none} a:visited{color: #aaa} /* -- Form elements -- */ select{border: 1px solid #7F9DB9; font-size: 90%} option{padding: 0 5px} hr{background: none; height: 0px; border: none; border-bottom: 1px solid #d2d2d2; margin: 3px 20px 10px 10px; clear: both} .left{float: left !important} .right{float: right !important} .regform{margin: 5px 0px 2px 0px;} /* -- to clear floated elements -- */ /* from http://www.positioniseverything.net/easyclearing.html */ .clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden} .clearfix {display: inline-table;} /* Hides from IE-mac \*/ * html .clearfix {height: 1%;} .clearfix {display: block;} /* End hide from IE-mac */ /** * 2. Header Styling * ================= */ #header{background: #fff; width: 758px; position: absolute; top: 0; left: 3px; padding: 0; margin: 0; padding-top: 28px; /* tmp */ height: 134px;} .headeraclink{width: 758px;} .headerbanner{width: 758px; height: 102px; padding-left: 0px; background-image:url(../Images/common/header-banner.jpg)} #homeheaderlink {position:absolute; top:28px;} #logoholder{height: 40px; width: 720px; position: relative; left: 20px; top:35px;} #aclogo {height: 33px; width: 69px; float:left;} #distlogo {height: 40px; width: 143px; float:right;} #nitrogenlogo {height: 54px; width: 143px; float:right; margin-top:-9px;} /* -- site title -- */ #header h1{color: #6e6e78; position: absolute; top: 8px; left: 20px; font-size: 80%; font-weight: normal} #header a{color: #0099cc; text-decoration: none} #header a:hover{text-decoration: none; color: #000} #header #logoimage{display: none} /* -- Quick Links (header drop downs) -- */ #quick-links{position: absolute; top: 70px; right: 20px; width: 400px} #quick-links select{border: 1px solid #7F9DB9; background: #fff} #quick-links option{padding: 0 5px} #quick-links form{float: right} /* -- site links (top right) -- */ #site-links{position: absolute; top: 0px; right: 10px; width: 350px; text-align: right; vertical-align: top; white-space: nowrap} #site-links a{color: #0099cc; font-size: 80%; padding-right: 5px; text-decoration: none} #site-links a:hover{color: #000} #site-links img{margin-top: 3px; margin-left: 2px} #site-links p{position: absolute; top: 0px; right: 11em; padding: 0; margin: 0; margin-top: 5px; color: #6e6e78} #site-links p span{margin-right: 5px; color: #6e6e78} #site-links p span, #lang-popup span, #country-popup span{text-decoration: none; cursor: pointer;} #site-links p span:hover, #lang-popup span:hover, #country-popup span{text-decoration: none; color: #000} #site-links p noscript span{text-decoration: none} * html #site-links p span, * html #lang-popup span, * html #country-popup span{cursor: hand} /* -- for design purposes only: this element creates the intersection between the header and the content part of the page -- */ #intersection{position: absolute; top: 160px; left: 0px; height: 3px; background: #EDF0F2; width: 764px; border: 1px solid #D2D2D2; border-width: 1px 0} /* -- Language & country pop-up -- */ #lang-popup, #country-popup{width: 760px; height:107px; position: absolute; top: 0; left: 1px; background: #0099CC; color: #fff; z-index: 300000} #lang-popup select, #country-popup select{background: #fff} #lang-popup div, #country-popup div{height: 80px; width: 150px; border-right: 1px solid #fff; margin: 10px; float: left} #lang-popup div#lang-language, #country-popup div#country-language{border: none; width: 530px; position: relative} #lang-popup a, #country-popup a{color: #fff} /*#lang-popup .input-submit{margin-bottom: 10px; margin-top: 10px; cursor: pointer;}*/ #lang-popup #lang-language #lang-select, #country-popup #country-language #lang-select{position: absolute; top: 0; left: 10px; margin-left: 0} #lang-popup #lang-language label, #country-popup #country-language label{position: absolute; top: 30px; left: 10px; margin-left: 0 !important} #lang-popup #lang-language label input, #country-popup #country-language label input{margin-top: 1px;} #lang-popup #lang-language #popup-submit, #country-popup #country-language #popup-submit{position: absolute; top: 60px; left: 10px; height: auto; cursor: pointer;} #lang-popup #lang-language #close-popup, #country-popup #country-language #close-popup{position: absolute; top: 0; right: 10px} /** * 3. Content/Main Styling * ======================= */ #content-container{width: 759px} #content .geheel p{text-align: left; margin-right: 0px !important} /* -- two cols LEFT -- */ #two-col-subnav #content{width: 607px; float: right} #two-col-subnav #main{width: 597px; float: left; overflow: hidden} #two-col-subnav #sub-nav{width: 149px; float: left; padding-left: 2px; overflow: hidden;} /* -- two cols RIGHT -- */ #two-col-modules #content-container{width: 758px; margin-left: 1px; background: #fff} #two-col-modules #main{width: 551px; float: left} #two-col-modules #modules{width: 185px; float: right; padding-top: 35px} /* -- three cols -- */ #three-col #content{width: 607px; float: right} #three-col #main{width: 410px; float: left; overflow: hidden} #three-col #sub-nav{width: 149px; float: left; padding-left: 2px} #three-col #modules{width: 185px; float: right; padding-top: 62px} /* -- Crumb-trail -- */ #crumb-trail{width: 100%; color: #0099CC; font-size: 80%; margin-top: 10px; letter-spacing: 0; font-family: arial} #main #crumb-trail p{padding: 0; margin: 0; margin-left: 10px; width: 385px} #main .dont-show-page-actions p{width: 570px !important} #crumb-trail a{color: #0099CC} #crumb-trail .crumbtrailactive{color: #d2d2d2; text-decoration: none} #crumb-trail a:hover{text-decoration: none} /* how to use: * to show/not show the page-actions set the class .show-page-actions/.dont-show-page-action on the #crumb-trail div */ /* -- Page actions -- */ .dont-show-page-actions p.page-actions{display: none} .show-page-action p.page-actions{display: block} #main #crumb-trail p.page-actions{position: absolute; top: 174px; right: 10px; z-index: 2000; width: 180px; text-align: left} a.print, a.send-to-friend{background: url(../Images/css_print_icon_tcm19-240.gif) no-repeat 95% 95%; padding-right: 18px} a.send-to-friend{background: url(../Images/css_mail_icon_tcm19-239.gif) no-repeat 97% 40%; margin-right: 5px; padding-right: 24px} /* == general == */ #main h1, #main h2, #main h3, #main p, #main ul, #main table, #main ol, #main dl, #main blockquote{margin: 0 10px} #main h1, #main h2, #main h3{clear: left} #main {padding-bottom: 2em; padding-left: 10px} #main h1{font-size : 130%; font-weight: bold; margin: 5px 10px; width: auto; clear: left; font-family: Arial, sans-serif} #main h2{font-size : 120%; width: auto; background: url() no-repeat right bottom; margin: 10px} #main h3{font-size: 105%; font-weight: bold;} /* #main ul, main #ol{margin: 1em 2em 1em 3em;} */ #main p{margin: 1em 10px; padding-left: 20px; padding-right: 20px} #main .header-image{margin: 10px 0} #main .para-list-bularrow{display: block} #main .para-list-bularrow p{margin: 1em 10px; padding-left: 20px; padding-right: 20px} #main .para-list-bularrow ul{list-style-image: url(../Images/css_modules_li_icon_tcm19-252.gif); margin-left: 45px;} #main div.para-list-bulnumber{display: block} #main div.para-list-bulnumber p{margin: 1em 10px; padding-left: 20px; padding-right: 20px} #main div.para-list-bulnumber ol{margin-left: 52px;} /* -- content images: must have fixed width -- */ .content-image{background: #d2d2d2 url(../Images/css_round_generic_top_tcm19-242.gif) no-repeat top left; float: left; margin-top: 4px; margin-right: 20px; margin-bottom: 10px; } /*.content-image a{margin-left: 20px;}*/ .content-image b{display: block; width: 170px; background: url(../Images/css_round_generic_tcm19-241.gif) no-repeat top left; height: 9px} .content-image img{margin-left: 10px; margin-top: 9px; background: inherit} .content-image-right250{background: #d2d2d2 url(../Images/css_round_generic_top_250.gif) no-repeat top left; float: right; margin-top: 4px; margin-left: 20px; margin-bottom: 10px; } .content-image-right250 b{display: block; width: 250px; background: url(../Images/css_round_generic_250.gif) no-repeat top left; height: 9px} .content-image-right250 img{margin-left: 10px; margin-top: 9px; background: inherit} .geheel .right{margin-left: 15px} #main p.content-image{float:left;} /* -- page intro -- */ #main p.intro{font-weight: bold; border-left: 10px solid #d2d2d2; padding-left: 10px; clear: left; font-family: Arial, sans-serif; letter-spacing: 1px} #main p.intronobar{margin-left: 20px; font-weight: bold; padding-left: 10px; clear: left; font-family: Arial, sans-serif; letter-spacing: 1px} #main p.intro-uppercase{font-weight: bold; text-transform:uppercase; border-left: 10px solid #d2d2d2; padding-left: 10px; clear: left; font-family: Arial, sans-serif; letter-spacing: 1px} /* -- page/publish information -- */ #main p.publish-date span, #main p.publish-date-alternate span{background: url(../Images/css_publish_icon_tcm19-236.gif) no-repeat 0% 0%; color: #6e6e78; font-size: 80%; padding-left: 20px; font-family: Arial, sans-serif;} #main p.publish-date-alternate {margin-left: 0px} #main p.publish-date-alternate span {margin-left: -10px} /* -- component bottom-border -- */ #main p.last, #footer p.last{background: url(../Images/css_content_border_bottom_tcm19-237.gif) no-repeat left top; width: auto; height: 16px; clear: both} #footer p.last{margin-left: 20px;} #two-col-modules #main p.last{background-position: -40px top} #three-col #main p.last{background-position: -181px top} /* -- related links/documents -- */ /*#main ul.links{list-style-image: url(/ukus/Images/css_link_icon_tcm19-235.gif); margin-left: 27px; list-style-position: inside; padding-left: 0px; text-indent: -5px}*/ /*#main ul.links{list-style-type: disc; list-style: url(/ukus/Images/css_link_icon_tcm19-235.gif) inside;}*/ #main ul.links{list-style-image: none; list-style-type: none; margin-left: 30px; clear: both} /*#main ul.links a{text-decoration: none;} #main ul.links span.image{padding-left: 20px; background: url(/ukus/Images/css_link_icon_tcm19-235.gif) no-repeat top left;}*/ #main ul.links li{margin-bottom: 0 !important;} #main ul.links a{text-decoration: none; padding-left: 20px; background: url(../Images/css_link_icon_tcm19-235.gif) no-repeat 0% 3px; } #main ul.links a span{color: #000; text-decoration: none} #main ul.links a strong{font-weight: normal; color: #0099CC; text-decoration: none; border-bottom: 1px solid #0099CC} #main ul.links a:hover strong{border-bottom: none} /* == Word List (glassary) page == */ .helpwordlist dt{font-weight: bold; margin-left: 15px;} .helpwordlist dd{margin-left: 25px; margin-right: 10px; margin-bottom: 10px} #main .helpwordlist h1{clear: both; font-size: 100%; width: auto; margin-left: 13px; padding-top: 4px; padding-left: 2px; background: url(../Images/css_help_title_bg_tcm19-233.gif) no-repeat left top; color: #fff; font-size: 80%; height: 20px} .top{width: auto; text-align: right; padding-right: 20px; font-size: 80%} .top a{background: url(../Images/css_top_link_tcm19-234.gif) no-repeat right top; padding-right: 20px} .helpindex{/*background: url(/ukus/Images/css_helpindex_bg_tcm19-232.gif) no-repeat left top;*/ width: auto; margin: 0; padding: 0; height: 25px; padding: 5px 0} .two-lines{width: 95%; margin-bottom: 20px}/* display wordlist icons on two rows */ #main .helpindex p{margin: 0; padding: 0; margin-left: 10px} .helpindex a, .helpindex span{padding: 0; margin: 0; background: url(../Images/css_gloss_off_tcm19-257.gif) no-repeat left top; width: 20px; height: 20px; display: block; float: left; text-align: center; font-weight: bold; margin-right: 1px; color: #fff !important} .helpindex span{background: url(../Images/css_gloss_on_tcm19-256.gif) no-repeat left top} /* -- contact page -- */ #main .contact-item{clear: both; margin: 0 20px 10px 30px; width: 520px;} #main .contact-item-image{float: left;} #main .contact-item-text-container{float: right;width: 420px; } #main .contact-item-text-container h2{font-size: 100%; margin: 0px; } #main .contact-item-text-container h3{font-size: 100%; color: #000000; margin: 0px; } #main .contact-item-info-general{font-size: 11px; float: left; width: 80%; margin-top: 10px; overflow: hidden; } #main .contact-item-info-general p{margin: 0px; padding: 0px;} #main .contact-item-info-detail{float: left; width: 250px; padding-right: 20px; margin-top: 5px; margin-bottom: 15px} #main .contact-item-info-detail ul{font-size: 11px; margin: 0; list-style-image: none} #main .contact-item-info-detail li{list-style-type: none; width: 100%; margin-bottom: 2px; background: none; white-space: nowrap} #main .contact-item-info-detail li img{display: block; float: left; margin-right: 4px} /* -- contact info page -- */ #main #contact-info-form input, #main #contact-info-form select{margin-left: 10px} #main .contact-component{float: left; width: 250px; padding-right: 20px; margin-top: 5px; margin-bottom: 15px} #main .contact-component h3{color: #000} #main .contact-component p{padding-left: 0} #main .contact-component ul{font-size: 11px; margin: 0; margin-left: 10px; list-style-image: none} /* MAE removed float: left */ /* #main .contact-component li{list-style-type: none; float: left; width: 120px; margin-bottom: 2px; background: none; white-space: nowrap} */ #main .contact-component li{list-style-type: none; width: 100%; margin-bottom: 2px; background: none; white-space: nowrap} /* END MAE */ #main .contact-component li img{display: block; float: left; margin-right: 4px} #main .left-border{padding-left: 10px; width: 250px; border-left: 1px solid #d2d2d2} /* -- Overview page (alternate = aligned with grey intro bar)-- */ #main .overview-item-bordertop, #main .overview-item-bordertop-alternate{border-top: 1px solid #d2d2d2; padding-bottom: 10px; margin-bottom: 10px; padding-top: 20px; margin-right: 15px;} #main .overview-item, #main .overview-item-alternate{border-bottom: 1px solid #d2d2d2; padding-bottom: 10px; margin-bottom: 10px; margin-left: 30px; margin-right: 15px; padding-left: 0} #main .overview-item-alternate{margin-left: 10px; } #main .overview-item.last-item, #main .overview-item-alternate.last-item{border-bottom: none;} .overview-item img, .overview-item-alternate img{float: left; margin-right: 5px; margin-bottom: 5px} .overview-item .more, .overview-item-alternate .more{display: block; clear: both; margin: 0} .overview-item-bullet{background: url(../Images/css_navigation_sub_element_tcm19-231.gif) no-repeat 50px 4px; background-color: #fff;margin: 7px -1px; padding-left: 40px} /* -- FAQ -- */ #main ul{list-style-image: url(../Images/css_modules_li_icon_tcm19-252.gif); margin-left: 45px} #main ol{margin-left: 52px} /* -- Modules in standard page -- */ #two-col-subnav #modules{float: right; padding-top: 4px; padding-left: 10px; height: 100%} #two-col-subnav #modules div{margin-right: 20px;} /* -- Content Forms -- */ .input-txt, .input-submit, label, .input-select{display: block !important; margin-bottom: 5px; margin-left: 30px; border: 1px solid #879DAB} label{border: none} .input-submit{margin-bottom: 10px} .jobs-submit, .language-submit{width: 100px;} .input-chkbx{float: left; margin-top: 3px; margin-right: 10px} p.error{color: red;} textarea.content-textarea{width: 350px; height: 100px; font-size: 120%; margin-left: 30px;} input.content-submit-button{width: 100px; margin-top: 2px; margin-bottom: 2px; margin-left: 30px} #main table label{display: inline !important; margin-left: 0;} #main table.content-form-container{border-collapse:collapse; margin-left: 27px; margin-right: 27px;background: none; } #main table.content-form-container2{border-collapse:collapse; margin-left: 0px; margin-right: 27px;background: none; } #main table.content-form-container caption{text-align: left; padding-left: 0px; margin-left: 0px;} #main table.content-form-container.full-width, #main table.content-form-container.settings{width: 100%} #main table.content-form-container2.modified-width, #main table.content-form-container.settings{width: 90%} #main table.content-form-container select, #main table.content-form-container input.content-textfield, textarea{border: 1px solid #8A9CB2; padding-left: 5px; font-size: 10px; width: 150px;} #main table.content-form-container select{width: 156px; } #main table.content-form-container input.content-textfield, #main table.content-form-container input.content-submit-buttom{padding-top: 2px; padding-bottom: 2px;} #main table.content-form-container input.content-textfield.full-width{width: 100% !important;} #main table.content-form-container2 input.content-textfield.modified-width{width: 90% !important;} #main table.content-form-container input.content-checkbox, #main table.content-form-container input.content-radio{margin-right: 5px; margin-left: 0px;} #main table.content-form-container input.content-submit-button{margin-left: 0; } #main table.content-form-container input.content-submit-button.textfield-width{width: 160px; } #main table.content-form-container input.content-submit-button.settings{width: 120px; } #main table.content-form-container th{font-weight: normal; padding: 3px; margin: 0; width: 150px; text-align: left;} #main table.content-form-container2 th{font-weight: normal; padding: 3px; margin: 0; width: 150px; text-align: left;} #main table.content-form-container th.detailed-info{padding-left: 40px;} #main table.content-form-container.settings th{font-weight: bold} #main table.content-form-container.full-width th{width: 180px; text-align: right;} #main table.content-form-container2.modified-width th{width: 180px; text-align: left;} #main table.content-form-container td{text-align: left; vertical-align: bottom; padding: 3px; margin: 0;} #main table.content-form-container2 td{text-align: left; vertical-align: top; padding: 3px; margin: 0;} #main table.content-form-container td.noerror b{display: none;} #main table.content-form-container td.error{padding: 3px 5px;} #main table.content-form-container td.error b{color: red;} #main table.content-form-container textarea{width: 350px; height: 100px; margin-left: 0; font-family: Arial; font-size: 100%;} #main h3.table-header{color: black; padding-left: 27px; margin-left: 0; margin-top: 5px;} #main p.table-footer{font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 10px; margin-bottom: 25px; margin-top: 5px} /* -- Search Forms -- */ #main table.search-form-container{border-collapse:collapse; margin-left: 27px; background: none; } #main table.search-form-container td{text-align: left; padding: 3px; margin: 0; } #main table.search-form-container select, #main table.search-form-container #search-form-searchterm{border: 1px solid #8A9CB2; padding-left: 5px; font-size: 10px;} #main table.search-form-container select{width: 175px;} #main table.search-form-container input{width: 135px;} #main table.search-form-container input.search-form-textfield{padding-top: 2px; padding-bottom: 2px} #main table.search-form-container input.search-form-submit-button{width: 120px; } #main table.search-form-container label{display: block;} #main table.calendar-table-container{width: 96%; margin-left: 10px; border-collapse: collapse; } #main table.calendar-table-container td{padding: 0; margin: 0;} #main table.calendar-table-container span{display: block;} #main table.calendar-table-container span.previous-results{float: left; padding-left: 10px; background: url(../Images/css_search-back_icon_tcm19-259.gif) no-repeat left 2px;} #main table.calendar-table-container span.next-results{float: right; padding-right: 10px; background: url(../Images/css_search-forward_icon_tcm19-253.gif) no-repeat right 2px;} #main table.calendar-table-container th.header-1{background: #d2d2d2;} #main table.calendar-table-container table{border-collapse: collapse; margin: 0; padding: 0} #main table.calendar-table-container table th.header-2{background: #0099CC; text-align: center; color: white; border: 1px solid white;} #main table.calendar-table-container table th.header-3{background: #6e6e78; font-weight: bold; color: white; text-align: center; border: 1px solid white;} #main table.calendar-table-container table td{background: #d2d2d2; padding: 0px 5px; text-align: center; border: 1px solid white; } #main table.calendar-table-container table td.active{background: #0099CC; height: 100%; } #main table.calendar-table-container table td.active a{color: white; width: 100%; display: block; } #main table.calendar-table-container table td.notactive{background: #6e6e78; height: 100%; } #main table.calendar-table-container table td.notactive a{color: white; width: 100%; display: block; } /* -- Search page -- */ .search-nav-top{border-bottom: 1px solid #d2d2d2;} .search-position{padding: 0 15px;} a.search-back{background: url(../Images/css_search-back_icon_tcm19-259.gif) no-repeat left top; text-decoration: none;} a.search-forward{background: url(../Images/css_search-forward_icon_tcm19-253.gif) no-repeat left top; text-decoration: none;} ul.search-results-list li{border-bottom: 1px solid #d2d2d2;} #main .search-item, #main .search-item-highlight{border-bottom: 1px solid #d2d2d2; background: url(../Images/css_search-forward_icon_tcm19-253.gif) no-repeat 20px 11px; padding-bottom: 10px; margin-top: 0px; padding-top: 10px; margin-bottom: 0px; margin-left: 10px; margin-right: 15px; padding-left: 40px} #main .search-item-highlight{background: #d2d2d2 url(../Images/css_search-forward_icon_tcm19-253.gif) no-repeat 20px 11px;} #main .search-item-alternate{border-bottom: 1px solid #d2d2d2; padding-bottom: 10px; margin-bottom: 10px; margin-left: 10px; margin-right: 15px; padding-left: 0px} #main .search-item-alternate input{display: inline !important; margin-left: 20px; margin-right: 10px} #main .search-item-alternate label{display: inline !important; margin: 0;} /* -- Attachments -- */ #main div.attachments-container p.search-item-alternate, #main div.attachments-container br{clear: both;} #main div.attachments-container input{float: left; width: 15px; } #main div.attachments-container label{float: right; width: 92%;} /* -- Settings -- */ #main #settings-preview{margin-left: 30px; margin-right: 30px; } #main #settings-preview h2{margin-left: 0px;} #main #settings-preview p{margin-left: 0px; padding-left: 0; padding-right: 0;} /* -- Job Search -- */ /* MAE */ #job-map{height: 200px; width: 95%; position: relative; margin-left: 30px; background: url('Images/css_map_tcm19-251.jpg') no-repeat} #na, #na-submit, #eu, #eu-submit, #sa, #sa-submit, #ame, #ame-submit, #as, #as-submit{position: absolute; left: 78px; top: 44px;} #na{width: 95px} #na-submit{left: 175px;} #eu{left: 225px; top: 35px; width: 100px} #eu-submit{left: 328px; top: 35px;} #sa{top: 136px; left: 120px; width: 96px} #sa-submit{left: 218px; top: 136px;} #ame{left: 220px; top: 114px} #ame-submit{left: 350px; top: 114px;} #as{left: 373px; top: 96px; width: 90px} #as-submit{left: 465px; top: 96px} /* MAE */ #main p.available-jobs strong{background: #0099CC; color: #fff } /* == lang settings page == */ #main #lang-settings{margin: 50px 15px} #main #lang-settings label{margin: 20px 0} /* == Related info: Grey box with rounded corners -- */ #main div.related-info{margin-left: 25px; width: 375px; background: #d2d2d2 url(../Images/css_rounded_box_tcm19-258.gif) no-repeat 0 -13px; padding-top: 15px} #main div.related-info b{display: block; width: 100%; height: 13px; background: #d2d2d2 url(../Images/css_rounded_box_tcm19-258.gif) no-repeat top left} #main div.related-info p{margin: 0 15px; padding: 0} #main div.related-info ul{list-style: none; list-style-image: none; margin: 0 0 0 15px; } #main div.related-info ul li{padding-top: 2px; padding-bottom: 2px; font-size: 11px;} #main div.related-info ul li img{float: left; padding-top: 2px; margin-right: 6px} /* Replaced by HC 17/10/06 */ /* #main .content-table{margin: 5px 29px; border: none; border-collapse: collapse; background: #d2d2d2} */ /* Fix for design issue */ #main table.content-table{width: 88%; margin: 5px 25px 5px 29px; border: none; border-collapse: collapse; background: #d2d2d2;} #main .content-table td, .content-table th{border: 1px solid #fff; font-weight: normal; padding: 2px 4px} #main .content-table td.link a{color: white;} #main .content-table th{background: #0099CC; color: #fff} #main .content-table th.sub-header{background: #d2d2d2; font-weight: bold; color: #000} #main .content-table a, #main .content-table a:visited{color: #FFF} /* == Sitemap == */ .dtree {color: black; margin-left: 20px} .dtree img {border: 0px;vertical-align: middle;} .dtree .dTreeNode a.node, .dtree dTreeNode a.nodeSel {padding: 1px 2px;} .dtree .clip {overflow: hidden; padding: 0px; } .dtree .clip a{text-decoration: none} .dtree .clip .clip a{text-decoration: underline} .dtree b{font-weight: bold; color: black;} p.sitemap-links{padding-left: 0px !important; margin-left: 17px !important;} a.expand{background: url(../Images/nolines_plus_tcm19-446.gif) no-repeat; padding-left: 15px; margin-left: 0; } a.collapse{background: url(../Images/nolines_minus_tcm19-445.gif) no-repeat; padding-left: 15px; margin-left: 10px; } /* MAE */ #main .content-table{width: 90%} * html #main .content-table{width: 88%} #two-col-subnav #main .content-table{width: 549px} /* MAE */ /* BAD CODE (TABLE IN P)*/ p.badcode span{width: 600px; float: left; margin-left: -27px;} *html p.badcode span{width: auto; margin-left: -8px;} /** * 4. Content/Modules Styling * =========================== */ #modules{padding-top: 35px; margin-bottom: 20px; padding: 0} #modules div{ width: 170px; margin-bottom: 10px; background-color: #fff; background-image: url(../Images/css_round_mid_grey_tcm19-247.gif); background-repeat: repeat-y; background-position: left top; } #modules div.stock-info{background-image:url(../Images/css_round_mid_blue_tcm19-246.gif)} #modules div b{display: block; width: 100%; height: 10px; background: url(../Images/css_round_bot_grey_tcm19-244.gif) no-repeat bottom left} #modules div.stock-info b{background-image: url(../Images/css_round_bot_blue_tcm19-245.gif)} /* fixed header - start */ /* #modules div.news h2, #modules div.actions h2, #modules div.stock-info h2{background: url(/ukus/Images/css_round_top_news_tcm19-250.gif) no-repeat top left; color: black; margin: 0; padding: 0; height: 49px; padding: 3px 40px 2px 8px; width: 122px !important; width :170px ; Box model hack } #modules div.actions h2{background-image: url(/ukus/Images/css_round_top_hand_tcm19-249.gif); height: 30px} #modules div.stock-info h2{background-image: url(/ukus/Images/css_round_top_blue_tcm19-248.gif); height: 30px} */ /* fixed header - stop */ /* dynamic header - start */ #modules div span.header-top, #modules div span.header-bottom, #modules div h2 b{display: block; margin-top: 0px; } #modules div.news span.header-top{padding: 0; background: url(../Images/css_news-top_tcm19-500.gif); width: 170px; height: 8px;} #modules div.advice span.header-top{padding: 0; background: url(../Images/css_news-top_tcm19-500.gif); width: 170px; height: 8px;} #modules div.actions span.header-top{padding-right: 25px; padding-left: 0px; background: url(../Images/css_news-top_tcm19-500.gif) no-repeat; width: 145px; height: 8px;} #modules div.stock-info span.header-top{padding: 0; background: url(../Images/css_stock-top_tcm19-502.gif); width: 170px; height: 8px;} #modules div.news h2, #modules div.advice h2, #modules div.actions h2{padding: 0; margin: 0; background: #d2d2d2} #modules div.stock-info h2 {background: #0099cc;} #modules div.news h2, #modules div.advice h2, #modules div.actions h2, #modules div.stock-info h2{padding-left: 10px; padding-bottom: 3px} #modules div.news h2 b, #modules div.advice h2 b, #modules div.actions h2 b, #modules div.stock-info h2 b{width: 125px; padding-right: 35px;} /* min-height for understanding browsers */ #modules div.news h2 b, #modules div.advice h2 b, #modules div.actions h2 b, #modules div.stock-info h2 b{min-height:27px; height:auto;} /* for Internet Explorer */ /*\*/ * html #modules div.news h2 b, * html #modules div.advice h2 b, * html #modules div.actions h2 b, * html #modules div.stock-info h2 b {height: 27px;} /**/ #modules div.news h2 b{font-size: 120%; background: url(../Images/css_news-logo_tcm19-498.gif) no-repeat 95% top;} #modules div.advice h2 b{font-size: 120%; background: url(../Images/advice-icon.gif) no-repeat 95% top;} #modules div.actions h2 b{font-size: 120%; background: url(../Images/css_actions-logo_tcm19-501.gif) no-repeat 95% top;} #modules div.stock-info h2 b{background: url(../Images/css_stock-logo_tcm19-504.gif) no-repeat 95% top;} #modules div.news h2 b.hide-image, #modules div.advice h2 b.hide-image, #modules div.actions h2 b.hide-image, #modules div.stock-info h2 b.hide-image{background: none; padding-right: 10px} #modules div.news span.header-bottom, #modules div.advice span.header-bottom, #modules div.actions span.header-bottom{background: url(../Images/css_news-bottom_tcm19-499.gif) no-repeat left bottom; width: 170px; height: 9px;} #modules div.stock-info span.header-bottom{background: url(../Images/css_stock-bottom_tcm19-503.gif) no-repeat left bottom; width: 170px; height: 9px;} /* dynamic header - stop */ /* these font-sizes in combination with 120% font-size above is the only rule that is opera friendly */ #modules div.news h2 {font-size: 10px; } #modules div.advice h2 {font-size: 10px; } #modules div.actions h2 {font-size: 10px; } #modules div.stock-info h2 {font-size: 100%} /* end opera friendly fonts */ #modules ul{margin: 10px;} #modules li{list-style-image: url(../Images/css_modules_li_icon_tcm19-252.gif); margin-left: 18px} #modules li.up{list-style-image: url(../Images/css_li_up_tcm19-254.gif); padding: 3px; clear: both} #modules li.down{list-style-image: url(../Images/css_li_down_tcm19-255.gif); padding: 3px; clear: both} #modules li.even{border-top: 1px solid #d2d2d2} #modules li.even-alternate{border-top: 2px solid #ccc} #modules div.stock-info strong{background: #0099CC; color: #fff; display: block; float: right; padding: 2px 5px; margin-bottom: 3px; font-weight: normal} .more{margin-left: 13px; color: #0099CC} .more:hover, .more:visited{color: #0099CC} .more{background: url(../Images/css_modules_li_icon_tcm19-252.gif) no-repeat 3px; padding-left: 15px} /* MAE & BCZ */ #modules div.stock-info h2{color: #FFF} #modules div.stock-info ul li, #modules div.stock-info p, #modules div.news, #modules div.advice, #modules div.actions{color: #6e6e78; font-size: 80%} #modules div.stock-info p{margin-left: 20px; padding-bottom: 10px;} #modules div.stock-info p.up{margin-left: 0px; margin-right: 10px; padding-left: 10px; margin-bottom: 2px; padding-bottom: 0px; background: url(../Images/css_li_up_tcm19-254.gif) no-repeat 0px bottom;} #modules div.stock-info p.down{margin-left: 0px; margin-right: 10px; padding-left: 10px; padding-top: 2px; padding-bottom: 0px; background: url(../Images/css_li_down_tcm19-255.gif) no-repeat 0px bottom;} #modules div.stock-info table.stock-info-container{border-collapse: collapse; width: 145px; margin-left: 10px;} #modules div.stock-info table.stock-info-container td{margin-left: 0px !important; } #modules div.stock-info table.stock-info-container td.stock-price{vertical-align: bottom; font-size: 10px} #modules div.stock-info table.stock-info-container td.stock-price strong{background: #0199CA; color: #fff;} #modules div.stock-info table.stock-info-container tr.separator td{border-top: 2px solid #ccc;} #modules div.stock-info table.stock-info-container a{padding-left: 10px; background: url(../Images/css_modules_li_icon_tcm19-252.gif) no-repeat 2px} /* MAE & BCZ */ /** * 5. Navigation Styling * ====================== */ /* -- skip links -- * Technique works visibly in IE, FF and Safari * Opera not visible but links are selected using the A key */ .skiplist {margin: 0; padding: 0; list-style: none; } .skip {margin: 0; padding: 0; position: absolute; top: 5px; left: 10em; z-index: 1; width: 25em } .skip a {display: block; text-decoration:none; left: -700em; overflow: hidden; position: absolute;} .skip a:focus, .skip a:active {height: auto; width: auto; left: 120px; overflow: visible; color: #666; border: 3px solid white; font-size: 80%; background: #fff; position: absolute;} .skip a:hover {cursor: default;} /* -- main (top) navigation -- */ #nav{font-family: Arial, sans-serif; font-size: 11px; width: 758px; height: 30px; position: absolute; top: 126px; left: 3px; color: #6e6e78; font-weight: bold} #nav ul{clear: left} #nav li{display: block; list-style-type: none; float: left; padding: 0; padding-right: 2px; } #nav li a{color: #6e6e78; text-decoration: none; display:block; float:left; font-weight:bold; text-align: center; padding: 0 10px; margin-top: 6px; height: 1.5em; border-right: 1px solid #666; letter-spacing: 1px} #nav li { list-style-image: url(../Images/css_modules_li_icon_tcm19-252.gif); margin-top:4px; margin-bottom:4px; } #nav li a:hover{color: #000} #nav li a.hide-separator-image:hover{color: white; background: #911; } #nav li form{margin-top: 4px; margin-left: 10px} #nav li.current{background: url(../Images/css_nav_current_icon_tcm19-238.gif) no-repeat left 10px} #nav li.currentcontacton{background: url(../Images/css_nav_current_icon_tcm19-238.gif) no-repeat left 10px} #nav li.currentcontacton a {border-right:none;} #nav li.currentcontactoff{} #nav li.currentcontactoff a {border-right:none;} /* -- sub (left) navigation -- */ #sub-nav ul{list-style-type: none; margin-top: 20px; width: auto} #sub-nav ul ul{margin: 0; margin-top: 0; width: auto} #sub-nav li{background: url(../Images/css_navigation_sub_element_tcm19-231.gif) no-repeat 7px 4px; margin: 7px 0; padding-left: 18px} #sub-nav li li{margin: 0; padding: 0; background: none; margin: 1px 0} #sub-nav li.firstnav{background: url(../Images/css_nav_current_icon_tcm19-238.gif) no-repeat 7px 4px; background-color: #fff;margin: 7px -1px; padding-left: 20px} #sub-nav li a{color: #000; text-decoration: none; font-weight: bold; font-size: 90%} #sub-nav li li a{font-weight: normal} #sub-nav a{display: block} * html #sub-nav a{height: 1px; width: 100%} #sub-nav li.sel{background-color: #fff} #sub-nav li a:hover, #sub-nav li.sel a, #sub-nav li.firstnav a{color: #0099CC} #sub-nav li.firstnav li a, #sub-nav li.sel li a{color: #000; padding-left: 10px; width: 120px; border-top: 1px solid #d2d2d2} #sub-nav li.firstnav li.sel a, #sub-nav li.sel li.sel a{color: #0099CC;} #sub-nav li.firstnav li.sel, #sub-nav li.firstnav li.sel a, #sub-nav li.firstnav li a:hover, #sub-nav li.firstnav li.sel a:hover{color: #0099CC; background: url(../Images/css_navigation_sub_element_tcm19-231.gif) no-repeat 0px 5px} #sub-nav li.sel li.sel, #sub-nav li.sel li.sel a, #sub-nav li.sel li a:hover, #sub-nav li.sel li.sel a:hover{color: #0099CC; background: url(../Images/css_navigation_sub_element_tcm19-231.gif) no-repeat 0px 5px} #sub-nav li.firstnav li a:hover, #sub-nav li.sel li a:hover{color: #000} /** * 6. Footer Styling * ================= */ #footer{width: 605px; text-align: center; clear: both; background: #fff; font-size: 80%; font-family: Arial, sans-serif;} #footer p{margin-left: 15px; margin-bottom: 5px; margin-right: 15px;} #footer-print{display: none} /** * 7. Rounded Corners * ================= */ .round-tl {background: url(../Images/round_tl_tcm19-5060.gif) top left no-repeat;} .round-tr {background: url(../Images/round_tr_tcm19-5061.gif) top right no-repeat;} .round-bl {background: url(../Images/round_bl_tcm19-5058.gif) bottom left no-repeat;} .round-br {background: url(../Images/round_br_tcm19-5059.gif) bottom right no-repeat;} #main OL {list-style-position: inside; } div.geheel {clear: both; margin: 0; padding: 0; } .divproductmaster { margin-top:20px; margin-left:10px; padding-top:5px; padding-bottom:10px; padding-right:10px; border-bottom:solid 1px #D2D2D2; height:200px; } .divproductmaster-nolist { margin-top:20px; margin-left:10px; padding-top:5px; padding-bottom:10px; padding-right:10px; border-bottom:solid 1px #D2D2D2; height:150px; } .divprodtitle { /*text-transform:uppercase*/ font-weight:bold; padding-left:15px; margin-bottom:7px; } .divprodimage { float:left; width:170px; padding-top:15px; padding-left:30px; } .divproddesc { float:left; padding-top:15px; } .prodbullist { list-style-image: url(../Images/css_modules_li_icon_tcm19-252.gif); margin-top:4px; margin-bottom:4px; } /*Start of Contact page Styles*/ .pnlemailformpre { display: block; height: 390px; width: 400px; margin-right: auto; margin-left: auto; padding-top: 10px; } .emailformlabelholder { display: block; height: 30px; width: 120px; float: left; margin-left: 10px; font-size: 0.9em; text-align: right; line-height: 2; } .emailformelementholder { display: block; height: 30px; width: 250px; float: left; margin-left: 5px; } .emailformlabelholderlarge { display: block; height: 100px; width: 120px; float: left; margin-left: 10px; font-size: 0.9em; text-align: right; line-height: 2; } .emailformelementholderlarge { display: block; height: 100px; width: 250px; float: left; margin-left: 5px; } .txtName { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtEmail { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtTel { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtAddress1 { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtAddress2 { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtAddress3 { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtAddress4 { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtPostcode { font-family: Arial, Helvetica, sans-serif; width: 175px; font-size: 1em; } .txtEnquiry { font-family: Arial, Helvetica, sans-serif; width: 225px; height: 100px; font-size: 1em; } .emailformbtnmaster { display: block; height: 30px; width: 300px; margin-left: auto; margin-right: auto; float: left; margin-top: 15px; } .emailformbtnholder { display: block; height: 30px; width: 75px; margin-left: auto; margin-right: auto; } .emailbtn { font-family: Arial, Helvetica, sans-serif; font-size: 1em; margin-left: 5px; } #contactuscopy { font-size: 1.1em; display: block; margin-top: 10px; margin-left: 90px; } .pnlemailformpost { text-align: center; display: block; height: 50px; width: 300px; margin-right: auto; margin-left: auto; padding-top: 25px; font-size: 1em; } #contactinfo { text-align: center; line-height: 0.4em; margin-top: 30px; margin-bottom: 30px; margin-left: 20px; border-top: 1px; border-top-style: solid; border-top-color: #D2D2D2; padding-top: 10px; border-bottom: 1px; border-bottom-style: solid; border-bottom-color: #D2D2D2; padding-bottom: 10px; } #divcompairlist { display:block; margin-left:193px; } .pad-left27 { padding-left:27px; } .homebannerlogo { margin-left: 15px; margin-top: 15px; } .tblusedequipment { padding-left:20px; } .tblusedequipment .row { height:25px; } .tblusedequipment .altrow { background-color:#EFEFEF; height:25px; } #contactinfo { text-align: center; line-height: 1.5em; margin-top: 30px; margin-bottom: 30px; margin-left: 20px; border-top: 1px; border-top-style: solid; border-top-color: #D2D2D2; padding-top: 10px; border-bottom: 1px; border-bottom-style: solid; border-bottom-color: #D2D2D2; padding-bottom: 10px; }