/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Aug 30, 2016, 10:16:59 AM
    Author     : MacBook
*/

ul.topnav li.icon {display: none;}




h1,h2,h3,h4,h5,h6{
    margin: 0px;
}

p,div,address{
    font-family: 'Lato', sans-serif;
    font-size: 14px;
}

#sidebar{
    width: 200px; float: right; position: absolute; bottom: 10px; height: 50px; right: 20px; z-index: 4000; 
    background: white;
    border: 2px solid #f1f1f1;
    background: #b51900;
}
#sidebar #booknow{
    display: block;
    padding: 8px 10px;
    background: #b51900;
    color: white;
    font-size: 18px;
    width: 100%;
    text-align: center;
}

.upper{
    text-transform: uppercase;
    font-size: 12px;
}

.lato{
    font-family: 'Lato', sans-serif;

}

.Playfair{
    font-family: 'Playfair Display', serif;
}

a{
    color: #232323;
}
a:hover{
    color: #f5b45c;
    text-decoration: none;
}


/* Defualt Settings */
#copywrite{
    background: #151515;
    padding: 12px 0;
    color: white;
    font-size: 10px;
}

#icon-holder{
    min-height: 600px;
    padding: 15px 0;
    padding-top: 45px;
    background: url('../images/footer-bg.jpg') no-repeat bottom center;
    background-size: cover;
}

#footer-nav{
    padding: 20px 0;
    background: #f2f2f2;
}

.nav-list{
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 0px;
    z-index: 1000;
}

#footer-nav-list{
    font-weight: normal;
    font-size: 10px;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin-bottom: 0px;
}

#footer-nav-list #booking_link{
    display: none;
}


#header-nav{
    background: rgba(0,0,0,0.4);
    padding: 15px 0;
    padding-bottom: 0px;
}




.header-nav-list  a{
    color: white;
    display: block;
    padding: 4px;
}


/*** Navigation *****/
.header-nav-list .fallback{
    position: absolute;
    background: rgba(0,0,0,0.7);
    width: 220px;
    text-align: left;
    margin: 0px;
    padding: 0px;
    margin-top: 20px;
    list-style: none;
    display: none;
    z-index: 5002;
}
.header-nav-list .fallback li a{
    display: block;
    padding: 7px 8px !important;
}
.header-nav-list .fallback li a:hover{
    background: rgba(255,255,255,0.6)
}
.header-nav-list .fallback li a:hover{   
    color: black !important;
}

#footer-nav-list .fallback{
    position: absolute;
    background: rgba(242,242,242,0.9);
    width: 220px;
    text-align: left;
    margin: 0px;
    padding: 0px;
    margin-top: 20px;
    list-style: none;
    display: none;
    z-index: 1502;
}
#footer-nav-list .fallback li a{
    display: block;
    padding: 7px 8px !important;
}
#footer-nav-list .fallback li a:hover{
    background: rgba(255,255,255,0.6)
}
#footer-nav-list .fallback li a:hover{   
    color: black !important;
}

.row.no-gutter {
    margin-left: 0;
    margin-right: 0;
}

.row.no-gutter [class*='col-']:not(:first-child),
.row.no-gutter [class*='col-']:not(:last-child) {
    padding-right: 0;
    padding-left: 0;
}

.form-control{
    border-radius: 0px;
}

#intro{
    padding: 30px 0;
}

#intro h1{
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    font-weight: normal;
    padding: 20px;
}

#intro p{
    font-family: 'Lato', sans-serif;
    font-weight: lighter;
    font-size: 16px;
    padding: 10px 120px;
    color: #484848;
}

.qh{
    font-weight: lighter;
    font-size: 16px;
    font-family: 'Lato', sans-serif; 
    margin-bottom: 2px;
    text-transform: uppercase;
    font-weight: bold;
}

.large{
    font-size: 18px;
    text-transform: uppercase;
}

#offers{
    padding-bottom: 10px;
}
#offers h1{
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    font-weight: normal;
    padding: 20px;
}

#offers p{
    font-family: 'Lato', sans-serif;
    font-weight: lighter;
    font-size: 16px;
    padding: 10px 120px;
    color: #484848;
}

figcaption p{
    margin-top: 20px  !important;
    padding: 0px !important;
    margin: 0px !important;
    color: white !important;
    font-size: 12px !important;
}


#dining{
    background: url('../images/dining_table.jpg') no-repeat top center;
    background-size: cover;
    height: 450px;
    overflow: hidden;
    position: relative;
}

#dining h2{
    font-family: 'Playfair Display', serif;
    font-size: 54px;
    margin-top: 40px;
    color: white;
}
#dining h3{
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    color: white;
    margin-bottom: 10px;
}

#dining button{
    border: none;
    display: inline-block;
    background: white;
    padding: 12px 40px;
    color: #292929;
}

.introtxt{
    padding: 30px 0;
}

