@charset "utf-8";
/* CSS Document */

/* Navigation */
.navi::after, .navi::before {content: ""; display: table;}
.navi::after {clear: both;}
.navi {display: table; position: absolute; bottom: 0px; right: 0; z-index: 10; font-family: 'Roboto', sans-serif;}
.navi ul {list-style-type: none; padding: 0; margin: 0;}
.navi ul li {float: left; position: relative; font-size: 18px;}
.nav-smal ul li {padding: 3px 0px; background-color: transparent; color: #575656; margin-left: 30px; border-bottom: 3px transparent solid;}
.nav-big ul li {padding: 9px 12px 6px 12px; background-color: #f7e91c; color: #575656; margin-left: 4px; border-bottom: 3px transparent solid;}
.nav-smal ul li:hover {color: #F7E91C; border-bottom: 3px #F7E91C solid;}
.nav-smal ul li:hover a {color: #F7E91C;}
.nav-big ul li:hover {color: #fff; background-color: #123778;}
.nav-big ul li:hover a {color: #fff;}
.navi ul li:hover ul li a {color: #575656;}
.navi ul li:hover ul li:hover a {color: #F7E91C;}
.nav-smal ul li a, .nav-big ul li a {color: #575656; text-decoration: none; font-size: 18px;}
.nav-smal ul li a:hover {color: #F7E91C;}
.nav-big ul li a:hover {color: #fff;}

.navi ul li ul li {float: none; margin-left: 0; margin-bottom: 1px; position: relative; font-size: 17px; border-bottom: 1px transparent solid; box-sizing: border-box; padding: 10px 15px; background-color: rgba(247,233,28,0.90);}
.navi ul li ul li a {font-size: 17px; font-weight: 300; color: #575656;}
.navi ul li ul li:hover a {color: #575656!important;}
.navi ul li ul, .navi ul li ul li ul {display: none;}
.navi ul li:hover ul {display: block; position: absolute; top: 30px; left: 0px; border-top: 15px transparent solid; width: 220px;}
.navi ul li:hover ul li ul {display: none;}
.navi ul li ul li:hover ul {display: block; position: absolute; top: 0; left: 100%; border-left: 4px transparent solid; border-top: 0;}

.separator::after, .deeper a::after {font-family: 'FontAwesome'; content: "\f107"; margin-left: 5px;}
.deeper ul li a::after {display: none;}
.navi ul li ul li:hover {color: #575656; border-bottom: 1px transparent solid; background-color: rgba(247,233,28,1.0);}
.nav-smal ul li.active {color: #F7E91C; border-color: #F7E91C;}
.nav-smal ul li.active a {color: #F7E91C;}
.nav-smal .active a, .nav-smal .active {color: #F7E91C;}
.nav-big ul li.active {color: #fff; border-color: transparent; background-color: #123778;}
.nav-big ul li.active a {color: #fff;}
.nav-big .active a, .nav-big .active {color: #fff;}

.nav-smal ul li.current a {color: #F7E91C!important;}
.nav-big ul li.current a {color: #fff!important;}

.mobil-menu {display: none; background-color: #575656; position: absolute; top: 0; font-size: 22px; box-sizing: border-box; padding: 8px 10px 4px 10px; color: #fff; cursor: pointer;}
.mobil-menu {right: 0px;}

@media screen and (max-width: 770px){
	.navi {display: none;}
	.mobil-menu {display: block;}
}
@media screen and (max-height: 380px){
	.navi {bottom: 30px;}
}

.mobil-navi {width: 100%; height: 100%; position: fixed; top: 0; left: 0; background-color: rgba(87,86,86,0.95); z-index: 333333; overflow: hidden; overflow-y: auto; display: none;}
.mn-inner {width: 100%; box-sizing: border-box; padding: 50px;}
.mn-inner .fa {color: #F7E91C; border: 5px #fff solid; border-radius: 50%; width: 50px; height: 50px; line-height: 50px; text-align: center; font-size: 30px; cursor: pointer;}
.mn-inner ul {list-style-type: none; margin: 50px 0 50px -35px;}
.mn-inner li, .mn-inner a {font-size: 26px; color: #F7E91C; margin: 15px 0; text-decoration: none; font-weight: bold;}
.mn-inner ul li ul {margin: 0 0 0 10px;}
.mn-on {display: block;}
@media screen and (max-width: 445px){
	.mn-inner li, .mn-inner a {font-size: 20px; margin: 10px 0;}
}
@media screen and (max-width: 370px){
	.mn-inner {padding: 25px;}
	.mn-inner ul li ul {margin: 0 0 0 -15px;}
}