div.menu_bar{position:relative; width:100%; height:auto; background:rgba(0, 0, 0, 0.5);}
div.menu_bar a.m_menu{display:block; position:absolute; top:-61px; right:10px; display:block; width:50px; height:auto; text-align:center; color:#fff; background:url("../img/main/menu.svg") center 0 no-repeat; background-size:auto 60%; padding-top:30px;}	
div.menu_bar a.m_home{display:block; position:absolute; top:-60px; left:10px; display:block; width:50px; height:auto; text-align:center; color:#fff; background:url("../img/main/home.svg") center 0 no-repeat; background-size:45%; padding-top:30px;}
div.menu_bar nav.main_M{float:right; transition:all 250ms ease-in-out 0ms;}
nav.main_M.active ul{display:block; z-index:10;}
nav.main_M > ul{position:absolute; display:none; top:0; right:0; width:100%; background:rgba(0, 0, 0, 0.7); transition:all 250ms ease-in-out 0ms;}
nav.main_M > ul > li{display:block; transition:all 250ms ease-in-out 0ms;}
div.menu_bar .submenu{position:relative; width:100%; height:auto; border-bottom:1px solid rgba(255, 255, 255, 0.3); transition:all 250ms ease-in-out 0ms;}
div.menu_bar .submenu a{display:block; padding:15px; transition:all 250ms ease-in-out 0ms; color:#fff; letter-spacing:2px;}
div.menu_bar .submenu i{float:right; display:block; margin:5px 0 0; width:0; height:0; border:5px solid transparent; border-top:7px solid #fff;}
div.menu_bar .submenu ul{position:relative; top:0; display:none; float:left; width:100%; background:rgba(255, 255, 255, 0.2); padding:10px; border:none; transition:all 250ms ease-in-out 0ms;}
.submenu.open{background:#0d2d84;}
.submenu.open > ul{display:block !important; transition:all 250ms ease-in-out 0ms;}
div.menu_bar .submenu ul li{width:47%; height:auto; border:1px solid rgba(255, 255, 255, 0.5); margin:1.5%; }
div.menu_bar .submenu ul li a{display:block; padding:10px; text-align:center; letter-spacing:0px;}

@media screen and (min-width:600px){
	div.menu_bar a.m_menu{top:-58px;}	
	div.menu_bar a.m_home{top:-55px;}
	nav.main_M > ul{top:10px;}
}

@media screen and (min-width:770px) {
	div.menu_bar{width:100%; height:55px; background:none; border-top:1px solid rgba(255, 255, 255, 0.3)}	
	div.menu_bar a.m_menu,
	div.menu_bar a.m_home{display:none;}
	div.menu_bar nav.main_M{position:relative; float:right; right:50%;}
	nav.main_M > ul{position:relative; float:right; display:block; top:0; right:-50%; width:1080px; height:55px; background:none;}
	nav.main_M > ul > li{float:left; width:16.5%;}
	div.menu_bar .submenu{width:16.5%; height:auto; border-bottom:0; transition:all 250ms ease-in-out 0ms;}
	div.menu_bar .submenu a{padding:18px 0; text-align:center; letter-spacing:1px;}
	div.menu_bar .submenu:hover a{background:rgba(0, 0, 0, 0.5);}
	div.menu_bar .submenu i{display:none;}
	div.menu_bar .submenu ul{position:relative; top:-1px; display:none; float:left; width:100%; background:rgba(0, 0, 0, 0.5); padding:0;}
	div.menu_bar .submenu:hover ul{display:block;}
	div.menu_bar .submenu:hover i{position:absolute; top:48px; left:50%; transform:translateX(-50%); text-align:center; display:block; margin:0 0 0; width:0; height:0; border:5px solid transparent; border-top:7px solid #fff; z-index:3;}
	div.menu_bar .submenu ul li{width:100%; height:auto; border:0; margin:0;}
	div.menu_bar .submenu ul li a{display:block; width:100%; height:auto; text-align:center; letter-spacing:0; padding:15px 0;}
	div.menu_bar .submenu ul li a:hover{letter-spacing:1px; background:#0d2d84;}
}

@media screen and (max-width:1100px){
	div.menu_bar nav.main_M{width:100%;}
	nav.main_M > ul{width:100%;}	
}