.introtxt h1{
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    font-weight: normal;
    padding: 20px;
}

.introtxt p{
    font-family: 'Lato', sans-serif;
    font-weight: lighter;
    font-size: 16px;
    padding: 10px 120px;
    color: #484848;
}


#gallery{
    background: url('../images/gallery_bg.jpg') no-repeat top center;
    background-size: cover;
    background-attachment: fixed;
    height: 450px;
    overflow: hidden;
    position: relative;
    min-width: 100%;
}


#gallery h2{
    font-family: 'Playfair Display', serif;
    font-size: 54px;
    margin-top: 40px;
    color: white;
}
#gallery h3{
    font-family: 'Playfair Display', serif;
    font-size: 44px;
    color: white;
    margin-bottom: 10px;
}

#gallery button{
    border: none;
    display: inline-block;
    background: white;
    padding: 12px 40px;
    color: #292929;
}

.header-nav-white{
    background: rgb(255,255,255) !important;
    padding: 15px 0;
    padding-bottom: 0px;
}
.header-nav-white .header-nav-list  a{
    color: black;
    display: block;
    padding: 4px;
}

.header-nav-white .fallback a{
    color: white;
}

.overlay {
    background:transparent; 
    position:relative; 
    width:100%;
    height:400px; /* your iframe height */
    top:400px;  /* your iframe height */
    margin-top:-400px;  /* your iframe height */
}

.comments{
    margin-bottom: 35px;
}
.comments h3{
    text-transform: uppercase;
    font-size:18px;
    margin-bottom: 10px;
}

.comments p{
    font-family: 'Lato', sans-serif;
    font-weight: lighter;
    font-size: 16px;
    color: #484848;
}

.grey-box{
    background: #f1f1f1;
    min-height: 200px;
    padding: 30px;
    overflow: hidden;
}

.main-grey{
    background: #f1f1f1;
}

.clearl{
    padding-left: 0px; padding-right: 0px;
}

.introp{
    font-family: 'Lato', sans-serif;
    font-weight: lighter;
    font-size: 16px;
    color: #484848;
}
.icons > img{
    width: 84px;
    height: 84px;
    cursor: pointer;
}


.icons h4{
    text-align: center;
    font-size: 14px;
}




.sub_header{
    padding: 8px 22px;
}

#popupbg{
    background: rgba(0,0,0,0.3);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 3000;
}
#popup{
    background: white;
    position: fixed;
    width: 800px;
    min-height: 400px;
    top: 50%;
    left: 50%;
    margin-left: -400px;
    margin-top: -200px;
    z-index: 3200;
}

.modal-header{
    border-bottom: none;
    font-family: 'Playfair Display', serif;
    font-size: 38px;

}

.modal-title{
    text-align: center;
}

.ranks{
    margin-top: 35px;
    margin-bottom: 20px;
}
.ranks p{
    margin: 2px 0;
    padding: 3px 0;
}

.ranks h5{
    font-size: 22px;
}

#news li{
    margin-bottom: 25px;
}

#news li h2{
    margin: 15px 0;
    font-size: 22px;
}
#news li p{
    font-size: 14px;
    font-weight: lighter;
}

#news li a{
    display: inline-block;
    padding: 8px 10px;
    border: 2px solid #484848;
    margin: 10px 0;
    text-transform: uppercase;
}

.room{
    margin-bottom: 20px;
}
.room_items{
    color: white; background: rgba(0,0,0,0.5); position: absolute; text-align: center; border: 2px solid white;  left: 25px; top: 50%; margin-top: -40px; height: 80px; font-size: 18px; font-weight: lighter;
    cursor: pointer;
    width: 150px;
}

.green:hover{
    background: rgba(0,165,169,0.7); 
}
.red:hover{
    background: rgba(231,81,76,0.7); 
}
.brown:hover{
    background: rgba(116,67,16,0.7); 
}
.blue:hover{
    background: rgba(50,74,135,0.7); 
}
.master:hover{
    background: rgba(160,126,93,0.7); 
}

.room_items a{
    color: white;
    display: block;
    width: 100%;
    padding: 10px;
}
.room_items a:visited{
    text-decoration: none;
}
.room_items a:focus{
    text-decoration: none;
}

.offer_item{
    background: #f4f4f4;
}

.offer-body{
    padding: 35px;
}

.btnmain{

    display: inline-block; padding: 8px 15px; border: 2px solid #000; margin-top: 10px; font-size: 14px; 
    background: #fec048;
}
.btnmain_confirm{
    display: inline-block; padding: 8px 15px; border: 2px solid #000; margin-top: 10px; font-size: 18px; 
}

.offer_item{
    margin-bottom: 15px;
}
.offer_item h2{
    margin-bottom: 20px;
    text-transform: uppercase;
    font-size: 22px;
}
.offer_item p{
    font-weight: lighter;
}

.offer_item .spl{
    color: #8d4f20;
}

