/* Generales */


/*********************************************************************/
@font-face {
		font-family: 'TGBold';
		src: url('/yoy/css/fonts/eot/Trade_gothic/TradeGothicLTStd-Bold.eot') format('embedded-opentype'),
			 url('/yoy/css/fonts/ttf/Trade_gothic/TradeGothicLTStd-Bold.ttf') format('truetype'),
			 url('/yoy/css/fonts/woff/Trade_gothic/TradeGothicLTStd-Bold.woff') format('woff');
	}		
	
	@font-face {
		font-family: 'TGBoldObl';
		src: url('/yoy/css/fonts/eot/Trade_gothic/TradeGothicLTStd-BoldObl.eot') format('embedded-opentype'),
			 url('/yoy/css/fonts/ttf/Trade_gothic/TradeGothicLTStd-BoldObl.ttf') format('truetype'),
			 url('/yoy/css/fonts/woff/Trade_gothic/TradeGothicLTStd-BoldObl.woff') format('woff');
	}		

	@font-face {
		font-family: 'TGLight';
		src: url('/yoy/css/fonts/eot/Trade_gothic/TradeGothicLTStd-Light.eot') format('embedded-opentype'),
			 url('/yoy/css/fonts/ttf/Trade_gothic/TradeGothicLTStd-Light.ttf') format('truetype'),
			 url('/yoy/css/fonts/woff/Trade_gothic/TradeGothicLTStd-Light.woff') format('woff');
	}
	@font-face {
		font-family: 'BauerBold';
		src: url('/yoy/css/fonts/eot/Bauer_Bodoni/BauerBodoniStd-Bold.eot') format('embedded-opentype'),
			 url('/yoy/css/fonts/ttf/Bauer_Bodoni/BauerBodoniStd-Bold.ttf') format('truetype'),
			 url('/yoy/css/fonts/woff/Bauer_Bodoni/BauerBodoniStd-Bold.woff') format('woff');
	}		

	@font-face {
	font-family: 'BauerBold-Italic';
	src: url('/yoy/css/fonts/eot/Bauer_Bodoni/BauerBodoniStd-BoldItalic.eot') format('embedded-opentype'),
		 url('/yoy/css/fonts/ttf/Bauer_Bodoni/BauerBodoniStd-BoldItalic.ttf') format('truetype'),
		 url('/yoy/css/fonts/woff/Bauer_Bodoni/BauerBodoniStd-BoldItalic.woff') format('woff');
	}		

	@font-face {
	font-family: 'Bauer-Italic';
	src: url('/yoy/css/fonts/eot/Bauer_Bodoni/BauerBodoniStd-Italic.eot') format('embedded-opentype'),
		 url('/yoy/css/fonts/ttf/Bauer_Bodoni/BauerBodoniStd-Italic.ttf') format('truetype'),
		 url('/yoy/css/fonts/woff/Bauer_Bodoni/BauerBodoniStd-Italic.woff') format('woff');
	}

html {
  overflow-y: scroll;
  *overflow-x: hidden;
}

body {
    font-family: TGLight;
    color: #000000;
    font-size: 13px !important;
}

h1 {
    font-family: TGBold;
    color: #000000;
    font-size: 26px !important;
    margin: 6px 10px 12px 0px;
}

.nbsp {
    clear: both;
}

.espacio {
    height: 10px;
    clear: both;
}

.margen {
    height: 20px;
    clear: both;
}

.salto {
    height: 40px;
    clear: both;
}


.container-fluid {
    width: 1333px;
}

.contenedor {
    background-color: white;
    padding: 20px;
}


.titulo {
    font-family: TGBold;
    color: #ed6c23;
    font-size: 26px !important;
    float: left;
    margin: 10px 0px;
    text-transform: uppercase;
}

.sub-titulo {
    font-family: TGBold;
    color: #000000;
    font-size: 18px !important;
    text-transform: uppercase;
}

.forgetpass {
    font-family: TGLight;
    color: #ed6c23;
    font-size: 14px !important;
}

.forgetpass:hover{
	color: #ed6c23;
}


.grupo-botones {
    float: right;
}


