@CHARSET "UTF-8";

/***************************************************/
/***** ELIMINAR HOVER DE PRIME EN LAYOUT **********/
/*************************************************/

.atlas-layout .ui-state-hover,
.atlas-layout.ui-widget-content .ui-state-hover,
.atlas-layout.ui-widget-header .ui-state-hover,
.atlas-layout.ui-state-focus,
.atlas-layout.ui-widget-content .ui-state-focus,
.atlas-layout.ui-widget-header .ui-state-focus {
    border: 0px solid;
    background: transparent;
    -moz-box-shadow: 0 0 0 #FFF ;
    -webkit-box-shadow: 0 0 0 #FFF ;
    box-shadow: 0 0 0 #FFF ;
}


/*****************************/
/*********** COLOR ****
*****************************/
.atlas-layout a.fa, .atlas-layout a.fa, .atlas-layout a.far{
    color:#FFF;
    text-decoration: none;
    cursor:pointer;
}

.atlas-layout a.fa:hover, .atlas-layout a.fas:hover, .atlas-layout a.far:hover{
    color:#dde4f1;
}

.atlas-layout i.fa, .atlas-layout i.fas, .atlas-layout i.far{
    color:#FFF;
}


/*****************************/
/*********** FOOTER ****
*****************************/
.main-footer {
    position: fixed;
    bottom: 0px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    background: #6689B4;
    border-top: 1px solid #FFF;
    border-bottom: 1px solid #d5deef;
    opacity: 0.9;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
    filter: alpha(opacity = 90);
    padding: 5px;
    z-index: 1000;
}

.main-footer a.fa {
    font-size:17px;
    text-decoration: none;
    margin-right: 7px;
}

.footer-content{
   color:#FFF;
   font-size:11px;
}

.footer-left {
   margin: 2px 0 0 5px;
}

/*****************************/
/*********** SLIDERS ****
*****************************/

.atlas-sliderbar {
    left: auto;
    right: 0px;
    border: 1px #FFF solid !important;
    border-radius: 10px;
    overflow:auto;
    display:block;
}

.atlas-sliderbar.ui-sidebar-top{
    height:auto;
    min-width:320px;
    max-height:80%;
    background: #00517F;

}

.atlas-sliderbar.ui-sidebar-bottom{
    width:80%;
    max-height:80%;
    height:auto;
    min-width:320px;
    direction:rtl;
    color: #666;
}

.atlas-sliderbar.ui-sidebar-bottom > div {
    direction:ltr;
}

a.ui-sidebar-close:before {
    font-size: 20px;
    content: "\f00d";
    font-family: "Font Awesome\ 5 Free";
    color: #FFF;
    font-weight: 900;
}

.ui-sidebar-bottom a.ui-sidebar-close:before{
    color: #666;
}


/*****************************/
/*********** HEADER ****
*****************************/

.header-main {
    display: flex;
    justify-content: space-between;
    width: 100%;
    min-height: 40px;
    max-height: 45px;
    background: #6689B4;
    z-index: 100;
    position:fixed;
}

.header-main .header-left {
    display: inline-flex;
    justify-content: baseline;
}

.header-main .header-center {
    overflow: hidden;
    text-overflow: ellipsis;
}

.header-main .header-right {
    min-width:66px;
}

.header-main i.fa.fa-spinner {
    margin: 10px 23px 1px 23px;
}

.header-main a.fa,
.header-main i.fa {
    font-size: 25px;
    margin: 10px 0;
}

.header-main img {
     margin: 9px;
     min-width: 60px;
}

/*****************************/
/*********** USER-INFO ****
*****************************/
.user-info {
    width: 100% ;
    height: 100% ;
    background: transparent;
}

.user-info span,
.user-info a {
    color: #FFF;
}

.user-info i.fa,
.user-info a.fa,
.user-info i.fas,
.user-info a.fas,
.user-info i.far,
.user-info a.far {
    font-size: 20px;
    margin-right:10px;
}

.title-container h1 {
    font-size: 1.6em;
    font-weight: bold;
    color: #FFF;
    line-height: 1.2em;
    font-weight: bold;
    /*padding: 7px 0px;*/
}
.titulo-responsive h1 {
    color: #FFF;
    text-align: center;
}

.title-container h2 {
    font-size: 1.0em;
    line-height: 1.2em;
    font-weight: normal;
    color: #FFF;
}

/****************************************/
/**************MENU HORIZONTAL *********/
/******************************************/
.menu-horizontal {
    background: transparent;
    border: 0px solid;
    padding: 10px 0 6px 6px;
    overflow: hidden;
    display: inline-flex;
}

.menu-horizontal form {
	margin: 0px;
}

div.atlas-menubar.ui-widget-content{
    border: 0px solid;
}


/********************************************/
/*************VERTICAL *********************/
/******************************************/
.menu-vertical {
    vertical-align: top;
    background: #edf1f3;
    display: table-cell\9;
    min-height: calc(100vh - 32px);
    margin-bottom:25px;
    height: 100%;
    /* padding-bottom: 100px; */
    /* height: calc(100vh + 25px); */
    /* height: 100vh; */
}

.verticalmenu > .ui-tree {
    width:240px;
    position:relative;
}

.verticalmenu {
    margin-top: 49px;
}

/****************************************/
/**************RASTRO Y HELP ****************/
/***************************************/

.barra-rastro {
    display: flex;
    justify-content: space-between;
    padding: 5px 10px 5px 10px;
    flex-wrap: wrap;
    box-sizing: border-box;
    background: #edf1f3;
}

