@CHARSET "UTF-8";

.btn_relative {
    border: 0;
    background: #e9e9e9;
    padding: 0 7px;
    font-size: 16px;
    text-decoration: none;
    line-height: 42px;
    display: inline-block;
    color: #5f5f5f;
    text-transform: uppercase;
    font-weight: 500;
    -webkit-transition: all 400ms linear 0s;
    -o-transition: all 400ms linear 0s;
    transition: all 400ms linear 0s;
    text-align: normal;
    /*margin-left:5px;*/
}

.btn_relative:hover {
    background: #d30059;
    color: #fff;
}

.btn_logout {
    color: #6c757d;
    background-color: transparent;
    border-color: transparent;

    -webkit-transition: all 400ms linear 0s;
    -o-transition: all 400ms linear 0s;
    transition: all 400ms linear 0s;
    /*text-align: normal;*/
}

#dialogo2
{
    position: absolute;
    background-color: transparent !important;
    margin-top: 68% !important;
    border: none !important;
    text-align: center !important;
    z-index: 999;
}

#dialogs .ui-dialog-titlebar{
    display:none;
}

.btn_selected {
    border: 0;
    background: #d30039;
    padding: 0 4px;
    font-size: 16px;
    text-decoration: none;
    line-height: 42px;
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    -webkit-transition: all 400ms linear 0s;
    -o-transition: all 400ms linear 0s;
    transition: all 400ms linear 0s;
    text-align: normal;
}

.btn_selected:hover {
    background: #e9e9e9;
    color: #5f5f5f;
}

.btn_user {
    border: 0;
    background: #b6c0ea;
    padding: 0 7px;
    font-size: 16px;
    text-decoration: none;
    line-height: 42px;
    display: inline-block;
    color: black;
    font-weight: 500;
    -webkit-transition: all 400ms linear 0s;
    -o-transition: all 400ms linear 0s;
    transition: all 400ms linear 0s;

}

.btn_user:hover {
    background: #97E5FF;
    color: #5f5f5f;
}

.active{
    color: rgb(47, 165, 154) !important;
}

#regresar{
    text-decoration: none;
}

#regresar:hover{
    font-size: 20px;
    color: #0293C7;
}

#aqui:hover{
    font-size: 20px;
}


.ui-datatable-header{
    background-color: #8ca7c6 !important;
    font-size: 14px;
}
.ui-paginator-bottom{
    background-color:#8ca7c6 !important;
}

.ui-paginator-top{
    background-color:#d0dae5 !important;/*#0AACE3*/
}

.ui-state-default{
    background-color:#C6D7DE !important;
    font-size: 13px;
}

.ui-widget-content{
    font-size: 12px;

}

.titulo{
    color: black;
    font-size: 20px;
    text-shadow: 3px 2px #d1cecd;
    text-align: center;
}

.titul{
    text-align: center;
    margin-top: 40px;
    font-size: 20px;
    color: white;
}

.menu{
    background: #9fb2c8;
    margin-top: 0px;
}

.footmenu{
    bottom: 0 !important;
    width: 100%;
    text-align: center;
    margin-bottom: 5px !important;
    margin-top: 20px;
}

.ui-panel-titlebar{
    background-color:#0293C3 !important;
}

.ui-paginator-rpp-options{
    font-size: 13px !important;
}

.ui-paginator-current{
    font-size: 13px !important;
}

/*Agregrar animación y pantalla negra al inicio*/
#loader-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}
#loader {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #0293C3;/*#3498db*/
    -webkit-animation: spin 2s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 2s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
    z-index: 1001; /* anything higher than z-index: 1000 of .loader-section */
}

#loader:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    right: 5px;
    bottom: 5px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #97E5FF; /*#e74c3c;*/
    -webkit-animation: spin 3s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

#loader:after {
    content: "";
    position: absolute;
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-top-color: #d30039;/*#f9c922;*/
    -webkit-animation: spin 1.5s linear infinite; /* Chrome, Opera 15+, Safari 5+ */
    animation: spin 1.5s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@-webkit-keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(0deg);  /* IE 9 */
        transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
    }
    100% {
        -webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: rotate(360deg);  /* IE 9 */
        transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
    }
}
/*@keyframes spin {
    0%   {
        -webkit-transform: rotate(0deg);   Chrome, Opera 15+, Safari 3.1+ 
        -ms-transform: rotate(0deg);   IE 9 
        transform: rotate(0deg);   Firefox 16+, IE 10+, Opera 
    }
    100% {
        -webkit-transform: rotate(360deg);   Chrome, Opera 15+, Safari 3.1+ 
        -ms-transform: rotate(360deg);   IE 9 
        transform: rotate(360deg);   Firefox 16+, IE 10+, Opera 
    }
}*/

#loader-wrapper .loader-section {
    position: fixed;
    top: 0;
    width: 51%;
    height: 100%;
    background: #222222;
    z-index: 1000;
}

#loader-wrapper .loader-section.section-left {
    left: 0;
}

#loader-wrapper .loader-section.section-right {
    right: 0;
}

h1 {
    color: #EEEEEE;
}

/* Loaded */
.loaded #loader-wrapper .loader-section.section-left {
    -webkit-transform: translateX(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: translateX(-100%);  /* IE 9 */
    transform: translateX(-100%);  /* Firefox 16+, IE 10+, Opera */
}

.loaded #loader-wrapper .loader-section.section-right {
    -webkit-transform: translateX(100%);  /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: translateX(100%);  /* IE 9 */
    transform: translateX(100%);  /* Firefox 16+, IE 10+, Opera */
}

.loaded #loader {
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.loaded #loader-wrapper .loader-section.section-right,
.loaded #loader-wrapper .loader-section.section-left {

    -webkit-transition: all 0.3s 0.3s ease-out;
    transition: all 0.3s 0.3s ease-out;

    -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}

.loaded #loader-wrapper {
    visibility: hidden;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%);

    -webkit-transition: all 0.3s 0.6s ease-out;
    transition: all 0.3s 0.6s ease-out;

    -webkit-transition: all 0.3s 1s ease-out;
    transition: all 0.3s 1s ease-out;
}

.no-js #loader-wrapper {
    display: none;
}
.no-js h1 {
    color: #222222;
}

body{
    font-family: "Segoe UI", sans-serif;
    font-size:100%;
}
/*  Para el efecto menú */
.backgroundStyle {
    /*    background-color: rgba(164,179,87,1);
        background-color: -moz-linear-gradient(45deg, rgba(164,179,87,1) 33%, rgba(161,176,83,1) 37%, rgba(124,143,23,1) 90%, rgba(117,137,12,1) 100%);
        background: -webkit-gradient(left bottom, right top, color-stop(33%, rgba(164,179,87,1)), color-stop(37%, rgba(161,176,83,1)), color-stop(90%, rgba(124,143,23,1)), color-stop(100%, rgba(117,137,12,1)));
        background: -webkit-linear-gradient(45deg, rgba(164,179,87,1) 33%, rgba(161,176,83,1) 37%, rgba(124,143,23,1) 90%, rgba(117,137,12,1) 100%);
        background: -o-linear-gradient(45deg, rgba(164,179,87,1) 33%, rgba(161,176,83,1) 37%, rgba(124,143,23,1) 90%, rgba(117,137,12,1) 100%);
        background: -ms-linear-gradient(45deg, rgba(164,179,87,1) 33%, rgba(161,176,83,1) 37%, rgba(124,143,23,1) 90%, rgba(117,137,12,1) 100%);
        background: linear-gradient(45deg, rgba(164,179,87,1) 33%, rgba(161,176,83,1) 37%, rgba(124,143,23,1) 90%, rgba(117,137,12,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b357', endColorstr='#75890c', GradientType=1 );*/
    background-color: #343a40 !important;
}

.panelin{
    text-align: center;
    margin: 0 auto;
    box-shadow: 1px 1px 1px #81d4fa;
    width: 300px;
}

.footlab{
    font-size: 14px;
    text-align: center;
    color: white;
}

.formul-selone{
    width: 30% !important;
    font-weight: bold !important;
    font-size: 15px !important;
    float: left;
}

.postalCode{
    width: 70% !important;
    font-weight: bold !important;
    font-size: 15px !important;
}

.a-link{
    width: 8% !important;
    float: right;
    vertical-align: middle !important;
    padding: 6px 0 !important;
    font-weight: bold;
}

.panel-res{
    -moz-border-radius:5px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    background: white !important;
    width: 60%;

}

@media (max-width: 500px) {
    .panelin{
        width: 80% !important;
    }
    .titul{
        font-size: 13px;
        font-weight: bold;
    }
    .footlab{
        font-size: 12px;
    }
    .formul-selone{
        width: 78% !important;
    }
    .postalCode{
        width: 55% !important;
    }
    .a-link{
        width: 23% !important
    }
    .panel-res{
        width: 95%;
    }

    .person_type{
        margin-top: -10px !important;
    }

    .font_select{
        font-size: 8px !important;
    }

    .logo_sen{
        height: 55px !important;
    }

    .barra{
        display: none;
    }
    .btn-cancelar {
        margin-top: 5px;
    }
}

.ui-selectoneradio label{
    cursor: pointer;
    display: inline-block;
    margin: 0 5px 0 2px;
    vertical-align: middle;
}
.ui-chkbox .ui-chkbox-label{
    cursor: pointer;
    margin: 0 5px 0 2px;
    outline: medium none;
    z-index: 1;
    display: inline-block;
    vertical-align: middle;
}
.ui-chkbox .ui-chkbox-box{
    vertical-align: middle;
}

@media (max-width: 900px) {
    .barra{
        display: none;
    }
}

.formdato{
    font-size: 14px !important;
    /*height: 25px !important;*/
    width: 100% !important;
    color: black !important;
    /*    margin-right: 5px;*/
}

.formdatolleno{
    font-size: 14px !important;
    font-weight: bold;
    color: black !important;
    border: 0 !important;
    /*margin: 0 !important;*/
}



.textarea{
    color: black !important;
    font-size: 14px !important;
    height: 50px !important;
}

.pagoDato{
    font-size: 14px !important;
    height: 25px !important;
    color: black !important;
    border: 0 !important;
    margin: 0 !important;
}

.totalText{
    font-size: 16px !important;
    font-weight: bold !important;
    color: black !important;
    border: 0 !important;
    margin: 0 !important;
    height: 30px !important;
}


.noBorders tr, .noBorders td {
    background: none !important;
    border: none !important;
}


.estiloAzul {
    font-size: 18px !important;
    background: #E3F2FD !important;
    border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    color: black !important;
    display: inline-block;
    font-weight: bold;
    line-height: 1.6em;
    margin-right: 15px;
    text-align: center;
    width: 100px;
}

.estiloRojo {
    font-size: 14px !important;
    background: pink !important;
    border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    color: black !important;
    display: inline-block;
    font-weight: bold;
    line-height: 1.6em;
    margin-right: 15px;
    text-align: center;
    width: 200px;

}

.estiloVerde {
    font-size: 16px !important;
    background: #5EA226 !important;
    border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    color: black !important;
    display: inline-block;
    font-weight: bold;
    line-height: 1.6em;
    margin-right: 15px;
    text-align: center;
    width: 100px;
}

.eliminarA{
    color: red !important;
    float: right;
    font-size: 14px !important;
    font-weight: bold !important;
}

.eliminarA:hover{
    font-size: 16px !important;
    text-decoration: underline;
}

.pregseguridad{
    font-size: 15px;
}

.ui-dialog-content{
    font-size: 20px;
}

.ui-icon-alert{
    display: none;
}

