/*--------------------------------------------------
                    Navigation s
--------------------------------------------------*/

/* top navigation s*/


.navWrap {
  height: 81px;
  width: 100%;
  position: absolute;
  z-index: 10;
  background-size: 100% 55px;
  background-repeat: no-repeat;
  z-index: 20;
  background: #414141;
  position: relative;
}

.nav-item a {
 text-shadow: 0px 2px 3px #5F5759;
}

/*------------------------------------*\
    Flaunt JS Navigation
\*------------------------------------*/

.nav {
	font-size: 14px;
  font-weight: 900;
  position: relative;
  height: 40px;
  line-height: 5px;
  left: 0;
  bottom: 0;
  width: 770px;
  top: 41px;
  float: left;
  margin: 0 0 0 5px;
}
ul.nav-list {
  width: 768px;
  height: 41px;
  float: right;
  padding: 0;
}
.nav-list {
	text-align:left;
	margin: 0;
}
.nav-item {
	float:right;
	*display:inline;
	zoom:1;
	position:relative;
}
.menuActive{
  background: #2896B0 !important;
  -webkit-box-shadow: 1px 0px 30px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 1px 0px 30px 0px rgba(0,0,0,0.75);
  box-shadow: 1px 0px 30px 0px rgba(0,0,0,0.75);
  }
.nav-item a {
  display: block;
  color: #FFF;
  font-size: 17px;
  font-weight: normal;
  padding: 0 15px 0 15px;
  line-height: 41px;
  margin: 0;
}
.nav-item > a:hover {
	/*background:#822368;*/
}
.nav-item:hover .nav-submenu {
	display: block;
  opacity: 1;
  right: 0;
  pointer-events: initial;
}

/* Navigation submenu */
.nav-submenu {
	/*display:none;*/
	pointer-events: none;
	position: absolute;
  top: 26px;
  background: #616B7B;
  transition: opacity .25s ease-in-out;
  -moz-transition: opacity .25s ease-in-out;
  -webkit-transition: opacity .25s ease-in-out;
   opacity: 0;
}
.nav-submenu-item a {
  border-bottom: 1px solid #565454;
  display: block;
  padding: 15px;
  text-align: center;
  margin: 0 0 0 -30px !important;
}
.nav-submenu-item a:hover {
	background: #2896B0;
  color: white;
}
li.nav-item ul.nav-submenu li.nav-submenu-item a {
  padding: 0;
  margin: 0 0 0 -40px !important;
  width: 168px !important;
}
li.nav-item:last-child a {
  padding: 0 10px 0 10px;
}

@media only screen and (max-width : 880px) {
ul.nav-submenu{ opacity: 1;}
li.nav-item ul.nav-submenu li.nav-submenu-item a{
  padding: 7px 0 6px 0;
  width: 100% !important;
  margin: 0 !important;
}
}
/*
#cssmenu ul li:hover {
  text-shadow: 1px 0px 1px #373334;
}*/

/* Mobile navigation */
.nav-mobile {
  display: none;
  cursor: pointer;
  position: absolute;
  top: -24px;
  right: 11px;
  background-size: 18px;
  height: 50px;
  width: 50px;
  background: url(../img/nav-icon2.png) no-repeat;
  z-index: 10000;
  float: left;
  left: 10px;
}
li.nav-item {
  height: 40px;
  background: #252525;
  margin: 0 10px 0 0;
}
li.nav-item {   
	direction: rtl;
  max-height: 40px;
  float: right;
  margin: 0 9px 0 0; }
li.nav-item.opened {max-height: 40px;}
li.nav-item.opened:hover {max-height: 40px;}
/* Mobile navigation, clickable area for revealing <ul> */
.nav-click {
	position:absolute;
	top:0;
	right: 50%;
	display:none;
	height:49px;
	width:50px;
	cursor:pointer;
	pointer-events: none !important;
}
.nav-click i {
	display:block;
  position: absolute;
  left: -14px;
  top: 20px;
  float: left;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #FFF3D1;
}
/*
.nav-click:hover {
	background-color:#6E1656;
}*/
i.nav-arrow {
  transition: all 0.5s;
}
.nav-rotate {
	-webkit-transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-ms-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	transform:rotate(180deg);
	transition: all 0.5s;
}
div#cssmenu ul li:last-child a {  width: 87%; padding-left: 0;}
/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media (max-width: 1150px) {.nav {right: 0;}}
@media only screen and (min-width: 320px) and (max-width: 880px) {
	/*.nav {right: 8%;top: 1%;}*/
	.nav-mobile {
		display:block;
	}

	.nav-list {
		display:none;
	}
	.nav-item {
		width:100%;
		float:none;
	}
	.nav-item > a {
		padding:15px;
	}
	.nav-click {
		display:block;
	}
	.nav-mobile-open {
		border-radius:5px 5px 0 0;
		-webkit-border-radius:5px 5px 0 0;
		-moz-border-radius:5px 5px 0 0;
	}
	.nav-item:hover .nav-submenu {
		display:none;
	}
	.nav-submenu {
		position:static;
		width:100%;
	}
	
	/*-- menu color --*/

	li.nav-item {
  background: #414141 !important;
  border-bottom: solid 1px #ccc;
  line-height: 20px;
  height: 50px;
  max-height:initial !important;
	}
/*
li.nav-item { direction: rtl; max-height: 40px; }
li.nav-item.opened {max-height: 40px;}
li.nav-item.opened:hover {max-height: 40px;}
*/

.sliderEfect {top: 448px; }
	.navWrap { position: fixed;}
	
	.slider {
	  position: relative;
	  top: 79px;
	}
}

