/* === TOP10 Widgets === */

/*
body {
    border:solid red 10px!important;
}
*/

.front .hard-right .views-field-field-booking-form .field-content {
    background: transparent;
    width:350px;
}

#content .views-field-field-booking-form form {
    background: #67b8e6;
    background-color: #67b8e6;
    border:solid #005077 3px;
    text-transform: uppercase;
    overflow:auto;
    margin-top: 200px;
    padding: 30px 20px;
}
.topmotels #content .views-field-field-booking-form form {
    background: #fdbe40;
    background-color: #fdbe40;
}

#content .views-field-field-booking-form table {
    width:280px
}
#content .views-field-field-booking-form table,
#content .views-field-field-booking-form tbody,
#content .views-field-field-booking-form tr,
#content .views-field-field-booking-form tr.odd, 
#content .views-field-field-booking-form tr:nth-child(odd),
#content .views-field-field-booking-form td {    
    display: block;
    border: none;
    width:100%;
    padding:0;
}
#content .views-field-field-booking-form tr {
    margin-bottom:10px;
}
#content .views-field-field-booking-form tr:nth-child(3) td {
    display: inline-block;
    width:33%;
    float:left;
}
#content .views-field-field-booking-form tr:nth-child(3) {
    overflow:auto;
}
#content .views-field-field-booking-form input[type="text"] {
    width:100%;
    padding:7px 10px;
}
#content .views-field-field-booking-form #available_from,
#content .views-field-field-booking-form #available_to {
    background: url("../img/icon-cal.png") no-repeat right 3px #FFFFFF;
}
#content .views-field-field-booking-form #available_from:hover,
#content .views-field-field-booking-form #available_to:hover {
    cursor: pointer;
}

#content .views-field-field-booking-form select {
    -webkit-border-radius: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    width:80px;
    background: url("../img/icon-arrow-down.png") no-repeat right 12px #FFFFFF;
}

#content .views-field-field-booking-form input.check_availability {
    color:#114d7c;
    border:solid #114d7c 2px;
    -webkit-border-radius: 3px 3px 3px 3px;
    border-radius: 3px 3px 3px 3px;
    float:right;
    margin-top: 10px;
}

/* popup calendar */

#ui-datepicker-div {
    width:200px;
}

/* === internal accomodation pages === */

.page-frontpage #block-system-main .view-content .views-row:nth-child(1) {
    min-height:800px;
}
#accommodation-booking-form {
    background-color: #67b8e6;
    padding:0 10px;
    padding-top:15px!important;
    margin-bottom: 20px;
    display: block;
    clear: both;
}
.topmotels #accommodation-booking-form {
    background-color: #f15e22;
}
#accommodation-booking-form h4 {
    color:#FFFFFF;
    font-size:14px;
    text-transform: uppercase;
    /*padding-top:10px;*/
    padding-left:1%;
}
#content #accommodation-booking-form form {
    background-color: transparent;
    margin-top:0;
}
#accommodation-booking-form label,
body #content #accommodation-booking-form tr.promo-row {
    display: none;
}
body #content #accommodation-booking-form form {
    background-color: transparent;
    display: inline-block;
    width:100%;
    position: relative;
    padding:0;
}
body #content #accommodation-booking-form table,
body #content #accommodation-booking-form tbody {
    display: inline-block;
    border: none;
    width:auto;
    /*min-width:780px;*/
}
body #content #accommodation-booking-form tr {
    border:none;
    display: inline-block;
}
#content #accommodation-booking-form select {
    -webkit-border-radius: 0 0 0 0;
    border-radius: 0 0 0 0;
    width:92%;
}
#content #accommodation-booking-form tr {
    float: left;
}
#content #accommodation-booking-form tr:nth-child(1),
#content #accommodation-booking-form tr:nth-child(2) {
    width:20%;
}
#content #accommodation-booking-form tr:nth-child(3) {
    /*width:50%;*/
    width:390px;
}
#content #accommodation-booking-form td {
    display: inline-block;
    min-width:130px;
    text-align: right;
}

#content #accommodation-booking-form tr:nth-child(3) td {
    width:130px;
}

