/* =======================================  */ 
         /* BOOKING ROOM HOTESPA */
/* =======================================  */ 
   
    
    #bookingroom {
        width: 130px;
        height: 20px;
        padding: 0 5px;
        background: #fff;
    }
   
    #bookingroom > li, #bookingroom > li > input {
        font-size: 14px;
        padding: 0;
        margin: 0;
        vertical-align: top;
        border: none;
        height: 20px;
        font: 13.3333px Arial;
    }
    #bookingroom > li {
        display: inline-block;
        position: relative;
        *zoom:1;
        *display: inline;
        position: relative;
        margin-right: -4px;
        background-color: transparent;
    } 
    #bookingroom > li > input {
        color: #000;
        line-height: 22px;
        text-align: right;
        border: none;
        background-color: transparent;
        position: relative;
        outline: 0;
        width: 100%;
        height: 20px;
        text-align: left;
        z-index: 1;
        margin-left: -4px;
        font-weight: normal !important;
    }
    #bookingroom > li {
        position: relative;
    }
        #bookingroom > li.year {
        width: 46px;
        height: 20px;
    }
    #bookingroom > li.month {
        width: 31px;
        height: 20px;
    }
    #bookingroom > li.day {
        width: 31px;
        height: 20px;
    }
    #bookingroom > li > span {
        color: #000;
        position: absolute;
        top: 2px;
        right: -0px;
        width: 14px;
        height: 20px;
        border: none;
        text-align: left;
        z-index: 0;
        display: block;
        font: 13.3333px Arial;
         border: 0px solid red;
        line-height: 15px;
    }
    #bookingroom > li > input:focus { 
        font-weight: bold;
    }
    
/* =======================================  */ 
                /* END CODE */
/* =======================================  */ 




   
    /* ==================================*/
            /* CALENDER CSS */
    /* ==================================*/
    
    
    
    .calendar_css {
        width: 275px !important;
        margin-top: -200px;
    }
    .calendar_style {
        padding: .2em;
        border-radius: 5px;
        border: 1px solid #dfd9c3;
        background: #fff;
        color: #312e25;
        top: -185px;
        left: 150px;
    }
    .calendar_style .tbl_title{
        width: 100%; 
        border: 1px solid #dddddd;
        background: #e9e9e9;
        color: #333333;
        font-weight: bold;
        font: 13.3333px Arial;
        padding: 7px;
    }
