/****** FILE: themes/organsupply/css/reset.css *****/
/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
 @import url(http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic);
 
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.clear {
	clear:both;
}

/****** FILE: themes/organsupply/css/shell.css *****/
/* BASE */
/* This file should not be edited */
.clear {
	clear:both;
}
.decimal-half{
	float:left;
	width:0.5%;    
	min-height: 1px;
}
.ten{
	float:left;
	width:10%;
}
.fifteen{
	float: left;
	width: 15%;	
}
.twenty{
	float:left;
	width:20%;
}
.twenty-five {
	float:left;
	width:25%;
}
.thirty {
	float:left;
	width:30%;
}
.thirty-three {
	float:left;
	width:33%;
}
.thirty-four {
	float:left;
	width:34%;
}
.forty {
	float:left;
	width:40%;
}
.forty-five {
	float:left;
	width:45%;
}
.fifty {
	float:left;
	width:50%;
}
.sixty {
	float:left;
	width:60%;
}
.sixty-six {
	float:left;
	width:66%;
}
.seventy {
	float:left;
	width:70%;
}
.seventy-five {
	float:left;
	width:75%;
}
.eighty {
	float:left;
	width:80%;
} 
.eighty-five{
	float:left;
	width:80%;
}
.full{
	float:left;
	width:100%;
}
img.responsive{
	width: 100%;
	height: auto;	
}
	img.min-responsive{
		height: auto;
		max-width: 100%;
		min-width: 50%;
		width: auto;
	}
@media handheld, only screen and (max-width: 600px) {
	.ten,
	.fifteen,
	.twenty,
	.twenty-five,
	.thirty,
	.thirty-three,
	.thirty-four,
	.forty,
	.forty-five,
	.fifty,
	.sixty,
	.sixty-six,
	.seventy,
	.seventy-five,
	.eighty,
	.eighty-five {
		float:left;
		width:100%;
	} 
}
/****** FILE: themes/organsupply/css/typography.css *****/
/* BASE */
/* This file should only contain styles for tags, no specific classes. Those should be defined in the correct {PAGE}.css */

body {
	font: 400 0.875em/1em 'Lato', sans-serif;
}
h1,
h2,
h3 {
	color: #162c53;
}

h1 {
	font: 600 2.6em/1em 'Lato',sans-serif;
	padding: 10px 0;
	text-align: center;
}
h2 {
	font: 400 1.4em/1em "Lato",sans-serif;
	padding: 20px 0px 5px 0px;
	color:#E4B02F;
}
h3 {
	font: 400 1.4em/1em "Lato",sans-serif;
}
h4 {
	font: 400 1.2em/1em "Lato",sans-serif;
	padding: 10px 0;
}
h5 {
}
h6 {
}
p {
	font: 400 1em/1.6em 'Lato', sans-serif;
	padding: 5px;
}
ul,ol {
	font: 400 1em/1.6em 'Lato', sans-serif;
}
strong, b {
	font-weight: bold;
}
em, i {
	font: 400 'Lato', sans-serif;
	font-style: italic;
}
a, a:visited {
	color: #162c53;
	font: inherit;
	text-decoration: none;
}
a:hover {
	color: #162c53;
	text-decoration: underline;
}

/****** FILE: themes/organsupply/css/form.css *****/
.form{
	width: 100%;
}
	.form .field{
		margin-top: 10px;
		margin-bottom: 10px;
		width: 100%;    
		float: left;
	}
		.form .field label{
			float: left;
			margin-bottom: 4px;
			margin-top: 10px;
			width: 100%;
		}
		.form .field .middleColumn{
			width: 100%;
		}
			.form .field .middleColumn textarea,
			.form .field .middleColumn select,
			.form .field .middleColumn input{
				padding: 1%;
				width: 98%;
			}
			.form .field .middleColumn label.required{
				background: none repeat scroll 0 0 #FF0000;
				color: #FFFFFF;
				float: left;
				margin-bottom: 10px;
				padding: 1%;
				width: 98%;
			}
	.form .field.creditcard{
	}
		.form .field.creditcard .middleColumn input{
			width: auto;	
		}
	.form .field.checkbox{
	}
		.form .field.optionset input,
		.form .field.checkboxset input,
		.form .field.checkbox input{    
			float: left;
		}
		.form .field.optionset label,
		.form .field.checkboxset label,
		.form .field.checkbox label{
			margin-bottom: 0;
			margin-left: 0;
			margin-top: 0;
			width: auto;
		}
			.form .field.optionset ul li label,
			.form .field.checkboxset ul li label,
			.form .field.checkbox > label{
				margin-left: 5px;
			}
	.form .field.optionset{
	}
		.form .field.optionset .middleColumn{
		}
			.form .field.optionset .middleColumn ul{
				clear: both;
				float: left;
				list-style-image: none;
				margin: 5px 0 0;
				width: 100%;
			}
				.form .field.optionset .middleColumn ul li{
					clear: both;
					float: left;
					width: 100%;
				}
					.form .field.optionset .middleColumn ul li input{
						width: auto;
					}
					.form .field.optionset .middleColumn ul li label{
					}
	.form .Actions{
	}
		.form .Actions input{
			background-color: #162c53;
			color: #FFFFFF;
			position: relative;
			text-decoration: none;
			white-space: nowrap;
			padding: 10px 21px;
			border: none;
			cursor: pointer;
		}
			.form .Actions input:hover{
			}
			.form .Actions input:disabled{
				background-color: #cccccc;
				cursor: default;
			}
.required {
	color: #FF0000;
}
.form h2,
.form h3,
.form h4 {
	clear: both;
	padding: 10px 0;
}
.fieldgroup .results {
	background-color: rgba(255, 255, 255, 0.5);
    border: 1px solid #ccc;
    padding: 10px;
}
/* ORDER ONLINE */
.form .fieldgroup.nolabel {
	border: 1px solid #aaa;
	clear: both;
	margin: 10px 0;
	padding: 20px;
	width: 100%;
}
.form .fieldgroup-field input{
	padding: 1%;
	width: 98%;
}
.form label {
	float: left;
    margin-bottom: 4px;
    margin-top: 10px;
    width: 100%;
}
#Form_OrderOnlineForm_CustNumber {
	width: 70px !important;
}
.message.floated {
	clear:both;
	float: left;
	width: 100%;
}
#addbutton {
	color: #162c53;
	cursor: pointer;
	padding: 5px 0;
	width: 115px;
}
.cc_logos {
	float: left;
	padding: 5px 0;
	position: relative;
	width: 100%;
}
	.cc_logos ul li {
		display: inline;
		padding: 0 1%;
	}
/* ERROR MESSAGES */
.message {
	line-height: 2.5em;
	padding: 10px;
}
.message.required,
.message.validation,
.message.bad {
	background: #FF0000;
	color: #FFF;
}
	.message.bad a {
		color: #FFF;
		font-weight: bold;
	}
.message.info {
	background: #F4DA86;
}

/****** FILE: themes/organsupply/css/page.css *****/
body{
	background: #dadada;	
}
.container{
	max-width: 1000px;
	margin: 0 auto;	
	position: relative;
}
.space{
	margin: 15px;
	padding: 15px;	
}
/* COLORS */
.blue {
	color: #162c53
}
.burgandy {
	color: #320004;
}
.grey {
	color: #666;
}
.orange {
	color: #e4b02f;
}
.yellow {
	color: #ecbe29;
}

/* HEADER */
#header{
	position: relative;
	width: 100%;
}
	#header .container {
		height: 110px;
	}
#header .logo{
	float: left;
	position: relative;
}
	#header .logo img {
		z-index: 999;
	}
#header .nav-bg {
	background: url("/themes/organsupply/images/menu-bg.png") repeat-x scroll 0 0 transparent;
	bottom: 15px;
	height: 56px;
	position: absolute;
	width: 100%;
}
#header .nav {
	position: relative;
	top: 54px;
}
	#header .nav ul {
		float: left;
	}
		#header .nav ul li {
			float: left;
		}
			#header .nav ul li a {
				padding: 18px 15px;
			}
			#header .nav ul li a:hover,
			#header .nav ul li.section a {
				background: #ecbe29;
			}
		#header .nav ul li.no,
		.sub-nav ul li.no {
			display: none;
		}
#header .social {
	position: absolute;
    right: 20px;
    top: 8px;
}
	#header .social a {
		padding: 0 3px;
	}
/* MARQUEES */
#marquees {
    position: relative;
    width: 100%;
}
	#marquees .rotate {    
		height: 360px;
		position: relative;
		width: 100%;
	}
		#marquees .rotatee {
			/*height: 360px;*/
			position: absolute;
    		width: 100%;
		}
		#marquees img {
			height: auto;
			width: 100%;
		}
	#marquees .caption {
		background: none repeat scroll 0 0 #CCC;
		border-radius:3px;
		-webkit-border-radius: 3px;
		height: auto;
		left:2%;
		opacity: 0.9;
		-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
		filter: alpha(opacity=90);
		padding:20px;
		position:absolute;
		top:2%;
		width:auto;
	}
	#marquees .caption p {
	}
/* CONTENT */
#content {
}
	#content .container {
		background: none repeat scroll 0 0 #f2f2f2;
		border: 1px solid #d7d7d7;
	}
	#content.home > .container {
		padding: 12px 0;
	}
	#content .container #marquees {
		margin: 0 auto;
		max-width: 963px;
	}
	#content.home .container .products {
		margin-top: 222px;
	}
.right {
	float: right !important;
}
table {
	border: 1px solid #666;
	margin: 5px 0;
	width: 100%;
}
	table thead tr {
		background: #333;
	}
		table thead tr th {
			border: 1px solid #666;
			color: #FFF;
			padding: 10px;
		}
	table tbody tr:nth-child(odd) {
		background: none repeat scroll 0 0 #FFF;
	}
	table tbody tr:nth-child(even) {
		background: none repeat scroll 0 0 #F6E19D;
	}
	table tbody tr td {
		border:1px solid #666;
		padding: 10px;
	}
