﻿body {
    background: #EAEFF4 !important;
}
* {
    font-family: 'Montserrat', sans-serif;
}

.card-usuario-detail .icon-table {
    background: none !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
}
/*.ui.form .field.field input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px rgba(0, 67, 76, 0.7) inset !important;
    box-shadow: 0 0 0 100px rgba(0, 67, 76, 0.7) inset !important;
    border-color: #e5dfa1 !important;
}*/
* {
    font-family: 'Montserrat', sans-serif;
}

.progress-bar {
    background-color: #506C93 !important;
}

.topiconbutton {
    background: transparent !important;
}

.bg-light{
    background: transparent !important;
}

.titulo {
    font-size: 1.71428571rem !important;
    font-weight: 700 !important;
}

.container-base{
    padding-left:40px;
    padding-right:40px;
}


.botonoculto {
    background-color: Transparent;
    border-style: None;
}

table th {
    border-top: none !important;
    border-bottom: none !important;
    /*background: #F5F7FB !important;*/
}

table td {
    border-top: 1px solid #F5F7FB !important;
}

.content-card {
    border-radius: 20px !important;
    background: white !important;
    padding: 20px !important;
}

.table-card {
    border-radius: 20px !important;
    background: white !important;
    padding: 20px !important;
    /*border: 1px solid rgba(5,6,15,.06) !important;*/
}


.GridCards tr {
    float: left;
    margin-right: 10px !important;
    margin-bottom: 10px !important;
}

.GridCards td {
    border-top: none !important;
    padding-right: 40px !important;
    padding-bottom: 40px !important;
}

.GridComentarios tr td{ 
    width: 100% !important;
}

.table td, .table th {
    vertical-align: inherit !important;
}

