body {
	max-width: 1200px; margin: 0 auto !important; float: none !important; background-color: #eee;
	font-family: 'Open Sans', sans-serif; font-size: 16px; line-height: 1.7em;}
h1	{font-weight: normal; font-size: 3em; color: #fff; line-height: 1em;}
h2	{font-weight: normal; font-size: 2em; color: #194072; line-height: 1em; margin:0; padding-top:3%}
h3	{font-weight: bold; font-size: 1.25em; color: #194072;}

hr	{border: 0; border-bottom: 1px dotted #8094b6; background: #fff; clear: both; width: 100%;}

input[type="text"], textarea	
	{width: 96%; color: #999; background-color: #eee; padding: 2%; border: solid 1px #dcdcdc; margin-bottom: 20px;
	 font-family: 'Open Sans', sans-serif; font-size: 16px;
  	 transition: box-shadow 0.3s, border 0.3s;}
input[type="text"]:focus, input[type="text"].focus, textarea:focus, textarea.focus 
	{border: solid 1px #707070; box-shadow: 0 0 5px 1px #969696;}
input.btn
	{display:block; margin:0 auto 1em}
a 	{color: #619ce5; text-decoration: none;}
a:hover 
	{color: #619ce5; text-decoration: underline;}

.center	
	{text-align: center;}

.btn 
	{display:inline-block; color: #ffffff; background-color: #033e73; padding: 10px 20px 10px 20px; text-decoration: none; white-space:nowrap}
.btn.bookmark 
	{background: url(../images/icon-mark.png) #033e73 no-repeat top 3px left 12px; padding: 10px 20px 10px 40px;}
.btn.doc 
	{background: url(../images/icon-doc.png) #033e73 no-repeat top 3px left 12px; padding: 10px 20px 10px 50px;}
.btn.mail 
	{background: url(../images/icon-mail.png) #033e73 no-repeat top 7px left 12px; padding: 10px 20px 10px 70px; font-size: 1.5em; border: none;}
.btn.web 
	{color: #033e73; background: url(../images/icon-web.png) #fff no-repeat top 10px left 12px;	padding: 10px 20px 10px 70px;}
.btn.web:hover 
	{opacity: .5; color: #fff;}
.btn:hover, .btn.bookmark:hover, .btn.doc:hover, .btn.mail:hover 
	{color: #fff; background-color: #8094b6; text-decoration: none; cursor: pointer;}

.email	
	{padding: 6px 0px 6px 30px;background: url(../images/icon-email.png) no-repeat top 8px left 0px;}

.ltblue {
	background-color: #8094b6;
	color: #fff;
	font-weight: normal;
	font-size: 2.5em;
	line-height: 1em;
}

.herosub	{
	font-weight: normal;
	font-size: 1.5em;
	color: #fff;
}

#container {
	width: 100%;
	height: auto;
	background-color: #fff;	
}

.inner-content {
	width: 95%;
	height: auto;
	margin: 0 2.5% 0 2.5%;
	clear:left;
}

.header {
	position: relative;
	height: 130px;
	}
	
.header .logo, .header .nav {
	display: table;
	height: 130px;
	margin-bottom: 0;
	}
	
.header .logo div, .header .nav div 
	{display: table-cell; vertical-align: bottom;}
	
ul.tab-navigation 
	{margin-right: 2.5%;}
.tab-navigation li {
	float: right;
	background-color: #194072;
	list-style:none;
	border-bottom: 1px solid #fff;		
}



.tab-navigation a {
	display: block;
	border-left: 1px solid #fff;
	height: 50px;
	line-height: 50px;
	width: auto;
	text-align: left;
	color: #fff;
	text-decoration: none;	
	padding: 0 24px 0 40px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1em;
	opacity: .5;
		
}

.footer .col8-12
	{float:right}
ul.footer-navigation 
	{margin:0 -2.5% 0 0}
.footer-navigation li 
	{float: right; list-style:none;}

.footer-navigation a 
	{display: block; width: auto; padding: 0 24px 0 40px; text-align: left; color: #fff; text-decoration: none;	 
	 text-transform: uppercase; font-weight: bold; font-size: 1em; height: 50px;	line-height: 50px;}
.footer-navigation a:hover 
	{opacity: .5;}

.fb	{
	width: 	20%;
	float: right;
	clear: both;
}

.nav-about {
	background: url(../images/nav-about.png) no-repeat top 10px left 12px;
}

.nav-lines {
	background: url(../images/nav-lines.png) no-repeat top 10px left 12px;
}

.nav-contact {
	background: url(../images/nav-contact.png) no-repeat top 10px left 12px;
}

.nav-sales {
	background: url(../images/nav-sales.png) no-repeat top 10px left 12px;
	padding: 0 20px 0 48px !important;

}

.footernav .nav-contact {
	background: url(../images/nav-contact.png) no-repeat top 10px left 12px;
	padding: 0 0 0 40px;
}


.tab-navigation a:hover {
	opacity: 1;
}

.tab-navigation a.selected {
	opacity: 1;
	margin-top: -5px;
	margin-bottom: -1px;
	height: 56px;
}

.tab-navigation a.selected.nav-about {
	background-color: #862c27;	
}

.tab-navigation a.selected.nav-lines {
	background-color: #367296;	
}

.tab-navigation a.selected.nav-sales {
	background-color: #d07100;	
}

.tab-navigation a.selected.nav-contact {
	background-color: #669e42;	
}

.col img {
	width: 100%;
	height: auto;
}

.homehero {
	height: auto;
	border-top: 6px solid #194072;	
}

.hero	{
	display: table; 
	background: #525252;
	color: #fff;
	width: 100%;
	height: 190px;
}

.hero.about {
	border-top: 6px solid #862c27;
	background: url(../images/hero-about.jpg) no-repeat top left;
}
.hero.lines {
	border-top: 6px solid #367296;
	background: url(../images/hero-lines.jpg) no-repeat top left;
}
.hero.sales {
	border-top: 6px solid #d07100;
	background: url(../images/hero-sales.jpg) no-repeat top center;
}
.hero.contact {
	border-top: 6px solid #669e42;
	background: url(../images/hero-contact.jpg) no-repeat top center;
}

.hero div {
	display: table-cell;
	width: 100%;
	vertical-align: middle;	
	padding: 0 2.5% 0 2.5%;
}

.homeblock {
	min-height: 350px;
	border-bottom: 4px solid #999;	
}

.homeblock.news {
	border-bottom: 4px solid #669e42;	
}

.homeblock.brands {
	border-bottom: 4px solid #367296;	
}

.homeblock.excel {
	border-bottom: 4px solid #862c27;	
}

.homeblock h3 	{
	display: block;
	background: #999;
	padding: 25% 5% 2% 5%;
	color: #fff;
	font-weight: normal; 	
}

.homeblock.news h3 	{
	background: url(../images/bg-news.jpg) no-repeat top left;	
}

.homeblock.brands h3 	{
	background: url(../images/bg-lines.jpg) no-repeat top left;	
}

.homeblock.excel h3 	{
	background: url(../images/bg-excel.jpg) no-repeat top left;	
}

.homeblock p, .homeblock ul {
	margin: auto 3% auto 5%;	
	
}

.homeblock p.link 	{
	display: block;
	text-align: right;
	font-size: .875em;
	font-weight: bold;
	margin-top: 5%; 	
}

.homeblock.excel p.link a	{
	color: #862c27;
}

.homeblock.brands p.link a	{
	color: #367296;
}

.footer {
	position: relative;
	height: auto;
	background-color: #194072;
	}
	
.footer div 
	{margin-top: 2%;}

.address	{
	font-size: .875em;
	margin-left: 25%;
	color: #fff;
	line-height: 1.3em;
}

.copyr {
	text-align: center;
	color: #fff;
	opacity: .5;
	font-size: .875em;
	clear: both;
	margin: 30px 0 30px 0;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

table { 
  width: 100%; 
  border-collapse: collapse; 
}

th { 
  background: #367296; 
  color: white; 
  font-weight: bold; 
}
td, th { 
  padding: 6px; 
  border-left: 1px dotted #ccc; 
  border-bottom: 1px solid #367296; 
}

th:nth-of-type(1), td:nth-of-type(1) {
	border-left: none; 
}

ul	{
	list-style: disc outside none;
}

/*@media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px)  {
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	td:before { 
		position: absolute;
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
	td:nth-of-type(1):before { content: "Brand"; }
	td:nth-of-type(2):before { content: "Products"; }
}
*/

.col1-12, .col2-12, .col3-12, .col4-12, .col5-12, .col6-12, .col7-12, .col8-12, .col9-12, .col10-12, .col11-12, .col12 
	{display:block; float: left; margin: 1% 0 1% 3%;}
.col1-12.first, .col2-12.first, .col3-12.first, .col4-12.first, .col5-12.first, .col6-12.first, .col7-12.first, .col8-12.first, .col9-12.first, .col10-12.first, .col11-12.first, .col12 
	{margin-left: 0; clear: left;}
.col1-12 { width: 5.583% !important; }
.col2-12 { width: 14.16% !important; }
.col3-12 { width: 22.5% !important; }
.col4-12 { width: 31.33% !important; }
.col5-12 { width: 39.91% !important; }
.col6-12 { width: 48.5% !important; }
.col7-12 { width: 57.08% !important; }
.col8-12 { width: 65.66% !important; }
.col9-12 { width: 74.25% !important; }
.col10-12 { width: 82.83% !important; }
.col11-12 { width: 91.41% !important; }
.col12 { width: 100% !important; margin: 0; }

.col1-12 img, .col2-12 img, .col3-12 img, .col4-12 img, .col5-12 img, .col6-12 img, .col7-12 img, .col8-12 img, .col9-12 img, .col10-12 img, .col11-12 img, .col12 img 
	{width: 100% !important; height: auto !important;	display: block;}

.img-50 .col img
	{width:50% !important; margin:0 auto;}
.salesmap
	{position:relative; margin:1% 0 3em}
.overlay
	{opacity:0; position:absolute; width:258px; height:130px; top:0; left:0; border:3px solid #033e73; background:#fff;
	 box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75); -webkit-box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75); -moz-box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75);
	 transition:opacity 0.3s 0s ease-in; -webkit-transition:opacity 0.3s 0s ease-in; -moz-transition:opacity 0.3s 0s ease-in}
.overlay.on
	{opacity:1; z-index:2;
	 transition:opacity 0.3s 0s ease-out; -webkit-transition:opacity 0.3s 0s ease-out; -moz-transition:opacity 0.3s 0s ease-out}
.inside-sales
	{width: 350px; right: 0%; bottom: 0%; position:absolute; border:3px solid #033e73; background:#fff;
	 box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75); -webkit-box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75); -moz-box-shadow: 5px 5px 10px -4px rgba(3,62,115,0.75);}
.tail
	{position:absolute; width:74px; height:136px; bottom:-136px; right:150px; background:url(../images/bg-rep-tile-left.png) top right no-repeat; background-size:auto 100%}
.rep	
	{display:none; position:absolute; top:0; left:0; width:100%; }
.rep.on
	{display:block}
.rep p, .inside-sales p
	{margin:20px}
.col6-12 .sec_img
	{width:60% !important; margin:auto}

input.error, textarea.error {
    border-color: red;
}
	
@media only screen and (max-width:980px) {
.header 
	{position: relative; height: 80px;}
.header .logo   
	{display: table; height: 80px; width: 50% !important;}
.header .nav 
	{margin: 0; height: 60px; width: 100% !important;}
.btn
	{white-space:normal; background-position:12px center !important}
.indent
	{margin-left:2%}
.tail
	{height:90px; bottom:-90px}
.overlay
	{height:130px;}
}

@media only screen and (max-width:840px) {
.footer .mobile-first
	{clear:right}
.footer .col8-12
	{width:50% !important}
.footer .col4-12
	{width:45% !important}
.footer-navigation li
	{width:45%}
.fb	{width:32%; margin-right:2%;}
.rep p, .inside-sales p
	{margin-bottom: 10px;}
}

@media only screen and (max-width:800px) {
.img-50	.col
	{width:100% !important}
.col .col2-12 
	{width: 31.33% !important; }
.img-50 .center
	{text-align:left; margin-left:3%}
.img-50 .col img
	{width:30% !important; float: left; margin-right: 3%; padding-bottom:3%}
.with-btn
	{text-align:center}
.indent
	{margin-left:1%}
.inside-sales
	{position: relative; float: right; margin-top:-38%;}
}

@media only screen and (max-width:700px) {
.tail
	{height:60px; bottom:-60px}
.overlay
	{width:218px;}
.inside-sales
	{float:none; width:98%; margin:-2em auto 2em;}
}

@media only screen and (max-width:600px) {
body
	{font-size:14px}
.header .logo   
	{display:table; height:45px; width:94% !important; margin:3% 3% 0}
ul.tab-navigation
	{padding-left:0; margin-right:auto}
.tab-navigation li
	{width:25%}
.tab-navigation a
	{background-position:center 5px; background-size:auto 20px; line-height:72px; padding:0 !important; text-align:center}
.tab-navigation a.selected
	{background-size:auto 25px; line-height:82px}
.tab-navigation a.selected.nav-about
	{border-left:none}
.footer .col8-12
	{display:none}	
.footer .col4-12
	{margin:0 0 0 25%}
.col1-12, .col2-12, .col3-12, .col4-12, .col5-12, .col6-12, .col7-12, .col8-12, .col9-12, .col10-12, .col11-12, .col12 
	{width:100% !important; margin:0}
.homeblock
	{min-height:inherit}
.homeblock h3
	{background-size:100% auto !important;}
.lines .col3-12 img
	{width:50% !important; margin:0 auto}
.overlay
	{width:200px; height:80px; border-width:2px;}
.tail
	{height:70px; bottom:-70px}
.rep p
	{margin:5px 10px;}
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
.col1-12, .col2-12, .col3-12, .col4-12, .col5-12, .col6-12, .col7-12, .col8-12, .col9-12, .col10-12, .col11-12, .col12
	{width:100% !important; margin-left:0%}
.footer .col4-12
	{width:75% !important; margin:0 0 0 12%}
.col .col2-12 { width: 48.5% !important; }
.img-50 .col img
	{width:60% !important; float:none; margin:3% auto;}
.img-50 .center
	{text-align:center; margin-bottom:2em}
.lines .col3-12 img
	{width:75% !important; margin:0 auto}
.overlay
	{width:200px; height:80px;}
.tail
	{width:35px; height:50px; bottom:-50px;}
.rep p 
	{margin:5px 10px}
}

