/*------------------------------Overall Styles----------------------------*/

* {
	margin:0px;
	padding:0px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a img {
	border:none;
}

a {
	text-decoration:none;
	color:#333;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body {
	background:#141517 url('/include/images/main-bg.jpg') no-repeat center center;
	background-attachment:fixed;
}

#site-holder {
	width:960px;
	background:white;
	margin:0px auto;
	border-top:11px solid #9d9da0;
	position:relative;
	box-shadow: 0px 0px 10px #000;
}

.col {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align: top;
}



/*----------------------------------Header---------------------------------*/

#header {
	height:110px;
	display:block;
	width:100%;
	position:relative;
}

#top-subnav {
	background:#145ba3;
	position: absolute;
	top:0px;
	right:-11px;
	padding: 5px 12px 5px 7px;
}

#top-subnav img {
	display: inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align: middle;
	padding: 0px 5px 0px 5px;
}

#top-subnav a {
	color:#fff;
	font-size: 13px;
}

#top-subnav a:hover {
	text-decoration: underline;
}

#top-subnav:after {
	border-color: #071c32 transparent;
	border-style: solid;
	border-width: 11px 11px 0px 0px;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	right: 0;
	bottom: -11px;
}

#top-subnav:before {
	border-color: #145ba3 transparent;
	border-style: solid;
	border-width: 28px 0px 0px 28px;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	left: -28px;
	top:0;
}

#header .logo {
	display: inline-block;
	*display: inline;
	*zoom:1.0;
	margin: 15px 40px 0px 40px;
}

#main-nav {
	display: block;
	position: absolute;
	right: 30px;
	bottom: 20px;
}

#main-nav li{
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	list-style:none;
}

#main-nav li a{
	color:#777;
	display:block;
	text-transform: uppercase;
	padding: 5px 10px;
	font-size: 13px;
	transition:color 400ms;
}

#main-nav li:hover a {
	color:#333;
}

#main-nav .active:hover a {
	color:#145ba3;
}

#main-nav .active a{
	color:#145ba3;
}



/*--------------------------------Footer----------------------------*/

#footer {
	background:#7d7c80;
	padding: 10px;
	display: block;
	text-align: center;
}

#footer .col {
	margin: 20px 30px;
	text-align: left;
}

#footer .three li {
	padding-left: 0;
}

#footer li, #footer li a {
	color:white;
	font-size: 10px;
	font-weight: normal;
	list-style: none;
	background-position: left top;
	background-repeat: no-repeat;
}

#footer li {
	padding-left: 20px;
}

#footer a:hover {
	text-decoration: underline;
}

#footer .two li { 
	margin: 8px 0px;
}

#footer .three li {
	margin: 5px 0px;
}

#footer h4 {
	font-size: 14px;
	font-weight: bold;
	color: #d5d5d5;
}

#footer .address {
	background-image: url('/include/images/icon-small-home.png');
}

#footer .phone {
	background-image: url('/include/images/icon-small-phone.png');
}

#footer .email {
	background-image: url('/include/images/icon-small-mail.png');
}

#footer .copyright {
	font-size: 11px;
	color: #ddd;
	display: block;
	text-align: right;
	margin-top:-20px;
}



/*---------------------------Homepage Content----------------------------*/
#home-slider #slides .slides_container {
	height:359px;
	width:960px;
}

#sub-slider #slides .slides_container, #sub-slider {
	height:222px;
	width:705px;
}

#sub-slider {
	margin-left:20px;
}

.pagination {
	display:none;
}

#slides {
	position:relative;
} 

#slides img {
	display:block;
}

#slides .prev, #slides .next {
	background-color:#aaa;
	position:absolute;
	top:0px;
	bottom:0px;
	height:100%;
	z-index:999;
	vertical-align:middle;
	color:white;
	font-size:70px;
	padding:0px 10px;
	line-height:222px;
	opacity:0;
	transition: opacity 400ms;
	margin:auto;
}

#home-slider #slides .prev, #home-slider #slides .next {
	line-height:359px;
}

#slides:hover .prev, #slides:hover .next {
	opacity:.4;
}

#slides .prev:hover, #slides .next:hover {
	opacity:.8;
}

#slides .prev {
	left:0px;
}

#slides .next {
	right:0px;
}

#intro {
	text-align: center;
	display: block;
	padding: 40px 120px;
}

#intro h1 {
	font-size: 18px;
	color: #004a98;
	margin-bottom: 5px;
}

