@media (max-width: 770px) {
    header {
        width: auto;
    }

        header .toggle {
            position: absolute;
            bottom: 15px;
            left: 15px;
            width: 38px;
            height: 25px;
            background: url(/images/toggle.png) no-repeat;
        }

    nav {
        position: fixed;
        width: 70%;
        top: 0;
        right: 0;
        z-index: 50;
        bottom: 0;
        background: #b6b6b6;
        height: auto;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        -ms-transition: all .3s ease;
        -o-transition: all .3s ease;
        transition: all .3s ease;
        -webkit-transform: translatex(100%);
        -moz-transform: translatex(100%);
        -o-transform: translatex(100%);
        -ms-transform: translatex(100%);
        transform: translatex(100%);
    }

        nav.in {
            -webkit-transform: translatex(0%);
            -moz-transform: translatex(0%);
            -o-transform: translatex(0%);
            -ms-transform: translatex(0%);
            transform: translatex(0%);
            overflow:hidden;
            z-index:9999;
        }

        nav ul#menu {
            width: auto;
        }

            nav ul#menu > li {
                display: block;
                float: none;
                margin-right: 25px;
                font-size: 18px;
                height: auto;
                padding: 0;
            }

                nav ul#menu > li > a {
                    display: block;
                    padding: 20px 0 0 0;
                }

                    nav ul#menu > li > a:hover {
                        color: #fff;
                    }

                nav ul#menu > li.open span:after {
                    -webkit-transform: rotate(180deg);
                    -moz-transform: rotate(180deg);
                    -o-transform: rotate(180deg);
                    -ms-transform: rotate(180deg);
                    transform: rotate(180deg);
                }

                nav ul#menu > li.open span:before {
                    -webkit-transform: rotate(180deg);
                    -o-transform: rotate(180deg);
                    -ms-transform: rotate(180deg);
                    -moz-transform: rotate(180deg);
                    transform: rotate(180deg);
                }

                nav ul#menu > li span {
                    display: block;
                    position: absolute;
                    pointer-events: none;
                    width: 30px;
                    height: 30px;
                    border-radius: 50%;
                    border: 3px solid white;
                    float: right;
                    left: 15px;
                    top: 15px;
                }

                    nav ul#menu > li span:after, nav ul#menu > li span:before {
                        content: "";
                        width: 13px;
                        -webkit-transition: all .3s ease;
                        -moz-transition: all .3s ease;
                        -o-transition: all .3s ease;
                        -ms-transition: all .3s ease;
                        transition: all .3s ease;
                        height: 3px;
                        background: #fff;
                        position: absolute;
                        left: 9px;
                        top: 13px;
                    }

                    nav ul#menu > li span:after {
                        -webkit-transform: rotate(90deg);
                        -moz-transform: rotate(90deg);
                        -o-transform: rotate(90deg);
                        -ms-transform: rotate(90deg);
                        transform: rotate(90deg);
                    }

                nav ul#menu > li ul {
                    display: block;
                    width: auto;
                    position: relative;
                    background: transparent;
                    overflow: hidden;
                    border: 0;
                    left: auto !important;
                    top: auto !important;
                    margin-right: 0 !important;
                    -webkit-transition: all .3s ease;
                    -moz-transition: all .3s ease;
                    -o-transition: all .3s ease;
                    -ms-transition: all .3s ease;
                    transition: all .3s ease;
                }

                    nav ul#menu > li ul > li > a {
                        color: #6e6a6a;
                        text-transform: uppercase;
                        margin-right: 20px;
                        border-bottom-color: #6e6a6a;
                        padding-right: 0 !important;
                    }

    #slider .gallerycontainer div {
        width: auto;
        left: 10%;
        margin-left: 0;
    }

    .slider-wrap {
        height: auto;
        width: 100%;
    }

        .slider-wrap div.pager {
            bottom: auto;
            top: 215px;
            position:absolute;
        }

        .slider-wrap .gallery, .slider-wrap .gallerycontainer {
            height: 256px !important;
        }

    .form_booking_wrap {
        position: relative;
        margin: 0;
        left: auto;
        width: auto;
    }

        .form_booking_wrap .form_booking {
            position: relative;
            background-color: #004d71;
        }

            .form_booking_wrap .form_booking .form_part1, .form_booking_wrap .form_booking .form_part2 {
                width: 100%;
                float: none;
                overflow: hidden;
            }

                .form_booking_wrap .form_booking .form_part1 .col2_l, .form_booking_wrap .form_booking .form_part2 .col2_l, .form_booking_wrap .form_booking .form_part1 .col2_r, .form_booking_wrap .form_booking .form_part2 .col2_r {
                    width: 49%;
                }

                .form_booking_wrap .form_booking .form_part1 .ctrl_select, .form_booking_wrap .form_booking .form_part2 .ctrl_select {
                    width: 32%;
                }

                .form_booking_wrap .form_booking .form_part1 .form_details, .form_booking_wrap .form_booking .form_part2 .form_details {
                    float: none;
                }

                    .form_booking_wrap .form_booking .form_part1 .form_details .input.select, .form_booking_wrap .form_booking .form_part2 .form_details .input.select {
                        width: 100%;
                    }

                .form_booking_wrap .form_booking .form_part1:not(.open) .title, .form_booking_wrap .form_booking .form_part2:not(.open) .title {
                    position: relative;
                }

                .form_booking_wrap .form_booking .form_part1:not(.open) .bottomborder, .form_booking_wrap .form_booking .form_part2:not(.open) .bottomborder {
                    opacity: 1;
                }

                .form_booking_wrap .form_booking .form_part1:not(.open) .title:after, .form_booking_wrap .form_booking .form_part2:not(.open) .title:after {
                    content: "";
                    position: absolute;
                    left: 5px;
                    width: 23px;
                    height: 19px;
                    top: 0;
                    background: url("/images/go-arrow.png") no-repeat transparent;
                }

                .form_booking_wrap .form_booking .form_part1 .form_left {
                    float: left;
                    width: 68%;
                }

                    .form_booking_wrap .form_booking .form_part1 .form_left .input.select {
                        width: 47%;
                        margin-right: 3%;
                        float: right;
                    }

    .innnerpage.overlaybg {
        margin-left: 0 !important;
        padding-left: 0 !important;
        left: auto !important;
        width: 100% !important;
        padding-top: 265px;
    }

        .innnerpage.overlaybg h2 {
            padding-left: 0px !important;
            padding-right: 60px !important;
            width: 98% !important;
        }

    .room-details #insideslider {
        width: 95%;
        margin: 0 auto;
    }

        .room-details #insideslider .insidegallery {
            width: 100% !important;
            height: 214px !important;
        }

            .room-details #insideslider .insidegallery .gallerycontainer {
                height: 214px !important;
            }

                .room-details #insideslider .insidegallery .gallerycontainer div {
                    width: 100% !important;
                    padding: 0 !important;
                    margin-top: 160px !important;
                }

                    .room-details #insideslider .insidegallery .gallerycontainer div h2 {
                        padding-right: 10px;
                    }

    #bodycontainer {
        width: auto;
        top: 0;
        clear: both;
    }

        #bodycontainer .hotspots {
            padding: 0 20px;
        }

            #bodycontainer .hotspots li {
                width: 49%;
                margin-left: 1% !important;
                margin-bottom: 2%;
            }

                #bodycontainer .hotspots li:nth-child(2n) {
                    margin-right: 1%;
                    margin-left: 0 !important;
                }

                #bodycontainer .hotspots li img {
                    width: 100%;
                    height: auto;
                }

                #bodycontainer .hotspots li div {
                    width: 100%;
                    background-size: 20px 70px;
                    background-repeat: repeat-x;
                }

                    #bodycontainer .hotspots li div h2 {
                        float: right;
                        padding-right:0px;
                    }

    .aboutus .right-container, .rooms .right-container, .room-details .right-container, .mice .right-container, .hotel-facilities .right-container, .contact .right-container, .special-offer .right-container {
        width: 100%;
        margin-top: 50px;
        float: none;
        margin-top: 5px;
    }

        .aboutus .right-container > p, .rooms .right-container > p, .room-details .right-container > p, .mice .right-container > p, .hotel-facilities .right-container > p, .contact .right-container > p, .special-offer .right-container > p {
            padding: 0 10px;
        }

        .room-details .right-container div > img {
            width: 100%;
            height: auto;
        }

    .room-details .col1 {
        width: 100%;
        float: none;
    }

    .room-details .col2 {
        width: 100%;
        float: none;
        margin-bottom:20px;
    }

    .book, .call {
        width: 90% !important;
        margin: 5px auto 10px !important;
    }

        .book a, .call a {
            background-position: right !important;
        }

    .aboutus tr {
        display: block;
    }

        .aboutus tr td {
            display: block;
            width: 99%;
        }

            .aboutus tr td p {
                padding: 5px;
            }

                .aboutus tr td p:first-child {
                    width: 50%;
                }

                .aboutus tr td p img {
                    position: absolute;
                    top: 0;
                    left: 0;
                }

    .rooms .right-container ul.rum-box {
        padding: 10px !important;
    }

        .rooms .right-container ul.rum-box li, .special .right-container ul.rum-box li {
            width: 49%;
            margin-left: 1%;
            /*min-height: 313px;*/
        }

            .rooms .right-container ul.rum-box li h2, .special .right-container ul.rum-box li h2 {
                font-size: 16px;
            }

            .rooms .right-container ul.rum-box li img, .special .right-container ul.rum-box li img {
                width: 100%;
                height: auto;
            }

            .rooms .right-container ul.rum-box li:nth-child(2n), .special .right-container ul.rum-box li:nth-child(2n) {
                margin-left: 0;
                margin-right: 1%;
            }

    #map_canvas {
        width: 95% !important;
        height: 280px !important;
        margin: 0 auto !important;
        margin-bottom: 20px;
    }

    .left-container {
        display: none;
    }

    footer .sitemap {
        width: auto;
        padding: 20px;
        padding-bottom: 0;
    }
    footer .copyrights {
        width: auto;
        padding-right: 20px;
        padding-bottom: 0;
        padding-top:0px;
    }

        footer .sitemap .col1, footer .copyrights .col1, footer .sitemap .col2, footer .copyrights .col2, footer .sitemap .col3, footer .copyrights .col3, footer .sitemap .col4, footer .copyrights .col4 {
            float: none;
        }

        footer .copyrights li {
            padding-top: 3px;
            font-size: 11px;
        }
        footer .sitemap{
        padding-top:0px;
    }
}