.btn-yanbal,
.btn-yanbal:hover,
.btn-yanbal:active,
.btn-yanbal:focus {
    font-family: TGBold;
    border: 2px solid #ed6c23;
    color: #ed6c23;
    padding: 8px 14px;
    border-radius: 20px;
    background-color: #ffffff;
    background-image: none;
    text-transform: uppercase;
    margin: 4px;
    min-width: 130px;
    text-shadow: 0 1px 0 transparent;
}


.btn-yanbal-naranja,
.btn-yanbal-naranja:hover,
.btn-yanbal-naranja:active,
.btn-yanbal-naranja:focus {
    font-family: TGBold;
    border: 2px solid #ed6c23;
    color: #ffffff;
    padding: 8px 14px;
    border-radius: 20px;
    background-color: #ed6c23;
    background-image: none;
    text-transform: uppercase;
    margin: 4px;
    min-width: 130px;
    text-shadow: 0 1px 0 transparent;
}

.botones {
    text-align: center;
}

.volver,
.volver:hover,
.volver:active,
.volver:focus {
    font-family: TGBold, arial;
    background: url(/yoy/images/espanol/eval/icon-volver.svg) no-repeat center left;
    text-transform: uppercase;
    font-size: 11px !important;
    position: absolute;
    z-index: 1;
    color: #ed6c23;
    top: 0;
    left: 0;
    padding: 7px 5px 5px 18px;
    background-size: 12px 12px;
    margin-left: 8px;
	cursor: pointer;
}

label {
    font-family: TGLight;
    color: #999999;
    font-size: 13px !important;
    font-weight: normal;
    display: block;
}


.form-control {

    display: block;
    width: 100%;
    height: 37px;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}


/**************************** Pendientes  ****************************/
.mispendientes {
    padding: 0px;
    border-top: 1px solid #e2e2e2;
}

.mispendientes li {
    list-style: none;
    font-size: 11px;
    border-bottom: 1px solid #e2e2e2;
}

.mispendientes li a {
    color: #666666;
    font-size: 12px;
    padding: 15px 15px 15px 10px;
    display: block;
    background: url(/yoy/images/login/f-derecha.svg) no-repeat right center;
    background-size: 9px;
    background-position: 98%;
    padding-right: 30px;
}


.mispendientes-titulo {
    font-family: TGBold, arial;
    font-size: 15px;
    float: left;
    color: #000000;
    text-transform: uppercase;
    margin: 4px 6px 0 0;
}


.mispendientes-valor { /* abc*/
    font-family: TGLight, arial;
    font-size: 12px;
    float: left;
    color: #ffffff;
    text-align: center;
    padding: 7px;
    border-radius: 50%;
    width: 30px;
    height: 30px;
}

.modal-carga{
	margin-top: 50px;
    height: 100%;
    width: 100%;
    z-index: 1000;
    text-align: center;
    align-items: center;
    position: absolute;
    background-color: white;
}

.ver-item{
	display: block;
}

.ocultar-item{
	display: none;
}

/**************************** Fin Pendientes  ****************************/




/**************************** Home  ****************************/

.masthead-wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    padding: 0px!important;
    /*left: 0px;*/
}

.masthead {
    display: table;
    width: 100%;
    /*height: auto;*/
    height: 100%;
    padding: 200px 0;
    text-align: center;
	background: url("/yoy/images/login/bg-banner.png") no-repeat bottom center scroll;
    background-color: #ffffff;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-position-y: 62px;
}

.masthead .intro-body {
    display: table-cell;
    /*vertical-align: middle;*/
    vertical-align: bottom;
    padding-bottom: 8%;
}

.masthead .intro-body .brand-heading {
    font-family: BauerBold-Italic, arial, helvetica;
    font-size: 27px;
    color: #000000;
    margin: 0px;
    display: inline-block;
    margin: 0px 20px;
    padding: 2px 10px;
    background-color: rgba(255, 255, 255, 0.7);
}

.masthead .intro-body .intro-text {
    font-family: TGBold, arial, helvetica;
    font-size: 24px;
    color: #000000;
    display: inline-block;
    margin: 0px 20px;
    padding: 2px 10px;
    background-color: rgba(255, 255, 255, 0.7);
}

.masthead-degrade {
    bottom: 0;
    position: absolute;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+50,ffffff+100&0.04+0,1+98 */
    background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 98%, rgba(255, 255, 255, 1) 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 98%, rgba(255, 255, 255, 1) 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.53) 50%, rgba(255, 255, 255, 1) 98%, rgba(255, 255, 255, 1) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0affffff', endColorstr='#ffffff', GradientType=0);
    /* IE6-9 */
}


@media (min-width: 768px) {
    .masthead {
        height: 100%;
        padding: 0;
    }
    .masthead .intro-body .brand-heading {
        font-size: 50px !important;
    }
    .masthead .intro-body .intro-text {
        font-size: 45px !important;
    }
}






/**************************** Paneles ****************************/

.panel-datos-bandeja {
    width: 90%;
    float: left;
}

.panel-acciones-bandeja {
    width: 84px;
    float: right;
    margin: 20px 10px 15px 0px;
}


.panel-acciones-bandeja div {}

.panel-acciones-bandeja ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.panel-acciones-bandeja li {
    float: right;
    margin: 0px 10px;
    text-align: center;
}

.panel-col3-muestra {
    display: inherit;
}

.panel-col4-muestra {
    display: inherit;
}

.panel-usuario-foto {
    float: left;
    height: 54px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
}

.panel-usuario-info {
    float: left;
    padding-left: 12px;
}

.panel-label-usuario-bandeja {
    font-size: 13px !important;
    font-weight: normal;
    color: #000000;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background-color: #ffffff;
}


.panel-label-usuario-nombre {
    font-family: TGBold;
    color: #666666;
}

.panel-label-bandeja {
    font-size: 13px !important;
    font-weight: normal;
    color: #999999;
    height: 24px;
    padding: 3px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



.panel-desc-bandeja {
    font-size: 13px !important;
    font-weight: normal;
    color: #000000;
    height: 24px;
    padding: 3px 0px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.panel-api,
.panel-api img {
    height: 47px;
}





.panel-sombras {
    -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, .1);
    box-shadow: 0 0px 5px rgba(0, 0, 0, .1);
}

.panel-estado-rojo {
    border-left: 3px solid #ff0000!important;
}

.panel-estado-verde {
    border-left: 3px solid #55ac00!important;
}

.panel-estado-naranja {
    border-left: 3px solid #f2b81c!important;
}

.panel-estado-gris {
    border-left: 3px solid #b6b6b6!important;
}


.panel-estado-blanco {
    border-left: 3px solid #ffffff!important;
}











/* Ventana Modal */

.modal-full {
    width: 100%;
    margin: 20px auto;
}


.modal-medio {
    width: 70%;
    margin: 20px auto;
}

.modal-chico {
    width: 650px;
    margin: 20px auto;
}

.modal-xschico {
    width: 450px;
    margin: 20px auto;
}


.modal-content {
    border: 0px solid #999;
    border: 0px solid rgba(0, 0, 0, 0);
    border-radius: 0px;
    -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, .2);
    box-shadow: 0 3px 5px rgba(0, 0, 0, .2);
}

.modal-header {
    padding: 25px 25px 10px 25px;
    border-bottom: 0px solid #e5e5e5;
}

.modal-body {
    padding: 25px;
}


.modal-header .close {
    position: absolute;
    top: 0;
    right: 0;
    opacity: 1;
    margin-right: 12px;
    margin-top: 10px;
    font-size: inherit;
    font-weight: normal;
    line-height: normal;
}

.modal-titulo {
    font-family: TGBold;
    color: #000000;
    font-size: 18px !important;
    text-transform: uppercase;
}


.modal-subtitulo {
    font-family: TGBold;
    color: #000000;
    font-size: 15px !important;
    text-transform: uppercase;
}

.modal-footer {
    border-top: 0px solid #e5e5e5;
    padding: 10px 25px 30px 25px;
}

.ico-cerrar-modal {
    height: 12px
}




















/* Acordeones */


/*********************************************************************/

.panel-default>.panel-heading a {
    font-family: TGBold;
    color: #666666;
    font-size: 12px !important;
    display: block;
    text-transform: uppercase;
}

