/* Hamburger Menu */
.hamburger-menu {
	/*float: left;*/
	display: none;
	/*display: inline-block;
	cursor: pointer;
	margin-right: -10px;*/
	position: absolute;
	top: calc(50% - 40px);
	left: 20px;
}
.hamburger-menu a {
	position: absolute;
    display: inline-block;
    color: #a87b57;
    font-size: 16px;
    font-weight: bold;
    line-height: 50px;
    left: 70px;
    top: calc(50% - 25px);
    text-transform: uppercase;
}
.menu-trigger {
	float: left;
   	display: none;
    position: relative;
    width: 80px;
    height: 80px;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);
    /*left: 25px;
    top: 6px;*/
	top: 0;
    right: 0;
	
	/*display: block;
    position: absolute;
    width: 36px;
    height: 36px;
    cursor: pointer;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.5);
    right: 25px;
    top: 6px;*/
}


/* Menu Icon */
.ham {
	position: relative;
	display: inline-block;
	width: 80px;
   	/*padding-left: 30px;*/
   	cursor: pointer;
   	overflow: hidden;
   	/*right: -12px;
    top: -13px;*/
   	z-index: 10;
   
  	-webkit-tap-highlight-color: transparent;
  	transition: transform 400ms;
  	-moz-user-select: none;
  	-webkit-user-select: none;
  	-ms-user-select: none;
  	user-select: none;
}
.hamRotate.active {
	transform: rotate(45deg);
	padding-left: 0;
	left: 0;
}
.hamRotate180.active {
	transform: rotate(180deg);
}
.hamtext {
	display: inline-block;	
}
.line {
	fill:none;
	stroke: #a87b57;
	stroke-width: 3.5;
	stroke-linecap:round;
	transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
}
.ham1 .top {
	stroke-dasharray: 40 139;
}
.ham1 .bottom {
	stroke-dasharray: 40 180;
}
.ham1.active .top {
	stroke-dashoffset: -98px;
}
.ham1.active .bottom {
	stroke-dashoffset: -138px;
}
.am-container {
	position: fixed;
	width: 360px;
	height: 100vh;
	background: rgba(255,246,231,0.9);
	overflow: auto;
	top: 114px;
	left: -360px;
	z-index: 99;
}
.open,
.am-container {
     transition: .4s;
	-webkit-transition: .4s;
	-moz-transition: .4s;
}
/*.open {
	right: -360px;
}*/
.open {
	left: 0;
}
.am-container.open {
	display: none;	
}
.smaller .am-container,
.smaller .am-container.open {
	top: 77px;
}
.dim { 
	display: none;
}
.list-item li {
	font-family: 'Thasadith', sans-serif;
	font-weight: bold;
	text-transform: uppercase;
}
.list-item li:first-child a {
	color: #fff;
    background: #35200a;
	line-height: 52px;
}
.ham-sub,
.list-item li a {
	display: block;
	color: #35200a;
	font-size: 14px;
	line-height: 40px;
	padding: 0 20px;
	white-space: nowrap;
	text-overflow: ellipsis;
	text-decoration: none;
	outline: 0;
	overflow: hidden;
}
.ham-sub:hover,
.list-item li a:hover{
	color: #fff;
    background: #f78d34;
}
.ham-sub {
	position: relative;
	color: #fff;
	background: #f5821f;
	line-height: 52px;
    cursor: pointer;
}
.ham-sub .icon-plus {
    position: absolute;
	font-size: 18px;
	top: calc(50% - 9px);
	right: 20px;
}
.list-item li.ham-sub a {
	padding: 0;
}
/*.ham-sub:after{
	font-family: FontAwesome;
	content: "\f105";
	float: right;
	padding-right: 20px;
	margin-top: 7px; 
	font-size: 16px;
}*/
.ham-sub + .sub-items{
	display: none;
}
.am-container h3{
	color: #fff; 
	/*font-family: 'Marmelad', sans-serif;*/
	text-shadow: 1px 0.01px rgba(0, 0, 0, 0.1);
	font-weight: 400;
	padding: 10px;
	font-size: 18px;
	border-bottom: 1px dotted rgba(255, 255, 255, 0.096);
}
.ham-sub .item-icon,
.item-icon{
	display: inline-block;
	border: 0;
	width: 32px;
	height: 32px;
	position: relative;
	vertical-align: middle;
	padding-right: 20px;
	text-align: left;
}
.item-icon img{
   	width: 32px;
    height: 32px;
}

