/* Flexnav Base Styles */
.flexnav ul, .flexnav ul li, .flexnav ul li ul, .flexnav ul li ul li {margin:0px; padding:0px; text-indent:0px;}
.flexnav { list-style:none; }
.flexnav li ul { list-style:none; }
.flexnav {
  -webkit-transition: none;
  -moz-transition: none;
  -ms-transition: none;
  transition: none;
  -webkit-transform-style: preserve-3d;
  overflow: hidden;
  margin: 0 auto;
  width: 100%;
  max-height: 0;
  position:relative;
  z-index:10000;
}
  .flexnav.opacity {opacity: 0; }
  .flexnav.flexnav-show {
    max-height: 2000px;
    opacity: 1;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out; }

  .flexnav li {
    font-size: 20px;
    position: relative;
    overflow: hidden;
	text-align:center;
	border-bottom:1px solid #000;
	margin-left:-4px; /* fix for left margin issue on iphone   */
	float:none;
  font-family:'Roboto condensed', serif; font-weight:300; 
text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
	}
  .flexnav li a {
    position: relative;
    display:block;
    height:50px;
	line-height:50px;
	width:100%;
	text-align:center;
    z-index: 10002;
    overflow: hidden;
    color: #fff;
	padding-left:5px; 
	background:rgba(33,33,33,0.98);
	margin-left:-4px;
   }
   .flexnav li a:hover {background:#666;color: #fff; }  
  .flexnav li ul {
    width: 100%;    /* submenu width */
	margin-bottom:0px;
	margin-left:-5px;
	margin-right:-5px;
	}

    .flexnav li ul li {
		width:100%;
      position: relative;
      overflow: hidden;
	  text-align:left;
	  z-index:10000;
	border-top:1px solid #000;
	border-bottom:0px;
	font-size:20px;
	
	  }
  .flexnav li ul.flexnav-show li {
    overflow: visible; }
  .flexnav li ul li a {
    display: block;
	color:white;
    background: #333; /* Submenu background */
	padding-left:20px;
	height:40px;line-height:40px;

	   }
	  .flexnav li ul li a:hover {
    background: #666; /* Submenu background */
	color:white;	
	  }

  .flexnav .touch-button {
    position: absolute;
    z-index: 10999;
    top: 0;
    right: 0;
    width: 40px;
    height: 46px;
    display: inline-block;
    background: #08220a;
    background: rgba(0, 0, 0, 0.25);
    text-align: center; }
    .flexnav .touch-button:hover {
      cursor: pointer; }
    .flexnav .touch-button .navicon {
      position: relative;
      top: .8em;
      font-size: 16px;
      color: #fff;
	  font-style:normal !important; }

.menu-button {
  position: relative;
  display: block;
  padding: 5px 0em 0em 0em;
  background: none;
  color: #fff;
  cursor: pointer;
  font-size:1.5em;
  height:40px;
  line-height:40px;
  width:40px;
  float:right;
  margin-right:20px;
}
  .menu-button .touch-button {
    background: transparent;
    position: absolute;
    z-index: 10999;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    display: inline-block;
    text-align: center; 
	display:none;
}
    .menu-button .touch-button .navicon {
      font-size: 12px;
      position: relative;
      top: .0em;
      color: #fff; 
 	  font-style:normal !important; }

	  span.active i.navicon { transform:rotateY(90deg) !important;-webkit-transform:rotateY(90deg) !important;-moz-transform:rotateY(90deg);
	  -webkit-transform: matrix(1, -0.2, 0, 1, 0, 0);
      -o-transform: matrix(1, -0.2, 0, 1, 0, 0);
         transform: matrix(1, -0.2, 0, 1, 0, 0);
}
	.menu-button .touch-button,.menu-button .navicon {display:none !important; width:0px !important;}
  

@media all and (min-width: 960px) {

.menu-button, .touch-button, .navicon {display:none !important; width:0px !important;}

  .flexnav {
    overflow: visible;  font-family: 'Roboto Condensed', serif; font-weight:300;
 }
    .flexnav.opacity {
      opacity: 1; }
    .flexnav.one-page {
      top: 0;
      right: auto;
      max-width: 1080px; }
    .flexnav li {
		font-size:22px; 
		font-weight:700;
      position: relative;
      list-style: none;
      float: left;
      display: block;
      background-color: none;
      overflow: visible;
		margin-left:0px; /* fix for left margin issue on iphone */ 
height:40px;
     padding-left:0px; border-bottom:0px;
 	width:9%;
   
    }
	 
	 
	 
	 
    .flexnav li a {
      border-left: 0px solid red;
      border-bottom: none; 
	  padding-left:5px;
	  padding-right:5px;
	  background:none;
	  border-bottom:5px solid transparent;

	  }
	  .flexnav li a:hover {background:none;border-bottom:5px solid #fe0104;}
    .flexnav li > ul {
      position: absolute;
      top: auto;
      left: 0; 
	   }
	   .flexnav li ul {width:auto;box-shadow:0px 20px 20px -20px rgba(0,0,0,0.25), 0px 0px 5px rgba(0,0,0,0.1);}
      .flexnav li ul li { padding:0px ; width: 100%; height:50px;line-height:50px;}   /* submenu width */
    .flexnav li ul li > ul {
      margin-left: 100%;
      top: 0; }
    .flexnav li ul li a { height:50px;line-height:50px;
		background:rgba(0,0,0,0.75); /* desktop submenu link background */
      border-bottom: none;
	  padding-left:5px;}
	  .flexnav li ul li a:hover {background:rgba(0,0,0,0.5);} /* desktop submenu link background hover*/
    .flexnav li ul.open {
      display: block;
      opacity: 1;
      visibility: visible;
      z-index: 10001; }
      .flexnav li ul.open li {
        overflow: visible;
        max-height: 100px; }
      .flexnav li ul.open ul.open {
        margin-left: 100%;
        top: 0; }

  .menu-button {
    display: none; }
	
/*	.flexnav li.m1 ul, flexnav li.m1 ul li{width:150px;}
		.flexnav li.m4 ul, flexnav li.m4 ul li{width:150px;} */

}

	@media only screen and (max-width:719px) {
 
	  .menu-button { }
	.flexnav{top:10px;}

	}
	
@media all and (min-width: 1280px) and (max-width: 1399px) {

  .flexnav li {font-size: 20px;}
  
  
}
@media all and (min-width: 960px) and (max-width: 1279px)  {

  .flexnav li {font-size: 18px;}
}

@media all and (min-width:720px) and (max-width:959px) {
  .flexnav  {position:relative;top:10px;}
	.flexnav li ul li {background:pink !important;}

}