/*
!*MAIN COLOR *!*/
@import "mail_color.css";


/*!*************************
*******Contact CSS******
**************************!*/


/*--booking-top--*/

.contact_page .booking_top-agile{

    box-sizing: border-box;
}


.contact_page .booking_top-agile h3{
    font-size: 28px;
    font-weight: 500;
    text-transform: capitalize;
    letter-spacing: 2px;
    margin-bottom: 1em;
    margin-top: 0;
    font-family: var(--text-info_title_font);
}

.contact_page .booking_top-agile p {
    font-size: 15px;
    font-family: var(--text-family_font);
    text-align: justify;
}



.contact_page .booking_top-agile h4{
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 1px;
    margin: 30px 0;
    text-transform: uppercase;
    font-family: var(--text-info_title_font);
    position: relative;
}

.contact_page .booking_top-agile h4:before{
    top: 25px;
    content: " ";
    position: absolute;
    width: 15%;
    height: 1px;
    bottom: 0;
    left: -20px;
    border-bottom: 1px solid #000000;
}

.contact_page .booking_top-agile table tr:nth-child(even) {
    background: none;
}

.contact_page .icon-agile i {
    width: 50px;
    height: 50px;
    border: 1px solid #000000;
    border-radius: 50%;
    text-align: center;
    line-height: 1.5;
    font-size: 2.2em;
    transform: rotate(20deg);
}


.contact_page .contact-agile p {
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 2px;
    font-family: var(--text-family_font);
}
.contact_page .contact-agile span {
    font-size: 15px;
    font-weight: 500;
    display: inline-block;
    margin:0 0 1em;
    font-family: var(--text-family_font);
}



/*map  */
.contact_page .map {
    width: 100%;
    height: 550px;
    margin: auto;
}

.contact_page .map iframe {
    width: 100%;
    height: 550px;
    margin: auto;
}

.contact_page .mapContainer a.direction-link {
    position: absolute;
    top: 10px;
    right: 15px;
    z-index: 100010;
    color: #FFF;
    text-decoration: none;
    font-size: 15px;
    font-weight: bold;
    line-height: 25px;
    padding: 8px 20px 8px 20px;
    background: #0094de;
    background-position: left center;
    background-repeat: no-repeat;
}

.contact_page .mapContainer a.direction-link:hover {
    text-decoration: none;
    background: #0072ab;
    color: #FFF;
    background-position: left center;
    background-repeat: no-repeat;
}

/*booking bottom */
.contact_page .booking_bottom-agile h2 {
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 30px;
    text-transform: uppercase;
    font-family: var(--text-info_title_font);
    background: none;
}
.contact_page .booking_bottom-agile {
    background: linear-gradient(to top, #999966 0%, #b9c0a9 100%);
    padding: 2em;
    box-sizing: border-box;
    border-radius: 25px;
    margin-top: 15px;

}



.contact_page .booking_bottom-agile h4{
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-family: var(--text-info_title_font);
    position: relative;
    text-align: center;
}


.contact_page .booking_bottom-agile .row {
     margin-bottom:0 ;
 }

.contact_page .booking_bottom-agile .col-sm-6.col-inside, .contact_page .booking_bottom-agile .col-sm-12.col-inside {
    margin-bottom:0 ;
    padding: 7px 0 7px 5px;

}
/* Form */

.contact_page form div {
    clear: none;
}

.contact_page form .label-agile label{
    font-size: 17px;
    font-weight: 200;
    text-align: left;
    letter-spacing: 1px;
    margin: 0.8em 0;
    color: #fff;
    font-family: var(--text-info_title_font);
    text-transform: uppercase;
}


.contact_page form  input::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.43);
    text-transform: none;

}

.contact_page form  input::-moz-placeholder {
    color: rgba(255, 255, 255, 0.43);
}

.contact_page form  input::-ms-placeholder {
    color: rgba(255, 255, 255, 0.43);
}

.contact_page form  input::placeholder {
    color: rgba(255, 255, 255, 0.43);
}


.contact_page .input_agile select{
    width: 100%;
    border: none;
    background: transparent;
    color:#fff;
    border-bottom: 1px solid #fff;
    border-radius: 0;
    padding: 0;
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    letter-spacing: 1px;
    margin-bottom: 1em;
    font-family: var(--text-family_font);
    box-shadow: none;
}