/* Virtual Page */
.virtual-page {
	position: absolute;
	width: 360px;
	height: calc(100vh - 150px);
	background: #ede6da;
	z-index: 500;
	overflow: auto !important;
	top: 52px;
	right: 0;
}
.virtual-header {
	position: absolute;
	background: #f78d34;
	color: #fff;
	width: 100%;
	height: 52px;
    font-family: 'Thasadith', sans-serif;
	font-size: 14px;
	font-weight: bold;
	line-height: 52px;
	text-transform: uppercase;
	box-sizing: border-box;
	top: 0;
	transition: all 0.5s ease;
}
.virtual-header .icon-plus {
	display: none !important;	
}
.close-vPage {
    position: absolute;
	width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    top: calc(50% - 20px);
    left: 5px;
}
.close-vPage .icon-prev {
	font-size: 18px !important;	
}

/* Sub-items */
.sub-items {
	 padding: 20px;
	 overflow: auto;
}
/*.jam {
	 overflow: hidden;
	 -webkit-scrollbar: display: none;
}*/
.dropdown,
.virtual-page ul li a {
	padding:  10px 10px 10px 38px;
	display: block;
	border-bottom: 1px dotted #ccc;
}
.dropdown:hover,
.virtual-page ul li a:hover {
	background: rgba(0, 0, 0, 0.13);
}
.virtual-page a {
	text-decoration: none;
	color: #35200a;
}
.virtual-page a:hover,
.virtual-page a:hover .icon-plus {
	color: #f78d34;
}
.virtual-page .h1 {
	font-family: 'Thasadith', sans-serif;
	font-size: 16px;
	color: #35200a;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 25px;
}
.virtual-page .icon-plus {
	color: #35200a;
	font-size: 14px;
	transition: all 0.5s ease;
}

/* Drop Downs */
.dropdown{
	font-weight: 700;
	cursor: pointer;
}
.dropdown + .dropdown-items{
	height: 0;
	overflow: hidden; 
}
.dropdown:after{
	font-family: FontAwesome;
	content: "\f078";
	float: right;
	font-weight: 400;
	font-size: 14px;
	margin-right: 15px;
	transition: 0.360s;
	-webkit-transition: 0.360s;
	-moz-transition: 0.360s;
}
.dropdown-items{
	font-weight: 400;
}
.dropdown-items li a {
	margin-left: 60px;
	font-size: 14px;
	border: 0 !important;
	padding: 10px;
	text-decoration: none;
	display: block;
}

/* For Pcs */
@media only screen and (min-width: 480px){
/*.am-container {
	width: 260px;
	right: -260px;
}
.am-container.open {
	right: 0;
}
.virtual-page {
	position: fixed;
}
.jam{
   overflow: hidden;
   -webkit-scrollbar: display: none;
}*/
}

/* Hamburger Menu - Teaser*/
#teaser {
	position: relative;
	text-align: left;
}
#teaser li {
	display: block;
    background: rgba(255,246,231,0.9);
    /*height: 60px;*/
    text-align: left;
    white-space: nowrap;
    margin: 0 0 10px;
    padding: 2px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-left-color: rgba(0, 0, 0, 0.1);
    border-left-style: solid;
    border-left-width: 1px;
    border-left: 5px solid #a87b57;
	transition: all 0.5s ease;
}
#teaser li:hover {
    background: #fefefe;
    border-left: 5px solid #f78d34;
}
#teaser li a {
	padding: 0 0 0 12px;
	border: none;
	overflow: hidden;
}
#teaser li a:hover {
	background: none;	
}
#teaser li .teaser-pic {
    float: left;
    width: 50px;
    height: 50px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat; 
    margin: 5px 10px 5px 5px;
}
#teaser li .h3 {
    font-family: 'Thasadith', sans-serif;
	font-size: 14px;
    line-height: 46px;
}
#teaser li .teaser-loc {
	color: #f78d34;
    font-family: 'Thasadith', sans-serif;
    font-size: 9px;
    margin-top: -13px;
    line-height: 20px;
    text-transform: uppercase;
    font-weight: bold;
}
#teaser li .teaser-loc i {
	color: #f78d34;
	font-size: 10px;
}

/*ham-lang*/
.ham-lang {
	background: #fff;
	text-align: center;	
	line-height: 50px;
	margin-top: 20px;
}
.ham-lang li {
	display: inline-block;
	font-size: 13px;
	font-weight: bold;
	margin: 0 10px;
}