@font-face {
	font-family: 'DinproBold';
	src: url(fonts/DINPro-Bold.otf);
}
@font-face {
	font-family: 'DinproBlack';
	src: url(fonts/dinpro-black.ttf);
}
@font-face {
	font-family: 'Tahoma';
	src: url(fonts/TahomaBold.ttf);
}
@font-face {
	font-family: 'TahomaRegular';
	src: url(fonts/TahomaRegular.ttf);
}
* {
	font-family: 'DinproBold';
}
html, body { height: 100% }
.me-bgcolor { background: rgb(84,49,205) }
.me-style.navbar-light .navbar-toggler { border-color: transparent; }
.me-style.navbar-light .navbar-toggler-icon {
	background-image: url("images/menu.svg")
}
.img-90 { max-width: 90% }
.me-style h2 { 
    color: rgb(245,204,70);
    font-family: 'DinproBlack';
    text-transform: uppercase;
    font-size: 1.5rem;
    width: 100%;
    margin: 10px 0;
}
.item {
	width: 110px;
	height: 110px;
	background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0 auto;
    position: relative;
    min-width: 110px;
    max-width: 110px;
}
.AGS { background-image: url(images/Gob_AGS.png) }
.CDMX { background-image: url(images/Gob_CDMX.png) }
.EDOMEX { background-image: url(images/Gob_EDOMEX.png) }
.COAH { background-image: url(images/Gob_COAH.png) }
.HGO { background-image: url(images/Gob_HGO.png) }
.VER { background-image: url(images/Gob_VER.png) }
.JAL { background-image: url(images/Gob_JAL.png) }
.PUE { background-image: url(images/Gob_PUE.png) }
.GTO { background-image: url(images/Gob_GTO.png) }
.CHIS { background-image: url(images/Gob_CHIS.png) }
.NL { background-image: url(images/Gob_NL.png) }
.MICH { background-image: url(images/Gob_MICH.png) }
.OAX { background-image: url(images/Gob_OAX.png) }
.CHIH { background-image: url(images/Gob_CHIH.png) }
.GRO { background-image: url(images/Gob_GRO.png) }
.TAMPS { background-image: url(images/Gob_TAMPS.png) }
.BC { background-image: url(images/Gob_BC.png) }
.SIN { background-image: url(images/Gob_SIN.png) }
.SON { background-image: url(images/Gob_SON.png) }
.SLP { background-image: url(images/Gob_SLP.png) }
.TAB { background-image: url(images/Gob_TAB.png) }
.YUC { background-image: url(images/Gob_YUC.png) }
.QRO { background-image: url(images/Gob_QRO.png) }
.MOR { background-image: url(images/Gob_MOR.png) }
.DGO { background-image: url(images/Gob_DGO.png) }
.ZAC { background-image: url(images/Gob_ZAC.png) }
.QROO { background-image: url(images/Gob_QROO.png) }
.TLAX { background-image: url(images/Gob_TLAX.png) }
.NAY { background-image: url(images/Gob_NAY.png) }
.CAMP { background-image: url(images/Gob_CAMP.png) }
.COL { background-image: url(images/Gob_COL.png) }
.BCS { background-image: url(images/Gob_BCS.png) }
.PRE { background-image: url(images/AMLO.png) }
.INICIO {
	background-image: url(images/inicio.svg);
	width: 40px;
	height: 40px;
	background-size: contain;
	margin: 30px 0 40px;
}
.pri { background-image: url(images/pri.svg) }
.pan { background-image: url(images/pan.svg) }
.morena { background-image: url(images/morena.svg) }
.mc { background-image: url(images/mc.svg) }
.ind { background-image: url(images/ind.svg) }
.pri-ico {  background-image: url(images/pri.png); }
.morena-ico {  background-image: url(images/morena.png); }
.pan-ico {  background-image: url(images/pan.png); }
.MC-ico {  background-image: url(images/mc.png); }
.ind-ico {  background-image: url(images/ind.png); }
.prd-ico {  background-image: url(images/prd.png); }
.pes-ico {  background-image: url(images/pes.png); }
.verde-ico {  background-image: url(images/verde.png); }
.party-ico { 
    width: 35px;
    height: 35px;
    position: absolute;
    bottom: 3px;
    right: 3px;
    display: inline;
    background-size: cover;
}
.home label { width: 100% }
.home label.percent {
	color: rgb(169,110,220);
    font-weight: 900;
    font-size: 2.5rem;
    font-family: 'DinproBlack';
}
.home label.name,
#navbarNav label.name {
    color: #FFF;
    font-family: Tahoma;
    font-weight: 600;
    font-size: 0.9rem;
    line-height: 1rem;
}
.home label.name.small {
	font-size: 0.4rem;
    top: -15px;
    position: relative;
}
.home label.ver {
	color: rgb(245,204,70);
    font-family: 'DinproBlack';
    text-transform: uppercase;
    font-size: 0.7rem;
    position: relative;
}
.home label.ver::before {
    bottom: 8px;
    content: " ";
    height: 18px;
    position: absolute;
    width: 29px;
    background-image: url(images/angle-down-solid.svg);
    background-repeat: no-repeat;
    background-position: center;
    left: 50%;
    top: 25px;
    transform: translate(-50%, -50%);
}
.purple-strong { color: rgb(85,48,205) !important }
.purple-light { color: rgb(169,110,220) !important }
.countdown strong {
	font-family: 'DinproBlack';
	font-size: 1.1rem;
	text-transform: uppercase;
}
.countdown { margin-bottom: 25px;  }
.bg-white { background-color: #FFF } 
.me-bglight { background-color: rgb(169,110,220) }
.me-bgblack { background-color: #000  }
.insides .name label {
	font-family: 'DinproBlack';
    text-transform: uppercase;
    font-size: 1.5rem;
    width: 100%;
    line-height: 1.5rem;
    text-shadow: 1px 0px 1px #e8e8e8;
}
.insides .name label.small {
	font-size: 0.9rem;
	text-decoration-line: overline;
}
.insides .name label.info-person {
	text-transform: initial;
	font-family: 'Tahoma';
	font-size: 0.65rem;
	line-height: 0.85rem;
	margin: 0;
}

.insides .item {
	border-radius: 50%;
    align-items: center;
    align-self: center;
    align-content: center;
    display: flex;
    justify-content: center;
    color: #FFF;
    font-family: 'DinproBlack';
    font-size: 2rem;
}
.aqua-bgcolor { background-color: rgb(132,222,226) }
.green-bgcolor { background-color: rgb(196,228,73) }
.orange-bgcolor { background-color: rgb(255, 138, 5) }
.insides .text-item {
    font-family: 'Tahoma';
    font-size: 0.6rem;
    line-height: 0.8rem;
    position: relative;
    padding: 10px;
    margin: 15px 0 0 0;
}

@media (min-width: 992px) {
	.insides .name label {
		font-size: 2.2rem;
    	line-height: 2.2rem;
	}
	.insides .name label.info-person {
		font-size: 0.8rem;
		line-height: 1.1rem;
	}
	.insides .text-item {
	    font-size: 0.9rem;
    	line-height: 1rem;
    }
}

.insides .text-item::before {
    bottom: 8px;
    content: " ";
    height: 18px;
    position: absolute;
    width: 29px;
    background-image: url(images/angle-down-solid-purple.svg);
    background-repeat: no-repeat;
    background-position: center;
    left: 50%;
    top: -2px;
    transform: translate(-50%, -50%) rotate(180deg);
    -ms-transform: translate(-50%, -50%) rotate(180deg);
    -webkit-transform: translate(-50%, -50%) rotate(180deg);
}

canvas{
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}
#chartjs-tooltip {
	opacity: 1;
	position: absolute;
	background: rgba(0, 0, 0, .7);
	color: white;
	border-radius: 3px;
	-webkit-transition: all .1s ease;
	transition: all .1s ease;
	pointer-events: none;
	-webkit-transform: translate(-50%, , -140%);
	transform: translate(-50%, -140%);
	min-width: 100px
}

.chartjs-tooltip-key {
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-right: 10px;
}
#chartjs-tooltip::before {
	content: '';
    bottom: -29px;
    left: 50%;
    border-width: 11px 15px 0 15px;
    border-color: rgb(126,237,246) transparent;
    height: 30px;
    width: 30px;
    position: absolute;
    transform: translate(-50%, 0%);
    border-style: solid;
}
#chartjs-tooltip.yellow {
	color: rgb(85,48,205);
    line-height: 0.8rem;
    font-size: 0.7rem !important;
}
#chartjs-tooltip.yellow::before { border-color: rgb(248,208,79) transparent; }
#chartjs-tooltip.orange::before { border-color: rgb(255, 138, 5) transparent; }
#chartjs-tooltip.pri::before { border-color: rgb(62,140,39) transparent; }
#chartjs-tooltip.morena::before { border-color: rgb(163, 0, 24) transparent; }
#chartjs-tooltip.pan::before { border-color: rgb(0, 38, 143) transparent; }
#chartjs-tooltip.ind::before { border-color: rgb(165, 3, 162) transparent; }
#chartjs-tooltip.mc::before { border-color: rgb(240, 149, 54) transparent; }
#chartjs-tooltip.otros::before { border-color: rgb(0, 0, 0) transparent; }
#chartjs-tooltip.nose::before { border-color: rgb(74, 80, 89) transparent; }
#chartjs-tooltip table {
	text-align: center;
	width: 100%;
}

