/*
Item name: Menuzord - Responsive Megamenu
Author: marcoarib - marco.arib@gmail.com
License: http://codecanyon.net/licenses
*/

/* MENU CONTAINER
======================================*/
.no_scroll_menuzord {
  overflow:hidden;
  padding:0 0px 0 0;
}

.menuzord{
	width: 100%;
  vertical-align:top;
}

.menuzord a {
	-o-transition: color .3s linear, background .3s linear;
	-moz-transition: color .3s linear, background .3s linear;
	-webkit-transition: color .3s linear, background .3s linear;
	transition: color .3s linear, background .3s linear;
}

/* BRAND
======================================*/
.menuzord-brand{
  display:none;
	float: left;
	cursor: pointer;
}

/* MENU
======================================*/
.menuzord-menu{
	margin: 0 0 0 0;
	padding: 0;
	list-style: none;
  vertical-align:top;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; 
}

/* Menu items */
.menuzord-menu > li{
	float: none;
}
.menuzord-menu > li > a{
	padding: 10px 20px;
  text-align:center;
	display: block;
	text-decoration: none;
	font-size:1.4rem;
  letter-spacing: 0px;
	font-weight: 600; 
  color:#000;
	outline: 0;
	line-height:2.0rem;
  text-transform:none;
  position:relative;
  z-index:100;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}

.menuzord-menu > li > a > span.over {
  vertical-align:top;
  display:inline-block;
  position:relative;
}
.menuzord-menu > li > a:hover > span.over:before {
  content:'';
  display:block;
  position:absolute;
  top:100%;
  width:100%;
  left:0px;
  right:0px;
}
.menuzord-menu ul.menu_items li.overview {
  display:none !important;
}

/* MEGAMENU INDICATORS
======================================*/
.menuzord-menu li .indicator{
	margin-left: 3px;
	display:none;
}

/* MEGAMENU
======================================*/
.menuzord-menu > li > .megamenu{
  text-align:left;
  visibility:visible;
  width: 100%;
  padding: 24px 0px 0px 0px;
  position: absolute;
  top:100%;
  left: 0px;
  right:0;
  display: none;
  z-index: 99;
  border-bottom:1px solid #d7d7d8;
  background:transparent;
  margin:0px auto;
  -webkit-transform: translateZ(0);
}