@media (max-width: 480px) {
    #fancybox-wrap {
        width: 100% !important;
        left: 0 !important;
        padding: 0;
    }

    #fancybox-content {
        width: 100% !important;
        border: 0 !important;
        /*height: 430px !important;*/
    }

    nav ul#menu > li {
        font-size: 16px;
    }

        nav ul#menu > li > a {
            padding: 15px 0 10px 0;
        }

        nav ul#menu > li span {
            top: 8px;
        }
        nav.indexpage.in ul#menu > li {
        padding: 6px 0px 0px 12px !important;
    }
    nav.in ul#menu > li {
        padding: 6px 0px 0px 12px !important;
    }

    .innnerpage.overlaybg{
        padding-top:110px;
    }
    .aboutus .right-container .direction-rtl{
        margin-right:10px;
        margin-left:5px;
    }
}
/* This beautiful CSS-File has been crafted with LESS (lesscss.org) and compiled by simpLESS (wearekiss.com/simpless) */
@media (max-width: 770px) {
    .slider-wrap .gallery div h2, .slider-wrap .gallerycontainer div h2, .slider-wrap .gallery div p, .slider-wrap .gallerycontainer div p {
        width: 100% !important;
    }

    .slider-wrap .gallery div h2, .slider-wrap .gallerycontainer div h2 {
        font-size: 26px !important;
    }

    #slider .gallerycontainer div h2, .bannerimg .gallerycontainer div h2, .insidebanner .gallerycontainer div h2, #slider .gallerycontainer div p {
        padding-left: 0;
        width:auto;
        padding-top: 20px;
    }

    #slider .gallerycontainer div {
        left: auto;
        right: 10%;
        bottom: 20px;
    }

        #slider .gallerycontainer div.shadow {
            height: 145px;
            bottom:-14px;
        }

    .insidebanner {
        height: auto;
    }

    header .social-icons li:last-child {
        padding-right: 11px;
    }
    
    header .social-icons img {
    margin-top: 12px;
}

    header h1 a img {
        width: 152px;
        height: auto;
        /*margin-left: 20px;*/
        margin-top: 10px;
        margin-bottom: 10px;
    }

    header .social-icons {
        padding-left: 0;
        margin-top: 0px;
    }

    .gallery img {
        width: 280%;
        margin-left: -30%;
    }

    .bannerimg, .insidebanner {
        margin-top: 0;
        top: 0;
    }

    #fancybox-close {
        background: url('/images/close.png') no-repeat;
        width: 27px;
        height: 27px;
        background-size: contain;
        top: 21px;
        left: 21px;
    }

    #lang {
        margin-top: 5px !important;
        font-size:13px;
    }

    .roomspecifications {
        padding: 0px 10px 30px;
    }

    .room-details .right-container > div > img {
        margin: 9px 5%;
        width: 90%;
    }

    footer {
        padding-bottom: 30px;
    }

        footer .sitemap .col1 ul li a, footer .sitemap .col2 ul li a, footer .sitemap .col3 ul li a {
            font-size: 13px;
        }

        footer .sitemap .col1 h2, footer .sitemap .col2 h2, footer .sitemap .col3 h2, footer .sitemap .col4 h2 {
            font-size: 14px;
        }

    .book a, .call a {
        background-position: left !important;
    }

    .call {
        text-align: right;
    }

    header .social-icons li {
        height:35px;
    }
}

