@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700);
@import url(https://fonts.googleapis.com/css?family=Raleway:100,300,400,600,800);
@import url(https://fonts.googleapis.com/css?family=Catamaran:400,800,200,300,100,500,600,700,900);

body { font-size: 100%;}

.top-bar-section ul li {
	background: none;
}

.row {
	max-width: 75em;
}

#headerbg {
	background-image: url("/images/headerfade.png");
	background-repeat: repeat-x;
    z-index: 50;
    position: absolute;
    top: -5px;
    left: 0;
    width: 100%;
    height: 82px;
    opacity: 1;
    z-index: 101;
}
  
  
td .photo {
    float: right;
}

.medialink {
	border: 1px solid #799bab;
	margin-bottom: 1em;
	display: inline-block;
}

.margin2em {
	margin-bottom: 2em;
}

.bottomborder .columns {
	border-bottom: 1px solid #ccc;
}

/* SMALL */
@media only screen {
	body {
		min-width: 30em;
	}

	#header {
		position: absolute;
		left: 0;
		right: 0;
		margin: 0 auto;
		max-width: 75em;
		z-index: 1000;
	}
	#header nav {
		position: relative;
		z-index: 100;	
	}
	
	#header .top-bar-section ul {
		background-color: #333;
		height: auto !important;
		display: inline; 
		position: absolute;
		top: 76px;
		left: 0;
		width: 100%;
		z-index: 1;
	}
	
	#header .top-bar-section ul li {
		display: inline-block;
	} 
	
	#header .top-bar-section ul.left {
		margin: 0 auto;
	}
	
	#header ul.fb {
		background: none;
		position: absolute;
		top: 0;
		right: 50px;
		height: 100%;
	}
	
	#header ul.fb li a {
		line-height: 76px;
		background: none;
		font-size: 12px;
		font-weight: bold;
		padding: 0 12px;
		display: block;
	}
	
	#header .top-bar-section li a:not(.button) {
		line-height: 50px;
		background: none;
		font-size: 12px;
		font-weight: bold;
		padding: 0 10px;
		display: block;
	}
	        
	.main-nav {
		width: 100%;
		height: 82px;
		line-height: 76px;
		position: absolute;
		margin-bottom: 0;
	}
	
	.main-nav #logo {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		margin: 0 auto;
		z-index: 1000;
	}
	
	.main-nav ul {
		margin-bottom: 0;
		list-style: none; 
	}
	
	.main-nav .row {
		max-width: none;
	}
	
	.main-nav form,
	.main-nav input {
		margin-bottom: 0; 
	}
	
	.main-nav input {
		height: auto;
		padding-top: .35rem;
		padding-bottom: .35rem;
		font-size: 0.75rem; 
	}
	
	.main-nav .button {
		padding-top: .45rem;
		padding-bottom: .35rem;
		margin-bottom: 0;
		font-size: 0.75rem; 
	}
	
	.main-nav .title-area {
		position: relative;
		margin: 0; 
	}
	
	.main-nav .name {
		height: 45px;
		margin: 0;
		font-size: 16px; 
	}
	
	.main-nav .name h1 {
		line-height: 45px;
		font-size: 1.0625rem;
		margin: 0; 
	}
	
	.main-nav .name h1 a {
		font-weight: normal;
		color: white;
		width: 50%;
		display: block;
		padding: 0 15px; 
	}
	
	.banner {
	  width: 100%;
	  margin-left: auto;
	  margin-right: auto;
	  margin-top: 0;
	  margin-bottom: 0;
	  max-width: 75em;
	  *zoom: 1; 
	  position: relative;
	}
	
	.banner ul {
		display: none;
	}
	
	.orbit-container .orbit-slides-container > * .orbit-caption {
		bottom: 0;
		background-color: rgba(0,0,0,0.5);
		color: white;
		padding: 10px 15px 10px 15px;
		font-size: 0.775rem; 
		width: 250px;
		height: 42px;
		font-size: 11px;
	}
	
	.orbit-caption h5 {
		color: #B2E1F1;
		font-weight: bold;
		margin-bottom: 0;
		font-size: 13px;
	}
	
	.orbit-container .button {
		display: inline-block;
		background-color: #4f545c;
		font-family: 'Open Sans', sans-serif;
		font-weight: 700;
		font-size: .6em;
		margin-top: 10px;
	}
	
	.orbit-container div.title {
		position: absolute;
		top: 20%;
		width: 100%;
		text-align: center;
	}
	
	.orbit-container div.titleright {
		position: absolute;
		top: 35%;
		right: 3%;
		width: 42%;
		text-align: left;
	}
	
	.orbit-container div.titlebottom {
		position: absolute;
		bottom: 0;
		width: 100%;
		text-align: left;
		padding: 2% 5% 2% 5%;
		background-color: rgba(0, 0, 0, 0.4)
	}
	
	.orbit-container div.titlebottom h1 {
		color: #fff;
		display: block;
		font-family: 'Open Sans', sans-serif;
		font-weight: 800;
		font-size: 1em;
		line-height: 1em;
		margin: 1em 0 .1em 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-container div.titlebottom h2 {
		color: #fff;
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 400;
		font-size: 1em;
		line-height: 1.5em;
		margin: 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-container div.titleright h1 {
		width: 100%;
		color: #4f545c;
		display: block;
		font-family: 'Open Sans', sans-serif;
		font-weight: 800;
		font-size: 1.5em;
		line-height: 1em;
		margin: 0 0 .1em 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-container div.titleright h2 {
		width: 100%;
		color: #727985;
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 200;
		font-size: 1.35em;
		line-height: 1.5em;
		margin: 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-container div.title h1 {
		width: 100%;
		color: #a6b0c2;
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 800;
		font-size: 4.5em;
		line-height: 1em;
		margin: 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-container div.title h2 {
		width: 100%;
		color: #fff;
		display: block;
		font-family: 'Raleway', sans-serif;
		font-weight: 200;
		font-size: 2.45em;
		line-height: 1em;
		margin: 0 !important;
		padding: 0;
		text-transform: uppercase;
	}
	
	.orbit-bullets-container {
		width: 100%;
		position: absolute;
		bottom: 2%;
	    left: 0;
		z-index: 10;
		height: 50px;
		text-align: center;
	}
	
	.orbit-bullets li {
		display: inline-block;
		width: 15px;
		height: 15px;
		border: 2px solid #fff;
		background-color: #aaa;
	}
	
	.orbit-bullets li.active {
		background-color: #009BD1;
	}
	
	.orbit-timer {
		display: none;
	}
	
	.banner {
	  top: 80px;
	  margin-bottom: 80px;
	  clear: both;
	}
	
	table.frame, table.frame td {
		border: none;
		padding: 0px 0px 0px 0px !important;
		margin: 0px 0px 0px 0px !important;
		-webkit-border-horizontal-spacing: 0;
		-webkit-border-vertical-spacing: 0;
	}
	
	table.frame td {
		vertical-align: top;
	}
	
	.relative {
		position: relative;
		display: block;
		clear: both;
	}
	
	.footer {
		position: relative;
		display: block;
		clear: both;
		padding: 20px 30px;
		border-top: 1px dotted #cccccc;
		font-size: 1em;
		line-height: 20px;
		margin-top: 30px;
	}
	
	.footer > .columns {
		margin-top: 20px;
		height: auto;
		font-size: .9em;
	}
	
	.footer > .columns > .row > .columns {
		margin-top: 0;
		padding-right: 0;
	}
	
	.content {
		position: relative;
		display: block;
		clear: both;
		padding: 160px 20px 0 20px;
	}
	
	.withbanner {
		padding-top: 40px !important;
	}
	
	.copyright {
		background-color: #4C4C4C;
		padding: 50px 30px 15px 30px;
		text-align: center;
		color: #bbbbbb;
		margin: 20px auto 0 auto;
		font-size: 1em;
	}
	
	.copyright div {
	font-size: .8em;	
	}
	
	.main {
		width: auto;
		overflow: hidden;
		display: block;
		padding: 30px 30px;
	}
	
	.leftcolumn {
		position: relative;
		background-color: #F2F3F3;
		display: block;
		width: 100%;
		float: none;
		padding: 20px 50px;
		font-size: 12px;
	}
	
	.floatright {
		float: right;
		margin: 0 0 20px 20px;
	}
	
	.top30 {
		margin-top: 30px;
	}
	
	.bottom15 {
		margin-bottom: 15px;
	}
	
	.leftcolumn h1, 
	.leftcolumn h2, 
	.leftcolumn h3, 
	.leftcolumn h4, 
	.leftcolumn h5 {
		color: #808387;
	}
	
	.footer h1, 
	.footer h2, 
	.footer h3, 
	.footer h4, 
	.footer h5 {
		color: #808387;
	}
	
	h3 {
		font-size: 20px;
		font-weight: normal;
		margin-bottom: 20px;
	}
	
	h3 b {
		font-size: 14px;
		font-weight: normal;
		display: block;
		text-transform: uppercase;
	}
	
	td h3 {
		margin-bottom: 0;
	}
	
	h3 .subheader {
		color: #aebec3;
		margin-left: 5px;
	}
	
	h4 {
		font-size: 14px;
		font-weight: bold;
		text-transform: uppercase;
	}
	
	h5 {
		font-size: 11px;
		font-weight: normal;
		text-transform: uppercase;
	}
	
	.footer a:hover {
		border-bottom: 1px dotted #333333;
	}
	
	.leftcolumn h4 {
		margin-bottom: 0;
	}
	
	.leftcolumn h5 {
		margin-top: 10px;
	}
	
	.leftcolumn select {
		font-size: 12px;
		margin-bottom: 0;
	}
	
	a.box {
		width: 100%;
		border: 1px solid #c4c4c4;
		background-color: #4C4C4C;
		height: 268px;
		margin-bottom: 30px;
		display: block;
		font-size: 14px;
		line-height: 17px;
		font-weight: bold;
	}
	
	a.box:hover {
		background-color: #404040;
		text-decoration: underline;
	}
	
	a.box img {
		border-bottom: 5px solid;
	}
	
	a.box span {
		width: 90%;
		padding: 10px 20px;
		display: block;
	}
	
	a.box b {
		display: block;
		font-weight: normal;
		font-size: 11px;
		margin-bottom: 8px;
	}
		
	.color-pr {
		border-color: #6ECBE0;
		color: #6ECBE0 !important;
	}
	
	.color-project {
		border-color: #E8902C;
		color: #E8902C !important;
	}
	
	.color-video {
		border-color: #D45F3B;
		color: #D45F3B !important;
	}
	
	.leftcolumn .newproducts {
		line-height: 18px;
	}
	
	.newslinks a {
	  	color: #333;
	  	display: block;
		border-bottom: 1px dotted #ccc;
		font-weight: bold;
	}
	
	.newslinks a:hover {
  	color: rgb(0, 140, 186);
		border-bottom: 1px dotted #333;
	}
		
	.product {
		padding: 20px 0;
		border-top: 1px dotted #cccccc;
		margin: 0 !important;
	}
	
	.qrblock {
		padding-top: 20px;
		border-top: 1px dotted #cccccc;
	}
	
	.defocus {
		color: #ccc;
		background-color: #999;
	}
	
	.findapps select {
		margin-bottom: 5px;
	}
	
	.findapps.horizontal select {
		font-size: 12px;
		width: 100% !important;
		display: block;
	}
	
	.findmake.horizontal select {
		font-size: 12px;
	}
	
	#gallery {
		width: 100%;
		margin: 0 0 40px 0;
	}
	
	.projectvehicle .panel ul {
		font-size: 13px;
		list-style: none;
		padding: 0;
		margin: 0 0 20px 0;
		color: #666;
	}
	
	.projectvehicle .panel h3 {
		font-size: 18px;
		color: #aaa;
	}
	
	.projectvehicle .panel h3:not(:first-child) {
		margin-top: 20px;
	}
	
	.projectvehicle .panel p {
		margin: 5px 0 0 0;
		line-height: 1.2rem;
		font-size: .85rem;
	}
	
	
	
	#projects {
		margin-top: 20px;
	}
	
	.projectvehicle-box {
		width: 100%;
		margin: 0 0 20px 0;
		background-color: #f5f9fb;
		padding: 10px 10px 20px 10px;
		font-weight: bold;
		display: inline-block;
	}
	
	.projectvehicle-box img {
		width: 100%;
		margin-bottom: 5px;
		display: block;
	}
	
	.button-group button {
		margin: 0 1px 1px 0;
	}
	
	#filtermenu {
		display: inline;
		width: 170px;
	}
	
	h3 span.filter {
		font-weight: normal;
		display: block;
		float: none;
		width: 100%;
		text-align: left;
		font-size: 16px;
		color: #333;
	}

	
	.button-group {
		width: 100%;
		margin: 0 !important;
	}
	
	.button-bar {
		width: 100%;
	}
	
	.button-bar li {
		width: 16.6%;
		line-height: 50px;
		height: 50px;
	}
	
	.button-bar li a {
		width: 16.6%;
		height: 50px;
		display: table-cell; 
		vertical-align: middle; 
		text-align: center; 
		padding: 8px !important;
		font-size: 10px !important;
	}

	.row.productlinks {
	    padding-left: 0.9375em;
	    padding-right: 0.9375em;
	    margin-bottom: 30px;
	}
	
	.col8 { 
		width: 24.5%;
		float: left;
	    position: relative;
		height: 0px;
		padding-bottom: 17.69%;
		margin-right: .5%;
		margin-bottom: .5%;
     }
	
	.col9 { 
		width: 24.5%;
		float: left;
	    position: relative;
		height: 0px;
		padding-bottom: 17.69%;
		margin-right: .5%;
		margin-bottom: .5%;
     }
     
	.row.productlinks a:hover span {
		opacity: .1;
	}
     
	.row.productlinks a span {
		text-align: center;
		font-weight: bold;
		font-size: .9em;
		color: #ffffff;
		z-index: 100;
		position: absolute;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: #3d4a52;
		opacity: .93;
		overflow: hidden;
		transition: opacity .3s ease-in-out;
	   -moz-transition: opacity .3s ease-in-out;
	   -webkit-transition: opacity .3s ease-in-out;
	}
     
	.row.productlinks a span b {
		text-align: center; 
		position: relative; 
		top: 43%; 
		display: block;
		padding: 0px 8px;
	}
     
	.row.productlinks a img {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}

	.top-bar .toggle-topbar.menu-icon {
		left: 5px;
		padding-right: 40px; 
	}
}

/* MEDIUM */
@media only screen and (min-width: 37.563em) { 

	#headerbg {
	    position: fixed;
	}
	
	.orbit-container div.titlebottom {
		padding: 2% 5% 6% 5%;
	}
	
	.orbit-container div.titlebottom h1 {
		margin: 0em 0 .1em 0 !important;
	}
	
	.orbit-container div.titlebottom h1, .orbit-container div.titlebottom h2 {
		font-size: 1.3em;
	}
	
	.orbit-container div.titleright h1 {
		font-size: 2em;
	}
	
	.orbit-container .button {
		font-size: .8em;
		margin: 0;
	}
	
	h3 span.filter {
		display: block;
		float: right;
		width: 65%;
		text-align: right;
	}
	
	.projectvehicle-box {
		width: 46%;
		margin: 0 2% 20px 0;
	}

	#header {
		position: fixed;
		height: 82px;
	}
	
	#header .top-bar-section ul li {
		float: none;
	} 
	
	#header .top-bar-section li a:not(.button) {
		font-size: 15px;
		padding: 0 15px;
	}
	
	.footer {
		padding: 20px 30px;
	}
	
	.footer > .columns {
		height: 160px;
	}
	
	a.box {
		height: 320px;
	}
	
	.findapps.horizontal select {
		width: 24% !important;
		float: left;
		margin-right: 1%;
	}
	
	.button-bar li a {
		padding: 12px !important;
		font-size: 11px !important;
		height: 50px;
	}
}