.calendar_style .tbl_title td {
       height: 20px !important;
        vertical-align: middle;
    }
    
    .calendar_style .tbl_text {
        width: 100%;
        font-weight: bold;
        padding: .5em .3em  .3em !important;
        border-collapse: separate !important;
    }
    .calendar_style .tbl_text td {
        color: #312e25;
        padding: 2px 0px 2px 0px;
        font-weight: bold!important;
        text-align: center;
        font: 13.3333px Arial;
    
    }
    .calendar_style .tbl_cel {
        width: 100%;
        padding: 3px;
        background-color: #fff;
        border-collapse: separate !important;
        border-spacing: 2px  !important;
        height: 194px;
    }
    
    
    .calendar_style .cell {
        background: #dfeffc url("http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/redmond/images/ui-bg_flat_55_fbec88_40x100.png") 50% 50% repeat-x;
        font-weight: bold;
        color: #2e6e9e;
    }
  
    
    .calendar_style .btn_today {
        font-size: 16px;
        font-family: Arial,Helvetica,sans-serif;
        color: #333333;
        padding: 4px 0px 2px 0px;
        text-align: center;
        font-weight: bold;
        
    }
    .calendar_style .btn_close {
        font-size: 12px;
        width: 20px;
         color: #333333;
        padding: 8px 0px 4px 0px;
        text-align: center;
        font-weight: bold;
        width: 30px;
        height: 15px!important;
         background-image: url("../../src/dynimg/cancel.png")!important;
        background-repeat: no-repeat !important;
        background-position:  center center !important;
    }
   
    .calendar_style .cancel:hover {
         background-image: url("../../src/dynimg/cancel_hover.png");
        
    }
    .calendar_style .btn_prev {
        color: #333333;
        padding: 8px 0px 4px 0px;
        text-align: center;
        font-weight: bold;
        width: 30px;
        height: 15px!important;
        background-image: url("../../src/dynimg/pre.png")!important;
        background-repeat: no-repeat !important;
        background-position:  center center !important;
    }
    .calendar_style .btn_next {
        color: rgb(51, 51, 51);
        padding: 8px 0px 4px 0px;
        font-weight: bold;
        cursor: pointer;
        height: 15px !important;
        width: 30px;
        background-image: url("../../src/dynimg/next.png")!important;
        background-repeat: no-repeat !important;
        background-position:  center center !important;
    }
    .calendar_style .btn_prev:hover , .calendar_style .btn_next:hover {
        opacity: .6;
    }
    
    .calendar_style .tbl_cel td {
        font-size: 14px;
        padding: 3px;
        font-family: Arial,Helvetica,sans-serif;
        font-weight: bold;
    }
    
    .calendar_style .enable {
        border: 1px solid #c5c5c5;
        background: #f6f6f6;
        font-weight: normal !important;
        color: #454545 !important;
    }
    .calendar_style .enable:hover {
        background: #ededed !important;
       
    }
    
    .calendar_style .normal {
        /*border: 1px solid #718a5d;*/
        background: #718a5d url("../../../images/ui-bg_highlight-hard_95_cccccc_1x100.png") 50% 50% repeat-x;
        font-weight: bold;
        color: #fff !important;
        font-weight: bold !important;
        opacity: 0 !important;
        border: 0 !important;
    }

    .calendar_style .normal:hover { 
        background: #718a5d url("../../../images/ui-bg_highlight-hard_95_cccccc_1x100.png") 50% 50% repeat-x !important;
    }
    .calendar_style .unable {
           border: 1px solid #c5c5c5;
            background: #f6f6f6;
            font-weight: normal!important;
            color: #454545!important;
            opacity: .7;
        }
    .calendar_style .active {
        font-weight: normal!important;
        border: 1px solid #dad55e;
        background: #fffa90 !important;
        color: #777620 !important;
    }
    
    .js__language {
        position: fixed;
        z-index: 99999999999999 !important;
        top: 10px;
        display: none;
    }
    .layout__row {
        padding-left: 4%;
        padding-right: 4%;
    }
    .layout__row::after {
        display: block;
        content: "";
        clear: both;
    }
    .layout_col-1 {
        padding: 20px 4px 4px 4px;
    }
    .layout_col-2 {
        width: 50%;
        float: left;
        padding: 4px 4px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .graphic__button {
        display: block;
        border: 1px solid #848f9f;
        background-color: #485d7b;
        color: #fff;
        padding: 5px 4px 4px 4px;
        text-align: center;
        font-size: 14px;
    }
    .graphic__button--big {
        padding-top: 10px;
        padding-bottom: 8px; 
    }
    
   .reservation__open {
    position: relative;
   }
    .layout__row--theme2 {
        padding-left: 0;
        padding-right: 0;
        position: relative;
    }
    .layout__row--theme2::after {
        display: block;
        content: "";
        clear: both;
    }
    .layout__col--full {
        padding: 0;
    }
    .layout__col {
        width: 50%;
        float: left;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-top: 1px solid #848f9f;
    }
    .layout__col:nth-child(odd) {
        border-left: 1px solid #848f9f;
    }
    .graphic--button {
        display: block;
        background-color: #485d7b;
        color: #fff;
        padding: 8px 10px 6px 10px;
        text-align: left;
        font-size: 14px;
    }
    .graphic--button:after {
        content: "";
        position: absolute;
        top: 12px;
        right: 8px;
        height: 12px;
        width: 12px;
        padding: 0;
        margin: 0;
        background-image: url("/common/search/dormyinn_standard/mobile_language/arrow--right.png");
        background-size: 100% 100%;
    }

    .dormyinn__standad {
        list-style: none;
        margin-bottom: 30px;
    }
    .dormyinn__standad .graphic--button {
        background-color: #0070BD;
    }
    .dormyinn__standad .graphic__button {
        font-size: 14px;
        margin: 0 2px;
    }
    .dormyinn__standad .layout__col {
        border-top: 1px solid #83b1d1;
    }
    .dormyinn__standad .layout__col:nth-child(odd) {
        border-left: 1px solid #83b1d1;
    }
    .dormyinn__standad.layout__row {
        bottom: 0;
        padding: 0 4px;
    }
    .dormyinn__standad .layout_col-1 {
        padding: 0;
        margin-top: 25px;
    }
    .dormyinn__standad .layout_col-2 {
        padding: 0;
        padding-top: 4px;
    }
    .dormyinn__standad .graphic__button {
        /*border-radius: 45px;*/
        background-color: #0070BD;
        border: 0;
    }


    /* ==================================*/
            /* END CALENDER */
    /* ==================================*/
    
.checkin_ctn {
    position: relative !important;
}
#datPhong .tab1, #datPhong .tab2, #datPhong .tab3 {
    
}
#dynCalendarTest1 {
    left: 0;
}


