/* CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

ol, ul { list-style: none; }

/* FONTS & COLORS */

body {
	background: #fff;
	font-family: arial, sans-serif;
	font-size: 16px;
	font-weight: normal;
	padding-left: 25px;
}

h1, h2, h3 {
	color: #00aded;
	font-size: 1.4em;
	font-weight: normal;
	letter-spacing: -0.025em;
	margin-bottom: 15px;
}

h1 { font-size: 1.6em; }

.intro { font-size: 1.1em !important; }

.red { color: red; }

#main { width: 920px; margin: 0 auto; }

#main-img { margin: 15px auto; }

#main-img img { float: right; margin-bottom: 15px; width: 490px;}

#tagline {
	background: url(images/blue-border.png) repeat-x;
	color: #fff;
	font-style: italic;
	text-align: center;
	padding: 8px 0 13px 0;
	font-size: 1.2em;
	float: left;
	width: 920px;
}

/* POSITIONING */

#address { font-size: 1.1em !important; margin-top: 25px; line-height: 1.5em }	
		
#footer {
	clear: left;
	color: #4d4d4d;
	float: left;
	font-size: .7em;
	padding-top: 15px;
	text-align: center;
	width: 920px;
}

#header {
	float: left;
	height: 163px;
	background: url(images/header-bg.jpg) top center no-repeat;
	width: 920px;
}

#header a {
	display: block; 
	font-size: .85em;
	height: 163px;
	padding-top: 130px;
	text-indent: 345px;
}

* html #header a {width:100%}

a {	color: black; text-decoration: none; }
	
#left {
	float: left;
	width: 365px;
	margin-right: 45px;
}
	
#left a, #right a { color: #00abeb; text-decoration:underline;}

#left p, #right p {
	margin: 0 0 12px 0;
	line-height: 1.35em;
	font-size: .9em;
	color: #4a4a4a;
	float: left;
}
	
#left li, #right li {
	list-style-type: block;
	font-size: .9em;
	color: #4a4a4a;
	line-height: 1.35em;
	margin-bottom: 5px;
}

#left li li, #right li li{
	margin-bottom: 0;
}

#left ul, #right ul { float: left; margin: 5px 0 5px 0; }

#links {
	text-align: center;
	width: 100%;
}

#links a {
	margin: 15px 5px;
}

#main-content {
	float: left;
	width: 920px;
	clear: left;
	margin-top: 25px;
}

#product-samples { 	margin-top: 15px; }

#product-samples a {
	color: #00aded;
	font-size: 1em;
	float: left;
	width: 50%;
}

#product-samples h2 { margin: 0;}

#product-samples li{ margin: 0 4px;}

#products-next { float: right; text-align: right; }
		
#right { float: left; width: 500px; }
	
/* FORMS */

#contact-form { float: left; clear: left; }

#contact-form input {
	font-size: 1em;
	padding: 3px;
	width: 335px;
	border: 1px solid #00abeb;
}

#contact-form label {
	clear: right;
	float: left;
	font-weight: bold;
}
	
#contact-form li {
	line-height: 1.2;
	padding-left: 0;
	width: 340px;
}

#contact-form select {
	border: 1px solid #00abeb;
	font-family: arial, sans-serif;
	margin-right: 3px;
	padding: 2px;
}

#contact-form textarea {
	width: 335px;
	padding: 3px;
	font-family: arial, sans-serif;
	font-size: 1em;
	border: 1px solid #00abeb;
	height: 250px;
}

#radio {
	clear: left;
	color: #4A4A4A;
	font-size: .9em;
	font-weight: bold;
	margin-bottom: 10px;
}

#radio label { margin-right:30px; }

#submitButton {
	background: #00abeb;
	color: #fff;
	font-weight: bold;
	width: 150px !important;
	text-align: center;
	cursor: pointer;
}
	
/* CAROUSEL */

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container { position: relative; }

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 159px;
    height: 140px;
	margin-right: 14px;
	text-align: center;
	font-size: .9em;
	color: #4a4a4a;
}

.carousel-list li img { margin-bottom:5px; }

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}