﻿/* ------------------------------------------------------------------------- */
/* ---------------------Contenedor principal del search--------------------- */
/* ------------------------------------------------------------------------- */
.md-search-container-fluid {
    margin-top: 1rem;
    margin-bottom: 2rem;
}

.input-group-btn {
    background-color: white;
    border-left: 0;
    border-radius: 0px 5px 5px 0px;
}

.input-group-btn .btn {
    border-radius: 10px 10px 10px 10px !important;
    background-color: var(--main-dark-blue-color);
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 10px;
    color: white;
}

.input-group .form-control {
    border-right: 0;
}

.container-search {
    padding-top: 1rem;
}

.input-group-btn select {
    -webkit-appearance: none;
    -moz-appearance: none;
}

/*for IE10*/
.input-group-btn select::-ms-expand {
    display: none;
}

/*-------------------------------------- Checkbox radio -----------------------------------------*/

.custom-control-label {
    color: white;
}

.custom-control-label::before {
    background-color: white;
}

.custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--main-dark-orange-color);
    box-shadow: none;
}

/*--------------------------------------------------------------------------------------*/
/*Para los Botones Geographical y Other Extensions*/

.md-btn-outline-geother-extensions:hover {
    background-color: var(--main-dark-orange-color);
    border-color: var(--main-dark-orange-color);
}

.md-btn-geother-extensions {
    font-size: 1.2rem;
    border-color: var(--main-dark-orange-color);
    width: 100%;
    border-width: 0.2rem;
    box-shadow: none !important;
    border-radius: 10px;
    color: white;
}

.md-container-geother-extensions {
    text-align: center;
}

.md-p-geother-extensions {
    margin-top: 0.3rem;
    margin-bottom: 0.3rem;
}

.md-container-geother-extensions .row {
    padding-left: 10%;
    padding-right: 10%;
}


@media screen and (max-width: 400px) {
    .md-btn-geother-extensions {
        font-size: 0.8rem;
    }

    .md-container-geother-extensions .row .col {
        padding-left: 10%;
        padding-right: 10%;
        margin-top: 1rem;
    }
}

@media screen and (min-width: 401px) and (max-width: 767px) {

    .md-container-geother-extensions .row .col {
        padding-left: 10%;
        padding-right: 10%;
        margin-top: 1rem;
    }

}