@media only screen and (max-width: 780px) and (min-width: 600px){
	.slider { height: 390px;}
	.sliderEfect { top: 307px !important;}
}

@media only screen and (max-width: 780px){ .sliderEfect {top: 227px; }}

@media only screen and (max-width: 390px){
	.sliderEfect { top: 195px;}
	.slider {height: 280px;}
}
/* top navigation f*/


/* side navigation */
#cssmenu,
#cssmenu ul,
#cssmenu ul li {
  list-style: none;
  margin: 0;
  padding: 0;
  border: 0;
}
.fabricsM {margin: 20px 0 0 0 !important;}
#cssmenu ul {
  position: relative;
  z-index: 597;
  float: right;
}
#cssmenu ul li {
width:99%;
height:33px;
min-height: 1px;
line-height: 1em;
vertical-align: middle;
float:right;
/*border-top:1px solid white;*/
border-bottom: 1px solid #DFDFDF;
  margin-top: -3px;
}

#cssmenu ul li.hover,
#cssmenu ul li:hover {
  position: relative;
  z-index: 599;
  cursor: default;
}

#cssmenu ul a,
#cssmenu ul a:link,
#cssmenu ul a:visited {
  display: block;
  color: #3fb7c9;
  text-decoration: none;
}
a.map-a:visited {
  color: #238EBD;
}


#cssmenu > ul > li > a {
  padding: 10px 20px;
}

ul.clearfix {
  float: right;
}
/*
#cssmenu > ul > li:hover {
  border-right: 3px solid blue;
}
*/

#cssmenu ul li:hover > a {
 -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
  background-color: #fed136;
  color: white;/*#556B6E;*/
  /* height: 200px; 
  background: -webkit-linear-gradient(left, transparent ,#FCC300);
  background: -o-linear-gradient(right, transparent, #FCC300);
  background: -moz-linear-gradient(right, transparent, #FCC300);
  background: linear-gradient(to right, transparent , #FCC300);*/
}


