/* header */
.navbar {position: fixed; z-index: 999; width: 100%;}

.mnlogo {display: block; position: absolute; z-index: 20; top: 40px; left: 40px; width: 159px; height: 52px; transition: all 0.5s;}
.logo {position: fixed; z-index: 999; left: 40px;}
.wlogo {display: none;}
.mbreser {position: absolute; top: 0px; right: 0px; z-index: 110; font-size: 12px; font-weight: bolder; line-height: 73px; text-align: center; letter-spacing: 0.025em; color: #fff; transition: all .5s ease;}
.wmbreser {display: none;}
#sticky_navs {display: block; position: fixed; top: 27px; z-index: 100; width: 100%; transition: all .5s ease;}
.mlogo,
.mreser {display: none;}
.mopen {position: fixed; z-index: 110; top: 0px; right: 200px; line-height: 70px; color: #fff; font-size: 15px; font-weight: bold;}
#cssmenu {position: relative; width: 100%; background: transparent !important; margin: 0 auto;}
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #head-mobile {display: block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 0;}
#cssmenu:after,
#cssmenu > ul:after {content: "."; display: block; clear: both; height: 0; visibility: hidden; line-height: 0;}
#cssmenu #head-mobile {display: none;}
#cssmenu {}
#cssmenu > ul {text-align: center;}
#cssmenu > ul > li {display: inline-block !important; vertical-align: top;}
#cssmenu > ul > li > a {display: inline-block; font-size: 15px; font-weight: bolder; line-height: 73px; text-transform: uppercase; letter-spacing: 0.025em; color: #fff; padding: 0 30px; cursor: pointer;}
#cssmenu ul li.active a {color: #000; text-shadow: none;}
#cssmenu ul ul {position: absolute; left: -9999px; background: rgba(49, 49, 49, 1); padding: 10px 0;}
#cssmenu ul ul li {height: 0; -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease;}
#cssmenu ul ul li:hover {}
#cssmenu li:hover > ul {left: auto;}
#cssmenu li:hover > ul > li {height: 30px;}
#cssmenu ul ul li a {display: inline-block; min-width: 120px; font-size: 13px; font-weight: normal; line-height: 30px; text-transform: uppercase; letter-spacing: 0.05em; color: #fff; padding: 0 20px;}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {border-bottom: 0;}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {text-decoration: underline;}

@media(min-width:1001px) {
	.navbar {padding: 27px 0 0; -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out; -moz-transition: background .5s ease-in-out,padding .5s ease-in-out; transition: background .5s ease-in-out,padding .5s ease-in-out;}
    .navbar.top-nav-collapse {height: 84px; background: rgba(70, 74, 87, 0.8); padding: 0;}
    .navbar.top-nav-collapse .mbreser {height: 84px;}
    .navbar.top-nav-collapse #cssmenu > ul > li > a {line-height: 84px;}
	#cssmenu > ul > li:nth-child(1) > ul {margin: 0 0 0 11px;} /* prologue */
	#cssmenu > ul > li:nth-child(2) > ul {margin: 0 0 0 -5.5px;} /* rooms */
	#cssmenu > ul > li:nth-child(3) > ul {} /* special */
	#cssmenu > ul > li:nth-child(4) > ul {margin: 0 0 0 -1.5px;} /* travel */
	#cssmenu > ul > li:nth-child(5) > ul {margin: 0 0 0 3.5px;} /* resere */
}

@media screen and ( max-width:1000px ){
	.navbar {position: static; height: 84px; background: rgba(70, 74, 87, 0.8);}

    .logo,
	.blogo,
	.mbreser {display: none !important;}
    .mbreser {right: 15px; font-size: 0; line-height: 84px;}

	#sticky_navs {position: static;}
    .mlogo,
	.mreser {display: block;}
    .mlogo {position: absolute; width: 100%; text-align: center;}
    .mlogo a {display: inline-block; margin-top:13px;}
    .mreser {position: absolute; right: 20px; line-height: 84px; color: #2a2a2a;}
    nav {width: 100%;}
    #cssmenu {width: 100%;}
    #cssmenu ul {display: none; width: 100%;}
	#cssmenu > ul {position: absolute; top: 84px; z-index: 999; padding: 0;}
    #cssmenu > ul > li {width: 100%; float: none; border-top: 1px solid #ebebeb;}
    #cssmenu > ul > li:last-child {border-bottom: 1px solid #ebebeb;}
    #cssmenu > ul > li:hover,
	#cssmenu ul li.active:hover,
	#cssmenu ul li.active {}
    #cssmenu > ul > li > a {font-size: 15px; font-weight: normal; line-height: 300%; background: #fff; color: #000 !important; text-shadow: none !important; padding: 0 25px;}
    #cssmenu > ul > li > a
    #cssmenu ul li a {}
    #cssmenu ul li a,
	#cssmenu ul ul li a {width: 100%;}
	#cssmenu > ul > li:hover > a,
    #cssmenu ul li.active a {}
    #cssmenu ul ul li,
	#cssmenu li:hover > ul > li {height: auto; text-align: center;}
	#cssmenu ul ul,
    #cssmenu > ul > ul > li {background: #757575 !important;}
    #cssmenu ul ul li:hover {}
    #cssmenu ul ul li a {color: #fff; padding-left: 25px;}
    #cssmenu ul ul li:hover > a,
	#cssmenu ul ul li.active > a {color: #fff;}
    #cssmenu ul ul {position: relative; left: 0; width: 100%; text-align: left; padding: 10px 0; margin: 0;}
    #cssmenu #head-mobile {display: block; font-size: 12px; font-weight: 700; color: #ddd; padding: 30px;}

    .button {position: absolute; top: 0; left: 15px; z-index: 12399994; width: 25px; height: 84px; color: #fff; cursor: pointer;}
    .button:after {content: ''; display: block; position: absolute; top: 40px; right: 0px; width: 25px; height: 12px; border-top: 3px solid #fff; border-bottom: 3px solid #fff;}
    .button:before {content: ''; display: block; position: absolute; top: 30px; right: 0px; width: 25px; height: 3px; background: #fff; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease;}
    .button.menu-opened:after {top: 40px; width: 25px; height: 3px; background: #fff; border: 0; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
    .button.menu-opened:before {top: 40px; width: 25px; background: #fff; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
}

@media ( max-width: 767px ) {
    .mlogo img {display: inline-block; width: 80%; padding: 5% 0;}
    #cssmenu > ul > li > a {font-size: 13px;}
	#cssmenu ul ul li a {font-size: 11px;}
    #cssmenu ul ul li:hover > a,
	#cssmenu ul ul li.active > a {text-decoration: none;}
}