/* CSS Document */

/* Table of Contents
-----------------------------
1. Mobile
2. iPad
3. large desktop
4. Other
*/

/* 1. Mobile responsive css 767px
-----------------------------------*/
#mobile-menu{display: none;}

@media (max-width:991px) {

    body{min-width: inherit;}
    .container{width: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;}

    /*----   header   ----*/
    /* mobile menu */
    #mobile-menu, #mobile-menu .menu-trigger{display: block;}
    #mobile-menu .menu-trigger{display: block;width: 40px;height: 40px;position: absolute;-ms-touch-action: manipulation;touch-action: manipulation;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-image: none;white-space: nowrap;z-index: 999999;right: 50px;top: 65px;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu .menu-trigger.open{left: calc(100% - 40px);background:#000;}
    #mobile-menu .menu-trigger span, #mobile-menu .menu-trigger span:after, #mobile-menu .menu-trigger span:before{background: #fff;height: 2px;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;} 
    #mobile-menu .menu-trigger span{position: absolute;display: block;width: 20px;left: 50%;top: 50%;transform: translate(-50% , -50%);-webkit-transform: translate(-50% , -50%);-moz-transform: translate(-50% , -50%)}
    #mobile-menu .menu-trigger span:after, #mobile-menu .menu-trigger span:before{content: '';position: absolute;left: 0;width: 100%;}
    #mobile-menu .menu-trigger span:before{top: -6px;}
    #mobile-menu .menu-trigger span:after{bottom: -6px;}
    #mobile-menu .menu-trigger.open span{background-color: rgba(0,0,0,.0)}
    #mobile-menu .menu-trigger.open span:before{top: 0;transform: rotate(45deg);-webkit-transform: rotate(45deg);background: #fff;}
    #mobile-menu .menu-trigger.open span:after{top: 0;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);background: #fff;}
    #mobile-menu .mob-navbar{background:rgba(0, 0, 0, 0.85);position: fixed;top: 0;width: calc(100% - 40px);height: 100%;left: -100%;-webkit-box-sizing: border-box;box-sizing: border-box;z-index: 99999;overflow-y: auto;-webkit-overflow-scrolling: touch;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;margin-right: 40px;}
    #mobile-menu .mob-navbar.open{left: 0;}
    #mobile-menu  ul ul{display: none;background:#000;}
    #mobile-menu  ul ul ul{background:rgb(71, 71, 68)}
    #mobile-menu  ul ul ul ul{background:rgb(60, 60, 56)}
    #mobile-menu  li{border-bottom:1px solid rgba(255, 255, 255, 0.10);list-style: none;position: relative;display: block;margin: 0;}
    #mobile-menu  li:last-child{border-bottom-width: 0;padding-bottom: 0;}
    #mobile-menu  em{display: block;position: absolute;top: 0;right: 0;width: 30px;height: 39px;-webkit-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu  em:before, #mobile-menu  em:after{content: '';position: absolute;top:50%;margin-top: -1px;left: calc(50% - 8px);width: 16px;height: 2px;background: #fff;}
    #mobile-menu  em:after{transform: rotate(-90deg);-moz-transform: rotate(-90deg);-webkit-transform: rotate(-90deg);-webkit-transition: all 0.5s ease;transition: all 0.5s ease;}
    #mobile-menu  em.toggled:after{transform: rotate(0);-moz-transform: rotate(0);-webkit-transform: rotate(0);}
    #mobile-menu  em.level-two:before{content: '';position: absolute;width: 0;height: 0;border-style: solid;border-width: 6px 6px 0 6px;border-color: #fff transparent transparent transparent;background-color: transparent;left: 50%;top: 50%;transform: translate(-50% , -50%);-webkit-transform: translate(-50% , -50%);-moz-transform: translate(-50% , -50%);margin: 0;}
    #mobile-menu  em.level-two:after{display: none;}
    #mobile-menu  em.level-two.toggled{transform: rotate(-180deg);-moz-transform: rotate(-180deg);-webkit-transform: rotate(-180deg)}
    #mobile-menu  li a{color: #fff;padding: 9px 0px 9px 15px;display: block;margin-right: 30px;text-transform: uppercase;line-height: 20px;font-size: 15px;font-weight: 400;letter-spacing: 0.06em;font-family: 'Titillium Web', sans-serif;}    
    #mobile-menu  li li a{text-transform: none;padding-left: 20px;}
    #mobile-menu  li li li a{padding-left: 25px;margin-right: 0;}
    #mobile-menu  li li li li a{padding-left: 30px;margin-right: 0;}
    #mobile-menu  li a.active{background:#7cb511c9;margin: 0px;}
    .scroll-hidden{overflow: hidden;height: 100%;}    
    
    /*--------- home page ------------*/
    #navigation ul{ display: none;}
    #navigation {padding: 30px 0;}
    #mobile-menu li.book-btn a{background: #ffd21eb3;margin: 0;color: #000;font-weight: 600;}
    .home-banner .container{ top: 50%;padding: 0px 30px;}
    .home-banner .slick-dots{ bottom: 60px;}
    .home-banner .banner-img{ min-height: 420px;}
    #header .logo{ max-width: 100px; left: 25px;}
    .home-banner .banner-title{ font-size: 30px; margin-bottom: 10px;}
    .home-banner p{ font-size: 16px;}
    .content-sec .wel-sec h1{ font-size: 30px;}
    .enquiry_sec h2{font-size: 28px;line-height: 38px;}
    .enquiry_sec .enquiry-links a{font-size: 17px;}
    .enquiry_sec .btn {font-size: 20px;padding: 10px 35px;}
    
     /*--------- accommodation page ------------*/
    .acco_banner figure{height: 250px;}
    .acco_banner h1>span{font-size: 28px;padding: 0px 85px;}
    .acco_content{padding: 30px 0px 0px;}
    .acco_detail a{font-size: 28px;padding: 8px 18px;}
    .acco_gallery{padding: 30px 0px;}
    .acco_gallery h2>span{font-size: 28px;}
    .acco_gallery h2{margin-bottom: 30px;}
    .view-btn-main{font-size: 17px;padding: 8px 12px;margin-top: 25px;}
    .img_list a,.gallery-image a{margin-bottom: 0px;padding:10px;width: 49%;margin: 0.5%;}
    .acco_gallery{padding: 40px 15px;}
    .img_list{max-width: 600px;margin: 0px auto;}
    .acco_gallery .gallery-image{max-width: 600px;margin: 0px auto;clear: both;font-size: 0;}
    
    /*--------- rate special page ------------*/
    .acco_banner.rate_banner h1 {width: 490px;}
    .special_content{padding: 30px 0px;}
    .special_content a{padding: 8px 18px;font-size: 28px;}
    .special_table table{margin-bottom: 20px;}
    .special_table table tr td{padding: 15px 10px;}
    .special_content h4>span{font-size: 20px;}
    .activities{padding: 0px 0px 30px;}
    .activities h2{margin-bottom: 30px;}
    .activities h2>span{font-size: 28px;}
    .activities h4{font-size: 20px;}
    .activities ul{margin: 20px 0px;}
    .special_content .prices_cont span{line-height: 24px;padding: 10px 20px;}
    
    /*--------- bay page ------------*/
    .bay_content{padding: 30px 0px;}
    .bay_bottom{padding: 20px 0px;}
    .bay_bottom .btn{padding: 8px 18px;font-size: 28px;margin-bottom: 0px;}
    .bay_imgwrap{padding: 30px 0 0;}
    .bay_imgwrap span{padding: 0px 10px;}
    .bay_things a{font-size: 20px;}
    
     /*--------- location page ------------*/
    .location_content{padding: 30px 0px;}
    .location_gallery{margin: 0 auto 50px;}
    
    /*--------- contact page ------------*/
    .contact_content{padding: 50px 0px 30px;}
    .contact_content form{padding-bottom: 50px;}
    .contact_content form div{padding: 0px 15px;}
    .contact_content form .btn{margin-left: 15px;}

}