.checkin_ctn_tbl input, .checkin_ctn_tbl select{
            color: #000;
            border: none;
            background-color: #fff;
            outline: none;
            height: 20px;
        }










































.fixed-bottom {
    height: 112px;
} 
.fixed-bottom {
    min-height: auto !important;
}

.checkin .group {
    min-height: 110px;
}

#blk-checkin .blk-checkin_inner-title {
    background-image: url(/common/img/checkin_ttl.png) !important;
}


/*  ===================================== */

/*         [CSS]ĐẶT PHĂ’NG MỚI             */

/*  ===================================== */


.checkin_ttl {
background-image: url(/common/img/checkin_ttl.png) !important;
}

.checkin_ctn {
position: relative !important;
}
#dynCalendarTest1 {
left: 0;
}

.checkin_ctn_tbl input, .checkin_ctn_tbl select{
color: #000;
border: none;
background-color: #fff;
outline: none;
height: 20px;
}


/* ========================================== */

.checkin {
background-color: #1a3651;
margin-top: 40px;
width: 100%;
}
.checkin.fixed {
position: fixed;
bottom: 0;
left: 0;
}

.checkin .group {
position: relative;
}
.checkin #tab {
position: absolute;
left: 0;
top: -35px;
}

.checkin #tab li {
list-style: none;
line-height: 18px;
float: left;
margin-right: 4px;
min-width: 160px;
text-align: center;
}
.checkin #tab li span {
font-size: 16px;
font-weight: bold;
color: #fff;
text-decoration: none;
font-family: "Meiryo", Helvetica, Arial, Sans-Serif;
display: block;
line-height: 18px;
padding: 9px 9px 8px;
background-color: #b1925e;
border: 0;
outline: 0;
margin: 0;
cursor: pointer;
}
.checkin #tab li.active span {
background-color: #1a3651;
}

.CategoryBooking, .hide_object .hide_night  {
display: none;
}

.checkin_ctn .tourlist-box {
border: 1px solid red  !important;
}
#i_day {
width: 160px;height: 20px;padding: 0 5px;background: #fff;text-align: right;
}
#r_cnt {
width: 170px;height: 20px;
}




.iframebox {
width: 100%;
margin: 0 auto;
}

.iframebox iframe {
width: 100%;
padding: 0;
height: 65px;
}
.checkin_ctn_btn input[type="button"] {
margin: 7px 0;
}
.checkin_ctn_tbl {
margin-top: 6px;
}

.iframebox {
/*margin-top: 15px;*/
    margin-top: 13px;
/*Ă¢Ëœâ€¦Ă¤Â¿Â®Ă¦Â­Â£0619:*/
    width: 700px;
}

.iframebox iframe {
/*height: 80px;*/
    height: 86.5px;
/*Ă¢Ëœâ€¦Ă¤Â¿Â®Ă¦Â­Â£0619:*/
}



.checkin .container .iframebox {
/*margin-top: 15px;*/
margin: 7px 0 0 0;/*Ă¢Ëœâ€¦Ă¤Â¿Â®Ă¦Â­Â£0619:*/
width: 669px;
padding-top: 3px;
}
.checkin .container .iframebox iframe {
/*height: 80px;*/
height: 86.5px;/*Ă¢Ëœâ€¦Ă¤Â¿Â®Ă¦Â­Â£0619:*/
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
.checkin .container .iframebox {
margin: 8px 0 0 0;/*Ă¢Ëœâ€¦Ă¨Â¿Â½Ă¥Å  0619:*/
width: 669px;
}
.checkin .container .iframebox iframe {
margin:-1px 0 1px;/*Ă¢Ëœâ€¦Ă¨Â¿Â½Ă¥Å  0619:*/
height: 87px;
}
}



.tab3 select {
    background-color: #fff;    
}





/* --------------------------------------------------
Checkin PENTIUM
-------------------------------------------------- */
.checkin_pentiem .checkin_ctn_btn {
width: 87px;
height: 87px;
display: block;
float: right;
border: 0;
margin-top: 3px;
/* margin: 10px 55px 0 0; */
}

