@import url("reset.css");


/* Basics
----------------------------------------------------------------------------------------------------*/

body { 
	font: 0.75em/1.25 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; 
	color:#555;
	background:#FFF url(images/header2.jpg) repeat-x center top;
}

a:link {color:#C00; text-decoration:none}
a:visited {color:#C00; text-decoration:none}
a:hover {color:#555; text-decoration:none}
a:active {color:#C00; text-decoration:none}

hr {
	border: 0 #ddd solid;
	border-top-width: 1px;
	clear: both;
	height: 0;
}


/* Global Containers
----------------------------------------------------------------------------------------------------*/

#index {
	background:#FFF url(images/headerbg.jpg) repeat-x center top;
	height:400px;
	overflow:visible;
}

#container {
	position:relative;	
	margin-left: auto;
	margin-right: auto;
	width: 980px;
}

#header-byline {
	float:left;
	display:inline;
	height:25px;
	padding-top:50px;
}

#ddbutton {
	height: 16px;
	width: 150px;
	position:absolute;
	right:20px;
	top:20px;
	z-index:100
}

.the_menu {
	display:none;
	width:400px;
	float:right;
	border-right:16px solid #C00;
	margin-top:1px;
	background-color: #ccc;
	padding:10px
}

.the_menu li {
	display:inline;
	float:left;
	width:200px;
	padding:2px 0;
}

.the_menu li a {
	color:#333; 
	text-decoration:none; 
	padding:10px; 
}

.the_menu li a:hover {
	padding:10px;
	font-weight:bold;
	color: #C00;
}

#menu {
	position:absolute;
	top:50px;
	right:10px;
	height:auto;
	overflow:visible;
	text-align:right;
	width:545px;
}

#menu a:link {color:#555;}
#menu a:visited {color:#555}
#menu a:hover {color:#C00;}
#menu a:active {color:#C00}
#menu ul {list-style:none;}
#menu li {float:right; display:inline; padding:0 10px; border-right:1px solid #555;}

#content {
	clear:both;
	padding:50px 0 30px 0;
}



/* Headings
----------------------------------------------------------------------------------------------------*/

h1 {font-size: 25px; margin-top:10px;}
h2 {font-size: 23px; line-height:1; text-shadow: 1px 1px 3px #ddd}
h3 {font-size: 21px;}
h4 {font-size: 19px;}
h5 {font-size: 17px;}
h6 {font-size: 15px;}


/* Spacing
----------------------------------------------------------------------------------------------------*/

p ol {list-style: decimal;}
p ul {list-style: square;}

p,
dl,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
pre,
table,
address,
fieldset {
	margin-bottom: 10px;
}


/* Classes
----------------------------------------------------------------------------------------------------*/

.fl {float:left; display:inline; margin-right:10px; }
.fr {float:right; display:inline; margin-left:10px; }
.clear {clear:both}
.cl {clear:left}
.cr {clear:right}
.small {font-size:75%}
.medium {font-size:85%}
.exp {letter-spacing:0.2em}
.cap {text-transform:uppercase}
.last {border-right:0!important; padding-right:0}
.first {padding-left:0}
.right {text-align:right}
.thirdblock {width:33.3%; height:auto; float:left; display:inline;}
.serif {font-family:Georgia, "Times New Roman", Times, serif}
.leftdiv {float:left; display:inline; width:70%}
.rightdiv {float:left; display:inline; width:30%; text-align:right; padding-top:57px}
.red {color:#C00}


/* IDs
----------------------------------------------------------------------------------------------------*/

#feature {
	position:absolute;
	left:0;
	top:75px;
	width:980px;
	height:284px;
	overflow:hidden;
	z-index:1;
}
#randomdiv1, #randomdiv2, #randomdiv3 {border:0; padding:0!important; margin:0!important}

#featuretext {
	position:absolute;
	height:110px;
	width:215px;
	padding:20px;
	text-align:right;
	left: 725px;
	top: 119px;
}

#indexslider {
	clear:both;
	position:relative;
	top:320px;
}

#footer, #indexfooter {
	color:#bbb; 
	font-size:90%;
	position:relative;
	width:100%;
	height:80px;
	visibility:visible;
	background: #FFF url(images/hr.gif) repeat-x top;
	padding-top:13px;
	clear:both;
}

#footer {
	top:20px;
}

#indexfooter {
	top:360px;
}

#brands li {float:left; display:inline; width:33.3%; margin:3px 0 12px 0}
#productlist {width:100%; font-size:85%}
#productlist td {padding:2px 0}

#signature {text-indent:-999px; width:127px; height:30px; background-image:url(images/signature.jpg)}


/*---------- Tooltips -----------*/

a.tt{
    position:relative;
    z-index:24;
    color:#BBB;
	font-weight:bold;
    text-decoration:none;
}
a.tt span{ display: none; }
a.tt:hover{ z-index:2;}
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    top:-12px; right:15px; padding:10px;
	width:250px; color: #BBB; 	
    text-align: right;
}




/*SLIDER*/

    /* image replacement */
        .graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
            }
    /* // image replacement */
	
	#slider {position:relative; left:54px}
	#slider img {margin:0 4px}
	.lastslider {margin-right:0!important}

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		width:870px;
		height:206px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:38px;
		height:206px;
		position:absolute;
		left:15px;
		top:0px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:925px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:38px;
		height:206px;
		background:url(images/scroll-left.jpg) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(images/scroll-right.jpg) no-repeat 0 0;	
		}	


/*FORM*/

#contact-form input {margin:3px 0}

.error{
	background-color:#AB0000;
	color:white;
	font-size:10px;
	font-weight:bold;
	margin-top:10px;
	padding:10px;
	width:240px;
}

#loading{
	position:relative;
	bottom:9px;
	visibility:hidden;
}

label{
	text-transform:uppercase;
	font-size:10px;
	font-family:Tahoma,Arial,Sans-serif;
}

textarea{
	color:#404040;
	font-family:Arial,Helvetica,sans-serif;
	font-size:12px;
}