#intro p {
	font-size: 11px;
	color: #777;
	transition: color 400ms;
}

#intro:hover p {
	color: #333;
}

#sub-articles {
	background:#dedfe0;
	width:100%;
	display:block;
	text-align: center;
	position: relative;
}

#sub-articles .featured-p {
	display: block;
	color:white;
	position: absolute;
	background-color: #1c5ea2;
	top:-20px;
	left: -11px;
	padding: 8px 12px;
	font-weight: bold;
	font-size: 13px;
	z-index: 9;
}

#sub-articles .featured-p:before {
	border-color: #071c32 transparent;
	border-style: solid;
	border-width: 11px 0px 0px 11px;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	left: 0px;
	bottom:-11px;
}

#sub-articles .featured-p:after {
	border-color: #1c5ea2 transparent;
	border-style: solid;
	border-width: 32px 32px 0px 0px;
	content: "";
	display: block;
	position: absolute;
	width: 0;
	right: -32px;
	top: 0px;
}

#sub-articles h4 {
	border-top:2px solid #004a98;
	border-bottom:2px solid #004a98;
}

#sub-articles .readmore {
	color:#004a98;
}

#sub-articles li {
	width:204px;
	position:relative;
	padding: 24px 17px;
	transition:background 400ms;
	text-align: left;
}

#sub-articles li a {
	display: block;
	position:relative;
	color:#777;
	transition:color 400ms;
	height: 255px;
}

#sub-articles li h3 {
	font-size: 15px;
	padding: 5px 0px;
	font-weight: bold;
}

#sub-articles li h4 {
	font-size: 10px;
	padding: 5px 0px;
}

#sub-articles li p {
	font-size: 10px;
	display: block;
	margin-top:7px;
}

#sub-articles li:hover a {
	color:#000;
}

#sub-articles li:hover {
	background: #bdbdbd;
}

#sub-articles .readmore {
	position: absolute;
	bottom:0px;
	right:0px;
	font-size: 10px;
	font-weight: bold;
}

#sub-articles .playvideo {
	position: absolute;
	bottom:0px;
	left:0px;
	font-size: 10px;
	font-weight: bold;
	display:inline;
	color:#004a98;
	vertical-align:center;
}

li:hover .playvideo {
	color:#004a98;
}

#benefits {
	display: block;
	text-align: center;
}

#benefits .col {
	width: 260px;
	text-align: left;
	margin: 20px 0px;
	padding: 0px 25px;
	border-left: 1px solid #ddd;
}

#benefits .col:first-child {
	border:none;
}

#benefits p {
	color: #777;
	font-size: 10px;
	transition:color 400ms;
}

#benefits:hover p {
	color: #333;
}



/*-----------------------------Product List Page--------------------------*/

#sub-page {
	width:960px;
	border-top:5px solid #c5c5c8;
	text-align:center;
}

#side-nav li>ul {
	max-height:0px;
	overflow:hidden;
	transition-property: max-height;
	transition-duration: 1s;
	transition-delay: 300ms;
	-webkit-transition-property: max-height;
	-webkit-transition-duration:1s;
	-webkit-transition-delay: 300ms;
}

#side-nav li:hover>ul {
	max-height:800px;
}

#side-nav {
	width:195px;
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:top;
	list-style-type:none;
	padding:15px 0px 15px 15px;
	text-align:left;
}

#side-nav li {
	border-bottom: 1px solid #eee;
}

#side-nav li li:hover {
	background-color: #eee;
}

#side-nav li li li:hover {
	background-color: #ddd;
}

#side-nav ul, #side-nav ul ul {
	padding-left:7px;
	list-style-type:none;
}

#side-nav li a {
	text-transform:uppercase;
	font-size:11px;
	line-height: 12px;
	padding: 3px 5px 3px 10px;
	display: block;
}

#side-nav ul li a {
	font-style:italic;
}

#side-nav .active>ul {
	max-height:800px;
}

#side-nav .active>a {
	color:#005aa1;
	opacity:0.5;
}

#side-nav .current.active>a {
	opacity:1;
}

#product-content {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:top;
	max-width:740px;
	border-left:2px solid #d5d5d7;
	margin: 20px 0px;
}

#product-content h1 {
	display:block;
	text-align:left;
	font-weight:normal;
	font-style:italic;
	text-transform:uppercase;
	color:#005da3;
	font-size:30px;
	margin:16px;
	border-bottom:2px solid #005da3;
}