/* MEDIUM LARGE */
@media only screen and (min-width: 50em) {  
	
	.orbit-container div.titleright h1 {
		font-size: 2.5em;
	}
     
	.row.productlinks a span {
		font-size: .5em;
	}
	
	.col8 { 
		width: 12%;
		float: left;
	    position: relative;
		height: 0px;
		padding-bottom: 8.67%;
		margin-right: .5%;
     }
	
	.col9 { 
		width: 10.6%;
		float: left;
	    position: relative;
		height: 0px;
		padding-bottom: 7.8%;
		margin-right: .5%;
     }
	
	.projectvehicle-box {
		width: 31%;
		margin: 0 2% 20px 0;
	}
	
	.button-bar li {
		line-height: 60px;
		height: 60px;
	}
	
	.button-bar li a {
		padding: 14px !important;
		font-size: 12px !important;
		height: 60px;
	}  

	.content {
		padding: 110px 55px 0 55px;
	} 
	
	#header .top-bar-section ul {
		background: none;
	}
	
	#header .top-bar-section ul li {
		float: left;
	} 
	
	.main-nav {
		width: 100%;
		height: 82px;
		line-height: 76px;
		position: absolute;
		margin-bottom: 0;
	}
	
	.main-nav #logo {
		position: absolute;
		top: 0;
		left: auto;
		right: auto;
		margin: inherit;
		left: 40px;
	}
	
	.orbit-container .orbit-slides-container > * .orbit-caption {
		bottom: 0;
		background-color: rgba(0,0,0,0.5);
		color: white;
		padding: 10px 50px 10px 75px;
		font-size: 0.875rem; 
		width: 500px;
		height: 96px;
		font-size: 12px;
	}
	
	.orbit-caption h5 {
		color: #B2E1F1;
		font-weight: bold;
		margin-bottom: 0;
	}
	
	.orbit-bullets-container {
		width: 100%;
		position: absolute;
		bottom: 2%;
	    left: 0;
		z-index: 10;
		height: 50px;
		text-align: center;
	}
	
	.banner {
	  width: 100%;
	  margin-left: auto;
	  margin-right: auto;
	  margin-top: 0;
	  margin-bottom: 0;
	  top: 0;
	  max-width: 75em;
	  *zoom: 1; 
	  position: relative;
	  min-height: 360px;
	}
	
	#header .top-bar-section ul.left {
		position: absolute;
		top: 0;
		left: 280px;
		height: 100%;
	}
	
	#header .top-bar-section li a:not(.button) {
		line-height: 76px;
		background: none;
		padding: 0 12px;
		display: block;
	}
	
	.leftcolumn {
		width: 280px;
		/*height: 500px;*/
		float: left;
		padding: 30px 40px 30px 40px;
	}
	
	.main {
		left: 280px;
		top: 0px;
	}
	
	.footer {
		padding: 20px 60px;
	}
	
	a.box {
		height: 300px;
	}
     
	.row.productlinks a span {
		font-size: .7em;
	}
	
	.projectvehicle-box {
		width: 23%;
		margin: 0 2% 20px 0;
	}
	
	#header .top-bar-section li a:not(.button) {
		font-size: .9em;
		font-weight: bold;
		padding: 0 .8em;
	}
	
}

