/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.#.com/
   TEMPLATE NAME:  NAME OF COMAPNY
   DATE:           Mar-28th-2008
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #eef8fd url(/images/bg.jpg) repeat-x; /* Background Img */
img{border: none};

} 

/* ----------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: 953px;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: bold 10pt 'Century Gothic', Arial, Sans-serif;
color: #6db40f;
}
 
.form, textarea {
width: 20em;
border: 1px solid #747473;
font: 10pt 'Century Gothic', Arial, Sans-serif;
color: #747473;
padding: 2px;
margin-bottom: 20px;
}
 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: #029ad4;
padding: 4px 5px;
border: 1px solid #029ad4;
}

/* --------------HEADER------------- */

#header {
height: 280px;
}

.headerright {
background-image: url('/images/headerright.jpg');
background-repeat: no-repeat;
height: 280px;
width: 497px;
float: right;
}


/* --------------LOGO IN HEADER *always use this*------------- */

.logolink {
background-image: url('/images/logo.jpg');
background-repeat: no-repeat;
height: 280px;
width: 456px;
float: left
}
 
.logolink a { float: left;  }
 
#swap {background-image: url(/images/logo.jpg);  width: 456px;  height: 280px;  }
 
.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-image: url('/images/topnavbg.jpg');
height: 51px;
margin-top: 15px;
}

.minicart font {
color: #fff;
text-decoration: none;
font: bold 8pt 'Century Gothic', Sans-Serif;
padding: 0px 0px 0px 10px
}

#topnav a{
color: #baecfa;
text-decoration: none;
font: bold 12pt 'Century Gothic', Sans-Serif;
padding: 0px 0px 0px 10px
}

#topnav a:hover{
color: #fff;
text-decoration: none;
font: bold 12pt 'Century Gothic', Sans-Serif;
padding: 0px 0px 0px 10px
}

/* ----------CART--------------------- */
 
font, table, tr, td { font: 10pt 'Century Gothic';  border: none;}
font { }
table, td, tr { border: none; }
td { line-height: 20px; }
table b { font: bold 11pt 'Century Gothic'; color: #6db40f; }
table a, tr a, td a{color: #029ad4;}
table hr {border: none; border-bottom: 1px solid #e3e3e3; height: 0px;}
font img { border: 0px; }



/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin-top: 16px;
}

#main .content {
padding: 0px;
margin-left: 225px;
margin-right: 0px;
min-height: 300px; /* Height of Background Img */
color: #747473;
font: 10pt 'century gothic', Sans-Serif;
}

#main .content a{
color: #029ad4;
font: 10pt 'century gothic', Sans-Serif;
}

#main .content a:hover{
color: #02547a;
font: 10pt 'century gothic', Sans-Serif;
}

#main .content a:visited{
color: #029ad4;
font: 10pt 'century gothic', Sans-Serif;
}


#main p {
}

#main h1 {
color: #6db40f;
font: 20pt 'Century Gothic', Helvetica, Tahoma, Sans-Serif;
padding-bottom: 15px;
text-transform: uppercase;
letter-spacing: 1px;
}


#main .navleft {
float:left; 
width: 213px;
padding: 0px;

}


.navleftlinks {
float:left; 
width: 213px;
margin-top: 0px;
background-image: url('/images/navbg.gif');
}


.navlinks ul {
margin: 0px;
}

.navlinks li {
background-image: url(/images/doublearrows.gif);
background-repeat: no-repeat;
background-position: 0 6px;
display: block;
padding: 0px 3px 3px 30px;
}

.navlinks li a {
color: #029ad4;
text-decoration: none;
font: bold 10pt 'century gothic', Sans-Serif;
}

.navlinks li a:hover {
text-decoration: underline;
color: #029ad4;
}


.navleftbottom {
float:left; 
width: 213px;
height: 12px;
padding: 0px;
background-image: url('/images/navbottom.gif');
}

.navlefttop {
float:left; 
width: 213px;
height: 79px;
padding: 0px;
background-image: url('/images/products.gif');
}


.specials {
float:left; 
width: 213px;
padding: 0px;
margin-top: 16px;
}

#specialsmiddle {
float:left; 
width: 213px;
background-image: url('/images/navbg.gif');
padding: 0px;
color: #747473;
text-decoration: none;
font: 10pt 'century gothic', Sans-Serif;
text-align: center;
}


#specialsmiddle .holder{
padding: 0px;
}


#specialsmiddle .left{
float:left; 
width: 70px;
padding: 5px 5px 5px 10px;
color: #747473;
text-align: center;
clear: both;
}

#specialsmiddle .right{
float:right; 
width: 100px;
padding: 5px 5px 5px 0px;
color: #747473;
text-align: left;
}


.specials a {
color: #e6b800;
text-decoration: underline;
font: bold 10pt 'century gothic', Sans-Serif;
}

.specials a:hover {
text-decoration: none;
color: #e6b800;
}

.specialsbottom {
float:left; 
width: 213px;
height: 12px;
padding: 0px;
background-image: url('/images/navbottom.gif');
}

.specialstop {
float:left; 
width: 213px;
height: 79px;
padding: 0px;
background-image: url('/images/specials.gif');
}



/* --------------FOOTER------------- */

.clear {
clear: both;
}

#footer, .push { 
clear: both;
width: 960px;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-image: url('/images/footerbg.gif');
background-repeat: repeat-x;
background-color: #029dd7;
height: 100px;
height: auto;
margin-top: 15px

}

#footer .content { 
width: 960px; 
margin: 0 auto; 
position: relative;
text-align: center; 
}

/* --------------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: 10pt 'century gothic', Sans-Serif;
}

#footer .links li a:hover {
text-decoration: underline;
}

#footer .asc ul {
margin: 0px;
padding: 0px;
}

#footer .asc li {
display: block;
list-style-type: none;
}

#footer .asc li a {
color: #baecfa;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 8pt 'century gothic', Sans-Serif;
}

#footer .links li a:hover {
text-decoration: underline;
}



.blue {
color: #029ad4;
font: bold 11pt 'century gothic', Sans-Serif;
}