/* GRID SYSTEM
======================================*/
.menuzord-menu > li > .megamenu .megamenu-row{
	width: 100%;
  border-top:1px solid #d7d7d8;
  padding: 20px 20px;
  background: rgba(255, 255, 255, 1.0);
}
.menuzord-menu > li > .megamenu .megamenu-row:first-child {
	margin-top: 0;
}
.menuzord-menu > li > .megamenu .megamenu-row:before,
.menuzord-menu > li > .megamenu .megamenu-row:after {
	display: table;
	content: "";
	line-height: 0;
}
.menuzord-menu > li > .megamenu .megamenu-row:after {
	clear: both;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12{
	display: block;
	min-height: 20px;
	float: left;
	width: 100%;
}



.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul {
  list-style-type:none;
  column-count: 4;
  column-gap: 30px;
  column-rule: 1px solid #fff;
  max-width:1280px;
  margin:0 auto;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul.menu_items {
  list-style-type:none;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul.menu_items > li {
  width: 100%; 
  overflow: hidden; 
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  -moz-column-break-inside:avoid;
  column-break-inside:avoid;
  break-inside: avoid; 
  break-inside: avoid-column;
  list-style-type:none;
  display:block;
  width:100%;
}

.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li {
  list-style-type:none;
  float:none;
}


/* level2 */
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li > a {
  color:#000;
  display:block;
  font-size:1.4rem;
  line-height:2rem;
  font-weight:600;
  padding: 12px 0px 4px 0px;
  text-transform:none;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li > a:hover {
  color:#000;
  text-decoration:none;
}
/* level3 */
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul {
  list-style-type:none;
  margin: 0px 0 0px 0px;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul li {
  float:none;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul li a {
  text-transform:normal;
  display:block;
  font-size:1.2rem;
  line-height:1.6rem;
  font-weight:400;
  padding: 6px 0px;
  color:#222;
}
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul li a:hover {
  font-weight:700; 
  text-decoration:none;
}
/* level 4,5,6 */
.menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul ul {
  display:none !important;
}



.menuzord_list_image {
  display:flex;
  flex-direction:column;
  background:#fff;
}
.menuzord_list_image_container {
  width:100%;
/*  height:280px; */
  overflow:hidden;
  margin:0 0px;
  position:relative;
  display:block;
  overflow:hidden;
}
.menuzord_list_image_container:before {
  content: "";
  display:block;
  padding-top: 66.6666%;
}
.menuzord_list_image_container img {
  max-width:100%;
  max-height:100%;
  margin: auto;
  position: absolute;
  font-size:0.1px;
  top: 0;
  left: 0px;
  bottom: 0;
  right: 0px;
}
/*
.menuzord_list_image_container img {
  width:100%;
  height:auto;
  vertical-align:top;
}
*/

.menuzord_list_image_name {
  background:#fff;
  color:#222;
  padding: 10px 0px;
}

.menuzord_list_icon {
  display:flex;
  flex-direction:row;
  align-items:center;
} 
.menuzord_list_icon_container {
  display:none;
  width:40px;
  height:40px;
  overflow:hidden;
}   
.menuzord_list_icon_container img {
  width:100%;
  height:auto;
  vertical-align:top;
  
}
.menuzord_list_icon_name {
  flex:1;
  padding-left:0px;
}  




/* SHOW/HIDE BUTTON (MOBILE MODE)
======================================*/
.menuzord .showhide{
  position:absolute;
  z-index:1;
  top:0px;
  right:-100%;
  width: 50px;
	padding: 0px 0 0;
	display: none;
	float: right;
	text-decoration: none;
	outline: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
  text-align:right;

}
/* Show/hide button icon */
.menuzord .showhide .fas{
  line-height:5.8rem;
  font-size:2.0rem;
  color:red;
  margin: 0px 10px;
}

/* ICONS (parent menu items)
======================================*/
.menuzord-menu > li > a > i{
	margin: 0 5px 0 0;
	font-size: 1.8rem;
	float: left;
	line-height: 2.0rem;
  font-family: 'Line Awesome Free';
  font-weight:900;
}


/* Levels */
.active1 > a { color:#000!important;}
.activeparent1 > a { color:#000!important;}

.active1 > a > span.over:before,
.activeparent1 > a > span.over:before {
  content:'';
  display:block;
  position:absolute;
  top:100%;
  width:100%;
  border-bottom: 1px solid #555;
  left:0px;
  right:0px;
}

.active2 > a { color:#000!important;}
.activeparent2 > a { color:#000!important;}

.active3 > a { color:#000!important;}
.activeparent3 > a { color:#000!important;}

.active4 > a { color:#000!important;}
.activeparent4 > a { color:#000!important;}

.active5 > a { color:#000!important;}
.activeparent5 > a { color:#000!important;}




/* MOBILE MODE (RESPONSIVE MODE)
======================================*/
.col_categories_menu ul {
  list-style-type:none;
}  
.col_categories_menu {
  display:block;  
  position:fixed;
  padding: 60px 10px 50px 10px;
  top:0px;
  left:calc(-100% + 20px);
  width:calc(100% - 20px);
  height:100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  opacity:0;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index:1301;
  background:#fff;
  margin-top:0px;
  margin-bottom:0px;

}
@media (min-width: 440px){
  .col_categories_menu { width:420px; padding:60px 20px 50px 20px; left:-420px; }
}


.admin_mode .col_categories_menu {
  padding-top: 96px;
}
.col_categories_menu.active {
  opacity:1;
  left:0px;
}
.toggle_overlay_menu {
  display:none;
  position:fixed;
  top:0;
  left:0;
  right:0;
  background:rgba(0,0,0,0.2);
  width:100%;
  height:100%;
  z-index:1300;
}
.col_categories_menu.active {
  opacity:1;
  left:0px;
}
.toggle_closer_menu {
  cursor:pointer;
  width:30px;
  height:30px;
  background:#fff;
  color:#000;
  position:absolute;
  top:10px;
  right:25px;
  font-size:1.6rem;
  line-height:3.0rem;
  text-align:center;
}
.admin_mode .toggle_closer_menu {
  top:46px;
}




@media (min-width: 1161px){
  .col_categories_menu {
    vertical-align:top;
    background:transparent;
    display:inline-block;  
    position:static;
    padding: 0px;
    width:auto;
    height:auto;
    opacity:1;
    transition: none;
    box-shadow: none;;
    margin-top:-10px;
    margin-bottom:-10px;
  }
  .admin_mode .col_categories_menu {
    padding: 0px;
  }  
  .toggle_closer_menu {
    display:none;
  }
  .toggle_overlay_menu {
    display:none !important;
  }

}







@media (max-width: 920px){


}


@media (max-width: 1160px){

  .menuzord-menu {
    display:block !important;
  }
  .menuzord-menu li .indicator{
	 margin-left: 0px;
	 display:inline-block;
  }

	/* Show/hide button */
	.menuzord-responsive .showhide{
		display:none !important;
	}
	
	/* Menu */
	.menuzord-responsive .menuzord-menu{
		width: 100%;
		float: left !important;
	}
	/* scrollable menu*/
	.menuzord-responsive .menuzord-menu.scrollable{
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	.menuzord-responsive .menuzord-menu.scrollable > .scrollable-fix{
		display: block;
	}
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul {
    margin: 0px 0 3px 0px;
  }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul ul li a {
    padding: 6px 0px 6px 6px;
  }	
  
  
  
	/* Menu items */
	.menuzord-responsive .menuzord-menu > li{
		width: 100%;
		display: block;
		position: relative;
	}
	.menuzord-responsive .menuzord-menu > li > a{
    text-align:left;
		width: 100%;
		padding: 14px 10px;
		display: block;
		border-bottom: solid 1px #ddd;
	}
	.menuzord-responsive .menuzord-menu > li:first-child > a{
		border-top: solid 1px #fff;
	}
	
	/* Dropdown/megamenu indicators */
	.menuzord-responsive .menuzord-menu li .indicator{		
		width: 60px;
		height: 49px;
		position: absolute;
		right: 0;
		top: 0;
		font-size:1.4rem;
		text-align: center;
		line-height:4.6rem;
		border-left: solid 1px #ddd;
	}

	
	/* Megamenu */
	.menuzord-responsive .menuzord-menu > li > .megamenu{
		width: 100% !important;
    padding: 10px 0px;
		left: 0 !important;
		position: static;
		border-top: none;
	}

	.menuzord-responsive .menuzord-menu > li > .megamenu .megamenu-row {
		float: none;
		display: block;
		width: 100% !important;
		margin: 0 0 0 0;
    border: none;
    padding: 0px 16px;
	}
  
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul {
    column-count: 1;
  }

  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul.menu_items > li > a {
    color: #222;
    display: block;
    font-size: 1.4rem;
    line-height: 1.8rem;
    font-weight: 500;
    padding: 10px 0px 10px 0;
  }
  
  .menuzord_list_icon_container {
    display:none;
  }  
  .menuzord_list_icon_name {
    padding: 0 0 0 0;
  } 
  
  .menuzord_list_image_container {
    display:none;
  }  
  .menuzord_list_image_name {
    padding: 0px 0px;
  }  
  
  
  .cat_level_2_image {
    display: block;
    width: 100%;
    height: auto;
    text-align: center;
    margin: 5px 0px 0px 0px;
    float:none;
    vertical-align:top;
  }



	.menuzord-responsive .menuzord-menu > li > .megamenu .megamenu-row:first-child  [class*="col"]:first-child {
		margin-top: 0;
	}




/*
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li { width: 50%; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(4n+1) { clear:none; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(3n+1) { clear:none; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(2n+1) { clear:both; }
*/
}

@media (max-width: 500px){

  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li { width: 100%; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(4n+1) { clear:none; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(3n+1) { clear:none; }
  .menuzord-menu > li > .megamenu .megamenu-row .col12 > ul > li:nth-child(2n+1) { clear:none; }



}