.panel-default>.panel-heading a:hover,
.panel-default>.panel-heading a:active,
.panel-default>.panel-heading a:default,
.panel-default>.panel-heading a:focus {
    text-decoration: none;
}


.panel-default>.panel-heading a:after {
    font-size: 20px !important;
    content: "";
    position: relative;
    top: -4px;
    display: inline-block;
    font-family: 'fontawesome';
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    float: right;
    transition: transform .25s linear;
    -webkit-transition: -webkit-transform .25s linear;
    color: #ed6c23;
}

.panel-default>.panel-heading a[aria-expanded="true"]:after {
    content: "\f107";
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.panel-default>.panel-heading a[aria-expanded="false"]:after {
    content: "\f105";
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}


.panel-group {
    margin-bottom: 10px;
}

.panel-group .panel {
    border-radius: 0px;
    border: 0px solid transparent;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .0);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .0);
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
}

.panel-default>.panel-heading {
    padding: 15px 15px;
    background: transparent;
    border-left: 0px;
    border-right: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}


.panel-body {
    border-bottom: 0px solid #f0f0f0;
    border-top: 0px solid #f0f0f0!important;
}

.panel-default>.panel-heading a span {
    font-family: TGBold;
    color: #999999;
    font-size: 14px !important;
}



.panel-tag-rojo {
    border-left: 3px solid #c50000!important;
}

.panel-tag-verde {
    border-left: 3px solid #55ac00!important;
}

.panel-tag-gris {
    border-left: 3px solid #999999!important;
}













/* Header */


/*********************************************************************/

.datos-usuario {}

.contenido-usuario {
    float: left;
    color: #ffffff;
    font-size: 11px;
    text-align: right;
    margin: 2px 0px 0px 0px;
    height: 30px;
}

.contenido-usuario div.nombre {}

.contenido-usuario a {
    color: #ffffff;
    font-weight: bold;
    text-decoration: underline;
}

.contenido-usuario span.cerrarsesion {}

.foto-usuario {
    position: relative;
    float: right;
    margin-right: 6px;
    margin-top: 2px;
    margin-left: 4px;
}

svg.foto-svg-usuario {
    width: 34px;
    height: 34px;
    background-color: #f8f8f8;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    margin: 0px 8px;
}

svg.foto-svg-usuario image {
    width: 100%;
    height: 100%;
}


.foto-usuario img {
	width: 36px ;
    height: 36px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    margin: 0px 8px;
	border:0px ; 
	object-fit: cover ;
	overflow: hidden ;
}


.foto-usuario a {
    color: #ffffff;
    display: block;
	height: 36px;
}

.foto-usuario:hover a {
    text-decoration: none;
}

.valor-notif-rojo {
    font-family: TGLight;
    background-color: #ff0000;
    font-size: 10px !important;
    color: #ffffff;
    text-align: center;
    padding: 3px;
    height: 19px;
    width: 19px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    vertical-align: middle;
    display: table-cell;
    position: absolute;
    top: 16px;
    right: 0px;
}

.yoyanbal {
    float: right;
    margin: 5px 0px 5px 5px;
    border-left: solid #ee9e71 1px;
    padding: 0 0 0 15px;
}

.yoyanbal img {
    height: 28px;
}

.yanbalnet {
    float: right;
    margin: 1px 0px 7px 0px;
    padding: 0 0 0 15px;
}

.yanbalnet img {
    height: 30px;
}



.login-pregunta {
    margin: 3px 8px 0px 0px;
    padding: 0 0 0 15px;
}

.login-pregunta a img {
    height: 32px;
    width: 32px;
}

.navbar {
    margin-bottom: 0px;
    background-color: #ed6c23;
    padding: 12px 6px;
    background-image: none;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
    box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
    border: 0px;
    z-index: 3;
}

.btn-menu {
    background-image: none;
    background-color: transparent;
    border: 0px;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
    box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
    padding: 8px 12px;
}

.btn-menu:hover,
.btn-menu:active,
.btn-menu:visited,
.btn-menu:focus {
    background-color: transparent;
    border-radius: 0px;
    -webkit-box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
    box-shadow: inset 0 0px 0 rgba(255, 255, 255, .0), 0 0px 0px rgba(0, 0, 0, .0);
}



