* { margin: 0; padding: 0px; }
body,html {
margin: 0;
padding: 0px;
background: #FFFFFF url('images/bg.gif') repeat-x;
height: 100%;
}
#frame {
width: 960px;
margin-left: auto;
margin-right: auto;
background-color: #FFF;
}
#container, #main
{
position: relative;
margin: 0 auto;
margin-left: auto;
margin-right: auto;
min-height: 100%;
height: 100%;
}
p {margin: 0; padding: 0px; }
/* LABELS AND FORMS */
label {font-weight: bold }
.form {
width: 20em;
border: 1px solid #86878b;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
}
textarea {
width: 20em;
border: 1px solid #86878b;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
}
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;
background: #4fc2f0;
padding: 2px 3px;
border: 1px solid #46a1c6;
}
#ButtonSubmit {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;
background: #4fc2f0;
padding: 2px 3px;
border: 1px solid #46a1c6;
}
/* LABELS AND FORMS */
/* BACKGROUND */
.background {
background: #425c64 url('images/bg.gif') repeat-x;
}
/* BACKGROUND */
/* HEADER */
#header {
height: 125px;
background-image: url(images/header2.gif);
background-repeat: no-repeat;
}
/* LOGO */
.logolink {
background-image: url('images/logo.gif');
background-repeat: no-repeat;
height: 236px;
width: 115px;
}
.logolink a { float: left; }
#swap {background-image: url(images/logo.gif); width: 236px; height: 115px; }
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */
/* LOGO */
/* HEADER */
/* NAV */
#nav {
background: url(images/nav_bg.gif) repeat-x;
height: 38px;
}
.images {
margin: 0px;
padding: 0px;
}
.images a { float: left; }
#swap01 {background-image: url(images/nav_products_on.gif); width: 74px; height: 38px; }
#swap02 { background-image: url(images/nav_service_on.gif); width: 74px; height: 38px; }
#swap03 { background-image: url(images/nav_safety_on.gif); width: 56px; height: 38px; }
#swap04 {background-image: url(images/nav_contact_on.gif); width: 92px; height: 38px; }
#swap05 { background-image: url(images/nav_catalog_on.gif); width: 122px; height: 38px; }
#swap06 { background-image: url(images/nav_landscape_on.gif); width: 160px; height: 38px; }
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */
#nav .end {
float: right;
background: url(images/nav_kid.jpg) no-repeat;
width: 365px;
height: 38px;
}
/* NAV */
/* MAINGRAPHIC */
#maingraphic {
background: url(images/main1.gif) no-repeat;
height: 150px;
}
#maingraphic p {
padding: 70px 300px 0px 20px;
font: 10pt "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12pt;
color: #066273;
}
/* MAINGRAPHIC */
/* PRODUCTS */
#products {
width: 625px;
}
#products .row {
background: #fffefe url(images/productsbg.gif) repeat-x;
line-height: 19px;
padding-bottom: 30px;
height: 100px;
}
#products .row img {
float: left;
padding: 4px;
margin: 12px;
border: 1px solid #8cc63e;
background-color: #FFF;
}
#products .row h3 {
padding: 20px 0px 0px 20px;
color: #6b982e;
font-size: 14pt;
font-weight: bold;
letter-spacing: -1px;
}
.clear { clear: both }
/* PRODUCTS */
/* MAIN */
#main {
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
height: auto;
height: 100%;
}
#main .leftside {
float: left;
margin: 15px;
width: 242px;
}
#main .leftside h1 {
background: url(images/left_contact.gif) no-repeat;
height: 37px;
}
#main .leftside h2 {
background: url(images/left_vendors.gif) no-repeat;
height: 37px;
}
#main .leftside p {
margin: 4px 0px 10px 0px;
padding: 10px;
background: url(images/left.gif) no-repeat;
background-color: #f1ebdf;
color: #a59662;
}
#main .vendors {
background: #f1ebdf url(images/vendors.gif) no-repeat;
height: 134px;
}
#main .content {
float: right;
padding: 20px 60px 0px 0px;
color: #434448;
line-height: 19px;
width: 600px;
}
#main .text {
background: url(images/intro.jpg) no-repeat;
font: 13pt 'Arial', Sans-serif;
font-style: italic;
line-height:150%;
width: 620px;
color:#0c737c;
padding: 10px 50px 20px 10px;
}
#main .right img{
float: right;
padding: 4px;
margin: 12px;
border: 1px solid #8cc63e;
background-color: #FFF;
}
#main .content h1 {
font-size: 18pt;
font-weight: bold;
color: #73071e;
letter-spacing: -1px;
}
#main .content a {
color: #4fc2f0;
}
#main .content ul {
padding-left: 25px;
color: #434448;
}
#main .content li {
list-style-image: url(images/bullet.gif);
}
#main .content a:hover {
font-weight: bold;
color: #8cc63e;
}
#main .content .row a {
color: #ee9b07;
}
#main .content .row a:hover {
color: #8cc63e;
}
/* MAIN */
/* LANDSCAPE */
.landscape {
float: left;
margin-right: 15px;
}
/* LANDSCAPE */
/* FOOTER */
#footer
{
position: relative;
clear: both;
height: 95px;
margin-left: auto;
margin-right:auto;
background: #FFFFFF url('images/footer.png') repeat-x;
padding: 10px;
color: #FFF;
}
#footer p {
width: 288px;
font: bold italic 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #ffeaea;
padding-bottom: 10px;
}
#footer .asc {
font: 8pt 'Arial', Sans-serif;
padding: 20px 0 0px 0px;
color: #33535d;
text-align:center;
text-decoration: none;
}
#footer .asc a {
font: 8pt 'Arial', Sans-serif;
color: #33535d;
text-align:center;
text-decoration: none;
}
#footer ul {
font: 8pt 'Trebuchet MS', Arial, Sans-serif;
display: inline;
}
#footer li {
display: inline;
padding: 10px;
}
#footer li a {
color: #dcffac;
}
/* FOOTER */
/* MENU */
/* Menu */
#menu {
width:1000px;
height: 44px;
background: url(images/img03.jpg) no-repeat left top;
margin: 0 auto;
padding: 0;
}
#menu ul {
margin: 0;
padding: 9px 0 0 20px;
list-style: none;
line-height: normal;
}
#menu li {
float: left;
}
#menu a {
display: block;
margin-right: 3px;
padding: 5px 20px 7px 20px;
text-decoration: none;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
color: #0a606e;
border: none;
}
#menu a:hover, #menu .current_page_item a {
}
#menu a:hover {
background: #b9e7ed;
text-decoration: none;
color:#0a606e;
}
#menu .first {
margin-right: 3px;
background: #b9e7ed;
color:#474646;
}