.checkin_pentiem .checkin_ctn_btn input[type="button"] {
    background-image: url(/common/img/checkin_pentium.png) !important;
}
.checkin_pentiem #tab li.active span {
    background-color: #333333;
}

.checkin_pentiem {
 width: 70%;
 float: left;
 color: #FFF;
}
.checkin_ctn_tbl {
 width: 75%;
 float: left;
 font-size: 14px;
}
.checkin_ctn_tbl td {
 padding: 15px 0 0;
 text-align: right;
}
.checkin_ctn_btn  {
 width: 25%;
 float: left;
}
.checkin_ctn_btn input[type="button"] {
 margin: 10px 0;
 width: 87px;
 height: 87px;
 background-image: url(/common/img/checkin_btn.png);
 background-size: 100% 100%;
 border: none;
 background-color: transparent;
 font-size: 0;
 cursor: pointer;
}

.pdt-fix {
    padding-top: 110px;
}
#dynCalendarTest2 {
    left: 0 !important;
}


#tab3 .iframebox select {
    background-color: #fff !important;
}


@media screen and (max-width: 640px) {
 
/*   update reservation */ 
 .pdt-fix {
    padding-top: 20px;
}
.headerPage_nav-sp_ctn .reservation_sp {
 background-color: #1a3651;
 color: #fff;
 font-size: 12px;
 padding: 12px 15px;
}
.headerPage_nav-sp_ctn .item-pentium {
background-color: #333333;
}   
.headerPage_nav-sp_ctn .reservation_sp ul {
 margin: 0;padding: 0; 
}
.headerPage_nav-sp_ctn .reservation_sp ul li {
 font-size: 15px;
 margin: 0;
 padding: 0;
}
.headerPage_nav-sp_ctn .reservation_sp > p {
 margin: 0 0 8px 0;
 padding: 0;
}
.headerPage_nav-sp_ctn .reservation_sp ul li a {
 background: none !important;
 color: #fff;
 padding: 1px 15px;
 font-size: 14px;
}

.headerPage_nav-sp_ctn .reservation_sp ul li a:before {
 content: url("/common/img/reservation_next_sp.png");
 margin-left: -12px;
 padding-right: 5px;
}
 
/*   update reservation */ 
}


.checkin .checkin_ttl {
    padding: 18px 0;
    margin-top: 1px;
}

.checkin .checkin_ttl {
    min-height: 72px;
}







#blk-checkin .blk-checkin_inner {
    max-width: 1000px;
    width: 100%;
}

#blk-checkin .blk-checkin_inner-title {
    width: 30%;
}

#blk-checkin .blk-checkin_inner-content {
    width: 68.7%;
}


@media screen and (max-width: 640px) {
    #footer .footer_bottom-logo img {
        width: auto !important;
        max-width: 70%;
    }
}

@media screen and (max-width: 950px) {
    #blk-checkin .blk-checkin_inner-title {
        font-size: 12px !important;
    }
}





/*â˜…è¿½åŠ ă“ă“ă‹ă‚‰*/

.checkin .blk-checkin_inner .iframebox {
    margin: 7px 0 0 0;
    max-width: 669px;
    width: 99%;
   padding-top: 3px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .checkin .blk-checkin_inner .iframebox {
        margin: 8px 0 0 0;
        max-width: 669px;
        width: 99%;
    }
}

/*â˜…è¿½åŠ ă“ă“ă¾ă§*/


.checkin .container .iframebox {
    margin: 7px 0 0 0;
    max-width: 669px;
    width: 95%;/*★20170704è¿½åŠ */
   padding-top: 3px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .checkin .container .iframebox {
        margin: 8px 0 0 0;
        max-width: 669px;
        width: 95%;/*★20170704è¿½åŠ */
    }
 }  
    




/* 
    NVDuoc_Google-Map
*/
#Google-Map {
    width: 100%;
    overflow: hidden;
    height: 300px;
}
#Google-Map > iframe {
    width: 100%;
    height: 640px;
    border: 0;
    margin-top: -170px;
}
   



/* 
    NVDuoc_Area-Banner
*/
#Area-Banner {
    margin-top: 30px;
    display: block;
    text-align: center;
}

#Area-Banner img {
    max-width: 100%;
}


/* 
    NVDuoc_Area-Banner_SP
*/
@media screen and (max-width: 640px) {
    .contentCmn03 .mt30, .contentCmn03 #Area-Banner {
        margin-top: 5px;
    }
    .sec-content-03_inner-content #Area-Banner {
        margin-top: 15px;
    }
    #sp-gnav {
        background-color: #fff;
    }
    
}