.table-rutas th {
    padding-bottom: .75rem !important;
    padding-top: .75rem !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.card.tablecard {
    border-radius: 20px !important;
}

.card-activity {
    border: 1px solid rgba(5,6,15,.06) !important;
    border-radius: 15px !important;
    padding:10px;
}

/*Imagen de usuario*/

.card-usuario-detail {
    width: 230px !important;
    height: 230px !important;
}

.circuloperfilGrid {
    border-radius: 50% !important;
    background: rgba( 0, 67, 76, 0.2) !important;
    color: var(--primary-color) !important;
    width: 80px !important;
    height: 80px !important;
    font-size: 28px !important;
    align-items: center;
    display: flex;
    justify-content: center;
}

.circuloperfilGrid-Image {
    border-radius: 50% !important;
    width: 80px !important;
    height: 80px !important;
}



.circuloperfilComentario-Principal {
    border-radius: 50% !important;
    background: rgba( 0, 67, 76, 0.2) !important;
    color: var(--primary-color) !important;
    width: 80px !important;
    height: 80px !important;
    font-size: 28px !important;
    align-items: center;
    display: flex;
    justify-content: center;
}


.circuloperfilComentario-Image-Principal {
    border-radius: 50% !important;
    max-width: 80px !important;
    max-height: 80px !important;
}

.circuloperfilComentario {
    border-radius: 50% !important;
    background: rgba( 0, 67, 76, 0.2) !important;
    color: var(--primary-color) !important;
    width: 60px !important;
    height: 60px !important;
    font-size: 28px !important;
    align-items: center;
    display: flex;
    justify-content: center;
}


.circuloperfilComentario-Image {
    border-radius: 50% !important;
    max-width: 60px !important;
    max-height:60px !important;
}

/*Modal*/
.modal-content {
    border-radius: 20px !important;
}

.modal-header {
    padding: 20px !important;
}

.modal-footer {
    justify-content: center !important;
}

    .modal-footer .ui.button {
        margin-left: 20px !important;
        margin-right: 20px !important;
    }

.card {
    /*border: 1px solid rgba(5,6,15,.06) !important;*/
    border: none !important;
}

.btn-primary-custom {
    background: var(--primary-color) !important;
    border: none !important;
    color: #F3F6F9 !important;
    border-radius: 10px !important;
    width: 150px !important;
    padding: 15px !important;
}

    .btn-primary-custom:hover {
        background: var(--primary-color-hover) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    .btn-primary-custom:active {
        background: var(--primary-color-presed) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    /*.btn-primary-custom:focus {
        background: var(--primary-color-focus) !important;
        border: white 1px solid !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
        box-shadow: #00434C 2px 2px 2px 2px inset;
    }*/

    .btn-primary-custom:disabled {
        background: rgba(0, 67, 76, 0.7) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

.mini-btn-primary-custom {
    background: var(--primary-color) !important;
    border: none !important;
    color: #F3F6F9 !important;
    border-radius: 10px !important;
    padding: 15px !important;
}

    .mini-btn-primary-custom:hover {
        background: var(--primary-color-hover) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    .mini-btn-primary-custom:active {
        background: var(--primary-color-presed) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    /*.mini-btn-primary-custom:focus {
        background: var(--primary-color-focus) !important;
        border: white 1px solid !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
        box-shadow: #00434C 2px 2px 2px 2px inset;
    }*/

    .mini-btn-primary-custom:disabled {
        background: rgba(0, 67, 76, 0.7) !important;
        border: none !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

.btn-secundary-custom {
    background: rgba(0, 67, 76, 0.1) !important;
    border: none !important;
    color: #00434C !important;
    border-radius: 10px !important;
    min-width: 150px !important;
    padding: 15px !important;
}

    .btn-secundary-custom:hover {
        background: rgba(0, 67, 76, 0.3) !important;
        border: none !important;
        color: #00434C !important;
        border-radius: 10px !important;
    }

    .btn-secundary-custom:active {
        background: rgba(53, 95, 103, 0.2) !important;
        border: none !important;
        color: #355F67 !important;
        border-radius: 10px !important;
    }

    /*.btn-secundary-custom:focus {
        background: rgba(0, 67, 76, 0.1) !important;
        border: rgba(0, 67, 76, 0.1) 1px solid !important;
        color: var(0, 67, 76) !important;
        border-radius: 10px !important;
        box-shadow: var(0, 67, 76) 2px 2px 2px 2px inset;
    }*/

    .btn-secundary-custom:disabled {
        background: rgba(0, 67, 76, 0.1) !important;
        border: rgba(0, 67, 76, 0.1) 1px solid !important;
        color: rgba(0, 67, 76, 0.7) !important;
        border-radius: 10px !important;
        box-shadow: var(--primary-color) 2px 2px 2px 2px inset;
    }

.btn-option {
    background: none !important;
    color: #01124C !important;
    border: none !important;
}

.btn-table {
    background: none !important;
    color: #494a4b !important;
    border: none !important;
}

.btn-next-prev {
    background: #9CA5B2 !important;
    color: #F3F6F9 !important;
    border: none !important;
    border-radius: 5px !important;
}

.btn-edit {
    background: rgba(196, 199, 200, 0.5) !important;
    border-radius: 10px !important;
    padding: 15px !important;
}

    .btn-edit:hover {
        background: rgba(196, 199, 200, 0.8) !important;
        color: #97999C !important;
        border-radius: 10px !important;
    }

    .btn-edit:active {
        background: rgba(196, 199, 200, 0.3) !important;
        color: #97999C !important;
        border-radius: 10px !important;
    }

    .btn-edit:disabled {
        background: rgba(196, 199, 200, 0.2) !important;
        color: rgba(151, 153, 156, 0.5) !important;
        border-radius: 10px !important;
    }

.btn-create {
    background: var(--primary-color) !important;
    color: #F3F6F9 !important;
    border-radius: 10px !important;
}

    .btn-create:hover {
        background: var(--primary-color-hover) !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    .btn-create:active {
        background: var(--primary-color-presed) !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

    /*.btn-create:focus {
        background: var(--primary-color) !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
        border: white 1px !important;
        box-shadow: var(--primary-color) 2px 2px 2px 2px inset;
    }*/

    .btn-create:disabled {
        background: rgba(var(--primary-color-presed),0.5) !important;
        color: #F3F6F9 !important;
        border-radius: 10px !important;
    }

.btn-filtro {
    background: transparent !important;
    color: #00434C !important;
    border-radius: 10px !important;
    border: var(--primary-color) 2px solid !important
}

    .btn-filtro:hover {
        background: rgba(0, 67, 76,0.1) !important;
        color: #00434C !important;
        border-radius: 10px !important;
        border: var(--primary-color) 2px solid !important
    }

    .btn-filtro:active {
        background: transparent !important;
        color: #355F67 !important;
        border-radius: 10px !important;
        box-shadow: rgba(0, 67, 76,0.3) 2px 2px 2px 2px inset;
    }

    .btn-filtro:disabled {
        background: transparent !important;
        color: rgba(var(--primary-color),0.5) !important;
        border-radius: 10px !important;
        border: #355F67 2px solid !important;
        box-shadow: rgba(0, 67, 76,0.5) 2px 2px 2px 2px inset;
    }

.btn-red-confirm {
    background-color: var(--color-red) !important;
    color: white !important;
    padding: 15px !important;
    transition: 0.5s !important;
    border-radius: 10px !important;
}

    .btn-red-confirm:hover {
        background-color: var(--color-red-hover) !important;
        color: white !important;
    }

.close-btn {
    float: right !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #000 !important;
    text-shadow: 0 1px 0 #fff !important;
    opacity: .5 !important;
}

.message-primary {
    border-radius: 15px !important;
    border: 1px solid #00434C !important;
    background: rgba(0, 67, 76, 0.2) !important;
    color: #00434C !important;
    padding: 20px;
}

input:focus {
    border-color: var(--btn-primary-color) !important;
}

input, textarea{
    /*border-radius:10px !important;*/
}

.red-important-data {
    color: #D2042D;
}


/*Etiquetas */
.maritimo-type {
    border-radius: 10px;
    width: 140px;
    background: rgba(127, 180, 190, 0.3);
    color: #7FB4BE;
    text-align:center;
    padding:10px;
    font-weight:bold;
}

.aereo-type {
    border-radius: 10px;
    width: 140px;
    background: rgba(80, 108, 147, 0.3);
    color: #506C93;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.terrestre-type {
    border-radius: 10px;
    width: 140px;
    background: rgba(254, 142, 61, 0.3);
    color: #FE8E3D;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.maritimo-mini-type {
    border-radius:50px;
    width: 40px;
    height:40px;
    background: rgba(127, 180, 190, 0.3);
    color: #7FB4BE;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.aereo-mini-type {
    border-radius: 50px;
    width: 40px;
    height: 40px;
    background: rgba(80, 108, 147, 0.3);
    color: #506C93;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.terrestre-mini-type {
    border-radius: 50px;
    width: 40px;
    height: 40px;
    background: rgba(254, 142, 61, 0.3);
    color: #FE8E3D;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.estatus-pendiente {
    border-radius: 10px;
    width: 140px;
    height: 40px;
    background: rgba(137, 143, 152, 0.3);
    color: #898F98;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.estatus-enprogreso {
    border-radius: 10px;
    width: 140px;
    height: 40px;
    background: rgba(0, 148, 181, 0.3);
    color: #0094B5;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.estatus-finalizado {
    border-radius: 10px;
    width: 140px;
    height: 40px;
    background: rgba(27, 94, 32, 0.3);
    color: #1b5e20;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.estatus-cancelado {
    border-radius: 10px;
    width: 140px;
    height: 40px;
    background: rgba(211, 47, 47, 0.3);
    color: #D32F2F;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

.actividades-mini {
    border-radius: 50px;
    width: 40px;
    height: 40px;
    background: rgba(1, 18, 76, 0.2);
    color: #01124C;
    text-align: center;
    padding: 10px;
    font-weight: bold;
}

/*Comentarios*/

.comentname {
    color: #01124C;
    font-weight: bold;
}

/*notificaciones*/

.newnotification::before {
    color: #004C05 !important;
    font-family: "Font Awesome 5 Pro" !important;
    font-weight: 900 !important;
    content: "\f8fa" !important;
}

.notificationicon::before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
    content: "\f0f3";
}

.aspNetDisabled{
    opacity:95% !important;
}

/*Tabs*/
.nav-pills .nav-link {
    color: #00434c !important;
    width: 90px;
    text-align: center;
    font-weight: 600;
}


.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    background-color: rgba(0, 67, 76, 1) !important;
    border-radius:15px !important;
    width:90px;
    text-align:center;
    font-weight:600;
    color: white !important;

}

.nav-pills {
    /*background-color: rgba(0, 67, 76, 0.2) !important;*/
    padding: 10px !important;
    border-radius:20px !important;
}

.inputcolor {
    border-radius: 5px !important;
}

/*Ruta*/

.texto-ciudad {
    color: #9CA5B2;
}

.texto-fecha-llegada {
    color: #605F5F;
}

/*indicadores de catalogos*/

.indicador-catalogo {
    border-radius: 20px !important;
}

    .indicador-catalogo i {
        font-size: 32px !important;
        color: #01124C !important;
    }

    .indicador-catalogo .cantidad-indicador {
        font-size: 28px !important;
        color: #140810 !important;
    }

    .indicador-catalogo .titulo-indicador {
        color: #616569 !important;
    }


.cotizacion-card{
    background:rgba(243,243,245,255) !important;
}

.table-responsive{
    min-height: 200px !important;
}

@media (max-width: 576px) {
    .pt-sm-4, .py-sm-4 {
        padding-top: 1.5rem!important;
    }
}


@media (max-width: 800px) {
    .circuloperfilComentario {
        border-radius: 50% !important;
        background: rgba( 0, 67, 76, 0.2) !important;
        color: var(--primary-color) !important;
        width: 40px !important;
        height: 40px !important;
        font-size: 18px !important;
        align-items: center;
        display: flex;
        justify-content: center;
    }


    .circuloperfilComentario-Image {
        border-radius: 50% !important;
        max-width: 40px !important;
        max-height: 40px !important;
    }
}

.btn.dropdown-toggle.btn-light {
    min-height: 33px !important;
    height: auto;
    display: block;
}