﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.#.com/
   TEMPLATE NAME:  NAME OF COMAPNY
   DATE:           Mar-28th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #FFF url(/images/bg.gif) repeat-x;} 

.error{
	color:red;
}

.success{
	color:green;
}

.error, .success{
	font-weight:bold;
}

.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }
#spacer { height: 20px; width: 650px; margin-bottom: 20px;}
.spanLink{	cursor:pointer;	text-decoration:underline;}
.center{ text-align: center;}

/* ----------CART--------------------- */

font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 12px 'century gothic', Sans-Serif; color: #000; }
td { line-height: 20px; }
table b { color: #6a1754; }
table a, tr a, td a, font a, .content table a {color: #6a1754; font: 14px 'century gothic', Sans-Serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #6a1754;}
table hr {border: none; border-bottom: 1px solid #dedbdd; height: 0px;}
font img { margin-right: 10px; }
#cartholder{width: 670px;}

/* ----------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: 960px;
} 


/* --------------LABELS BUTTONS & FORMS-----------*/
 
label {
font: 14px 'century gothic', Sans-Serif;
color: #000;
}
 
#contact INPUT[type="text"], INPUT[type="textarea"], INPUT[type="password"],textarea{
font: 10pt 'century gothic', Arial, Sans-serif;
color: #86878b;
padding: 4px;
margin-bottom: 15px;
width: 225px;
border: 1px #c0cb30 solid;
}


 
.button {
width: 6em;
font: bold 10pt 'Trebuchet MS', Arial, Sans-serif;
color: #fff;      
background: #4fc2f0;
padding: 4px 5px;
border: 1px solid #46a1c6;
}

/* --------------HEADER------------- */

#header {height: 141px;}

#header .headerright { float: right; height: 141px; width: 527px; background: url(/images/headerright.gif) no-repeat top;}
#header .headerright a{ color: #fff; font: 14px 'century gothic', Sans-Serif; text-decoration: underline; padding: 0px 0px 10px 25px;}

#header .cart { float: right; width: 130px; text-align: right;  height: 50px; margin: 10px 30px 0px 0px;}
#header .cart a { background: url(/images/shoppingbag.gif) no-repeat top left;}
#header .cart td {float: left; color: #fff; font: 11px 'century gothic', Sans-Serif; text-align: left; padding-left: 35px;}

#header .myaccount { float: left; width: 110px; text-align: left; height: 50px; margin: 10px 0px 0px 200px;}
#header .myaccount a { background: url(/images/myaccount.gif) no-repeat top left; }

#header .subinfo a{ color: #fff; font: 11px 'century gothic', Sans-Serif; text-decoration: none; background: none; letter-spacing: 0px;}

#header .quilt a{ width: 180px; height: 60px; float: left; margin-top: 90px; position: absolute; }

/* --------------LOGO IN HEADER *always use this*------------- */

.logolink, #swap { width: 273px; height: 141px;}
.logolink { background-image: url('/images/logo.png'); background-repeat: no-repeat; float: left;}
.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 {
height: 77px;
background: url(/images/topnavbg.gif) no-repeat top left;}

#topnav ul{
float: left;
margin: 25px 0px 0px 300px;
}

#topnav li{list-style-type: none; display: inline; color: #fff;}

#topnav li a{
color: #fff;
text-decoration: none;
font: 16px 'century gothic', Sans-Serif; 
padding: 0px 42px 0px 0px;
}

#topnav li a:hover{ color: #fff; text-decoration: underline;}


/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/

#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
background: #FFF url(/images/mainbg.gif) repeat-y; /* Main DIV Background Img */
}

#main .content {
padding-top: 20px;
margin: 0px;
margin-left: 300px;
margin-right: 0px;
min-height: 1000px; /* Height of Background Img */
height: auto;
height: 100%;
font: 14px 'century gothic', Sans-Serif; color: #000;
}

#main h1 {font: 22px 'century gothic', Sans-Serif; color: #000;margin-bottom: 15px;text-transform:uppercase; letter-spacing:.1em;}
#main h2 {font: 22px 'century gothic', Sans-Serif; color: #aeba0c;margin-bottom: 15px; text-transform:uppercase; letter-spacing:.1em;}
#main h3 {font: 18px 'century gothic', Sans-Serif; color: #fff;margin-bottom: 15px; }

#main p {font: 12px 'century gothic', Sans-Serif; color: #000;margin-bottom: 15px;}

#main .content a {text-decoration: underline; color: #6a1754;}

#main .left{
width: 300px;
float: left;
padding-right: 25px;
}

#main .right{
width: 300px;
float: right;
border-left: 1px #dedbdd solid;
padding-left: 25px;
}


#navleft {
float:left; 
width: 273px;
margin: 0px;
padding: 70px 0px 0px 0px;
background: url(/images/navlefttop.gif) no-repeat top left; 
}


#navleft .search{float:left; margin-left: 40px; padding: 0px; color: #9da807; font: 22px 'century gothic', Sans-Serif; }
#navleft .search a{color: #5a1548; font: bold 11px 'century gothic', Sans-Serif;}
#navleft .search table{float:left; color: #fff; width: 200px; margin: 4px 0px 0px 0px;}
#navleft .search td{padding: 0px;}
#navleft .search input[type="text"]{padding: 5px 5px 5px 5px; border: 2px #c0cb30 solid; width: 140px; height: 16px;}