.btn-full {
    width: 100%;
    min-width: 100%;
}











/* Login */


/*********************************************************************/

.login-content {
    width: 380px;
    margin: 0 auto;
}


.login-content-terminos {
    width: 600px;
    text-align: center;
    margin: 24px auto;
}

.login-logo-yoyanbal {
    width: 100px;
    margin: 15px auto 15px auto;
}


.login-logo-yoyanbal img {
    width: 105px;
}

.login-form-group {
    margin-bottom: 25px;
}



.login-has-usuario {
    position: relative;
}

.login-has-usuario .form-control {
    padding-right: 42.5px;
}


.login-form-control-usuario {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none;
}

.login-form-control-usuario img {
    height: 20px;
}



.login-has-pass {
    position: relative;
}

.login-has-pass .form-control {
    padding-right: 42.5px;
}


.login-form-control-pass {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none;
}

.login-form-control-pass img {
    height: 20px;
}



/* Menu Principal */


/*********************************************************************/

nav.sidebar.navbar.sidebar>.container .navbar-brand,
.navbar>.container-fluid .navbar-brand {
    margin-left: 0px;
}

nav.sidebar .navbar-brand,
nav.sidebar .navbar-header {
    text-align: center;
    width: 100%;
    margin-left: 0px;
}


nav.sidebar .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

nav.sidebar .navbar-collapse,
nav.sidebar .container-fluid {
    padding: 0 0px 0 0px;
}


nav.sidebar {
    width: 250px;
    height: 100%;
    margin-bottom: 0px;
    margin-left: 0px;
    float: left;
}

nav.sidebar li {
    width: 100%;
}


nav.sidebar a {
    font-family: TGBold, arial, helvetica;
    color: #000000;
    padding: 13px 18px;
	font-size: 14px !important;
}

nav.sidebar a img.icono{
    height: 18px;
    margin-right: 6px;
    top: -2px;
    position: relative;
}


nav.sidebar ul li ul {
    padding-left: 20px;
    background-color: red;
}



nav.sidebar ul li ul li a {
    font-family: TGLight, arial, helvetica;
	color: #000000;
    padding: 8px 18px 8px 8px;
    font-size: 13px !important;
    white-space: inherit;
}


nav.sidebar ul li ul li a:hover {
    background: none!important;
}


.sidebar-margin {
    margin: 80px 0px 0px 0px
}

.sidebar-icon {
    font-size: 14px;
    margin-right: 8px;
}

.sidebar-subitem {
    font-family: TGBold, arial, helvetica;
    color: #ed6c23;
    padding: 8px;
}



/* Toggle */


/*********************************************************************/

#wrapper {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled {
    padding-left: 250px;
}

#sidebar-wrapper {
    top: 0;
    z-index: 2;
    position: absolute;
    overflow-x: hidden;
    left: 250px;
    width: 0;
    height: 100%;
    margin-left: -250px;
    overflow-y: auto;
    background: #eeeeee;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled #sidebar-wrapper {
    width: 250px;
}

#page-content-wrapper {
    width: 100%;
    position: absolute;
    padding: 15px;
    left: 0;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -250px;
}
































/* Sidebar */


/*********************************************************************/

