.main-container {
  width: 100%;
  position: relative;
  display:flex;
  padding:50px 70px;
  overflow:hidden;
  
}


.main-container:before,
.main-container:after {
  content: "";
  display: table;
}

.main-container:after {
  clear: both;
}

 .overlay-logo{
 	padding: 50px 20px 20px 70px;
 }
  .overlay-logo img{
 	max-width: 150px;
 }
.anim {
  
}

.fmenu-col-row{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.fmenu-col{
	flex: 0 0 31%;
 

}
.fmenu-col h3{
	color:#fff;
	font-size: 36px;
	line-height: 46px;
	font-weight: 600;
	font-family:var(--heading-font);
	padding: 0 0 20px 0;
	margin: 0 0 17px 0;
	position:relative;
	text-shadow: 1px 1px 2px black;
}
.fmenu-col h3:after{
	content: '';
	width: 70%;
	height: 3px;
	background-color: var(--primary-color);
	position: absolute;
	bottom: 0;
	left:0;
} 
 


/* Nav Bar */
 

.menu-icon {
    width: 50px;
    height: 50px;
    margin: 0;
    position: relative;
    /* background-color: #1E1232; */
    /* left: 50px; */
    /* top: 41px; */
    cursor: pointer;
    z-index: 2;
    transition: background 0.5s;
    margin-left: 8px;
}
.menu-icon .lines,

.menu-icon .lines:before,

.menu-icon .lines:after {cursor: pointer;/*border-radius: 1px;*/height: 2px;width: 50px;background:var(--white);position: absolute;left: 13px;top: 39%;display: block;content: '';transition: all 0.5s ease-in-out;}

.menu-icon .lines{
	width: 25px;
}

.menu-icon .lines:before {
    left: -13px;
    top: -16px;
}



.menu-icon .lines:after {
    left: -13px;
    top: 16px;
}


/*.menu-icon.active {position: fixed;
	top: 50px;right: 50px;z-index: 100000000;}*/



header.smaller .menu-icon {
  color:var(--black);}
  
 header.smaller .menu-icon:hover {
  color:var(--white);}
  
  
.menu-icon:hover{
	/*background-image: linear-gradient(to left top, #08250A,   #499852 , #499852, #08250A);*/
	}
	
/*.menu-icon span,
.menu-icon span:before,
.menu-icon span:after {
  cursor: pointer;
 
  height: 2px;
  width: 25px;
  background-color:var(--black);
  position: absolute;
  left: 25%;
  top: 50%;
  display: block;
  content: '';
  transition: all 0.5s ease-in-out;
}

.menu-icon span:before {
  left: 0;
  top: -8px;
}

.menu-icon span:after {
  left: 0;
  top: 8px;
}

.menu-icon.active {
  background: #6E2443; 
 z-index:99;*/
 

/******/
.menu-icon:hover span:before, .menu-icon:hover span:after, .menu-icon:hover span {
	/*background-color:var(--primary-color) !important;*/
 	
}
/*****/


.menu-icon.active span {
  background-color: transparent !important;
  
}
 
.menu-icon.active span:before,
.menu-icon.active span:after {
  top: 0;
  background-color:var(--black);
}

.menu-icon.active span:before {
  transform: rotate(135deg);
}

.menu-icon.active span:after {
  transform: rotate(-135deg);
}


.close-button{
	display: flex;
	justify-content: center;
	align-items: center;
	position:fixed;
	top:50px;
	right:50px;
	z-index:9999;
	background-color: var(--primary-color);
	color:var(--white);
	border-radius: 100%;
}
 
/* Menu */

.overlay-menu {
	background-color:var(--black);
	background-image: url(../images/menu-bg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color: var(--white);
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	padding: 0;
	opacity:0.9;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	transform: translateX(100%);
	transition: all 0.4s;
	/*z-index:-1; */
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	align-items: center;
}

.overlay-menu.open {
  height: 100%;
  width: 100%;
  opacity: 1;
  transform: translateX(0);
  z-index:999;
  transition: all 0.4s;
  border-radius: 0;
}
.overlay-menu.open {
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}
.overlay-menu.open::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}
.overlay-menu .anim {
  transform: translateY(25px);
  opacity: 0;
  transition: all 0.5s;
  transition-delay: 0s;
}

.overlay-menu.open .anim {
  transition: all 1s;
  transition-delay: 1s;
  opacity: 1;
  transform: translateY(0px);
  
}

.overlay-menu .anims:nth-child(0) {
  transition-delay: 0.9s;
   
}

.overlay-menu.open .anim:nth-child(2) {
  transition-delay:0.8s;

}
.overlay-menu.open .anim:nth-child(3) {
  transition-delay:0.7s;

}
.overlay-menu.open .anim:nth-child(4) {
  transition-delay:0.6s;

}
.overlay-menu.open .anim:nth-child(5) {
  transition-delay:0.5s;

}
.overlay-menu.open .anim:nth-child(6) {
   transition-delay:0.4s;
}
.overlay-menu.open .anim:nth-child(7) {
  transition-delay:0.11s;

}
.overlay-menu.open .anim:nth-child(8) {
 transition-delay:0.2s;
}
.overlay-menu.open .anim:nth-child(9) {
 transition-delay:0.1s;
}
/****************menu styles****************/


.overlay-menu ul{
	width: 90%;
	height: 100%;
	display:block;
	padding: 15px 15px 15px 0;
	list-style:none;

}
.overlay-menu ul li{
	width:100%;
	display:block;
}

.overlay-menu ul li a{
	width:100%;
	display:block;
	font-weight:normal;
	font-family:var(--heading-font);
	text-transform:uppercase;
	padding:10px 0;
	color:var(--white);
	font-weight:normal;
	font-size:18px;
	letter-spacing:1px;
	line-height:22px;
	position:relative;
 
}
.overlay-menu ul li a:hover{
	 color:var(--white);
	 padding:10px 30px;
}

.overlay-menu ul li a .active{
	color:var(--primary-color);
	}
	
.overlay-menu ul li a span{
	 position:relative;
	 z-index:2;
	
}

.overlay-menu ul li a:after{
	width:0px;
	height:3px;
	position:absolute;
	background-color:var(--primary-color);
	left:0;
	top:15px;
	content:'';
	-webkit-transition: all 300ms ease-in-out;
	-moz-transition: all 300ms ease-in-out;
	transition: all 300ms ease-in-out;	
}


.overlay-menu ul li a:hover:after{
	width:20px;

}
@media screen and (max-width: 768px) {

 .main-container {
  padding:20px;
 
  
}
.close-button{
	top:20px;
	right:20px;
}
 
.fmenu-col{
	flex: 0 0 100%;
	 

}
.fmenu-col h2{
	color:#fff;
	font-size: 30px;
	line-height:40px;
	margin-top:10px;
 
 
}
 
 
.overlay-menu {
	background-image: none;
	}
.overlay-menu ul li a{
	padding:10px 0;
	font-size:12px;
	border-bottom:1px solid rgba(255, 255, 255, 0.2);
 
}
.overlay-menu ul li a:hover{
	 padding:10px 15px;
}

}