/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Screen.css * Main stylesheet for controling all CSS styles Author * Sam Howat [sam@bluetux.com] - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ @import "_reset.css"; @import "_type.css"; @import "_grid.css"; /* Body - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ body { background-color: #FFF; margin: 0; padding: 0; } /* Main Navigation - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #main-nav { clear: both; width: 850px; height: 30px; } #main-nav ul { background: transparent url('../img/nav-main.jpg') top left no-repeat; position: relative; display: block; float: right; width: 850px; height: 30px; margin: 9px 0px 0 0; padding: 0; } #main-nav li, #main-nav a { display: block; height: 30px; outline: none; } #main-nav li { position: absolute; top: 0px; } #main-nav a { text-indent: -9999px; text-decoration: none; outline: none; } #main-nav #nav-one { left: 56px; width: 61px; } #main-nav #nav-two { left: 117px; width: 118px; } #main-nav #nav-three { left: 235px; width: 114px; } #main-nav #nav-four { left: 349px; width: 151px; } #main-nav #nav-five { left: 500px; width: 111px; } #main-nav #nav-six { left: 611px; width: 79px; } #main-nav #nav-seven { left: 690px; width: 93px; } #main-nav #nav-one a:hover { background: transparent url('../img/nav-main.jpg') -56px -30px no-repeat; } #main-nav #nav-two a:hover { background: transparent url('../img/nav-main.jpg') -117px -30px no-repeat; } #main-nav #nav-three a:hover { background: transparent url('../img/nav-main.jpg') -235px -30px no-repeat; } #main-nav #nav-four a:hover { background: transparent url('../img/nav-main.jpg') -349px -30px no-repeat; } #main-nav #nav-five a:hover { background: transparent url('../img/nav-main.jpg') -500px -30px no-repeat; } #main-nav #nav-six a:hover { background: transparent url('../img/nav-main.jpg') -611px -30px no-repeat; } #main-nav #nav-seven a:hover { background: transparent url('../img/nav-main.jpg') -690px -30px no-repeat; } /* Side Navigation - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #side-nav { margin: 20px 0 0 0; padding: 0 9px; } #side-nav h4 { color: #155839; font-size: 12px; font-weight: bold; margin: 0; padding: 0 0 2px 0; text-transform: uppercase; border-bottom: 1px dotted #c4c4c4; } #side-nav ul { list-style-type: none; margin: 0; padding: 0;} #side-nav li { background: transparent url('../img/check.jpg') 0 6px no-repeat; font-size: 13px; font-weight: bold; padding: 3px 0 3px 21px; margin: 0; border-bottom: 1px dotted #c4c4c4; } #side-nav a:link, #side-nav a:visited { color: #3D8137; } #side-nav a:active, #side-nav a:hover { color: #3D8137; } /* Image Replacement For Headers & Logo - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #header-div h1 a { background: transparent url('../img/logo-olympic-printers-299x100.jpg') no-repeat left top; display: block; float: left; width: 299px; height: 100px; margin: 10px 0 0 0; padding: 0; text-decoration: none; text-indent: -9999px; outline: none; } /* Table Classes - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #info-table { margin-bottom: 13px; border-top:1px solid #D6D0DC; border-left:1px solid #D6D0DC; } #info-table th { background-color: #D6D0DC; color: #404587; font-size: 11px; font-weight: bold; padding: 9px 5px;} #info-table td { padding: 5px; font-size: 11px;} #info-table th, #info-table td { border-bottom:1px solid #D6D0DC; border-right:1px solid #D6D0DC; } #info-table div { float: right; width: 70%; padding: 1px 0 0 0;} #info-table img { float: left; margin: 0; padding: 4px 5px; } #info-table p { margin: 0; padding: 0; font-size: 11px; } #info-table p.prodTitle { color: #155839; font-size: 12px; font-weight: bold; margin: 0; padding: 3px 0 2px 0; text-transform: uppercase;} /* Misc Classes - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .clear { clear: both; } .small { font-size: 10px; margin:0; padding: 0; line-height: 140%; } #footer-div p.border-top { border-top: 1px dotted #c4c4c4; margin: 10px 0 0 0; padding: 5px 0 2px 0;} .side-button-one { padding: 15px 0 2px 0;} .side-button-two { padding: 2px 0;} .side-button-three { padding: 2px 0px 2px 0px;} .float-img-right { float: right; clear: both; margin: 0; padding: 3px; margin: 5px 20px; border: 1px solid #c4c4c4; } .float-img-left { float: left; margin: 0; padding: 2px 5px 2px 2px;} .nofloat-img-right { clear: both; margin: 0; padding: 2px; margin: 0px 0px; border: 1px solid #c4c4c4; } #advert-table img { float: right; clear: both; margin: 0; padding: 10px; } #advert-table p { clear: none; } .staff-name { padding: 5px; border-top: 1px dotted #c4c4c4; clear: both; font-weight: bold; font-size: 12px; text-transform: uppercase; } .staff-name img { float: left; margin: 0; padding: 5px 10px 10px 0px; } /* Quote Classes - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .quote-block { font-family: georgia, 'times new roman', times; font-size: 15px; line-height: 18px; background: white url('../img/quote-left.jpg') top left no-repeat; margin: 0 0 0 5px; padding: 0 0 0 23px; } .quote-close { background: white url('../img/quote-right.jpg') top left no-repeat; width: 18px; height: 12px; display: block; float: right; } .quote-img { padding: 3px 4px 0 4px; } .cite { clear: both; display: block; padding: 15px 0 0 0; font-size: 12px; line-height: 15px; } /* Forms - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ fieldset#upload-forms { width: 95%; margin: 0; padding: 2px; border: 1px solid #c4c4c4; background-color: #F3F3F3; } #upload-forms p { border-top: 0px dotted #FFF; margin: 0; padding: 4px 0 4px 0 ; clear: both; font-size: 11px; } #upload-forms label { float: left; width: 120px; font-weight: bold; text-align: right; margin: 0; padding: 2px 10px 0 0;} #upload-forms label.error { float: none; color: red; padding: 0; margin: 0; } #upload-forms input, #upload-forms select { padding: 0; margin: 0 10px 0 0; } #upload-forms label.warning { color: red; } #upload-forms span { font-size: 10px; line-height: 105%; } .error { color: red; }