@charset "utf-8";
/* CSS Document */

.greenlt {
	font-family: Arial, Helvetica, sans-serif;
	FONT-SIZE: 12px; COLOR: #000066;
}
body{
	font-family:Arial,Sans-Serif;
	margin:0;
	padding:8px;
	font-size:105.01%;
}
#tabs
{
/*margin-left:125px;
margin-right:25px;
padding:0 25px 0 25px;*/
width:70%;
padding:0 0px 0 0px;
}
.div1
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image:url('images/website_graphics/logo_ComboUnit1.png');
background-repeat:no-repeat;
background-position: 96% 41%;
}

.div2
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image:url('images/website_graphics/logo_directFit1.png');
background-repeat:no-repeat;
background-position: 96% 37%;
}

.div3
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image: none;
background-repeat:no-repeat;
background-position: 96% 37%;
}

.div4
{
border:1px solid black;
width:75%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image: none;
}
.container-box {
	position: absolute;
	margin:0;
	z-index: 999;
	width:100%;
	height:100%;
	top:5%;
	padding-top:10%;
	background-color:#ccc;
}
.container-box2 {
	position: static;
	z-index: 999;
	width:100%;
	background-color: #CCC;
}
.container-box2a {
	position: absolute;
	margin-right:auto;
	margin-left:auto;
	z-index: 999;
	width:100%;
	background-color: #ccc;
}
.container-box3 {
	width:100%;
}
.cb2 {
    display: block;
}
* {
    box-sizing: border-box;
}
.container-box1 {
	position: absolute;
	z-index: 999;
	width:100%;
	top:80%;
	bottom:0;
}
.row::after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    padding: 2px;
}
.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.menu li {
    float: left;
    padding: 0px;
    margin-bottom: 0px;
    color: #000;
    display: block;
	clear: left;
}
.menu li:hover {
    background-color: #0099cc;
	color:#FFF;
}
.left {
    float: left;
    color: #000;
	font-size:14px;
	position:relative;
	padding-left:1%;
	width:100%;
}
.left1 {
    float: left;
}
.green {
    float: left;
    color: #000;
	font-size:14px;
	font-weight:bold;
	padding-right:4px;
}
.green1 {
    float: left;
    color: #000;
	font-size:16px;
	font-weight:bold;
}
.RedLink {
    color: #800000;
	font-size:16px;
}
.RedLink1 {
    color: #800000;
	font-size:16px;
}
.footer1 {
    color: #ffffff;
	margin:auto;
    text-align: center;
    font-size: 12px;
    padding: 1px;
}
.footer {
	padding-top:32%;
	padding-left:25%;
	padding-bottom:0;
}
/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
.image_full{
   display:block;
  }

 .image_mobile{
  display:none;
 }

/* Large devices (laptops/desktops, 669px and upto 902) */
@media only screen and (min-width: 641px) and (max-width: 902px) {
	[class*="col-"] {
		float:left;
        width: 80%;
    }

.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 82.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}
.container-box {
	position: absolute;
	margin:0;
	z-index: 999;
	width:100%;
	top:5%;
	padding-top:5%;
	background-color:#ccc;
}
.container-box2 {
	position: absolute;
	margin-left:0%;
	z-index: 999;
	width:100%;
	background-color:#ccc;


}
.container-box2a {
	position: absolute;
	margin-right:auto;
	margin-left:auto;
	z-index: 999;
	width:100%;
	background-color:#ccc;
}
* {
    box-sizing: border-box;
}
#tabs
{
/*margin-left:125px;
margin-right:25px;
padding:0 25px 0 25px;*/
width:75%;
padding:0 0px 0 0px;
}

.div1
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-size:auto;
background-image:url('images/website_graphics/logo_ComboUnit1.png');
background-repeat:no-repeat;
background-position: 93% 83%;
}

.div2
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_directFit1.png');
background-repeat:no-repeat;
background-position: 93% 86%;
}

.div3
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_exactFit1.png');
background-repeat:no-repeat;
background-position: 93% 76%;
}

