﻿/* COLORS */


.lt_blue {
	color: #f1f6fc;
}
.leigh_blue {
	color: #007ec6;
}
.dk_blue {
	color: #002e42;
}
.green {
	color: #72a000;
}
.dk_grey {
	color: #455461;
}



/* SAMPLE BOX */


.title_container_box {
	width: 668px;
	height: 100px;
	background: none;
}
.sidebar_wrapper_box {
	float: right;
	padding: 0 30px 0 0;
	margin: -60px 0 0 0;
}
.sidebar_box {
	width: 280px;
}
.sample_box_outer {
	background: #333;
	margin: 0;
	padding: 90px 0 75px 0;
	background: url(../img/interactive_box.jpg) no-repeat top left;
	z-index: 100;
}
#sample_box_wrapper {
	height: 280px;
	padding:0 0 0 40px;
}
.submitbox_wrapper {
	padding: 0 0 0 30px;
}
.submitbox {
	padding: 0 0 10px 0;
	display: block;
	width: 130px;
	height: 35px;
	text-decoration: none;	
}
.submitbox:hover {
	background: url(../img/submit_box_over.jpg) -10px -2px no-repeat;
}
.clearbox_wrapper {
	padding: 44px 0 6px 23px;
}
.clearbox {
	padding: 0 0 10px 0;
	display: block;
	width: 149px;
	height: 14px;
	text-decoration: none;		
}
.clearbox:hover {
	background: url(../img/empty_box_over.jpg) -3px -3px no-repeat;		
}











/* BOX INSTRUCTIONS */

.box_instructions {
	float: left;
	width: 280px;
	margin: -40px 0 40px 0;
	border: 2px solid #e5e5e5;
	-khtml-border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	background: #eff2f3 url(../img/gradient_instructions.jpg) top left no-repeat;
}
.box_instructions p {
	padding: 87px 21px 18px 21px;
	color: #455461;
	color: #999;
	font-size: 90%;
	line-height: 1.6em;
	font-style: italic;
	text-shadow: #FFF 2px 2px 2px;
}
.box_intro {
	float: left;
	width: 280px;
	border: 2px solid #e5e5e5;
	-khtml-border-radius: 12px;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	background: url(../img/gradient_intro.jpg) bottom center no-repeat;
}
.box_intro p {
	padding: 90px 21px 260px 21px;
	color: #455461;
	color: #999;
	font-size: 90%;
	line-height: 1.6em;
	font-style: italic;
	text-shadow: #FFF 2px 2px 2px;
	background: url(../img/gradient_intro_top.jpg) 19px 24px no-repeat;
}


















/*where the individual sample items get placed*/
#samples_wrapper {
	width:200px;
	height:180px;
	padding:3px 0 0 5px;
	margin:0;	
}
.sample_box_item {
	width:60px;
	height:51px;
	padding:0 0 0 0;
	margin:0 2px 2px 0;
	float:left;
	overflow: hidden;
}
.sample_box_item a.remove {
	float:left;
	width:60px;
	height: 51px;
	text-decoration:none;
	overflow:hidden;
	display: block;
	background: url(../img/box_remove.png) 99px 6px no-repeat;
}
.sample_box_item a.remove:hover{
	background: url(../img/box_remove.png) center center no-repeat;
}
.sample_box_item a.magnify{
	float:left;
	width:30px;
	padding: 36px 0 0 0;
	text-decoration:none;
	overflow:hidden;
	background: url(../img/box_magnify.png) 0 75px no-repeat;
}
.sample_box_item a.magnify:hover{
	background: url(../img/box_magnify.png) 6px 17px no-repeat;
}
.sample_box_item a.magnify .hover{
	background: url(../img/box_magnify.png) 6px 17px no-repeat;
}







/* unitip css */

#unitip {
	position: absolute;
	z-index: 1000;
	top: -1000px;
	color: #fff;
	font: normal normal 85%/14px Arial, Verdana, Helvetica, sans-serif;
	display: none;
}

	#unitippoint, #unitipmid, #unitipcap {
		position: relative;
		top: 0px; 
		left: 0px;
		width: 145px;
		display: block;
	}
	
	#unitippoint { 
		background: url(../images/TipPoint.png) no-repeat; 
		height: 19px; 
		overflow: hidden; 
	}
	
	#unitipmid { 
		background: url(../images/TipMid.png) repeat; 
		width: 115px;
		height: auto; 
		padding: 1px 15px;
	}
	
	#unitipcap { 
		background: url(../images/TipCap.png) no-repeat; 
		height: 7px; 
		overflow: hidden; 
	}











/*BUTTONS*/

.buttons_wrapper { 
	float: right;
	width: 133px;
}
.button_requestinfo { 
	float: right;
	text-decoration: none;
	padding: 0;
}
.button_requestinfo:hover { 
	cursor:pointer;
    background-position: 0 -23px;	
}
.button_requestinfo a.rollover {
    display: block;
    width: 133px;
	height: 23px;
    background: url(../img/button_moreinfo.jpg) no-repeat top left;
    text-decoration: none;
}
.button_requestinfo a:hover.rollover {
    background-position: 0 -23px;
}
.button_addtobox { 
	float: right;
	text-decoration: none;
	margin: 0 0 10px 0;
}
.button_addtobox:hover { 
	cursor:pointer;
    background-position: 0 -23px;	
}
.button_addtobox a.rollover {
    display: block;
    width: 133px;
	height: 23px;
    background: url(../img/button_addtobox.jpg) no-repeat top left;
    text-decoration: none;
}
.button_addtobox a:hover.rollover {
    background-position: 0 -23px;
}









/*FORM*/

#sample_list_wrapper { 
	padding: 30px 0 0 0;
}
#sample_list_wrapper ol { 
	margin: 6px 0 5px 26px;
	color: #555;
}
#sample_list_wrapper ol li { 
	padding: 3px 0;
	font-size: 100%;
	font-weight: normal;
}
#sample_list_wrapper .listtitle { 
	color: #72a000;
	font-size: 150%;
	padding: 0 0 0 10px;
}








#gallery {
	float: left;
} 
.gallery.custom-state-active { 
	background: #eee;
}
.gallery li { 
	float: left; 
	padding: 0.4em; 
	margin: 0 0.4em 0.4em 0; 
	text-align: center;
}
.gallery li h5 {
	margin: 0 0 0.4em;
	cursor: move;
}
.gallery li a {
	float: right;
}
.gallery li a.ui-icon-zoomin { 
	float: left;
}
.gallery li img { 
	width: 100%; 
	cursor: move;
}
#trash { 
	float: left; 
	width: 100%; 
	height: 260px; 
	padding: 1%;
} 
#trash h4 { 
	line-height: 16px; 
	margin: 0 0 0.4em;
}
#trash h4 .ui-icon { 
	float: left;
}
#trash .gallery h5 { 
	display: none;
}
