@media only screen {/*
	#div1 a {
    color: #fff;
    display: block;
    font-size: 12px;
    line-height: 38px;
    margin: 13px 0 0;
    padding: 0 26px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
} */
} /* Define mobile styles */

@media only screen and (max-width: 40em) {
	ul.top-menu li a { font-size:12px; padding:0 9px;}
	.header-wrap p { float:left;}
	header{position:relative; margin-top:0; padding:0;}
	.logo{margin:10px 0;}
	ul.off-canvas-list li label{background:#e2e2e2; color:#114b11;}
	ul.off-canvas-list li a:hover {
      background: #6b9b0c; color:#fff;}
    ul.off-canvas-list li a:active {
      background: #6b9b0c; color:#fff;}
	  .prdct-banner{margin:20px 0 0;}
	  
	  .mid-sec{margin:20px 0 0;}
	  .f-prodcts.prdct-area{ margin-top: 0px !important;}
	  .f-prodcts h1{font-size:13px;}
	  #div1 a {
    color: #fff;
    display: block;
    font-size: 12px;
    line-height: 30px;
    margin: 13px 0 0;
    padding: 0 26px;
    position: relative;
    text-decoration: none;
}
#f-pro-hd a { font-size:15px; padding:0 14px;}
.f-pro-wrp { margin-top:3px; min-height:0; margin-bottom:12px;}
a.vertical-menu-hd-wrap { font-size:12px !important;}
.toogle dd, .toogle__panel { width:100%}
.product-wraper { padding-bottom:20px;}
#div1 { margin:0 0 20px 0;}
.f-pro-txt a{font-size:10px !important;}
#div1.dwnlod {
    margin: 0 6px 20px 0;
}
.f-prodcts h4 {
    float: left;
}	 
} /* max-width 640px, mobile-only styles, use when QAing mobile issues */

@media only screen and (min-width: 40.063em) { 
} /* min-width 641px, medium screens */

@media only screen and (min-width: 40.063em) and (max-width: 64em) { 
.header-img {background-size: contain;}
.f-prodcts h1{font-size:17px;}
.site-map{ background: rgba(0, 0, 0, 0) linear-gradient(#9bd51a, #85ba13) repeat scroll 0 0;
    color: #000;
    float: right;
    font-size: 13px;
    margin: 0 11% 0 0;
    padding: 2px 0;
    position: relative;
    text-align: center;
    text-indent: 0;
    width: 85px;
    z-index: -9;
}

ul.menu li .trap { 
  padding:9px 7px 0;
}
ul.menu li .trap a{padding:9px 7px 0; font-size: 10px;}
ul.menu li .trap ul li a{font-size:10px;}

.logo h1{font-size:39px;}

a.vertical-menu-hd-wrap{font-size: 11px !important; width: 71%;}
.mid-sec-hd p.posing {
    background-position: 33px 48%;
}

.pro-bttn h1{padding:0;}

.header-wrap{margin: -5px 0 0;}

ul.top-menu li a {
    font-size: 12px;
    padding: 0 7px;
}
.mid-sec-hd ul li.arrw-ico {
    background: rgba(0, 0, 0, 0) url("../image/arrw.png") no-repeat scroll 9% 30%;
    padding: 0 10px 0 0;
}

.mid-sec-hd ul li {
    background: rgba(0, 0, 0, 0) url("../image/arrw.png") no-repeat scroll 1% 12%;
    color: #1d1d1d;
    font-family: "ralewayregular";
    font-size: 12px;
    font-weight: bold;
    padding: 0;
}

#div1 a {
    color: #fff;
    font-size: 13px;
    line-height: 57px;
    padding: 0 12px;
    position: relative;
    text-decoration: none;
    
}
#f-pro-hd a {
    color: #fff;
    display: block;
    font-family: "ralewayregular";
    font-size: 17px;
    font-weight: bold;
    line-height: 60px;
    padding: 0 26px;
    position: relative;
    text-decoration: none;
}
.f-pro-txt a{font-size:12px !important;}
} /* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

@media only screen and (min-width: 64em) { 
ul.menu{list-style:none; margin:15px 0 0; padding:0;}
ul.menu li{float:left; text-align:center; padding:10px 2px 4px; }
ul.menu li .trap { 
  position:relative;
  padding:9px 10px 0;
  text-transform:uppercase;
  text-align:center;

}

ul.menu li .trap:before {
  content: "";
  position: absolute;
  border-radius:0 0 4px 4px;
/*  box-shadow:0 1px 0px 4px #000;*/
  background:linear-gradient(#eaeaea, #e1e1e1);
  top: -4%; bottom: -11%; left: -3%; right: -3%;
  z-index: ;
  -webkit-transform: perspective(5em) rotateX(-150deg);
  transform: perspective(5em) rotateX(-150deg);
  /*box-shadow:1px 0 1px 1px #c0c0c0;*/
      border-right: 1px solid #ccc;
}
ul.menu li .trap a{ position:relative; color:#114b11; text-decoration:none; padding:9px 8px 0; font-size:13px; text-transform:uppercase; font-weight:bold;}
ul.menu li .trap:hover:before{background:linear-gradient(#6e9e0d, #8cc316); }
ul.menu li .trap a:hover{color:#fff;}
ul.menu li .trap ul {
  padding: 0;
  position: absolute;
  top:39px;
  left:-16px;
  width: 220px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul.menu li .trap ul li { 
  background: #e3e4e5; 
  display: block; 
  color: #fff;
  float:none;
  text-align:left;
  width:100%;
  border-bottom:1px solid #cccccc;
}
ul.menu li .trap ul li a{ font-size:13px; font-weight:normal;padding:5px 10px; display:block;}
ul.menu li .trap ul li:hover { background:linear-gradient(#7bb511, #579132); }
ul.menu li .trap ul li.select { background:linear-gradient(#7bb511, #579132); }
ul.menu li .trap:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

.f-prodcts h1{font-size:24px;}
.site-map{  background: rgba(0, 0, 0, 0) linear-gradient(#9bd51a, #85ba13) repeat scroll 0 0;
    float: right;
    margin: 0 11% 0 0;
    padding: 2px 0;
    position: relative;
    text-align: center;
    width: 105px;
    z-index: -9;
	 color:#000; font-size:14px;
	 text-indent:0;
}
.logo h1{font-size:46px;}

a.vertical-menu-hd-wrap{background:linear-gradient(#eaeaea, #e1e1e1); position:relative; width:60%; height:36px; padding:0 0 0 8px !important; font-size:12px !important; font-weight:bold; text-transform:uppercase; color:#114b11 !important; font-family: 'open_sanscondensed_light'; line-height:normal; float:left;}

.pro-bttn h1{padding:0 14px;}

.header-wrap{margin:0;}

ul.top-menu li a {text-decoration:none; color:#000; padding:0 15px; font-size:14px; font-weight:bold; border-left:1px solid #000;}
#div1{
 perspective: 88em;
    perspective-origin: -1% 0;
    position: relative;
	padding-left:0;
}

#div1:before{
	    background: rgba(0, 0, 0, 0) linear-gradient(#96cf18, #6e9e0d) repeat scroll 0 0;
    content: "";
    padding: 30px;
    position: absolute;
    transform: rotateX(-45deg);
    width: 100%;
}
#div1 a{color: #fff;
    font-size: 16px;
    line-height: 60px;
    padding:0 26px;
    position: relative;
    text-decoration: none;
	display:block;
}

.mid-sec-hd ul li {
    background: rgba(0, 0, 0, 0) url("../image/arrw.png") no-repeat scroll 13% 12%;
    color: #1d1d1d;
    font-family: "ralewayregular";
    font-size: 12px;
    font-weight: bold;
    padding: 0;
}
.mid-sec-hd ul li.arrw-ico{background:url(../image/arrw.png) 20% 12% no-repeat; padding:0 10px 0 0;}
#f-pro-hd a{
    font-size: 25px;
}

.f-pro-txt a{font-size:17px !important;}
	
}


@media only screen and (min-width: 64.063em) {
	.site-map{  background: rgba(0, 0, 0, 0) linear-gradient(#9bd51a, #85ba13) repeat scroll 0 0;
    float: right;
    margin: 0 135px 0 0 !important;
    padding: 2px 0;
    position: relative;
    text-align: center;
    width: 105px;
    z-index: -9;
	 color:#000; font-size:14px;
	 text-indent:0;
}

.mid-sec-wid{width:20%;}

} /* min-width 1025px, large screens */

@media only screen and (min-width: 64.063em) and (max-width: 90em) { 
.mid-sec-hd ul li{background:url(../image/arrw.png) 0 33% no-repeat; padding:0 10px 0 0; font-size:14px; color:#1d1d1d; font-family: 'ralewayregular'; font-weight:bold;}
.mid-sec-hd ul li.arrw-ico {
    background: rgba(0, 0, 0, 0) url("../image/arrw.png") no-repeat scroll 9% 30%;
    padding: 0 10px 0 0;
}
}
 /* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */


@media only screen and (min-width: 90.063em) { 
.mid-sec-hd ul li{background:url(../image/arrw.png) 0 0 no-repeat; padding:0 10px 0 0; font-size:14px; color:#1d1d1d; font-family: 'ralewayregular'; font-weight:bold;}
.mid-sec-hd ul li.arrw-ico {
    background: rgba(0, 0, 0, 0) url("../image/arrw.png") no-repeat scroll 9% 30%;
    padding: 0 10px 0 0;
}
} /* min-width 1441px, xlarge screens */

@media only screen and (min-width: 90.063em) and (max-width: 120em) { } /* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */