@font-face { 
	font-family: 'Avenir'; 
	src: url('/assets/100/font/Avenir.eot'); 
	src: url('/assets/100/font/Avenir.eot?#iefix') format('embedded-opentype'), 
	     url('/assets/100/font/Avenir.woff') format('woff'), 
	     url('/assets/100/font/Avenir.ttf') format('truetype'), 
	     url('/assets/100/font/Avenir.svg#Avenir') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face { 
    font-family: 'BrandonGrotesque'; 
    src: url('/assets/100/font/BrandonGrotesque.eot'); 
    src: url('/assets/100/font/BrandonGrotesque.eot?#iefix') format('embedded-opentype'), 
         url('/assets/100/font/BrandonGrotesque.woff2') format('woff2'), 
         url('/assets/100/font/BrandonGrotesque.woff') format('woff'), 
         url('/assets/100/font/BrandonGrotesque.ttf') format('truetype'), 
         url('/assets/100/font/BrandonGrotesque.svg#BrandonGrotesque') format('svg');
    font-weight: normal;
    font-style: normal;
}

#gagdet,
input,
select,
button,
.ui-datepicker {
    font-family: "Avenir", Arial, Helvetica, sans-serif;
}

#gagdet {  
    box-sizing: border-box;
	color: #414141;
	font-size: 18px;
	text-align: center;
    padding: 0 0 25px;
    border-bottom: 1px solid #F2F2F2;
}

.module {
	display: inline-block;
    vertical-align: bottom;
    box-sizing: border-box;
}

.gadget_title {
    font-family: "BrandonGrotesque", Arial, Helvetica, sans-serif;
    font-size: 36px;
    text-transform: uppercase;
    display: block;
    text-align: left;
    border-bottom: 1px solid #F2F2F2;
    padding-bottom: 10px;
    margin: 0 0 30px;
}

.date_begin,
.date_end,
.occupancy_select {
    width: 245px;
}

.date_begin,
.date_end,
.occupancy_select {
    padding-right: 10px;
}

.make_search {
    width: 180px;
}

label {
    display: block;
    padding: 0 0 10px 10px;
    text-align: left; 
}

input[type="text"],
select {
    border: 1px solid #F8F8F8;
    color: #666666;
    font-size: 18px;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
    padding: 0 40px 0 10px;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background-repeat: no-repeat;
    background-position: right center;
    background-color: #F8F8F8;
    width: 100%;
    cursor: pointer;
}

input[type="text"] {
	background-image: url("/assets/100/289/img/calendar.png"); 
}

select {
	background-image: url("/assets/100/289/img/select-caret.png"); 
}

#submit {
	background: #1E4383;
    border: 1px solid #1E4383;
    color: #FFFFFF;
    cursor: pointer;
    font-size: 20px;
    height: 40px;
    box-sizing: border-box;
    text-transform: uppercase;
    width: 100%;
}

#submit:hover {
	background: #173975;
	border-color: #173975;
}

#submit b {
    margin-right: 10px;
}

#submit span {
    display: inline-block;
    width: 14px;
    height: 14px;
    content: "";
    background: url("/assets/100/289/img/button-arrow.png") no-repeat 0 0 transparent;
}

#hotline_reservations {
    text-transform: capitalize;
    position: absolute;
    top: 15px;
    right: 0;
    font-size: 20px;
}

.ui-datepicker {
    font-size: 14px;
    top: 0 !important;
}

.ui-widget-header {
    background: none repeat scroll 0 0 #CFE2F1;
    border: 1px solid #BCD3E5;
}

.ui-widget-header span {
    text-transform: uppercase;
}

.ui-datepicker th {
    font-weight: normal;
}

@media all and (max-width: 939px) {

    #gagdet,
    #hotline_reservations,
    input[type="text"],
    select,
    button {
        font-size: 14px;
    }

    .gadget_title {
        font-size: 26px;
    }

    .date_begin,
    .date_end,
    .occupancy_select {
        width: 30%;
    }

    .make_search {
        width: 8%;
    }

    label {
        padding-bottom: 5px;
    }

    #submit b {
        display: none;
    }

}

@media all and (max-width: 750px) {

    .date_begin,
    .date_end,
    .occupancy_select {
        width: 25%;
    }

    .make_search {
        width: 10%;
    }

}

@media all and (max-width: 595px) {

    .date_begin,
    .date_end,
    .occupancy_select {
        width: 28%;
    }

    #hotline_reservations {
        text-align: center;
        width: 100%;
        left: 0;
        top: 175px;
    }

}

@media all and (max-width: 511px) {

    label {
        padding: 0 0 5px 5px;
    }

    input[type="text"],
    select {        
        padding: 0 40px 0 5px;
    }

    #hotline_reservations {
        top: 180px;
    }

}

@media all and (max-width: 425px) {

    #gagdet {
        padding-bottom: 5px;
    }

    .module {
        display: block;
        padding: 0 0 10px 0;
        overflow: hidden;
        width: 100%;
        text-align: left;
    }

    .gadget_title {
        margin-bottom: 20px;
    }

    label {
        float: left;
        width: 45%;
        box-sizing: border-box;
        text-align: right;
        padding: 0 10px 0 0;
        line-height: 40px;
    }

    input[type="text"],
    select {
        width: 160px;
    }

    .make_search {
        text-align: center;
    }

    #submit {
        width: 278px;
    }

    #submit b {
        display: inline-block;
    }

    #hotline_reservations {
        top: 280px;
    }

}

@media all and (max-width: 300px) {

    label {
        width: 35%;
    }

}