.info-job {}

@media (min-width: 992px) {
	.navbar-brand {
		margin-left: 30px
	}
	.item {
		width: 130px;
	    height: 130px;
	    min-width: 130px;
	    max-width: 130px;
	    font-size: 2.5rem;
	}
	.info-job { 
		margin: 15px 0 20px; 
	    position:relative;
	    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
	}
	.info-job:before, .info-job:after {
		content:"";
	    position:absolute;
	    z-index:-1;
	    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
	    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
	    box-shadow:0 0 20px rgba(0,0,0,0.8);
	    top:10px;
	    bottom:10px;
	    left:0;
	    right:0;
	    -moz-border-radius:100px / 10px;
	    border-radius:100px / 10px;
	}
	.info-job:after {
	    right:10px;
	    left:auto;
	    -webkit-transform:skew(8deg) rotate(3deg);
	       -moz-transform:skew(8deg) rotate(3deg);
	        -ms-transform:skew(8deg) rotate(3deg);
	         -o-transform:skew(8deg) rotate(3deg);
	            transform:skew(8deg) rotate(3deg);
	}
}

.navbar-collapse {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    width: 150px;
    position: absolute;
    background: rgb(67,25,191);
    padding: 10px;
    text-align: center;
}
#navbarNav { margin-left: -150px }
#navbarNav label.name {
    width: 100%;
    text-align: center;
    font-size: 0.7rem;
    margin: 7px 0 30px 0;
    line-height: 0.8rem;
}
#navbarNav a {
	height: auto;
	display: inline-grid;
}
.home .me-bglight label.percent {
    font-size: 1.5rem;
    margin: 10px 0;
}
.gold label { border-bottom: 8px inset gold !important }
.silver label { border-bottom: 8px inset silver !important }
.bronce label { border-bottom: 8px inset #b08d57 !important }
@media (min-width: 992px) {
	.me-style h2 {
		font-size: 2.7rem;
		margin: 10px 0 20px;
		text-shadow: 1px 0px 1px #611a1a;
	}
	.home label.percent {
    	font-size: 3.5rem;
    	text-shadow: 1px 0px 1px #0e0e0e;
	}
	.home .me-bglight label.percent {
		text-shadow: 1px 0px 1px #c3c3c3;
	}
	.home label.name {
		font-size: 1.3rem;
		line-height: 1.5rem;
	}
	.home label.ver {
		font-size: 0.9rem;
	}
	.countdown strong {
		font-size: 1.5rem;
	}
	.navbar-collapse {
		width: 200px;
	}
	.navbar-collapse .item {
		width: 110px;
	    height: 110px;
	    min-width: 110px;
	    max-width: 110px;
	}
	.navbar-collapse .item.INICIO {
		width: 40px;
		height: 40px;
		margin: 52px 0 52px;
	}
	#navbarNav label.name {
	    font-size: 0.9rem;
	    line-height: 1rem;
	    padding: 5px 10px;
	}
	#navbarNav { margin-left: -195px }
}
.countdown.cargos { margin: 0; }
.uppadding {

}
.parties-bar {
	position: relative;
	top: 20px;
	line-height: 55px;
	margin-top: 0 !important;
}
.parties-bar:after {
	background: linear-gradient(to right, #bcbcbc 25%,#ffcd02 25%, #ffcd02 50%, #e84f47 50%, #e84f47 75%, #65c1ac 75%);
    position: absolute;
    content: '';
    height: 20px;
    right: 0;
    left: 0;
    top: -20px;
}
.parties-bar:before {}

.parties a {
	position: relative;
    display: inline-block;
}
.parties a:after {
    border-radius: 50%;
    width: 29px;
    position: absolute;
    text-align: center;
    color: #000;
    bottom: 4px;
    border: 4px rgb(85,48,205);
    right: 2px;
    height: 29px;
    text-shadow: 1px 0px 1px #c3c3c3;
    border-style: outset;
    font-size: 15px;
    line-height: 19px;
}
.parties .gold a:after {
	content: '1';
	background: gold;
	border-color: gold;
}
.parties .silver a:after {
	content: '2';
	background: silver;
	border-color: silver
}
.parties .bronce a:after {
	content: '3';
	background: #b08d57;
	border-color: #b08d57
}
.clearfix {
	margin: 0 0 50px
}