#content #accommodation-booking-form input[type="text"] {
    display: inline-block;
    width:95%;
    min-width:130px;
    padding:10px;
    padding:1rem;
}
#content #accommodation-booking-form input[type="text"]:nth-child(1){
    margin-left:0;
}
#content #accommodation-booking-form input.check_availability {
    background: url("../img/icon-search-white.png") no-repeat 5px 7px #005077;
    color: #FFFFFF;
    border: none!important;
    padding:8px 10px 8px 30px;
    margin-top:0;

    position:absolute;
    top:0;
    right:0;

}
.accommodation-plans {
    clear: both;    
}

#navigation .content>.menu a:hover, #second-navigation .content>.menu a:hover, #navigation .content>.menu a:hover span, #second-navigation .content>.menu a:hover span {
    color: #e1f200;
}

/* === Responsive === */

@media only screen and (max-width: 1375px) {
    #accommodation-booking-form {
        padding: 0 15px;
    }
    #accommodation-booking-form h4 {
        padding-left:0;
    }
    #content #accommodation-booking-form tr:nth-child(1), 
    #content #accommodation-booking-form tr:nth-child(2) {
        width:auto
    }
    #content #accommodation-booking-form tr:nth-child(1) > td, 
    #content #accommodation-booking-form tr:nth-child(2) > td {
        text-align: left;
    }
    #content #accommodation-booking-form tr:nth-child(3) {
        clear:left;
    }
    #content #accommodation-booking-form tr:nth-child(3) > td {
        text-align: left;
    }
    #content #accommodation-booking-form input.check_availability {
        margin-top: 50px;
    }

}/* // max-width: 1375px */

@media only screen and (max-width: 1020px) {

    body #content #accommodation-booking-form table, 
    body #content #accommodation-booking-form tbody {
        min-width:100px;
    }


    #content #accommodation-booking-form tr:nth-child(3) td {
        width:100px;
    }
    #content #accommodation-booking-form td {
        min-width: 105px;
    }
    #content #accommodation-booking-form select {
        width:83px;
    }

}

@media only screen and (max-width: 700px) {
    
    #content #accommodation-booking-form tr:nth-child(1),
    #content #accommodation-booking-form tr:nth-child(2) {
        width:50%;
    }
    #content #accommodation-booking-form tr:nth-child(3) {
        width:100%;
    }
    #content #accommodation-booking-form tr:nth-child(3) td:nth-child(3) {
        float:right;
    }
    #content #accommodation-booking-form tr:nth-child(3) td:nth-child(3) select {
        width:95%;
    }

}/* // max-width: 700px */

@media only screen and (max-width: 640px) {
    p.scroll-down {
        display: none!important;
    }
}/* // max-width: 640px */

@media only screen and (max-width: 630px) {

    body #content #accommodation-booking-form table, 
    body #content #accommodation-booking-form tbody,
    #content #accommodation-booking-form tr:nth-child(1), 
    #content #accommodation-booking-form tr:nth-child(2),
    #content #accommodation-booking-form tr:nth-child(1) > td, 
    #content #accommodation-booking-form tr:nth-child(2) > td {
        width:100%;
    }
    #content #accommodation-booking-form input[type="text"] {
        width:100%;
    }

    #accommodation-booking-form {
        padding-bottom:30px;
    }
    #content #accommodation-booking-form input.check_availability {
        top:initial;
        bottom:-23px;
    }

    #content #accommodation-booking-form td {
        text-align: left;
    }

    #content #accommodation-booking-form select {
        width:95%;
    }
    #content #accommodation-booking-form tr:nth-child(3) td {
        width:33%;
        min-width: initial;
    }
    #content #accommodation-booking-form tr:nth-child(3) td:nth-child(3) {
        float: left;
        width:34%;
    }
    #content #accommodation-booking-form tr:nth-child(3) td:nth-child(3) select {
        width:100%;
    }

    

}/* // max-width: 630px */

@media only screen and (max-width: 410px) {

    #accommodation-booking-form label,
    #accommodation-booking-form .promo-row {
        display: block;
        color: #FFF;
        text-align:left;        
    }
    #accommodation-booking-form label {
        display: none;
    }    
    #content #accommodation-booking-form input[type="text"] {
        width:100%;
    }
    #content #accommodation-booking-form tr:nth-child(1),
    #content #accommodation-booking-form tr:nth-child(2) {
        width:100%;
    }
    

}/* // max-width: 400px */