.terms{
    margin-bottom: 30px;
}

.terms h5{
    padding: 6px 0;
    border-bottom: 1px solid #f2f2f2;
}

.terms ul{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.terms ul li{
    padding: 2px 0;
}

.offer_additionals{
    margin: 20px 0px;
    padding: 0px;
    list-style: none;
}
.offer_additionals li{
    padding-bottom: 20px;
    font-weight: lighter;
}


#rooms-sel li{
}

.selbox h3{
    margin-top: 8px;
    font-size: 16px;
}

.details h4{
    padding: 6px 10px;
    font-size: 14px;
    text-transform: uppercase;
}

/** GOOGLE DATEPICKER **/
.ui-widget-header{
    background: none !important;
    border: none !important;
    font-weight: normal !important;
}
.ui-datepicker th{
    font-weight: normal !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default{
    border: none !important;
    background: #fcfcfc !important;
}


.parentD {
    overflow: hidden;
    position: relative;
}

.childD {
    height: 100%;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.parentD:hover .childD, .parentD:focus .childD {
    -ms-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
    cursor: pointer;
}

.parentD:hover .childD:before, .parentD:focus .childD:before {
    display: block;
}

.parentD:hover a, .parentD:focus a {
    display: block;
}

.childD:before {
    content: "";
    display: none;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.tabless{
    border-collapse: collapse;
    background: #f0f0dd
}

.tabless td{
    border: 1px solid #807b34;
    text-align: left;
    padding: 10px;
    font-weight: normal;
}

.tabless td h3{
    font-size: 18px;
}


#avlcal{
        border-collapse: collapse;
    }
    #avlcal th{
        font-weight: normal;
        padding: 5px;
        font-size: 12px;
        background: #dedede;
        border: 1px solid #dedede;
    }
    #avlcal td{
        font-weight: normal;
        padding: 5px 8px;
        font-size: 12px;
        border: 1px solid #dedede;
    }

    .avl{
        background: #8cb718;
    }

    .ok{
        
        background: #ececec;
    }
    
    
    /*  MOBILE **/
@media screen and (max-width:680px) {

    
    .doCenter{
        text-align: center !important;
    }
    
    #intro{
        padding: 10px;
    }
    #intro h1{
        font-size: 24px;
    }
    
    #intro p{
        padding: 5px 20px;
    }
    
    #offers h1{
        font-size: 24px;
        padding: 10px;
    }
    #offers p{
        padding: 5px 20px;
    }
   
    .grid{
        padding: 0px;
    }
    
    .grid figure{
        margin: 0px;
        padding: 0px;
    }
    
    
    #dining{
        height: 300px;
    }
    
    #dining h2{
        font-size: 24px;
        margin-top: 90px;
    }
    #dining h3{
        font-size: 20px;
    }
    
    .introtxt h1{
        font-size: 24px;
    }
    .introtxt p{
        padding: 5px 20px;
    }
    
    .resMargTop{
        margin-top: 10px;
    }
    .comments{
        padding: 5px 20px;
    }
    
    .comments b{
        text-align: center;
    }
    .comments h3{
        text-align: center;
    }
    .comments p{
        text-align: center;
    }
    
    .introp{
        padding: 0px 15px !important;
        text-align: center;
    }
    .upper{
        text-align: center;
    }
    
    #offersLinks{
        text-align: center;
    }
    
    .offimg{
        margin-left: 0px !important;
        margin-top: 0px !important;
    }
    
    .list-unstyled{
        text-align: center;
    }
    
    .booknowRoom{
        display: block !important;
        width: 100% !important;
    }
    
    .terms h5{
        padding: 5px 20px;
    }
    .terms p{
        padding: 10px 20px;
        font-size: 11px;
    }
    
    .calFooter{
        text-align: center !important;
    }
    
    #advert{
        width: 400px !important;
        height: 200px !important;
        margin-left: -200px !important;
    }
    
    #bookformcont{
        min-height: 500px;
    }
    
    .selbox h5{
        font-size: 12px;
    }
    
    #price h3{
        font-size: 14px;
    }
    
    .icons{
        height: 100px;
    }
    
    .inroomimg{
        height: 300px !important;
    }
    
    .close{
        font-weight: bold !important;
        font-size: 32px !important;
    }
    
    #icon-holder{
    min-height: 600px;
    padding: 15px 0;
    padding-top: 45px;
    background: url('../images/footer-bg.jpg') no-repeat bottom center;
    background-size: contain !important;
    
    .slideitems{
        background-size: contain !important;
    }
}
    
}
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : portrait) { 

    
    .slideitems{
        height: 300px !important;
    }
    
    .roomimg_in{
        height: 300px !important;
    }
    
    
    #advert{
        width: 350px !important;
        margin-left: -175px !important;
    }
    
    #searchdates{
        width: 370px !important;
    }
    
    .inroomimg{
        height: 300px !important;
    }

}