.header-menubar{ display: block; height: 40px; position: relative; text-align: center; 
	background-color: #e8e9eb;
}

.glass {
	background: radial-gradient(#fff 20%, #fff2);
	backdrop-filter: blur(10px);
  }

.mnHeader {color:#b01f24;}

#BigLogo {display: block; background-color: #fff;}
#MiniLogo {position:absolute; left:47%; height: 35px; padding-top:2px; display: none;}

.footer {
	background: #9e2620;
	font-weight: bold;
	color: #fff;
	line-height: 50px;

	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	height: 50px;
	padding: 0 50px;
}

.header.fixed {
	position: fixed;
	top: 0;
	left: 0;
}


.sticky {
	position: fixed;
	top: 0;
	width: 100%
}

.Selected {
	background-color: brown !important;
	color: white !important;
}


.mm-navbar {
	--mm-color-background: #4bb5ef;
	--mm-color-text-dimmed: #fff;
	--mm-color-button: #fff;
}

.mm-panel {
	--mm-color-background: #e0f2fc;
	--mm-color-text: #222;
	--mm-color-button: #4bb5ef;
}

.mm-spn li span:hover,
.mm-spn li a:hover {
	background-color: #9e2620 !important;
	color: #f3f3f3;
	-webkit-transition: background 1s;
	/* For Safari 3.0 to 6.0 */
	transition: background 1s;
	/* For modern browsers */
}


#purchase_cart {position: absolute; z-index: 91; right: 0px; top: 0px; 
	padding:8px 15px; height: 40px;}


.bannerPane {background-color: #f1f1f2; height:20%; min-height: 200px; padding:30px 0px;}

.btnImg1, .btnImg2 {
	text-align: center; overflow: hidden; position: relative; display: inline-block;
	-webkit-border-radius: 10px !important;-moz-border-radius: 10px;border-radius: 10px !important;
	filter: drop-shadow(2px 1px 5px #acacac);
}

.btnImg1{background-color: #dbdbdb; width:15%; min-width: 80px; max-width: 110px;  margin: 10px; padding:0px;}
.btnImg2{background-color: #acacac; width:20%; min-width: 120px; max-width: 250px; margin: 10px;}

.btnImg1 .img1{display:block;}
.btnImg1 .img2{display: none;}
.btnImg1:hover , .btnImg2:hover, .btnImg2.active , .btnImg1.active {
	/* background: rgb(146,37,30);
	background: linear-gradient(90deg, rgba(146,37,30,1) 0%, rgba(226,89,37,1) 100%);
	filter: drop-shadow(2px 1px 5px #acacac); */
	background: rgb(91,90,95);
	background: linear-gradient(90deg, rgba(91,90,95,1) 0%, rgba(166,170,173,1) 100%);
			}
.btnImg1:hover .img1, .active>.img1{display: none;}
.btnImg1:hover .img2, .active>.img2{display: block;}

.tab-content{border:1px solid #acacac;}


.btnCourse {
	display: inline-block;
	color: black;
	padding: 5px;
	margin: 5px 5px;
	text-decoration: none !important;
	font-weight: 600;
	overflow: hidden;
	filter: drop-shadow(0px 0px 0px #acacac);
}

.btnCourse img {
	width: 10vw;
	max-width: 80px;
}

.btnCourse:hover,
.btnCourse.active {
	-webkit-border-radius: 10px !important;
	-moz-border-radius: 10px;
	border-radius: 10px !important;
	filter: drop-shadow(2px 1px 5px #acacac);
	background-color: #dbdbdb;
}

.btnCourse2 {
	display: block;
	color: black;
	margin: 5px 5px;
	text-decoration: none !important;
	font-weight: 600;
	line-height: 1.2em;
}

.btnCourse2 img {
	width: 4vw;
	max-width: 70px;
}

.btnCourse2 .badge {
	display: block;
	height: 35px;
	text-decoration: none;
	line-height: 30px;
	color: white;
	margin: 1px;
}

.btnCourse3 {
	display: inline-block;
	color: black;
	padding: 5px;
	margin: 5px 5px;
	text-decoration: none !important;
	font-weight: 600;
	overflow: hidden;
	filter: drop-shadow(0px 0px 0px #acacac);
}


.btnCourse3:hover,
.btnCourse3.active {
	-webkit-border-radius: 10px !important;
	-moz-border-radius: 10px;
	border-radius: 10px !important;
	filter: drop-shadow(2px 1px 5px #acacac);
	background-color: #2B398F;
}

.badge:hover {
	background-color: #9e2620;
}

.badge-basic {
	background-color: #ac7177;
}

.badge-addon {
	background-color: #c16870;
}

.btnCourse2:hover,
.btnCourse2.active {
	-webkit-border-radius: 10px !important;
	-moz-border-radius: 10px;
	border-radius: 10px !important;
	filter: drop-shadow(2px 1px 5px #acacac);
	background-color: #dbdbdb;
}

.btnHamburger {
	display: block;
	width: 50px !important;
	height: 40px !important;
	z-index: 92;
	padding: 11px;
	margin: 5px;
	margin-top :0px;
	position: absolute;
	top: 0;
	left: 0;
}

.btnHamburger:before,
.btnHamburger:after {
	content: '';
	display: block;
	background: #6e6f73;
	height: 2px;
}

.btnHamburger span {
	background: #6e6f73;
	display: block;
	height: 2px;
	margin: 6px 0;
}
a:hover { transition: 1s; }

#pcMenu {
	position: absolute;
	display: inline-block;
	z-index: 91;
	top: 0px;
}

/* ipad */
@media only screen and (min-device-width: 834px)  {
	#pcMenu{ width: 95%; left: 2%;}
}

/* ----------- lap top ----------- */
@media screen and (min-device-width: 1600px)  {
	#pcMenu{ width: 80%; left: 10%;}
}

.pcmenu a, .pcmenu a:link, .pcmenu a:visited, .pcmenu a:focus {
    text-decoration: none;
}

.pcmenu > li {
    display: inline-block;
    text-align: center;
    margin-left: -4px;
	height: 30px; margin-top:5px;
    border-left: 2px ridge  rgba(255, 255, 255, 0.11);
    box-shadow: -1px 0 0 rgba(0, 0, 0, 0.1);
}
.pcmenu > li > a {
    display: block;
	font-size: 1.2rem;
	margin-top: -5px;
	padding: 5px 25px; height: 40px;
	text-decoration: none !important;
	color: #2b2b2b;
}
.pcmenu > li:hover > a, .btnHamburger:hover, #purchase_cart:hover {
    color: #2b2b2b;
	background-color: #dedede;
	
}

.pcmenu > li:hover {
    
}
/* Megadrop width dropdown */
 .pcmenu > li > .megadrop {
    opacity: 0;
    visibility: hidden;
    position: absolute;
    list-style: none;
    top:40px;
    left: 0px;
    width: 99.5%;
    min-height: 100px;

    margin-top:30px;
    padding: 0;
    z-index: 99;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    overflow: hidden;
    border-left: 2px solid #dedede; 
    border-right: 2px solid #dedede;
    border-bottom: 2px solid #dedede;
	background-color: #dedede;
}
.pcmenu > li:hover .megadrop {
    opacity: 1;
    visibility: visible;
    margin-top: 0px; color:white;
}

.pcmenu > li > ul li ul, .pcmenu li >ul li, .pcmenu > li > .megadrop, .pcmenu > li > ul, .pcmenu > li {
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-outs;
}

.megadrop > ul {display: block; position: relative; width: 100%; }
.megadrop > ul > li {list-style: none; margin: 5px; display: inline-block; width:19%; text-align: center; 
	border: 1px solid #d1d1d1; border-top:none; overflow: hidden;}
.megadrop > ul > li a {display:block; padding:5px; color:#2b2b2b !important;}
.megadrop > ul > li a:hover {background-color: #e8e9eb;}

#pcMenu .active  {
	/*
	background: rgb(107,0,7);
	background: radial-gradient(circle, rgba(107,0,7,1) 0%, rgba(230,92,29,1) 100%);
	*/

	background: rgb(91,90,95);
	background: linear-gradient(0deg, rgba(91,90,95,1) 0%, rgba(232,233,235,1) 7%);
}




#MenuRight{position: fixed; right:0px; bottom:0vh; z-index: 999;}
.menubtn {
	float:right;
	cursor: pointer;
	display: inline-block;
	position: relative;
	height: 40px; width: 50px;

	box-shadow:inset 0px 1px 0px 0px #ffffff;
	
	background-color:#a6aaad;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	padding:6px 12px;
	text-decoration:none;
	

  }
  .menubtn span {
	display: block;
	width: 40px;
	height: 3px;
	position: absolute; top:10px; left:5px;
	background: #fff;
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease; 
  }
  .menubtn span::before {
	content: "";
	width: 40px;
	height: 3px;
	position: absolute;
	top: 8px;
	background: #fff;
	-webkit-transition: all 100ms ease;
	transition: all 100ms ease;
  }
  .menubtn span::after {
	content: "";
	width: 40px;
	height: 3px;
	position: absolute;
	top: 16px;
	background: #fff;
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease;
  }
  .menubtn.opened{
	width: 100%;

	border-top-left-radius: 10px;
		
	display:inline-block;
	cursor:pointer;
	color:#ffffff;

	padding:6px 24px;
	z-index: 99;
  }

  .menubtn.opened:hover {
	
	background-color:#5b5a5f;
  }

  .menubtn.opened span {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 18px;
  }
  .menubtn.opened span::before {
	opacity: 0;
  }
  .menubtn.opened span::after {
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
	top: 0px;
  }
  .navmenu {
	visibility: hidden;
	width:150px; z-index: -1;
	padding:15px 5px;
	text-align: center;

	box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);
	z-index: 10;
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 300ms ease;
	transition: all 300ms ease;


	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
  }
  .navmenu.opened {
	visibility: visible;
	opacity: 1;
	width:150px;

	background: radial-gradient(#fff 20%, #fff2);
	backdrop-filter: blur(10px);

  }
  
  .navmenu ul {
	list-style: none;
	margin: 0;
	padding: 0;
  }

  .navmenu ul li {
    text-align: center;
    margin-left: -4px;
	border:none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.11);
    box-shadow: 0 0 -1px rgba(0, 0, 0, 0.1);
  }

  .navmenu ul li a {display: inline-block;}
  .navmenu ul li:hover{	background-color:#e8e9eb;}



#bottom-nav{
	

	border: 0px dashed #999;
 	position: fixed;
 	bottom: 0;
 	width: 100%;
	z-index: 999;
}
#bottom-nav.active{
	background: -moz-linear-gradient(-45deg,  #952820 0%, #e35a24 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg,  #952820 0%,#e35a24 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg,  #952820 0%,#e35a24 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#952820', endColorstr='#e35a24',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

#bottom-menu{
	display:none;
	text-align: center; padding:5px; padding-top:10px;
   }
#bottom-menu li {display: inline-block; padding:5px 5px; margin-bottom: 5px;}
#bottom-menu a {color:#fff; text-decoration: none; border: 1px solid #fff; padding:4px 9px;}
#bottom-menu a:hover{ background-color: #6b0007;}

#toggle2 {
	background-color: #ff0101;
	border: 0px solid rgba(0, 0, 0, 0);
	cursor: pointer;
	margin: 5px auto;
	width: 50px; height:50px;
	position: relative;
	border-radius: 50%;
	border: 4px solid #fff;

	-webkit-box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.3); 
	box-shadow: 0px 0px 3px 2px rgba(0,0,0,0.3);
   }

   #toggle2.active {background-color: #ff8e1f;}   
  
   #toggle2:before, #toggle2:after {
	content: "";
	display: block;
	width: 20px;
	height: 5px;
	background: white;
	position: absolute;
	top: 18px;
	transition: transform .5s;
  }

  #toggle2:before {
	right:16px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	transform: rotate(-45deg);
  }
  
  #toggle2:after {
	right: 6px;
	transform: rotate(45deg);
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
  }
  
  #toggle2.active:before {
	transform: rotate(45deg);
  }
  
  #toggle2.active:after {
	transform: rotate(-45deg);
  }
   
  .mmbox {border: 1px solid #a0a0a2; border-top:none;}