/*  links s */
a:link {text-decoration:none;}
a:visited {color: white;}
/*a:hover,a.Fabric-a:hover {color: #F7D037; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease;}*/
a:active {color: #CCCCCC;}
a.Fabric-a{color:#3fb7c9}
a.Fabric-a:visited{color:#3fb7c9}
li.nav-item:hover {
  background: #2896B0;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
/*  links f */

/* aside s */
#asideSpacing{
float:left; 
width:20.2%; 
background-image:url(img/bg.jpg);
height:20px;
border:none;
-webkit-box-shadow: inset 0 20px 20px -20px rgba(0,0,9,0.3);
}

#aside1{
height:0;
height:auto;
border-top: none;
margin-top:-1005px;
width:80%;
}

.opened{
height: 546px !important;
-webkit-transition: width 2s; /* Safari */
 transition: width 2s;
}	

/*--------------------------------------------------
                      Navigation f
--------------------------------------------------*/

@media only screen and (max-width : 1457px) { #asideSpacing{width:20%; } }

@media only screen and (max-width : 1000px) {

#aside1{display: none;}

#asideSpacing{display: none;}

/*.AwningTypeVideo{ margin-bottom:70px;*/ 
}


@media only screen and (max-width : 880px) {
	ul.nav-list { padding: 0 !important;}
.nav-mobile {
  display: block !important;
  cursor: pointer;
  position: absolute;
  top: -26px;
  right: 0;
  background-size: 18px;
  height: 50px;
  width: 50px;
  background: url(../img/nav-icon2.png) no-repeat;
}

li.nav-item ul.nav-submenu li.nav-submenu-item a{
  padding: 6px 0 7px 0;
  width: 100% !important;
  margin: 0 !important;
}
.nav-item a { font-size: 17px !important; }
}

/*Styles for screen 515px and lower*/
@media only screen and (max-width : 880px) {
		nav { height: auto; border-bottom: 0;  width:100%;}
  	nav ul { width: 100%; display: none; height: auto; margin: 0 auto;}
  	nav li { width: 100%; float: left; position: relative; }
  	/*nav li a { border-bottom: 1px solid #CCC; }*/
  	nav a { text-align:center; width: 100%; }
    nav a#pull {
		display: block;
		background-color: white;
		width: 100%;
		position: relative;
		height:60px;
		  background: red;
	}
	nav a#pull:after {
		content:"";
		background: url('img/nav-icon.png') no-repeat;
		width: 40px;
		height: 25px;
		display: inline-block;
		position: absolute;
		right: 25px;
		top: 19px;
	}
	
	/*.nav-mobile {top: 2px;}*/
	ul.nav-list {margin-top: 40px;}
	ul.nav-submenu {
  z-index: 1111;
  position: absolute;
  left: 0;
  right: 4%;
  width: 100%;
  top: 51px;
  margin: 0 auto;
  padding: 0 !important;
  right: 0;
	}

.nav-submenu-item a {
  background: #AEABAB;
  color: #333;
  margin: 0 !important;
  }
  
  #cssmenu ul li:hover > a {
  color: #556B6E;
  background: #fed136;
  width: 178px;
	}
	
.a_href {
  width: 178px;
  line-height: initial;
	}

.menuActive {
  background: #2896B0 !important;
  -webkit-box-shadow: 1px 0px 30px 0px rgba(45, 44, 44, 0.75);
  -moz-box-shadow: 1px 0px 30px 0px rgba(45, 44, 44, 0.75);
  box-shadow: 1px 0px 30px 0px rgba(45, 44, 44, 0.75);
}
}

@media only screen and (max-width : 880px) { 
	ul.nav-list { padding: 0 !important;}
	.logoWrapper{ float: right; width: 300px;}
	.logo {width: 140px !important;}
	.nav{
		float: right;
		width: 100% !important;
 	  position: absolute;
 	  margin: 0 !important;
  }

	.logoWrapper { height: 120px; }

	ul.nav-list { width: 100% !important; height: 400px !important;}
	
	li.nav-item {margin: 0;}
	
	}
	
@media only screen and (max-width : 700px) { ul.nav-submenu {right: 0;}}	
/*@media only screen and (max-width : 650px) { ul.nav-submenu {right: 5%;}}	
@media only screen and (max-width : 550px) { ul.nav-submenu {right: 6%;}}
@media only screen and (max-width : 450px) { ul.nav-submenu {right: 7.5%;}}	
@media only screen and (max-width : 390px) { ul.nav-submenu {right: 8%;}}
@media only screen and (max-width : 360px) { ul.nav-submenu {right: 8.7%;}}
@media only screen and (max-width : 340px) { ul.nav-submenu {right: 9.5%;}}

@media (max-width: 1077px) {.nav-item a {padding: 0 10px; !important}}
@media (max-width: 975px) {.nav-item a {padding: 0 7px; !important}}*/
@media (max-width: 1160px) {
	.nav-item a {padding: 0 5.5px; !important}
	.nav{ width: 637px;}
	}

@media (max-width: 400px) { 
	.logoWrapper{ width: 140px;}	
}
@media (max-width: 496px) {.logo { width: 120px !important;  top: 6px;}}
@media (max-width: 390px) {
	.logo { width: 100px !important; top: 13px;}
	.nav-mobile{
	  top: -22px;
	  left: 5px;
		background-size: 40px 40px; 
		}
		.phoneNum { left: 26%; }
}
@media (max-width: 360) {.logo { width: 90px !important;  top: 4px;}}

@media (max-width: 990px) { 
	.nav-item a{font-size: 16px;}
	.nav {width: 607px;}
}	

@media (max-width: 930px) { 
	.nav-item a { font-size: 15px; }
	.nav { width: 580px;}
	.logoWrapper { width: 277px }
	.phoneNum { width: 43%; }
	.logo { width: 53%; }
	li.nav-item{ /*margin: 0 5px 0 0;*/ 0px }
	.nav { width: 552px; }
}	

@media (max-width : 500px) {
	li.nav-item ul.nav-submenu li.nav-submenu-item a{
	 height: 40px !important;
	 display:block;
	}
	nav li {
 	 height: 54px;
	}
	.contact-wrap * {
	  color: #666!important;
	}
}

@media (max-width: 345px){.phoneNum { left: 21%;}}
@media (max-width: 320px){
	.phoneNum { left: 19%;}
	.slider-text { font-size: 13px;}
}