#product-container {
	padding: 0 0 0 1%;
}
.product {
	/*padding: 2% 1.5%;*/
	text-align: center;
}
	.product:hover {
		background: #d8d8d8;
	}
.product.full-catalog {
	padding: 6% 1.5%;
}
.catalog-section {
	color: #162c53;
    font-style: italic;
    padding: 0;
    text-transform: none;
}
/* SIDEBAR NAVIGATION */
.sub-nav {
	background: none repeat scroll 0 0 #fff;
    border: 1px solid #e5e5e5;
    margin-top: 15px;
    padding: 10px;
    width: 85%;
}
.sub-nav ul li {
	padding: 10px 5px;
}
.box {
	padding: 10px 15px;
}
/* FOOTER */
#footer .container,
.section .container,
#marquees .container {
	border: none !important;
	background: none !important;
}
#footer .col2 {
	text-align: right;
}

img.right{
	float:right;
	padding:5px;	
}

img.left{
	float:left;	
	padding:5px;
}


/* TYPOGRAPHY */
/* NAVIGATION */
#header .nav ul li a,
#header .nav ul li a:hover,
#header .nav ul li a:visited {
	font: 700 0.875em/1em 'Lato', sans-serif;
	color: #162c53;
	text-decoration: none;
	text-transform: uppercase;
}
.sub-nav ul li a,
.sub-nav ul li a:hover,
.sub-nav ul li a:visited {
	font: 400 1em/1em 'Lato', sans-serif;
	text-decoration: none;
	text-transform: uppercase;
}
.sub-nav ul li a {
	color: #162c53;
}
.sub-nav ul li a:hover,
.sub-nav ul li.section a {
	color: #e7ae22;
}
/* CONTENT */

/* PRODUCT AREA */
.product a {
	color: #000;
	padding: 5px;
	text-decoration: none;
	text-transform: uppercase;
}
.product img {
	height: auto;
	max-width: 200px;
	width: 100%;
}
/* SPINNER */
#spinner{
	background: none repeat scroll 0 0 #FFFFFF;
    float: left;
    height: 100%;
    left: 0;
    opacity: 0.5;
    position: absolute;
    top: 0;
    width: 100%;
	display: none;
	z-index: 2000000;
}
	#spinner .position{
		left: 50%;
		position: fixed;
		top: 40%;
	}

@media handheld, only screen and (max-width: 1000px) {
	/* HEADER */
	#header .logo img {
		left: -10px;
		position: relative;
	}
	/* NAVIGATION */
	#header .nav {
		margin: 0;
		top: auto;
		width: 100%;
	}
	#header .nav ul{
		background: none repeat scroll 0 0 #e7ae22;
		display: block;
		float: left;
		padding: 0;
		position: relative;
		width: 100%;    
		z-index: 9999;
	}
	#header .nav ul:hover li {
		display: block;
	}
	#header .nav ul li {
		border: medium none;
		display: none;
		float: left;
		margin: 0;
		padding: 0;
		width: 100%;
	}
	#header .nav ul li.no {
		background: url("/themes/organsupply/images/nav-mobile-bg.png") no-repeat scroll 95% 45% #e7ae22;
		display: block; 
		position: relative;
		z-index: 1;
	}
		#header .nav ul li a {
			float: left;
			padding: 3% 5%;
			width: 90%;
		}
		#header .nav ul li a:hover {
			background: #ffffff;
			color: #e7ae22;
		}
	/* CONTENT */
	#content .container #marquee {
		width: 98%;
	}
	#content {
		margin-top: 8%;
	}
	#home-banner,
	#home-banner .container {
		height: auto !important;
	}
		#home-banner {
			position: relative !important;
			top: auto !important;
		}
	.products,
	.product {
		margin:0 !important;
		padding: 2% 0 !important;
	}
	.products {
		width: 98%;
	}
	/* SIDEBAR */
	.sub-nav,
	.box {
		margin: 0 auto;
		width: 80%;
	}
	/* FOOTER */
	#footer .col2 {
		text-align: left !important;
	}
	
}
@media handheld, only screen and (max-width: 600px) {
	.sub-nav {
		background: none;
		border: none;
	}
	.sub-nav ul{
		background: none repeat scroll 0 0 #e7ae22;
		display: block;
		float: left;
		padding: 0;
		position: relative;
		width: 100%;    
		z-index: 9999;
	}
	.sub-nav ul:hover li{
		display: block;
	}
	.sub-nav ul li {
		border: medium none;
		display: none;
		float: left;
		margin: 0;
		padding: 0;
		width: 100%;
	}
	.sub-nav ul li.no {
		background: url("/themes/organsupply/images/nav-mobile-bg.png") no-repeat scroll 95% 45% #e7ae22;
		display: block; 
		position: relative;
		z-index: 1;
	}
	.sub-nav ul li a {
		float: left;
		padding: 3% 5%;
		width: 90%;
	}
		.sub-nav ul li a:hover {
			background: #ffffff;
			color: #e7ae22;
		}
	#marquees .caption {
		display: none;
	}
}

