.cuadro-texto{
	font-size: 16px;
	font-weight: 300;
	color:#fff;
	background: #46648c;
	padding: 20px 60px;
	margin: 20px 0;
}
.cuadro-texto p{
	text-align: justify;
}

.comp-devengo{
	background: #e9f1fd;
	padding: 40px 20px 50px;
	margin-bottom: 20px;
}
.comp-devengo .wrap-comp-devengo{
	max-width: 1020px;
	margin: 0 auto;
	width: 100%;
}
.comp-devengo .devengo{
	margin-bottom: 20px;
}
.comp-devengo .devengo h4{
	color:#cb7017;
	font-size: 14px;
	font-weight: 500;
	width: 18%;
	float: left;
}
.comp-devengo .devengo .valor{
	color:#fff;
	font-size: 18px;
	font-weight: 500;
	width: 82%;
	float: left;
	background: #cb7017;
	text-align: center;
	height: 46px;
	border-radius: 5px;
	padding-top: 10px;
}

.consumido{}
.consumido h4{
	color:#3b68b0;
	font-weight: 500;
	width: 18%;
font-size: 14px;
	float: left;
}
.consumido .valor{
	width: 82%;
	float: left;
}
.consumido .valor .barra-valor{
	background: #4471b5;
	height: 46px;
	border-radius: 5px;
	overflow: hidden;
	margin-bottom: 15px;
}
.consumido .valor .barra-valor span{
	text-align: center;
	color:#fff;
	font-size: 18px;
	font-weight: 500;
	padding-top: 10px;
	display: inline-block;
	height: 100%;
	background: #769fde;
}
.consumido .valor .slide-valor{
	width: 100%;
	height: 4px;
	background: #769fde;
	border-radius: 5px;
	position: relative;
}
.consumido .valor .slide-valor .circulo{
	border-radius: 100%;
	background: #4471b5;
	width: 19px;
	height: 19px;
	position: absolute;
	top:-8px;
}
.consumido .valor .slide-valor span{
	color:#4471b5;
	font-size: 18px;
	font-weight: 500;
	padding-top: 10px;
	display: inline-block;
}


.item-grafico {
width: 1000px;
max-width: 100%;
margin: 0 auto 40px;
}
.item-grafico .grafico{
	min-height: 200px;

}
.item-grafico .grafico img{
	max-width: 100%;
}

.item-grafico .btn-grafico{
	display:block;
}
.item-grafico .btn-grafico a{
	color:#476290;
	font-size: 13px;
	font-weight: 500;
	border: 1px solid #476290;
	border-radius: 5px;
	padding: 10px 20px;
	display: inline-block;
	margin: 30px 0 0 0px;
}

.item-grafico .texto-grafico{
	width: 490px;
	max-width: 100%;
	display: inline-block;
	position: relative;
	z-index: 10;
}
.item-grafico .texto-grafico .head-texto-grafico{
	padding: 10px 20px;
	position: relative;
}
.item-grafico .texto-grafico .head-texto-grafico h4{
	color:#fff;
	font-weight: 600;
	font-size: 16px;
	margin: 0;
	display: inline-block;
}
.item-grafico .texto-grafico .head-texto-grafico span{
	display: inline-block;
	position: absolute;
	right: 10px;
	font-size: 20px;
	cursor: pointer;
	z-index: 10;
}

.item-grafico .texto-grafico .body-texto-grafico{
	padding: 20px;
}
.item-grafico .texto-grafico .body-texto-grafico .item-texto-grafico{}
.item-grafico .texto-grafico .body-texto-grafico .item-texto-grafico label{
	color:#333333;
	font-size: 18px;
	font-weight: bold;
	display: inline-block;
	width: 100px;
	vertical-align: top;
}
.item-grafico .texto-grafico .body-texto-grafico .item-texto-grafico p{
	font-size: 14px;
	line-height: 20px;
	font-weight: 300;
	color:#333333;
	display: inline-block;
	width: 345px;
	vertical-align: top;
	max-width: 100%;
}
section.s-grafico{
	padding: 30px 0;
}
section.bg-celeste{
	background: #e9f1fd;
	padding: 50px 0 20px;
	margin-top: -20px;
}
.item-grafico.item-graf4.p1-graf .texto-grafico {
    float: right;
    margin-top: -100px;
}

.item-grafico.item-graf4 .texto-grafico {
    float: right;
    margin-top: 25px;
}


.t-center{
	text-align: center;
}
/*--AZUL--*/
.item-grafico .texto-grafico.azul .head-texto-grafico{
	background: #4471b5;
}
.item-grafico .texto-grafico.azul .body-texto-grafico{
	background: #e9f1fd;
}
/*--FIN AZUL--*/

/*--ROJO--*/
.item-grafico .texto-grafico.rojo .head-texto-grafico{
	background: #b54444;
}
.item-grafico .texto-grafico.rojo .body-texto-grafico{
	background: #ffe6e6;
}
/*--FIN ROJO--*/

/*--VERDE--*/
.item-grafico .texto-grafico.verde .head-texto-grafico{
	background: #44b579;
}
.item-grafico .texto-grafico.verde .body-texto-grafico{
	background: #ebfff4;
}
/*--FIN VERDE--*/

/*--COLOR 4--*/
.item-grafico .texto-grafico.color4 .head-texto-grafico{
	background: #4447b5;
}
.item-grafico .texto-grafico.color4 .body-texto-grafico{
	background: #ecedff;
}
/*--FIN COLOR 4--*/