/* LARGE */
@media only screen and (min-width: 56.250em) {
	
	.orbit-container div.titleright {
		top: 40%;
	}
	
	#header .top-bar-section li a:not(.button) {
		font-size: 1em;
		padding: 0 1em;
	}
	
	.leftcolumn {
		width: 340px;
	}
	
	.main {
		left: 340px;
	}.row.productlinks a span {
		font-size: .7em;
	}
	
}

/* X-LARGE */
@media only screen and (min-width: 65.563em) {
	#header .top-bar-section li a:not(.button) {
		font-size: 1.2em;
		padding: 0 1.2em;
	}
	
  .xlarge-push-0 {
    position: relative;
    left: 0%;
    right: auto; }

  .xlarge-pull-0 {
    position: relative;
    right: 0%;
    left: auto; }

  .xlarge-push-1 {
    position: relative;
    left: 8.33333%;
    right: auto; }

  .xlarge-pull-1 {
    position: relative;
    right: 8.33333%;
    left: auto; }

  .xlarge-push-2 {
    position: relative;
    left: 16.66667%;
    right: auto; }

  .xlarge-pull-2 {
    position: relative;
    right: 16.66667%;
    left: auto; }

  .xlarge-push-3 {
    position: relative;
    left: 25%;
    right: auto; }

  .xlarge-pull-3 {
    position: relative;
    right: 25%;
    left: auto; }

  .xlarge-push-4 {
    position: relative;
    left: 33.33333%;
    right: auto; }

  .xlarge-pull-4 {
    position: relative;
    right: 33.33333%;
    left: auto; }

  .xlarge-push-5 {
    position: relative;
    left: 41.66667%;
    right: auto; }

  .xlarge-pull-5 {
    position: relative;
    right: 41.66667%;
    left: auto; }

  .xlarge-push-6 {
    position: relative;
    left: 50%;
    right: auto; }

  .xlarge-pull-6 {
    position: relative;
    right: 50%;
    left: auto; }

  .xlarge-push-7 {
    position: relative;
    left: 58.33333%;
    right: auto; }

  .xlarge-pull-7 {
    position: relative;
    right: 58.33333%;
    left: auto; }

  .xlarge-push-8 {
    position: relative;
    left: 66.66667%;
    right: auto; }

  .xlarge-pull-8 {
    position: relative;
    right: 66.66667%;
    left: auto; }

  .xlarge-push-9 {
    position: relative;
    left: 75%;
    right: auto; }

  .xlarge-pull-9 {
    position: relative;
    right: 75%;
    left: auto; }

  .xlarge-push-10 {
    position: relative;
    left: 83.33333%;
    right: auto; }

  .xlarge-pull-10 {
    position: relative;
    right: 83.33333%;
    left: auto; }

  .xlarge-push-11 {
    position: relative;
    left: 91.66667%;
    right: auto; }

  .xlarge-pull-11 {
    position: relative;
    right: 91.66667%;
    left: auto; }

  .xlarge-1 {
    width: 8.33333%; }

  .xlarge-2 {
    width: 16.66667%; }

  .xlarge-3 {
    width: 25%; }

  .xlarge-4 {
    width: 33.33333%; }

  .xlarge-5 {
    width: 41.66667%; }

  .xlarge-6 {
    width: 50%; }

  .xlarge-7 {
    width: 58.33333%; }

  .xlarge-8 {
    width: 66.66667%; }

  .xlarge-9 {
    width: 75%; }

  .xlarge-10 {
    width: 83.33333%; }

  .xlarge-11 {
    width: 91.66667%; }

  .xlarge-12 {
    width: 100%; }

  .xlarge-offset-0 {
    margin-left: 0% !important; }

  .xlarge-offset-1 {
    margin-left: 8.33333% !important; }

  .xlarge-offset-2 {
    margin-left: 16.66667% !important; }

  .xlarge-offset-3 {
    margin-left: 25% !important; }

  .xlarge-offset-4 {
    margin-left: 33.33333% !important; }

  .xlarge-offset-5 {
    margin-left: 41.66667% !important; }

  .xlarge-offset-6 {
    margin-left: 50% !important; }

  .xlarge-offset-7 {
    margin-left: 58.33333% !important; }

  .xlarge-offset-8 {
    margin-left: 66.66667% !important; }

  .xlarge-offset-9 {
    margin-left: 75% !important; }

  .xlarge-offset-10 {
    margin-left: 83.33333% !important; }

  .xlarge-offset-11 {
    margin-left: 91.66667% !important; }

  .xlarge-reset-order {
    margin-left: 0;
    margin-right: 0;
    left: auto;
    right: auto;
    float: left; }
}

/* XXL */
@media only screen and (min-width: 75.063em) {
	
}