.div4
{
border:1px solid black;
width:85%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image: none;
}
.left {
	margin:auto;
    color: #000;
	font-size:14px;
	padding-left:5%;
	top: 1%;
}
.left1 {
	clear: both;
    float: left;
}
.imageBorderColor {
    max-width: 100%;
    max-height: 100%;
	padding-left:25%;
}
.imageBorderColor1 {
    width: 50%;
    height: auto;
}
.footer {
	clear:right;
	padding-top:99%;
	padding-left:60%;
	padding-bottom:0;
}
.swap {
 position: absolute;
 height:15px;
 width:119px;
 display:block;
}
.swap:hover{
 background-image: url('images/black/full_info1_.gif');	
}
  .image_full{
   display: block;
  }

  .image_mobile{
   display: none;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up)@media all and (min-width: 1000px) and (max-width: 1280px) 
@media only screen and (min-width: 943px) and (max-width:1000px)  {
	[class*="col-"] {
		float:left;
        width: 90%;
    }

.container-box {
	position: absolute;
	margin: auto;
	left:-1px;
	right:1px;
	top: 15px;
	z-index: 999;
	width:85%;
}
.div1
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_directFit1.png');
background-repeat:no-repeat;
background-position: 93% 89%;
}
.div2
{
border:1px solid black;
width:90%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 10px;
border-radius: 10px;
}
.div3
{
border:1px solid black;
width:90%;
font-family:Arial,Sans-Serif;
font-size:70.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image:url('');
background-repeat:no-repeat;
background-position: 93% 88%;
}
#tabs
{
width:90%;
padding:0 5px 0 0px;
}
.left {
    float: left;
    color: #ccc000;
	font-size:14px;
	clear: both;
}
.left1 {
    float: left;
	clear: both;
}
.imageBorderColor {
    width: 30%;
    height: auto;
	margin:auto;
}
}
@media only screen and (min-width: 1201px)  {...}*/

@media only screen and (min-width: 229px) and (max-width: 640px) {
    /* For tablets: */
    .col-s-1 {width: 8.33%;}
    .col-s-2 {width: 16.66%;}
    .col-s-3 {width: 25%;}
    .col-s-4 {width: 63.33%;}
    .col-s-5 {width: 41.66%;}
    .col-s-6 {width: 50%;}
    .col-s-7 {width: 58.33%;}
    .col-s-8 {width: 66.66%;}
    .col-s-9 {width: 75%;}
    .col-s-10 {width: 83.33%;}
    .col-s-11 {width: 91.66%;}
    .col-s-12 {width: 100%;}
.col-4 {width: 88.33%;}
#tabs
{
/*margin-left:125px;
margin-right:25px;
padding:0 25px 0 25px;*/
width:100%;
padding:0 10px 0 0px;
}
.container-box {
	position: absolute;
	margin:0;
	z-index: 999;
	width:100%;
	background-color:#ccc;
}
.container-box2 {
	position: absolute;
	margin-left:0%;
	z-index: 999;
	width:100%;
	background-color:#ccc;
}
.container-box2a {
	position: absolute;
	margin-right:auto;
	margin-left:auto;
	z-index: 999;
	width:100%;
	background-color:#ccc;
}

.div1
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_ComboUnit1.png');
background-repeat:no-repeat;
background-position: 98% 75%;
}

.div2
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_directFit1.png');
background-repeat:no-repeat;
background-position: 98% 75%;
}

.div3
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:url('images/website_graphics/logo_exactFit1.png');
background-repeat:no-repeat;
background-position: 98% 75%;
}