.contact_page .input_agile option{
    background: var(--color_background_AccentElement);
    color: #fff;
    font-size: 15px;
}


.contact_page .input_agile input{
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    letter-spacing: 1px;
    border: none;
    outline: none;
    width: 100%;
    background: none;
    padding: 0.5em 0;
    color:#fff;
    margin-bottom: 8px;
    border-bottom: 1px solid #fff;
    border-radius: 0;
    font-family: var(--text-family_font);
    box-shadow: none;
}

.contact_page .input_agile input[type='text'] {
    text-transform: capitalize;
    font-family: var(--text-family_font);
}


/*datepicker */


.contact_page .datepicker {
    color: #333 ;
}


.contact_page .input-group{
    margin-bottom: 0px;
    padding: 0 7px;
}

.contact_page .input-group-addon {
    border: none;
    color: #ffffff;
    background: none;
}

.contact_page .input-group-addon .glyphicon {
    font-size: 20px;
}

.contact_page .bootstrap-datetimepicker-widget a{
    color:var(--color_background_AccentElement) ;
}

.contact_page .bootstrap-datetimepicker-widget table td.day:hover {
    box-shadow: 0 0 5px 2px var(--color_accent_elements);

}



.contact_page .bootstrap-datetimepicker-widget table td.active{
    background-color: var(--color_background_AccentElement);
}

.contact_page .bootstrap-datetimepicker-widget table td.active:hover{
    background-color: var(--color_background_AccentElement);
}

.contact_page .bootstrap-datetimepicker-widget table td.disabled:hover {
    box-shadow: none ;

}

.contact_page .datepicker-days table tr{
    background-color: #ffffff;
}


.contact_page #ui-datepicker-div {
    font-family: 'Open Sans', sans-serif;
    background: none !important;
}


.contact_page .ui-datepicker table tr:nth-child(even) {
    background: none;
}


.contact_page .recaptcha-block{
    width: 305px;
    height:79px;

}

.contact_page .recaptcha div{
    margin: 0 auto;
    padding: 0;
}

.contact_page form  input::-webkit-input-placeholder {
    text-transform: none;
    font-family: var(--text-family_font);

}

.contact_page form  input::-moz-placeholder {
    text-transform: none;
    font-family: var(--text-family_font);
}

.contact_page form  input::-ms-placeholder {
    text-transform: none;
    font-family: var(--text-family_font);
}

.contact_page form  input::placeholder {
    text-transform: none;
    font-family: var(--text-family_font);
}


/*submit */
.contact_page button[type="submit"].submit-agile  {
    font-size: 17px;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin: 0 auto;
    width: 40%;
    display: block;
    background: var(--color_background_Footer_bottom);
    color: #fff;
    padding:0.8em 0.8em;
    font-family: var(--text-family_font);
    border-radius: 25px;
    background: -moz-linear-gradient(
            top,
            #ffcb69 0%,
            #f0a733 50%,
            #f2a324 92%,
            #ffb730);
    background: -webkit-gradient(
            linear, left top, left bottom,
            from(#ffcb69),
            color-stop(0.50, #f0a733),
            color-stop(0.92, #f2a324),
            to(#ffb730));
    border: 1px solid #965F06;
    -moz-box-shadow:
            0px 1px 1px rgba(000,000,000,0.5),
            inset 1px 2px 0px rgba(255,255,255,0.4);
    -webkit-box-shadow:
            0px 1px 1px rgba(000,000,000,0.5),
            inset 1px 2px 0px rgba(255,255,255,0.4);
    box-shadow:
            0px 1px 1px rgba(000,000,000,0.5),
            inset 1px 2px 0px rgba(255,255,255,0.4);
    text-shadow:
            1px 1px 2px rgba(000,000,000,0.7),
            0px 1px 0px rgba(255,255,255,0.4);
}
.contact_page button[type="submit"]:hover.submit-agile  {
    color: #000000;

    transition:.5s ease-in;

}



@media (max-width: 991px) {
    .contact_page .col-inside {
        width: 100%;
    }

    .contact_page .booking_bottom-agile{
        margin-bottom: 20px;
    }

    .contact_page .booking_bottom-agile .center-block{
        padding-left: 0;
    }

    .contact_page .booking_bottom-agile h2{
        font-size: 25px;
    }

}