/* 
    NVDuoc_Reservation
*/
@media screen and (min-width: 641px) {
    .is--sp {
        display: none;
    }
    .hide {
        display: block;
    }
    dl#NVDuoc_Reservation {
        display: inline-block;
        position: fixed;
        right: 0;
        top: auto;
        bottom: 400px;
        z-index: 99999;
        box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.35);
        -moz-box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.35);
        -webkit-box-shadow: -1px 1px 4px 0px rgba(0,0,0,0.35);
    }
    dl.NVDuoc_Reservation_Nono{
        bottom: auto !important;
    }
    dl#NVDuoc_Reservation > dt {
        background-color: rgba(221,221,221,0.8);
        font-size: 12px;
        line-height: 1.6;
        text-align: center;
    }
    dl#NVDuoc_Reservation > dt > em {
        background-color: #fff;
        display: block;
        font-size: 16px;
        font-style: normal;
        line-height: 30px;
    }
    dl#NVDuoc_Reservation > dd > a {
        text-decoration: none;
        color: #fff;
        font-size: 12px;
        padding: 5px 26px 3px 20px;
        display: block;
        line-height: 1.4;
    }
    dl#NVDuoc_Reservation > dd > a:before {
        content: url("/image_common/arrow.png");
        color: #fff;
        padding-right: 7px;
        font-size: 12px;
    }
    
    
    /*
        Reservation Dormy inn [Standard]
    */
    dl.Reservation_Standard > dd > a {
        border-top: 1px solid #4d93cb;
        background-color: #0064b4;
    }
    dl.Reservation_Standard > dt {
        color: #1a3651;
    }
    dl.Reservation_Standard > dd > a:hover {
        background-color: rgba(0,100,180,0.7);
        opacity: 0.9;
    }
    
    /*
        Reservation Dormy inn [Premium]
    */
    dl.Reservation_Premium > dd > a {
        border-top: 1px solid #b69863;
        background-color: #966b20;
    }
    dl.Reservation_Premium > dt {
        color: #000000;
    }
    dl.Reservation_Premium > dd > a:hover {
        background-color: rgba(150,107,32,0.7);
        opacity: 0.9;
    }
    
    /*
        Reservation Dormy inn [Express]
    */
    dl.Reservation_Express > dd > a {
        border-top: 1px solid #f49c5d;
        background-color: #ef7117;
    }
    dl.Reservation_Express > dt {
        color: #000000;
    }
    dl.Reservation_Express > dd > a:hover {
        background-color: rgba(239,113,23,0.7);
        opacity: 0.9;
    }
    
    
    /*
        Reservation Dormy inn [Nono]
    */
    dl.Reservation_Nono {
        top: 12% !important;
    }
    dl.Reservation_Nono > dd > a {
        border-top: 1px solid #444;
        background-color: #222;
    }
    dl.Reservation_Nono > dt {
        color: #000000;
    }
    dl.Reservation_Nono > dd {
        margin: 0;
    }
    dl.Reservation_Nono > dd > a:hover {
        background-color: rgba(34,34,34,0.8);
        opacity: 0.9;
    }
    
    
    
}
    
@media screen and (max-width: 640px) {
    .is--pc, .is-pc {
        display: none !important;
    }
    .layout__headercut .header_inner, .layout__headercut #mainvisual {
      height: 293px !important;
    }
    .headerPage_nav-sp_ctn_inner, #sp-gnav {
        overflow-y: scroll;
    }
    dl#NVDuoc_Reservation {
        padding: 10px 16px;
        border-bottom: 1px solid #dedddd;
        margin-bottom: 6px;
    }
    dl#NVDuoc_Reservation > dt {
        margin-bottom: 5px;
        font-size: 12px;
        line-height: 1.4;
        color: #1a3651;
    }
    dl#NVDuoc_Reservation > dt > em {
        font-size: 16px;
        font-style: normal;
        line-height: 1.4;
        padding: 0 20px 0 8px;
    }
   dl#NVDuoc_Reservation > dd > a {
       display: inline-block;
       width: 48%;
       padding: 0;
       background: none;
       font-weight: bold;
       line-height: 1.8;
       font-size: 12px;
       text-decoration: none;
       color: #000;
    }
    dl#NVDuoc_Reservation > dd > a:before {
        content: ">";
        text-indent: -5px;
        color: #000;
        padding-right: 7px;
        font-size: 12px;
    }
    
}