﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.omnilightingsales.com/
   TEMPLATE NAME:  Omni Lighting Sales
   DATE:           Feb-18th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #424242 url(/images/bg.gif) repeat-x;
}

.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }

/* ----------CART--------------------- */
font, table, tr, td { border: none; background-color: transparent; font-size: 12px;}
table, td, tr { border: none; font-family: Arial, Tahoma, sans-serif; color: #424242; }
td { line-height: 20px; width: 30% }
table b { color: #424242; }
table a, tr a, td a, font a, .content table a {color: #ed1922; font-family: Arial, Tahoma, sans-serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #ed1922;}
table hr {border: none; border-bottom: 1px solid #e1e1e1; height: 0px;}
td div { width: 400px; font-family: Arial, Tahoma, sans-serif; }


/* ----------Centered Container Or the Layout--------------------- */
#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 927px; 
background: #FFF url('images/mainbg.gif') repeat-y top left;
border: 1px solid #656565
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
label {
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #777;
}
 
.form, textarea {
width: 20em;
border: 1px solid #777;
font: 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #86878b;
padding: 2px;
margin-bottom: 20px;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: #4fc2f0;
padding: 4px 5px;
border: 1px solid #46a1c6;
}

/* --------------HEADER------------- */
#header { background: url(/images/headbg.jpg) no-repeat; height: 142px;}
#header .right { width: 250px; float: right; text-align: right;}
#header .callus { padding: 18px 16px 0px 0px}

#header .cart {
position: absolute; 
width: 124px; 
height: 51px; 
background: url(/images/head_cartholder.gif) no-repeat; 
margin: 91px 0px 0px 788px;
padding: 8px 0px 0px 0px;
text-align: right;
}

#header td { text-align: right; line-height: 12px; }

#header font {
color: black;
margin-right: 16px; margin-top: -30px;
font-size: 10px;
}

#header img { border: none; }


/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap { width: 128px; height: 142px; float: left;}
.logolink { background-image: url('/images/logo.png'); background-repeat: no-repeat;}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.png); }
 
.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 */

/* --------------TOPNAV------------- */
#topnav {background: #ed1922 url('images/navbg.gif') repeat-x; height: 38px;}
#topnav ul { padding: 7px 0px 0px 0px; margin: 0px;}
#topnav ul li { display: inline; list-style-type: none; padding: 0px 16px 0px 16px; border-right: 1px solid white;}
#topnav ul li.last, #footer .links li.last a { border: none}


#topnav ul li a {
color: white;
font-family: Arial, Tahoma, sans-serif;
font-size: 10px; 
text-decoration: none;
text-transform: uppercase;
letter-spacing: -1px
}

#topnav ul li a:hover { text-decoration: underline}


/* --------------MISSION------------- */

#mission { height: 228px; background: url(/images/missionbg.jpg) no-repeat; padding: 0px}
#mission .holder {  margin: 0 auto;}
#mission .holder .left { width: 470px; height: 228px; float: left; }
#mission .holder .right { width: 450px; height: 228px; float:right; text-align: left; padding-top: 20px}

#mission .searchhead { width: 357px; height: 30px; background: url(/images/searchhead.gif) no-repeat;}
#mission .holder .right p { font-family: Arial, Tahoma, sans-serif; font-size: 10px; padding-top: 14px; padding-right: 30px;}

#mission .search {
width: 358px; 
padding: 15px; 
background: url(/images/searchholderbg.png); 
margin-top: 10px;
font-family: Arial, Tahoma, sans-serif; 
font-size: 10px;
}

#mission .search .input, .cartsearch { 
background: url(/images/searchbg.gif) repeat-x; 
width: 28em; 
padding: 10px;
margin-bottom: 12px;
font-family: Arial, Tahoma, sans-serif; 
font-size: 12px;
border: 1px solid #d4d4d4
}

.cartbutton { position: absolute; margin: 44px 0px 0px -74px; border: none; }


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/
#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
}

#main .content {
padding: 20px 25px 30px 0px;
margin-left: 240px;
margin-right: 0px;
min-height: 500px; /* Height of Background Img */
height: auto;
font-family: Arial, Tahoma, sans-serif;
}

#main h1 {
font-size: 14pt;
color: #d60000;
font-style: italic;
margin-bottom: 20px;
}

#main p {
font-size: 12px;
line-height: 20px;
margin-bottom: 25px;
}

#main p a { color: #d60000;}

#main img { border: none;}

#main .navleft {
float:left; 
width: 214px;
margin: 0px;
padding: 0px;
}

#main .navleft .head {
background-color: #424242;
background: #424242 url(/images/cathead.gif) no-repeat top left;
height: 34px;
}


/* --------------INSTALLS----------------*/
#installs {margin: 0px; padding: 0px;}
#installs p { font-size: 11px; padding-top: 10px; margin: 0px; padding-bottom: 10px;}
#installs .rowa { margin: 0px; padding: 10px; background-color: #eee; border-bottom: 1px solid #bfbfbf; height: 100%; height: auto}
#installs h3 { font-size: 20px; color: #d60000;}
#installs .left { float: left; width: 100px;}
#installs .left img { padding: 6px; border: 1px solid #bfbfbf; background-color: white }
#installs .right { float: right; width: 510px; text-align: left; padding-left: 0px;}

/* --------------LEFTNAV----------------*/
.suckerdiv ul{
margin-bottom: 50px;
padding: 0;
list-style-type: none;
width: 214px; /* Width of Menu Items */
font-family: Arial, Tahoma, Helvetica, Sans-Serif;
font-size: 10px;
background-color: white;
}
	
.suckerdiv ul li{ position: relative;  }
.suckerdiv ul li a { background: url(/images/iconarrow.png) no-repeat center left;}
	
/*Sub level menu items */
.suckerdiv ul li ul{
position: absolute;
width: 172px; /*sub menu width*/
top: 0;
visibility: hidden;
background-color: #424242;
border: 1px solid white;
}

.suckerdiv ul li ul li a { color: white; }

/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
padding: 10px 10px 10px 32px;
border-bottom: 1px solid #c5c5c5;
}

.suckerdiv ul li a:hover{
background-color: #777;
color: #FFF;
}

.suckerdiv .subfolderstyle ul li a {
background-color: #424242
}
	
	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */


/* --------------FOOTER------------- */

#footer, .push { 
clear: both;
width: 927px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer { background-color: #ed1922; height: 100px; height: auto;}
#footer .content { width: 927px; margin: 0 auto; position: relative; }

/* --------------FOOTER LINKS------------- */
#footer ul { padding: 10px;}
#footer .links ul { margin: 0px; padding: 0px;}
#footer .links li { display: inline; list-style-type: none;}

#footer .links li a {
color: #fff;
text-decoration: none;
border-right: 1px solid;
padding: 0px 10px 0px 10px;
font-family: Arial, Tahoma, sans-serif;
font-size: 10px; 
text-transform: uppercase;
text-decoration: none;
}

#footer .links li a:hover { text-decoration: underline; }


/* --------ASC LINKS--------- */
#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}

#footer .asc li a {
color: #fff;
text-decoration: none;
padding: 0px 10px 0px 10px;
font-family: Arial, Tahoma, sans-serif;
font-size: 10px; 
text-decoration: none;
}





/* ----- Customer Cart TABLES ---------- */
#awscustomertables table{margin: 1em; border-collapse: collapse;}
#awscustomertables td{ padding: .3em; border: 1px #F2F2F2 solid; }
#awscustomertables th{ padding: .3em; border: 1px #F2F2F2 solid; background: #F2F2F2; }