.suckerdiv ul{
margin: 0px 0px 20px 50px;
padding: 0;
list-style-type: none;
width: 190px; /* Width of Menu Items */
font: 14px 'century gothic', Sans-Serif;
position: relative;
z-index:500;
}
	
.suckerdiv ul li{
position: relative;
}
	

/* Sub level menu links style */
.suckerdiv ul li a{
display: block;
overflow: auto; /*force hasLayout in IE7 */
color: black;
text-decoration: none;
padding: 3px 8px;
}

.suckerdiv ul li a:hover{
background-color: #6a1754;
color: #FFF;
border-bottom: 1px white dashed;

}

.suckerdiv .subfolderstyle{
}

.suckerdiv ul li ul{
position: absolute;
width: 180px; /*sub menu width*/
top: 0;
visibility: hidden;
background-color: #c0cb30;
margin: 0px;
}

.suckerdiv ul li ul li a{
border-bottom: 1px white dashed;
color: white;
}


/* 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: 100%;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: aqua;
height: 100px;
height: auto;
background: #6a1754 url(/images/footerbg.gif) repeat-x; /* Main DIV Background Img */
z-index:200;

}

#footer .content { 
width: 960px; 
margin: 0 auto; 
position: relative; 
padding-left: 20px;
}


#footer .block {
width: 300px;
height: 200px;
float: left;
margin: 30px 20px 0px 0px;
}


#footer .blockright {
width: 300px; 
height: 200px;
float: right;
margin: 30px 0px 0px 0px;
}

#footer .blockright img{
padding: 20px 20px 0px 0px;
border: none;
}


#footer .block h1, .blockright h1{
color: #2f0421;
font: 22px 'century gothic', Sans-Serif;
}

#footer .block li, .blockright li{
display: block;
list-style-type: none;
padding-bottom: 5px;
}


#footer .block li a, .blockright li a{
color: #a86396;
font: 12px 'century gothic', Sans-Serif;
text-decoration: none;
}



/* --------------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: #2f0421;
text-decoration: none;
padding: 0px;
font: 9px 'century gothic', Sans-Serif;
}

#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: #2f0421;
text-decoration: none;
font: 10px 'century gothic', Sans-Serif;
}

/* --------W3 LINKS--------- */

#footer .w3 ul { margin: 0px; padding: 10px;}
#footer .w3 li { display: inline; list-style-type: none;}
#footer .w3 li a { color: #000; text-decoration: none; border-right: 1px solid; padding: 0px 10px 0px 10px; font: 10pt Arial, 'Trebuchet MS', Sans-Serif;}
#footer .w3 li a:hover { text-decoration: underline;}




/* --------------FOOTER SEO LINKS------------- */


#footer .seo {
height: auto;
text-align: left;
min-height: 100px;
width: 750px;
font: 8pt 'century gothic', Sans-Serif;
}
 

#footer .seo a {
color: #6e4a2f;
text-decoration: none;
font: 8pt 'century gothic', Sans-Serif;
}


/* ----------FEATURED PRODUCT--------------------- */
#featuredproducts{width: 660px;float: left;padding: 0px; margin: 0px;  }

.featuredproduct{width: 200px;	font: 12px 'century gothic', Sans-Serif;color: #6f6f6f; text-align: center; float: left;margin-right: 15px;}

.featuredproduct img{border: 1px #dedbdd solid; padding: 5px;}



/* ----------WHATS NEW--------------------- */

#whatsnew{width: 660px;float: left; margin-bottom: 20px; }

#whatsnew img{border: 1px #dedbdd solid; padding: 5px; float: left; margin-right: 15px;}


/* ----------INDEX CMS--------------------- */

.blankleft {float: left; margin-right: 15px; margin-bottom: 20px; width: 200px; font: 12px 'century gothic', Sans-Serif;}
.dashedgreybox {float: left; margin-right: 15px; margin-bottom: 20px;  width: 390px;border: 2px #dedbdd dashed;padding: 9px; font: 12px 'century gothic', Sans-Serif;}
.greybox{width: 180px;	border: 1px #dedbdd solid;  margin-bottom: 20px; padding: 9px; font: 12px 'century gothic', Sans-Serif;color: #000; text-align: left; float: left;margin-right: 15px;}
.dashedgreenbox {float: left; margin-right: 15px;  margin-bottom: 20px; width: 285px;border: 2px #aeba0c dashed;padding: 9px; font: 12px 'century gothic', Sans-Serif;}
.dashedgreenbox h2 {font: 22px 'century gothic', Sans-Serif; color: #aeba0c;margin-bottom: 15px; text-transform:uppercase; letter-spacing:.1em;}

/* ----------CALENDAR--------------------- */
#calendar{width: 600px; border: 1px #dedbdd solid; color: #000;}
#calendar a{color: #000;}

#calendar th{background-color: #fe680f;font: bold 18px 'century gothic', Sans-Serif;color: #fff; padding: 8px;}

#calendar td{border: .08em #dedbdd solid;color: #000; padding: 5px;}

#calendar .calHeader{background-color: #6a1754;font: bold 14px 'century gothic', Sans-Serif;color: #fff;}


/* ----------CONSTANTCONTACT--------------------- */
#constantcontact{width: 180px; color: #fff; margin-top: 10px; background-color:#6a1754; float: left; margin-left: 40px;}

#constantcontact td{padding: 2px; color: #fff; vertical-align:top;}

#constantcontact INPUT[type="text"]{
color: #86878b;
padding: 2px;
margin-bottom: 15px;
width: 80px;
}