@media (max-width:767px) {
    .content-sec{padding: 50px 15px;}
    .content-sec .wel-sec h1{font-size: 28px;}
    .enquiry_sec{padding: 30px 15px;}
    .enquiry_sec h2 {font-size: 24px;line-height: 34px;}
    .enquiry-links a:first-child{margin-bottom: 10px;}
    .enquiry_sec .enquiry-links a img{margin-right: 10px;}
    .home-banner .banner-title{font-size: 26px;}
    
    /*--------- rate special page ------------*/
    .special_content h2{font-size: 20px;margin-bottom: 15px;}
    .special_table{overflow-x: scroll;}
    .special_content h4>span {font-size: 18px;margin: 25px 0px;}
    
    /*--------- location page ------------*/
    .location_gallery{max-width: 480px;margin: 0 auto 50px;}
    .location_gallery_b2 a>img{max-height: 96px;}
    
    /*--------- contact page ------------*/
    .contact_content form{padding-bottom: 50px;text-align: center;display: block;}
    .contact_content form div{padding: 0px;width: 100%;}
    .contact_content form .btn{margin:25px 0px 0px;}
    .map_wrapper .map_content{width: 100%;padding: 20px;position: relative;box-shadow: none;top: 0;border-bottom: 5px solid #7cb511;}
    .map_wrapper .map_content p{font-size: 15px;margin-bottom: 15px;}
    .map_wrapper .map_content a{font-size: 15px;margin-bottom: 15px;}
    .map_wrapper .map_content a:last-child{margin-bottom: 0;}
    #map.map{border-bottom: none;}
}
@media (max-width:640px) {
    #mobile-menu .menu-trigger{right: 10px;top: 40px;}
    #content{width: 100%;margin: 0px auto;}
    .home-banner .banner-title {font-size: 22px;}
    .content-sec .wel-sec h1 {font-size: 24px;}
    .content-sec .wel-sec p{margin: 0 0 20px;line-height: 26px;}
    .enquiry_sec h2 {font-size: 20px;line-height: 26px;}
    .enquiry_sec .btn {font-size: 17px;padding: 10px 30px;margin: 30px 0px;}
    .enquiry_sec .enquiry-links a{font-size: 17px;padding: 0px;line-height: 15px;word-break: break-all;display: block;}
    .enquiry_sec .enquiry-links a img {margin-right: 10px;}
    #footer{padding: 30px 0px;}
    .home-banner .slick-arrow{width: 85px;height: 85px;}
    .home-banner .slick-next{background-position: 15px center;background-size: 12px;}
    .home-banner .slick-prev{background-position: 55px center;background-size: 12px; }
    .enquiry-links a:first-child {margin-bottom: 5px;}
    #header{padding: 30px 0 0;}
    #header .logo {max-width: 80px;left: 25px;top: 15px;}
   
    
    /*--------- accommodation page ------------*/
    .acco_content{background: rgba(255,255,255,1);}
    .acco_content .container{padding: 0px 20px;}
    .acco_gallery{background: rgba(255,255,255,1);}
    .acco_banner h1{width: 100%;padding: 15px 10px;margin: 0px;text-align: center;}
    .acco_banner h1>span{padding: 0px 60px;font-size: 20px;}
    .acco_banner h1>span:before,.acco_banner h1>span:after{width: 52px;height: 21px;background-size: cover;background-repeat: no-repeat;margin-top: -10px;}
    .acco_detail a{font-size: 20px;}
    .acco_gallery h2>span{font-size: 24px;padding: 0px 70px;}
    .acco_gallery h2>span:before,.acco_gallery h2>span:after{height: 21px;width: 52px;background-size: cover;background-repeat: no-repeat;}
    .img_list a,.gallery-image a{margin-bottom: 0px;padding:10px;width: 100%;margin: 0 0 25px;}
    .view-btn-main {font-size: 15px;padding: 8px 14px;margin-top: 20px;}
    .img_list{max-width: 300px;margin: 0px auto;}
    .acco_gallery .gallery-image{max-width: 300px;margin: 0px auto;clear: both;}
    
    /*--------- rate special page ------------*/
    .special_content {background: rgba(255,255,255,1);}
    .acco_banner.rate_banner h1{width: 100%;}
    .special_content h2{font-size: 18px;}
    .special_table table tr td{font-size: 14px;line-height: 20px;}
    .special_table table tr th{font-size: 14px;line-height: 20px;}
    .special_content h4>span{margin: 0px 0px 20px;}
    .special_content a{font-size: 20px;}
    .activities{padding: 0px 0px 10px;background: rgba(255,255,255,1);}
    .activities h2>span {font-size: 24px;padding: 0px 70px;}
    .activities h2>span:before, .activities h2>span:after {height: 21px;width: 52px;background-size: cover;background-repeat: no-repeat;}
    .activities h4{font-size: 18px;}
    .activities ul{margin: 10px 0px 20px;}
    .special_content .prices_cont span{font-size: 18px;}
    
    /*--------- bay page ------------*/
    .bay_top{text-align: center;}
    .bay_content{padding: 30px 0px;background: rgba(255,255,255,1);}
    .bay_top img{float: none;width: 75%;margin: 0px auto 20px;padding: 0px;}
    .bay_bottom .btn{font-size: 20px;margin: 0 auto 0px;}
    .bay_bottom{padding: 0;}
    .bay_imgwrap{padding: 30px 0px 0px;}
    .bay_imgwrap span{padding: 0;width: 75%;margin: 0 auto 20px;}
    .bay_things{padding: 0 0 0px;margin-bottom: 30px;}
    .bay_things a{width: 100%;border:none;padding: 20px 0px;border-right: none;font-size: 18px;position: relative;}
    .bay_things a:after{content: "";position: absolute;bottom: 0;height: 2px;width: 40px;background:#4c7a6a;left: 50%;transform: translateX(-50%);transition: 0.5s all;}
    .bay_things a:last-child{border-bottom: none;}
    .bay_things a:hover:after{background:#7cb511;width: 60px;}
    .bay_things a:last-child:after{display: none;}
    
    /*--------- location page ------------*/
    .location_content{background: rgba(255,255,255,1);padding: 30px 0px 10px;}
    .location_gallery{margin: 0 auto 30px;display: block;max-width: 250px;}
    .location_blog{width: 100%;}
    .location_blog a{padding: 0px;margin-bottom: 20px;}
    .location_blog .text{font-size: 15px;line-height: 20px;}
    .location_gallery_b2 a>img{max-height: 100%;height:auto;}
    .location_blog .text {color: #fff;font-size: 14px;font-family: 'Titillium Web', sans-serif;padding: 0px 15px;font-weight: 300;line-height: 20px; position: absolute;top: 50%;left: 50%;-webkit-transform: translate(-50%, -50%) scaleY(0);-ms-transform: translate(-50%, -50%) scaleY(0);transform: translate(-50%, -50%) scaleY(0);text-align: center;opacity: 0;transition: 0.35s all;}
    .location_blog a:hover .text{-webkit-transform: translate(-50%, -50%) scaleY(1);-ms-transform: translate(-50%, -50%) scaleY(1);transform: translate(-50%, -50%) scaleY(1);opacity: 1;}
    #map{height: 300px;width: 100%;border-top: 3px solid #7cb511;border-bottom: 3px solid #7cb511;}
    #map .info-content{width: 72%;}
    #map .info-window img{height: 80px;}
    #map .info-content h3{font-size: 16px;line-height: 18px;margin-bottom: 2px;}
    #map .info-content p{font-size: 15px;line-height: 16px;}
    
    /*--------- contact page ------------*/
    .contact_content{background: rgba(255,255,255,1);padding: 30px 0px;}
    .map_wrapper .map_content{border-bottom: 3px solid #7cb511;}
    .contact_content form{padding:0 0 0px;}
    .contact_content form .btn{font-size: 16px;padding: 10px 35px;margin: 0;}
    .contact_content form input[type="text"], .contact_content form input[type="email"], .contact_content form textarea{margin-bottom: 20px;padding: 14px 15px;font-size: 14px;}
    .contact_content form input[type="text"]::placeholder,.contact_content form input[type="email"]::placeholder,.contact_content form textarea::placeholder{color:#191919;font-size: 14px;}
    .contact_content form textarea{height: 120px;}
}
@media (max-width:480px) {
    .enquiry_sec .enquiry-links a{font-size: 15px;}
    .home-banner .container{padding: 0px 30px;}
    .home-banner .banner-title{font-size: 20px;margin-bottom: 5px;}
    .home-banner p{font-size: 15px;line-height: 20px;}
    
    /*--------- bay page ------------*/
    .bay_top img,.bay_imgwrap span{width: 95%;}
}



/* 2. iPad responsive css 768px to 1024px
-----------------------------------------*/
@media (min-width:768px) and (max-width:991px) {

    /* default  */
    body{min-width: inherit;}
    
    /* accomodation */
    .acco_banner h1>span{font-size: 30px;padding: 0px 90px;}
    .acco_content{padding: 40px 0px 0px;}
    .acco_detail a{font-size: 32px;}
    .acco_gallery{padding: 40px 15px;}
    .acco_gallery h2{margin-bottom: 40px;}
    .view-btn-main{font-size: 18px;padding: 12px 20px;}
    
    /*--------- rate special page ------------*/
    .special_content h2{font-size: 24px;}
    .special_content a{font-size: 32px;}
    
    /*--------- bay page ------------*/
    .bay_bottom .btn{font-size: 32px;}
    
        
}

@media (min-width:992px) and (max-width:1199px) {	
    #navigation ul li a{ padding: 10px 7px; font-size: 14px;word-spacing: 0px;}
    #header .logo{ left: 25px;}
    #navigation{ padding: 0 25px 0 170px;}
    #navigation ul li.book-btn a{ padding: 10px 10px;margin-left: 0px;font-size: 14px;}
    .home-banner .slick-dots{ bottom: 60px;}
    .home-banner .container{ top: 55%;}
    .enquiry_sec h2{font-size: 32px;}
   
    /* rate special page */
    .special_table table tr td{padding: 15px 10px;}
}

@media (min-width:1200px) and (max-width:1300px) {
     #navigation ul li a{ padding: 10px 10px; font-size: 14px;word-spacing: 0px;}
}

/* 4. Other media-query
------------------------------------------------*/
@media (max-width:480px){

}