.div4
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image: none;
}
  .image_full{
   display:none;
  }

  .image_mobile{
   display:block;
  }
}
.imageBorderColor {
    width: 100%;
    height: auto;	
	padding-left:3%;
	padding-right:3%;
}
.imageBorderColor1 {
    width: 50%;
    height: auto;
}
div.torder{
	margin-left:auto;
	margin-right:auto;
	padding-left:0px;
	padding-right:0px;
	background-color: #FFFFFF;
	width:95%;	
}
div.tstyle1 {
	color: #ccc000;
	font-family:Arial, Helvetica, sans-serif;
	padding:5px;
	padding-top:20px;
    width:95%;
	background-color:#FFF;
	height:auto;
}
div.tstyle2 {
    width:95%px;
	margin-left:1px;
	margin-right:10px;
	text-align:left;
	padding-left:10px;
	padding-right:10px;
	float:left;
}
label.styled{
float: left;
width: 525px;
text-transform: uppercase;
font-size: 18px;
color: #06F;
font-weight:bold;
text-align:left;
display: inline;
border-bottom: 1px solid red;
margin-right: 15px;
}
label.styled1{
float: left;
width: 595px;
font-size: 14px;
color: #FFF;
font-weight:bold;
display: inline;
margin-right: 15px;
}
.eatit{
font-size:16px;
font-style:bold;
text-decoration:none;
color: #CC0;
}
.beatit{
font-size:18px;
font-style:bold;
text-decoration:none;
color: #FFF;
}
.swap {
 position: relative;
 margin-right:30%;
 height:15px;
 width:119px;
 display:block;
 background:transparent url('images/black/full_info1.gif') center top no-repeat;	
}
.swap:hover{
 background-image: url('images/black/full_info1_.gif');	
}
.details {
	width:98%;
    border:none; 
}
.jam {
	position: absolute;
    padding-left:20px;
    top:13%;
    left:50%;
    width:33%; 
    padding-top:2px;
}
.handh {
width:100%; 
}
.header-search {
   position: relative;
   border:none;
   left: 6%; /* adjust as needed */
   top: 2%; /* Adjust as needed to get the number that will keep it above the menu */
   height: 22px;
   display:inline;
   padding: 1px 0px 3px 1px;
   margin-bottom: 1px;
   z-index: 999; /* Whatever number that keeps it above the menu */	
	color:#ccc;
}
		.search-bar {
		   position: absolute;
		   left: 26%;
		   top: 5%;
		   z-index: 999;
		}
		.nav-bar {
		   z-index: 999;
		   width:100%;
		   background-color:#CCC;
		}
		#navigation1 {
		   z-index: 1999;
		   width:100%;
		}
.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.menu li {
    float: left;
	padding-left:4%;
    margin-bottom: 0px;
    color: #000;
    display: block;
}
.menu li:hover {
    background-color: #0099cc;
}
.left1 {
	margin:auto;
    color: #000;
	font-size:14px;
	clear: both;
	padding-left:5%;
}
.green {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #000000;
}
@media only screen and (max-width: 388px) {
    /* For mobile phones: */
    [class*="col-"] {
		float:left;
        width: 90%;
    }
.col-4 {width: 95.33%;}

.container-box {
	position: absolute;
	margin:0;
	z-index: 999;
	width:100%;
	top:8%;
	padding-top:1%;
	background-color:#ccc;
}
.container-box2 {
	position: absolute;
	margin-left:0%;
	z-index: 999;
	width:100%;
	background-color:#ccc;
}
.container-box2a {
	position: absolute;
	margin: auto;
	z-index: 1000;
	width:100%;
	background-color:#ccc;
}
.div1
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 6px;
border-radius: 6px;
background-image:none;
background-repeat:no-repeat;
background-position: 98% 53%;
}

.div2
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 16px;
border-radius: 6px;
background-image:none;
background-repeat:no-repeat;
background-position: 93% 53%;
}

.div3
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:90.01%;
background-origin:border-box;
padding:0 5px 0 5px;
-moz-border-radius: 16px;
border-radius: 6px;
background-image:none;
background-repeat:no-repeat;
background-position: 93% 53%;
}

.div4
{
border:1px solid black;
width:100%;
font-family:Arial,Sans-Serif;
font-size:70.01%;
background-origin:border-box;
padding:0 10px 0 10px;
-moz-border-radius: 10px;
border-radius: 10px;
background-image:none;
}
.tabs
{
width:100%;
padding:0 5px 0 0px;
}
.left {
	margin:auto;
    color: #000;
	font-size:14px;
	clear: both;
	padding-left:4%;
}
.left1 {
	padding-top:2%;
	padding-left:5%;
}
.imageBorderColor {
    width: 100%;
    height: auto;
	margin:auto;
}
.imageBorderColor1 {
    width: 50%;
    height: auto;
}
.footer {
	padding-top:99%;
	padding-left:40%;
}
.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}
.menu li {
    float: left;
	padding-left:2%;
    margin-bottom: 0px;
    color: #000;
    display: block;
}
.menu li:hover {
    background-color: #0099cc;
}
.swap {
 position: relative;
 right:20%;
 height:15px;
 width:119px;
 display: inline-block;
}
.swap:hover{
 background-image: url('images/black/full_info1_.gif');	
}
  .image_full{
   display:none;
  }

  .image_mobile{
   display:block;
  }
}
/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 0 0% 0 1$;
}
.col:first-child { margin-left: 0; }

/*  GROUPING  */
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }

/*  GRID OF FOUR  */
.span_1_of_4 {
	width: 23.8%;
}
    .col-sm-3 {width: 25%;}
    .col-sm-6 {width: 50%;}
.containerd {
	clear: both;
	width: 100%;
}

/*  GRID OF SEVEN  */
.span_7_of_7 {
	width: 100%;
}

.span_6_of_7 {
  	width: 85.54%;
}

.span_5_of_7 {
  	width: 71.08%;
}

.span_4_of_7 {
  	width: 56.62%;
}

.span_3_of_7 {
  	width: 42.17%;
}

.span_2_of_7 {
  	width: 27.71%;
}

.span_1_of_7 {
  	width: 13.25%;
}
.container-box .container-box2 .text-nav ul {
	clear: both;
    float: left;
	list-style-type: none;
	margin:0;
}
.container-box .container-box2 .text-nav li {
    float: left;
	left:0;
	padding-bottom:1%;
    color: #c1e249;
    font-family: Tahoma, Geneva, sans-serif; 
    font-size: 18px;
    line-height:24px;
    display: block;
}
container-box .container-box2 .text-nav li :hover {
 color: #0099cc;
}
.tdiv {
	background-color:#000;
}
#footer1a {
	clear: both;
	float:left;
	width: 100%;
	background-color:#000;
}
.container2a {
	float:left;
	width: 100%;
}
.containerd {
	clear: both;
	width: 100%;
}
.container2b {
	padding-left:4%;
	margin-left:11%;
	right:0;
}
.container2c {
	width: 100%;
	text-align:left;
}
.container2d {
	margin-left:auto;
	margin-right:auto;
	width: 39%;
	padding-left:0;
}
.footer1b {
	margin-left:auto;
	margin-right:auto;
	width: 100%;
	background-color:#000;
}
#footer1 {
    background-color:#000;
	width: 100%;
}
.container2e {
	padding-left:1%;
	left:0;
}

/*  GO FULL WIDTH BELOW 480 PIXELS */
@media only screen and (max-width: 787px) {
	.col {  margin: 0 0 0 0; }
	.span_1_of_4 { width: 100%; }
.container2a {
	padding-left:0;
	left:0;
}
.container2e {
	left:0;
}
.container2b {
	padding-left:0%;
	left:0;
}
.container2d {
}
.text-nav ul {
    float: left;
	list-style-type: none;
	margin:0;
}
.text-nav li {
    float: left;
	left:0;
	padding-left:1%;
    margin-bottom: 0px;
    color: #c1e249;
    font-family: Tahoma, Geneva, sans-serif; 
    font-size: 16px;
    line-height:22px;
    display: block;
}
.text-nav li :hover {
 color: #0099cc;
}
}
@media only screen and (max-width: 620px) {
	.col {  margin: 0 0 0 0; }
	.span_1_of_4 { width: 100%; }
    .col-sm-3 {width: 100%;}
    .col-sm-6 {width: 100%;}
.container2e {
	left:0;
}
.container2b {
	left:0;
}
.container2d {
	left:0;
}
.container2a {
	left:0;
}
.text-nav ul {
    float: left;
	list-style-type: none;
	margin:0;
}
.text-nav li {
    float: left;
	left:0;
	padding-left:1%;
    margin-bottom: 0px;
    color: #c1e249;
    font-family: Tahoma, Geneva, sans-serif; 
    font-size: 16px;
    line-height:22px;
    display: block;
}
.text-nav li :hover {
 color: #0099cc;
}
}
@media only screen and (max-width: 480px) {
	.col {  margin: 0 0 0 0; }
	.span_1_of_7, .span_2_of_7, .span_3_of_7, .span_4_of_7, .span_5_of_7, .span_6_of_7, .span_7_of_7 { width: 100%; }
	.span_1_of_4 { width: 100%; }
    .col-sm-3 {width: 100%;}
    .col-sm-6 {width: 100%;}
.container2e {
	float:left;
}
.container2b {
	float:left;
}
.container2d {
	float:left;
}
.container2a {
	float:left;
	left:0;
}
.text-nav ul {
    float: left;
	list-style-type: none;
	margin:0;
}
.text-nav li {
    float: left;
	left:0;
	padding-left:1%;
    margin-bottom: 0px;
    color: #c1e249;
    font-family: Tahoma, Geneva, sans-serif; 
    font-size: 14px;
    line-height:20px;
    display: block;
}
.text-nav li :hover {
 color: #0099cc;
}
}