/*--COLOR 5--*/
.item-grafico .texto-grafico.color5 .head-texto-grafico{
	background: #a644b5;
}
.item-grafico .texto-grafico.color5 .body-texto-grafico{
	background: #fce5ff;
}
/*--FIN COLOR 5--*/

/*--COLOR 6--*/
.item-grafico .texto-grafico.color6 .head-texto-grafico{
	background: #b54477;
}
.item-grafico .texto-grafico.color6 .body-texto-grafico{
	background: #ffe7f2;
}
/*--FIN COLOR 6--*/

/*--COLOR 7--*/
.item-grafico .texto-grafico.color7 .head-texto-grafico{
	background: #b56144;
}
.item-grafico .texto-grafico.color7 .body-texto-grafico{
	background: #fff3ef;
}
/*--FIN COLOR 7--*/

/*--COLOR 8--*/
.item-grafico .texto-grafico.color8 .head-texto-grafico{
	background: #b5a944;
}
.item-grafico .texto-grafico.color8 .body-texto-grafico{
	background: #fffce1;
}
/*--FIN COLOR 8--*/

/*--COLOR 9--*/
.item-grafico .texto-grafico.color9 .head-texto-grafico{
	background: #4491b5;
}
.item-grafico .texto-grafico.color9 .body-texto-grafico{
	background: #e9f1fd;
}
/*--FIN COLOR 9--*/

.item-grafico.item-graf1 .texto-grafico{
margin-left: 500px;
margin-top: -200px;
top: -100px;
}

.item-grafico.item-graf2 .btn-grafico{
	margin-top: -50px;
}

.item-grafico.item-graf3 .texto-grafico {
    float: right;
    margin-top: -20%;
}

@media (max-width: 1100px) {
	.item-grafico.item-graf3 .texto-grafico {
	    float: left;
	    margin-top: 30px;
	}

	.item-grafico.item-graf4 .texto-grafico {
	    float: none;
	    margin-top: 40px;
	}
}
@media (max-width: 991px) {

	.item-grafico.item-graf1 .texto-grafico {
	    margin-left: 0;
	    margin-top: 40px;
	}

	.item-grafico.item-graf2 .btn-grafico{
		margin-top: 0;
	}
}

@media (max-width: 768px) {}
@media (max-width: 640px) {
	.item-grafico .texto-grafico .body-texto-grafico .item-texto-grafico label{
		width: 100%;
	}
}


.processing {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('../images/ajax.gif') 
                50% 50% 
                no-repeat;
}


body {
     font-family:'Montserrat' !important;
}
body.loading {
    overflow: hidden;   
}

body.loading .processing {
    display: block;
}

.s-grafico {
	padding: 0px !important;
}

h2.titulo {
	padding: 20px;
}

.caja-destacado.azul{
animation: initial !important;
opacity: 1!important;
}
.item-grafico .texto-grafico .body-texto-grafico .item-texto-grafico label {
    font-size: 15px;
}

.simbologia-1{
	margin-bottom: 10px;
}
.simbologia-1 span{
	display: block;
	font-size: 16px;
	color:#222;
	margin-bottom: 6px;
}
.simbologia-1 span:before{
	content:"";
	border-radius: 100%;
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
}
.simbologia-1 span:nth-child(1):before{ background: #1972b9; }
.simbologia-1 span:nth-child(2):before{ background: #d14242; }
.simbologia-1 span:nth-child(3):before{ background: #00b676; }

.item-grafico#item-graf2 .texto-grafico {
    margin-top: -200px;
    float: right;
    top: -100px;
}

.simbologia-2{
	margin-bottom: 10px;
}
.simbologia-2 span{
	display: block;
	font-size: 14px;
	color:#222;
	margin-bottom: 6px;
}
.simbologia-2 span:before{
	content:"";
	border-radius: 100%;
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
}
.simbologia-2 span:nth-child(1):before{ background: #4145ba; }
.simbologia-2 span:nth-child(2):before{ background: #bf42ba; }
.simbologia-2 span:nth-child(3):before{ background: #d14279; }
.simbologia-2 span:nth-child(4):before{ background: #cd6140; }
.simbologia-2 span:nth-child(5):before{ background: #bbab38; }
.simbologia-2 span:nth-child(6):before{ background: #0092b8; }


.simbologia-3{
	margin-top: -180px;
	margin-bottom: 10px;
}
.simbologia-3 span{
	display: block;
	font-size: 14px;
	color:#222;
	margin-bottom: 6px;
}
.simbologia-3 span:before{
	content:"";
	border-radius: 100%;
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
}
.simbologia-3 span:nth-child(1):before{ background: #00b676; }
.simbologia-3 span:nth-child(2):before{ background: #1972b9; }
.simbologia-3 span:nth-child(3):before{ background: #d14242; }
.simbologia-3 span:nth-child(4):before{ background: #bf42ba; }
.simbologia-3 span:nth-child(5):before{ background: #bbab38; }

.simbologia-bar{
	margin-top: -156px;
	margin-bottom: 10px;
}
.simbologia-bar span{
	display: block;
	font-size: 14px;
	color:#222;
	margin-bottom: 6px;
}


.simbologia-bar span:before{
	content:"";
	border-radius: 100%;
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 8px;
}
.barra {
	/*background: #1972b9;*/
	width: 28px;
	margin-right: 7px;
	vertical-align: middle;
	margin-top: 3px;
	height: 14px;
	margin-left: -22px;
	display: inline-block;
}