.sidebar-nav {
    position: absolute;
    top: 70px;
    width: 250px;
    margin: 16px 0px;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {}

.sidebar-nav li a {
    display: block;
    color: #999999;
    font-family: TGBold;
    color: #000000;
    font-size: 14px !important;
    padding: 10px 20px;
}

.sidebar-nav li a:hover {}

.sidebar-nav li a:active,
.sidebar-nav li a:focus {
    text-decoration: none;
}

.sidebar-nav>.sidebar-brand {
    height: 65px;
    font-size: 18px !important;
    line-height: 60px;
}

.sidebar-nav>.sidebar-brand a {
    color: #999999;
}

.sidebar-nav>.sidebar-brand a:hover {
    color: #fff;
    background: none;
}

/* Colores Texto y Fondo */


/*********************************************************************/

.t-naranja {
    color: #ed6c23;
}

.t-negro {
    color: #000000;
}

.t-gris {
    color: #999999;
}

.t-verde {
    color: #55ac00;
}

.t-rojo {
    color: #ff0000;
}


.b-naranja {
    background-color: #ed6c23;
}

.b-negro {
    background-color: #000000;
}

.b-gris {
    background-color: #999999;
}

.b-verde {
    background-color: #55ac00;
}

.b-rojo {
    background-color: #ff0000;
}


/* Márgenes - Alineaciones */


/*********************************************************************/

.mt0 {
    margin-top: 0px!important;
}

.mb0 {
    margin-bottom: 0px!important;
}


.ml0 {
    margin-left: 0px!important;
}

.mr0 {
    margin-right: 0px!important;
}

.mt5 {
    margin-top: 5px!important;
}

.mb5 {
    margin-bottom: 5px!important;
}


.ml5 {
    margin-left: 5px!important;
}

.mr5 {
    margin-right: 5px!important;
}


.pt0 {
    padding-top: 0px!important;
}

.pb0 {
    padding-bottom: 0px!important;
}


.pl0 {
    padding-left: 0px!important;
}

.pr0 {
    padding-right: 0px!important;
}



.pt5 {
    padding-top: 5px!important;
}

.pb5 {
    padding-bottom: 5px!important;
}


.pl5 {
    padding-left: 5px!important;
}

.pr5 {
    padding-right: 5px!important;
}


.pt10 {
    padding-top: 10px!important;
}

.pb10 {
    padding-bottom: 10px!important;
}


.pl10 {
    padding-left: 10px!important;
}

.pr10 {
    padding-right: 10px!important;
}



.pt15 {
    padding-top: 15px!important;
}

.pb15 {
    padding-bottom: 15px!important;
}


.pl15 {
    padding-left: 15px!important;
}

.pr15 {
    padding-right: 15px!important;
}


.f-left {
    float: left;
}

.f-right {
    float: right;
}



/* Media Querys */


/*********************************************************************/


/*Media máximo estandard */


/*  @media (min-width: 992px) and (max-width: 1199px) { } */


/*Media máximo estandard */

@media (min-width: 992px) and (max-width: 1360px) {

    .container-fluid {
        width: 100%;
    }

    .perfil-foto {
        width: 100%;
    }

    .panel-datos-bandeja {
        width: 88%;
        float: left;
    }
	
	.masthead .intro-body {
        padding-bottom: 8%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {

    .container-fluid {
        width: 100%;
    }
    .margen-inf {
        margin-bottom: 20px;
    }

    .perfil-foto {
        width: 100%;
    }


    .cg-text {
        height: 40px;
    }


    .modal-full {
        width: 100%;
    }


    .modal-medio {
        width: 90%;
    }

    .modal-chico {
        width: 90%;
    }
	
	.modal-xschico {
		width: 90%;
	}

    .panel-datos-bandeja {
        width: 85%;
        float: left;
    }

    .panel-col3-muestra {
        display: none;
    }

    .panel-col4-muestra {
        display: none;
    }
}


@media (min-width: 480px) and (max-width: 767px) {

    .container-fluid {
        width: 100%;
    }

    .contenido-usuario div.nombre {
        display: none;
    }

    .col-sm-4 {
        width: 33.33333333%;
        float: left;
    }
    .perfil-oculta-imagen {
        display: none;
    }

    .margen-inf {
        margin-bottom: 20px;
    }

	.masthead .intro-body {
        padding-bottom: 20%;
    }
	
    .perfil-foto {
        width: 100%;
    }


    .caja-gris {
        width: 100%;
    }

    .caja-gris-no-borde {
        border-left: 1px solid #e2e2e2;
        border-top: 0px;
    }

    .cg-text {
        height: 40px;
    }

    .titulo {
        float: inherit;
        display: block;
        text-align: center;
        padding-bottom: 0px;
    }


    .grupo-botones {
        float: inherit;
        display: block;
        text-align: center;
    }



    .modal-full {
        width: 90%;
    }

    .modal-medio {
        width: 90%;
    }

    .modal-chico {
        width: 90%;
    }

	.modal-xschico {
		width: 90%;
	}
	
    .panel-datos-bandeja {
        width: 90%;
        float: left;
    }

    .panel-col3-muestra {
        display: none;
    }

    .panel-col4-muestra {
        display: none;
    }

}


@media (max-width: 479px) {


    #page-content-wrapper {
        padding-top: 20px;
    }

    .contenido-usuario div.nombre {
        /*display: none;*/
    }
	
	.contenido-usuario span.cerrarsesion {
        display: none;
    }

    .container-fluid {
        padding-right: 0px;
        padding-left: 0px;
        width: 100%;
    }

    .contenedor {
        padding: 0px;
    }

	.navbar {
        padding: 8px 6px;
    }

    .contenido-usuario a {
        /*margin-top: 8px;*/
        display: inline-block;
    }

    .btn {
        /*margin-top: 8px;*/
        display: inline-block;
    }
	
    .btn-yanbal,
    .btn-yanbal:hover,
    .btn-yanbal:active,
    .btn-yanbal:focus {
        min-width: 110px;
    }


    .btn-yanbal-naranja,
    .btn-yanbal-naranja:hover,
    .btn-yanbal-naranja:active,
    .btn-yanbal-naranja:focus {
        min-width: 110px;
    }

    .tabbable-line>.nav-tabs>li {
        font-size: 16px !important;
    }
    .estado dt.texto {
        font-size: 11px;
    }


    .estado dt.numero {
        font-size: 10px !important;
        height: 16px;
        width: 16px;
        padding-top: 1px;
        display: none;
    }

    .ico-desempeno-popover {
        left: 124px;
        top: 11px;
    }

    .ico-solicitudes-popover {
        left: 135px;
        top: 11px;
    }

    .perfil-oculta-imagen {
        display: none;
    }

    .margen-inf {
        margin-bottom: 20px;
    }


    .perfil-foto {
        width: 100%;
    }


    .caja-gris {
        width: 100%;
        padding: 20px 0px;
    }

    .caja-gris-no-borde {
        border-left: 1px solid #e2e2e2;
        border-top: 0px;
    }


    .cg-text {
        height: 40px;
    }
    .pesos-circle {
        width: 90px;
        height: 90px;
    }

    .popover {
        width: 100%
    }


    .pd-mobile {
        padding-right: 0px;
        padding-left: 0px;
    }


    .titulo {
        float: inherit;
        display: block;
        text-align: center;
        padding-bottom: 0px;
        font-size: 22px !important;
    }

    .grupo-botones {
        float: inherit;
        display: block;
        text-align: center;
    }

    .modal-full {
        width: 90%;
    }

    .modal-medio {
        width: 90%;
    }

    .modal-chico {
        width: 90%;
    }

	.modal-xschico {
		width: 90%;
	}
	
    .panel-body-mobile {
        padding: 4px 15px;
    }
    .panel-col-margenes {
        padding: 8px;
    }

    .panel-api,
    .panel-api img {
        height: 40px;
    }


    .panel-label-usuario-bandeja {
        font-size: 12px;
    }

    .panel-label-usuario-bandeja {
        font-size: 12px !important;
    }
    .panel-usuario-foto {
        height: 36px;
    }
    .panel-usuario-info {
        padding-left: 5px;
    }

    .panel-datos-bandeja {
        width: 87%;
        float: left;
    }

    .panel-col3-muestra {
        display: none;
    }
    .panel-col4-muestra {
        display: none;
    }

    .panel-acciones-bandeja {
        width: auto;
        margin: 0px 15px 0px 0px;
    }

    .panel-acciones-bandeja li {
        float: inherit;
        margin: 14px 0px;
        text-align: center;
    }

    .masthead {
		background: url("/yoy/images/login/bg-banner-mobile.png") no-repeat bottom center scroll;
        padding: 80px 0;
        background-position-y: 54px;
		background-size: cover;
    }
    .masthead .intro-body {
        padding-bottom: 0%;
    }



    .modal-usuario-foto {
        height: 50px;
    }
    .modal-usuario-group {
        padding-left: 8px;
        padding-top: 6px;
    }

    .login-content {
        width: 100%;
    }

    .login-content-terminos {
        width: 100%;
        margin: 10px auto 10px auto;
    }
	
}