.barra-rastro a.fa,
.barra-rastro span.fa,
.barra-rastro i.fa{
    font-size: 16px;
    margin: 0;
    color: #6689B4;
}

.panel-ayuda {
    padding-left: 0.5em;
    cursor: pointer;
}

.panel-ayuda .botonera-ayuda {
    width: 100%;
    display: block;
    background: #dde4f1;
    text-align: right;
    height: 2em;
}

.panel-ayuda .boton-cerrar {
    padding-right: 5px;
    height: 2em;
    display: block;
    padding-top: 5px;
    cursor: pointer;
}

.panel-ayuda .boton-cerrar img {
    width: 11px;
    padding: 0px 9px;
}

/****************************************/
/**************LOADING ****************/
/***************************************/

.popupStatus i.fa{
    font-size: 30px;
    margin: 10px;
    color:#6689B4;
}


/****************************************/
/**************CONTENIDO ****************/
/***************************************/
.main-body {
    padding: 0px;
    margin: 0px;
    width: 100vm;
    height: 100vm;
    margin: 0px auto;
    display: flex;
    flex-direction: column;
}

.main-content {
    display: flex;
    width: 100vm;
    height: 100vm;
}

.page-wrapper {
    display: block;
    width: -moz-available;
    width: -webkit-fill-available;
    margin-top:45px;
}

.content-wrapper {
    padding: 10px;
    width: -moz-available;
    width: -webkit-fill-available;
    max-width: calc(100vw - 20px);
    margin-bottom: 25px;
}

.mensaje-error .codigo {
    font-size: 1.1rem;
    margin-left: 1em;
}

.content {
    background: #f5f5f5;
    display: inline;
    margin: 5px 0 0 0;
    width: 100%;
}

.botonera-dcha {
    width: 100%;
    background: #dde4f1;
    text-align: right;
    margin: 0px;
    min-height: 1.7em;
    padding-top: 0.3em;
    padding-right: 8px;
}

.botonera-dcha img {
    padding-right: 7px;
}

.botonera-dcha span {
    cursor: pointer;
}
/** IE 10 */
@media all and (-ms-high-contrast: none) , ( -ms-high-contrast : active)
    {
    .titleclass {
        margin-top: 150px;
    }
}

/** Firefox */
@
-moz-document url-prefix () {
    .footer-content .info_izq { padding-left:15px;

}

}
.link-sistema {
    cursor: pointer;
}

.link-sistema :HOVER {
    text-decoration: underline;
}

div#systemInfoTable,
div#systemInfoTable .ui-widget-content {
    border: 0px solid ;
    padding: 0px;
}

.system-info .ui-datalist-item {
    list-style: none;
}

.system-info .ui-datalist-data {
    padding-left: 15px;
}

.info-fecha {
    text-align: left;
    padding: 5px 0px;
}

.info-fecha span {
    font-weight: bold;
}

.info-par, .info-impar {
    word-wrap: break-word;
    padding: 5px;
}

.info-par {
    background-color: #f0f0f0;
}

.info-label {
    width: 24%;
}

.info-value {
    width: 70%;
    padding-left: 10px;
}

.ui-panelgrid-cell-center{
	text-align: center
}

/** IE 10 */
@media all and (-ms-high-contrast: none) , ( -ms-high-contrast : active) {

    .header-main {
        display: flex;
        justify-content: space-between;
    }

    .title {
        display: block;
    }
    .login-content-wrapper {
        padding-top: 0px;
    }
    .login-title {
        margin-top: 0px;
    }

    .page-wrapper {
        width: 100%;
    }

    .content-wrapper {
        width: auto;
        margin-bottom: 45px;
    }

    .menu-vertical {
        margin-bottom: 45px;
    }
}

@media screen and (min-width: 992px) {

	.menu-modal {
	   display: none;
	}

	.atlas-sliderbar.ui-sidebar-top{
        width:600px;
    }
}

@media screen and (max-width: 991px) {

	.fix .main-content {
	   position: relative;
	   top: 0px;
	}

	.modal-menu {
	    width: 100%;
	    height: 100%;
	    position: fixed;
	    z-index: 102;
	    background-color: lightgrey;
	    opacity: .70;
	}

    .page-wrapper {
       padding-left: 10px;
       max-width:100vw !important;
       max-width:100% !important;
    }

    .menu-horizontal {
        display: none;
    }

    .menu-vertical {
        position:fixed;
        width: auto;
        display:none;
        z-index:100;
        margin-top:48px;
        min-height: calc(100vh - 78px);
        overflow-y: auto;
        height: 0%;
    }

    .verticalmenu  {
        margin-top:0px;
        background:#6689B4;
        display:block !important;
    }

    .header-main .header-right {
        min-width:auto;
    }

    .atlas-sliderbar.ui-sidebar-top{
        width:480px;
    }


}

/** Se comenta para pruebas por problemas con el footer y ajuste de alto de menú y contenido
@media screen and (min-width: 481px) {
    .main-content {
        min-height: 500px;
    }
} */

@media screen and (max-width: 480px) {
    .content-wrapper {
        padding: 10px 5px 0px 5px !important;
    }
    .page-wrapper {
        padding-left: 0px;
        max-width:100vw !important;
        max-width:100% !important;
    }

    .header-main .header-right {
        min-width:auto;
    }

    .menu-vertical {
        background: #6689B4;
    }

    .atlas-sliderbar.ui-sidebar-top{
        width:320px;
    }


    .titulo-responsive {
        display: inline-block;
        width: 100%;
    }

    .titulo-responsive span {
        overflow: hidden;
        text-overflow: ellipsis;
        position: absolute;
        margin: 10px 0 0 70px;
        width: 260px;
    }
}