#product-content p {
	text-align:left;
	font-size:15px;
	line-height:22px;
	padding:0px 20px;
	margin:10px 0px;
}

.product-grid a {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:top;
	margin: 10px 15px;
	text-align:left;
}

.product-grid a span{
	font-size:12px;
	font-weight:bold;
	text-transform:uppercase;
	font-style:italic;
}

.product-grid.large a span{
	font-size:18px;
}

.product-grid a:hover img {
	background-color: #ccc;
}

.product-grid a img {
	display:block;
	padding:5px 0px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	background-color:#fff;
	transition:background-color 400ms;
}



/*--------------------------------Product Detail Page----------------------------*/

#productpage-content h1 {
	color: #3c3c3e;
	font-size:40px;
	font-style: italic;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
	text-align: left;
	padding-left: 20px;
}

#productpage-content {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:top;
	max-width:740px;
	border-left:2px solid #d5d5d7;
	margin: 20px 0px;
}

#productpage-content #mainContent {
	display: block;
	width: 740px;
	text-align: center;
}

#mainContent #mainImage {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:middle;
	padding: 8px 0px;
	border-top:2px solid #bbb;
	border-bottom:2px solid #bbb;
	margin: 8px 0px;
	width: 372px;
	height: 430px;
}

#mainContent #description {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align:middle;
	max-width: 310px;
	margin-left: 20px;
	text-align: left;
}

#mainContent #description p {
	font-size: 15px;
	margin-bottom: 8px;
	color:#444;
}



/*------------------------------Tabbed Product Page Content---------------------------*/

.tabs {
	text-align: left;
	margin-left: 20px;
	margin-bottom: -1px;
}

.tabs li {
	list-style:none;
	display:inline-block;
	*display:inline;
	*zoom:1.0;
}

.tabs a {
	padding:3px 10px;
	display: block;
	background:#bbb;
	color:#fff;
	text-decoration:none;
	border:1px solid #bbb;
	border-radius: 5px 5px 0px 0px;
	font-size: 13px;
}

.tabs a:hover {
	background: #666;
}

.tabs a.active:hover {
	background: #fff;
}

.tabs a.active {
	background:#fff;
	color:#000;
	border-bottom: 1px solid #fff;
}

#info-content {
	border:1px solid #bbb;
	padding-bottom: 20px;
	text-align: left;
	width: 700px;
	margin-left: 20px;
}

#tabbed-content {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	width: 400px;
	vertical-align: top;
	margin-left: 20px;
}

#tabbed-content h3 {
	font-size: 16px;
	font-weight: bold;
	color:#0069aa;
	text-transform: uppercase;
	margin-top: 9px;
}

#tabbed-content a {
	color:#0069aa;
	font-size: inherit;
	font-weight: bold;
}

#tabbed-content ul {
	padding-left: 20px;
}

#tabbed-content li {
	font-size: 12px;
	font-weight: normal;
	margin-top: 3px;
}

#tabbed-content p {
	font-size: 12px;
	font-weight: normal;
	margin-top: 9px;
}

#thumbImgs {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	width: 255px;
	vertical-align: top;
	margin-left: 15px;
	padding-top: 20px;
	text-align: center;
}

#thumbImgs a {
	display:inline-block;
	*display:inline;
	*zoom:1.0;
	vertical-align: top;
	margin: 3px;
	position: relative;
}

#thumbImgs a:before {
	background: #fff;
	content: "";
	display: block;
	position: absolute;
	top:5;
	left: 5;
	z-index: 99;
	padding: 1px 5px 2px 5px;
	border-radius: 15px;
	color:#0069aa;
	font-size: 11px;
	border:1px solid #0069aa;
	font-weight: bold;
}

#thumbImgs a:nth-child(1):before {
	content: "1";
}

#thumbImgs a:nth-child(2):before {
	content: "2";
}

#thumbImgs a:nth-child(3):before {
	content: "3";
}

#thumbImgs a:nth-child(4):before {
	content: "4";
}

#thumbImgs a:nth-child(5):before {
	content: "5";
}

#thumbImgs a:nth-child(6):before {
	content: "6";
}

#thumbImgs img:nth-child(7):before {
	content: "7";
}

#thumbImgs img:nth-child(8):before {
	content: "8";
}

#thumbImgs img:nth-child(9):before {
	content: "9";
}

#thumbImgs img:nth-child(10):before {
	content: "10";
} 

#thumbImgs img {
	cursor: pointer;
}