.td.ui-widget-content {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

.excel:hover{
    width: 40px;
    height: 40px;
}

.ui-growl {
    right: 20px;
    top: 15%;
}

.formul-row{
    width: 78% !important;
    font-weight: bold !important;
    font-size: 15px !important;
}

.aux{
    text-align: left !important;
}

.person_type{
    margin-top: -15px;
}

.font_select{
    font-size: 13px !important;
}

.white-back{
    background: white !important;
}

.label-row{
    width: 22% !important;
    font-weight: bold;
}

.label-env{
    width: 10% !important;
    font-weight: bold;
    font-size: 10px !important;
    text-align: right;
}

.formul-env{
    width: 100% !important;
    font-weight: bold;
    font-size: 12px !important;
    margin-right: 5px !important;
}

.formul-cant{
    width: 90% !important;
    font-weight: bold;
    font-size: 20px !important;
    margin-right: 5px !important;
    background: #00bfa5 !important;
}

.formul-res{
    width: 90% !important;
    font-weight: bold;
    font-size: 12px !important;
    margin-right: 5px !important;
}

.vd-hidden-column {
    display: none;
    width: 0;
    height: 0;
}

.loginButton{

    height: 40px !important;
    width: 100px !important;
    background-color: #6c757d !important;
    /*background: gray !important;*/
    /*box-shadow:inset 0px 0px 0px 3px #fff;*/
    /*color: white !important;*/
    margin: 25px 0 !important;

}

.btn-default {
    text-shadow: 0 2px 1px rgba(0, 0, 0, .2);
}

.buscar-btn{
    font-size: 18px;
    font-weight: bold;
    background-color: #5DB4FD !important;
    display: inline-block !important;
}

.buscar-btn:hover{
    background-color: #3170A5 !important;/*#3170A5; /*#f24516;*/
}

.pagar-btn{
    background-color: #5DB4FD !important;/*#f4623a;*/
    padding: .5rem 1rem !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 10rem !important;
    text-decoration: none;
}

.pagar-btn:hover {
    background-color: #3170A5 !important;/*#3170A5; /*#f24516;*/
}

.ui-selectonemenu-items{
    font-weight: bold !important;
}

.twenty-five-percent{
    width: 25%;
    text-align: right;
}

.seventy-five-percent{
    width: 75%;
    text-align: left;
}

.thirty-five-percent{
    width: 35%;
    text-align: right;
}

.sixty-five_percent{
    width: 65%;
    text-align: left;
}

.maxsize{
    width: 100% !important;
}

.listaComp.ui-panelgrid .ui-panelgrid-cell {
    padding: 0.2rem !important;
}

.listaComp.ui-dialog-content ui-widget-content{
    padding-bottom: 0px !important;
}

.dialogDetalle{
    width: 35rem !important;
}

.dialogDetalle.ui-panelgrid .ui-panelgrid-cell {
    padding: 0.3rem !important;
}

.dialogDetalle.ui-dialog-content ui-widget-content{
    padding-bottom: 0px !important;
}

.btnComprob{
    background: inherit !important;
    background-color: #5DB4FD !important;
    color: black !important; 
    font-size: 16px !important; 
    
}

.btnComprob:hover{
    background-color: #0293C7 !important;
}
    

.btn_agregar{
    background: inherit !important;
    color: black !important; 
    font-size: 16px !important; 
    padding: 5px 10px !important; 
}

.btn_agregar:hover{
    background-color: #5DB4FD !important;
}

.btn_cerrar{
    background: inherit !important;
    color: black !important; 
    font-size: 16px !important; 
    padding: 5px 10px !important; 
}

.btn_cerrar:hover{
    background-color: tomato !important;
}

.headfoot{
    background: inherit !important;
    background: transparent !important;
}

.panelcontenedor.ui-panel .ui-panel-content{
    background: yellow !important;
}

.headfoot.ui-panel .ui-panel-content{
    background: #18375D !important;
}

body .ui-chkbox .ui-chkbox-box.ui-state-active {
    background: #2196F3 !important;
}

body .ui-radiobutton .ui-radiobutton-box.ui-state-active{
    border-color: #E3F2FD !important;
    background: #2196F3 !important;
}

body .ui-radiobutton .ui-radiobutton-box.ui-state-active.ui-state-hover{
    background: white !important;
}

body .ui-radiobutton .ui-radiobutton-box.ui-state-active .ui-icon-bullet {
    background: #2196F3 !important;
}
    