@media (max-width:770px) {
    .hiden-mob {
        display: none !important;
    }
}

@media (min-width:771px) {
    .visible-not-mob {
        display: none;
    }
}

@media (max-width: 319px) {
    header h1 a img {
        width: 130px;
        margin-left: -1px;
    }

    #lang {
        margin-top: -10px;
    }
}


@media only screen and (max-width: 320px) {
    header h1 a img {
        width: 118px;
    }
    #lang {
        margin-top: 0px !important;
    }
    nav {
   
        width: 78%;
    }

    header .social-icons
    {
        margin-top:10px;
    }
    header .social-icons img
    {
        margin-top:0px;
    }
    
}

@media (max-width:360px) {
    .innnerpage.overlaybg{
        padding-top:70px;
    }
}	

/*@media only screen and (max-width: 568px){
    header .social-icons li.align-ar-txt {
        padding: 25px 16px 0 16px;
    }
    header .social-icons li:nth-child(2), header .social-icons li:nth-child(3), header .social-icons li:nth-child(4), header .social-icons li:nth-child(5){
        padding: 10px 23px 0 19px;
    }   
}

@media only screen and (max-width: 768px) {
    header .social-icons li.align-ar-txt {
        padding: 25px 16px 0 16px;
    }

    header .social-icons li:nth-child(2), .social-icons li:nth-child(3) {
        padding: 10px 23px 0 19px;
    }
}*/

@media (min-width: 320px) and (max-width: 400px) {
    .room-details #insideslider .insidegallery .gallerycontainer div {
        margin-top:134px !important;
        height:80px;
        background: url(/images/overlay-transparent.png) repeat 0 0;
    }
}
@media (max-width: 320px) {
    .room-details #insideslider .insidegallery .gallerycontainer div {
        margin-top:110px !important;
        height:80px;
        background: url(/images/overlay-transparent.png) repeat 0 0;
    }
}
@media (max-width: 480px) {
    #fancybox-close {
        background: url('/images/close.png') no-repeat;
        width: 27px;
        height: 27px;
        background-size: contain;
        top: 12px;
        left: 12px;
    }
}