#header{
    padding: 30px;
    background: url(images/trama.png), linear-gradient(top, #F04808 10%, #F45A06 90%);
    background: url(images/trama.png), -webkit-linear-gradient(top, #F04808 10%, #F45A06 90%);
    background: url(images/trama.png), -moz-linear-gradient(top, #F04808 10%, #F45A06 90%);
    background: url(images/trama.png), -o-linear-gradient(top, #F04808 10%, #F45A06 90%);
    background: url(images/trama.png), -ms-linear-gradient(top, #F04808 10%, #F45A06 90%);
    transition: all 0.5s;
    /*z-index: 997;*/
    padding: 0px 0;
    height: 230px;
}

.centrar_div{
	padding-left:270px;
}

#main_paisaje{
	
	height: 30.5rem;
    background: url(images/trama.png) center center, transparent linear-gradient(180deg, #FFFFFF 0%, #F97803 70%, #FF9500 100%) 0% 0% no-repeat padding-box;
}
.footer {
	background: transparent linear-gradient(180deg, #FF9500 0%, #FF9500 70%, #FF9500 100%) 0% 0% no-repeat padding-box;
    /*background: linear-gradient(top, #FA8002 10%, #FF9500 60%);
    background: -webkit-linear-gradient(top, #FA8002 10%, #FF9500 60%);
    background: -moz-linear-gradient(top, #FA8002 10%, #FF9500 60%);
    background: -o-linear-gradient(top, #FA8002 10%, #FF9500 60%);
    background: -ms-linear-gradient(top, #FA8002 10%, #FF9500 60%);*/
    color: #FFF;
    font-size: 0.6em;
    padding-left: 1%;
    padding-right: 1%;
    bottom: 0;
    left: 0;
    /*position:estatic;*/
    right: 0;
	height:1rem;
	
}

/*********STYLE MAPA********/
* *********** CUSTOM PROPERTIES *********** */
:root {
    --first-color: #CF2D45;
    --second-color: #1C8E9D;
    --second-color-alt: #1F9BAB;
    --third-color: #d39d09;
    --four-color: #939d1c;
    --five-color: #BF4C32;
    --white-color: #ffffff;
    --black-color: #1D1D1B;
    --gray-color: #999999;
    --silver-color: #ebebeb;
    --light-color: #F4F4F4;
    --light-blue: #40C4FF;
    --text-color: #444444;
    --black-alpha-color: rgba(0, 0, 0, 0.25);
    --font: 'Montserrat', sans-serif;
    --max-width: 1200px;
	
	--amazonas: #3fa2a5;
	--ancash: #cd0053;
	--apurimac: #e20a17;
	--arequipa: #ffc11c;
	--ayacucho: #ff8522;
	--cajamarca: #8e3490;
	--callao: #2c367d;
	--cusco: #247db9;
	--huancavelica: #006368;
	--huanuco: #323f51;
	--ica: #471a90;
	
	--junin: #1db3e1;
	--laLibertad : #5098d5;
	--lambayeque : #55ab68;
	--lima : #38b2b4;
	--limaProvincias : #ee971a;
	--loreto : #c72163;
	--moquegua : #ffc91c;
	--piura : #843885;
	--puno : #006368;
	--sanMartin  : #c72163;
	--ucayali  : #3b5393;
}
.hover-region:hover {
    fill: #CF2D45;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.hover-region-hover {
    fill: #CF2D45 !important;
	background-color: #FFF;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -webkit-transition: 0.3s;
    transition: 0.3s;
}

.content-map{
	border-radius: 15px;
	border-color: var(--first-color);
	width: 88%;
	border-width: 2px;
	border-style: solid;
	padding:15px;
}

.content-obra{
	border-radius: 15px;
	border-color: var(--first-color);
	width: 100%;
	border-width: 2px;
	border-style: solid;
	padding:15px;
	padding-top:20px;
	padding-bottom:20px;
	color: #005457;
	height:400px;
	margin-bottom: 20px;
}

.content-obra-text{
	overflow-y: auto;
	height:310px;
}

.enabled {
    fill: var(--six-color);
    cursor: pointer;
}

.display-tbl {
    display: table; 
	width: 100%;
	border-spacing: 5px;
}
.display-tbl > div { 
    display: table-row; 
	text-align: center;
    vertical-align: middle;
}
.display-tbl > div > div { 
    display: inline-block;
    padding: 5px;
	
}

.map-box-item {
	/*border: 1px solid #C72163;*/
	margin:5px;
	padding: 10px;
	border-radius: 8px;
	width:110px;
	text-align: center;
	cursor:pointer;
	font-size:0.7rem;
	/*background-color:#F6FBFB;
	color:#CD0053;*/
}

/* **************** COMPONENTS ***************** */

/* Mapa SVG */
.mapdiv {
    margin: 0 auto;
    max-width: 350px;
}

.mapdiv path {
    fill: #198754 ;
    stroke: rgb(207, 207, 207);
    stroke-width: 1.14192px;
    transition: fill 0.3s;
}

.mapdiv :hover {
    fill:rgb(204, 22, 22);
    cursor: pointer;
}


.mapdiv2 {
    fill: rgb(166, 166, 166) !important;
    stroke: rgb(207, 207, 207) !important;
    stroke-width: 1.14192px;
    transition: fill 0.3s;
}
@media screen and (max-width: 768px) {
	#header {
		padding: 30px;
		background: url(images/trama.png), linear-gradient(top, #cf2163 10%, #A0329D 90%);
		background: url(images/trama.png), -webkit-linear-gradient(top, #cf2163 10%, #A0329D 90%);
		background: url(images/trama.png), -moz-linear-gradient(top, #cf2163 10%, #A0329D 90%);
		background: url(images/trama.png), -o-linear-gradient(top, #cf2163 10%, #A0329D 90%);
		background: url(images/trama.png), -ms-linear-gradient(top, #cf2163 10%, #A0329D 90%);
		transition: all 0.5s;
		/*z-index: 997;*/
		padding: 0px 0;
		height: auto;
	}
	
	.footer {
		background: linear-gradient(top, #BD2583 10%, #A3319C 60%);
		background: -webkit-linear-gradient(top, #BD2583 10%, #A3319C 60%);
		background: -moz-linear-gradient(top, #BD2583 10%, #A3319C 60%);
		background: -o-linear-gradient(top, #BD2583 10%, #A3319C 60%);
		background: -ms-linear-gradient(top, #BD2583 10%, #A3319C 60%);
		color: #FFF;
		font-size: 0.6em;
		padding-left: 1%;
		padding-right: 1%;
		bottom: 0;
		left: 0;
		position: absolute;
		right: 0;
	}
	
	
}
@media screen and (min-width: 768px) {
	
    .mapdiv {
        max-width: 500px;
	}
}

.hover-region-btn{}
.btn-radio{
	border-radius:15px;
	
}

#btn-ancash{
	color:#FFF; background-color: #CD0053; border: 2px solid #FFFFFF;
}
#btn-ancash:hover{
	color:#CD0053; background-color: #FFF; border: 2px solid #CD0053; font-weight:bolder;
}

#btn-amazonas{
	color:#FFF; background-color: #3FA2A5; border: 2px solid #FFFFFF;
}
#btn-amazonas:hover{
	color:#3FA2A5; background-color: #FFF; border: 2px solid #3FA2A5;font-weight:bolder;
}

#btn-apurimac{
	color:#FFF; background-color: #DA0A16; border: 2px solid #FFFFFF;
}
#btn-apurimac:hover{
	color:#DA0A16; background-color: #FFF; border: 2px solid #DA0A16;font-weight:bolder;
}

#btn-arequipa{
	color:#FFF; background-color: #FFC11C; border: 2px solid #FFFFFF;
}
#btn-arequipa:hover{
	color:#FFC11C; background-color: #FFF; border: 2px solid #FFC11C;font-weight:bolder;
}

#btn-ayacucho{
	color:#FFF; background-color: #FF8522; border: 2px solid #FFFFFF;
}
#btn-ayacucho:hover{
	color:#FF8522; background-color: #FFF; border: 2px solid #FF8522;font-weight:bolder;
}

#btn-cajamarca{
	color:#FFF; background-color: #8e3490; border: 2px solid #FFFFFF;
}
#btn-cajamarca:hover{
	color:#8e3490; background-color: #FFF; border: 2px solid #8e3490;font-weight:bolder;
}

#btn-callao{
	color:#FFF; background-color: #2c367d; border: 2px solid #FFFFFF;
}
#btn-callao:hover{
	color:#2c367d; background-color: #FFF; border: 2px solid #2c367d;font-weight:bolder;
}

#btn-cusco{
	color:#FFF; background-color: #247db9; border: 2px solid #FFFFFF;
}
#btn-cusco:hover{
	color:#247db9; background-color: #FFF; border: 2px solid #247db9;font-weight:bolder;
}

#btn-huanuco{
	color:#FFF; background-color: var(--huanuco); border: 2px solid var(--huanuco);
}
#btn-huanuco:hover{
	color:var(--huanuco); background-color: #FFF; border: 2px solid var(--huanuco);
}

#btn-huancavelica{
	color:#FFF; background-color: var(--huancavelica); border: 2px solid var(--huancavelica);
}
#btn-huancavelica:hover{
	color:var(--huancavelica); background-color: #FFF; border: 2px solid var(--huancavelica);
}

#btn-ica{
	color:#FFF; background-color: #0F6CBD; border: 2px solid #FFFFFF;
}
#btn-ica:hover{
	color:#0F6CBD; background-color: #FFF; border: 2px solid #0F6CBD;font-weight:bolder;
}

#btn-junin{
	color:#FFF; background-color: #1DB3E1; border: 2px solid #FFFFFF;
}
#btn-junin:hover{
	color:#1DB3E1; background-color: #FFF; border: 2px solid #1DB3E1;font-weight:bolder;
}

#btn-laLibertad{
	color:#FFF; background-color: #5098D5; border: 2px solid #FFFFFF;
}
#btn-laLibertad:hover{
	color:#5098D5; background-color: #FFF; border: 2px solid #5098D5;font-weight:bolder;
}

#btn-lambayeque{
	color:#FFF; background-color: #55AB68; border: 2px solid #FFFFFF;
}
#btn-lambayeque:hover{
	color:#55AB68; background-color: #FFF; border: 2px solid #55AB68;font-weight:bolder;
}

#btn-lima{
	color:#FFF; background-color: #38B2B4; border: 2px solid #FFFFFF;
}
#btn-lima:hover{
	color:#38B2B4; background-color: #FFF; border: 2px solid #38B2B4;font-weight:bolder;
}

#btn-limaProvincias{
	color:#FFF; background-color: #EE971A; border: 2px solid #FFFFFF;
}
#btn-limaProvincias:hover{
	color:#EE971A; background-color: #FFF; border: 2px solid #EE971A;font-weight:bolder;
}

#btn-loreto{
	color:#FFF; background-color: #c72163; border: 2px solid #FFFFFF;
}
#btn-loreto:hover{
	color:#c72163; background-color: #FFF; border: 2px solid #c72163; font-weight:bolder;
}

#btn-moquegua{
	color:#FFF; background-color: #ffc91c; border: 2px solid #FFFFFF;
}
#btn-moquegua:hover{
	color:#ffc91c; background-color: #FFF; border: 2px solid #ffc91c;font-weight:bolder;
}

#btn-piura{
	color:#FFF; background-color: #843885; border: 2px solid #FFFFFF;
}
#btn-piura:hover{
	color:#843885; background-color: #FFF; border: 2px solid #843885;font-weight:bolder;
}

#btn-puno{
	color:#FFF; background-color: #006368; border: 2px solid #FFFFFF;
}
#btn-puno:hover{
	color:#006368; background-color: #FFF; border: 2px solid #006368;font-weight:bolder;
}

#btn-sanMartin{
	color:#FFF; background-color: #c72163; border: 2px solid #FFFFFF;
}
#btn-sanMartin:hover{
	color:#c72163; background-color: #FFF; border: 2px solid #c72163;font-weight:bolder;
}

#btn-ucayali{
	color:#FFF; background-color: var(--ucayali); border: 2px solid var(--ucayali);
}
#btn-ucayali:hover{
	color:var(--ucayali); background-color: #FFF; border: 2px solid var(--ucayali);
}
#btn-tumbes{
	color:#FFF; background-color: #55AB68; border: 2px solid #FFFFFF;
}
#btn-tumbes:hover{
	color:#55AB68; background-color: #FFF; border: 2px solid #55AB68; font-weight:bolder;
}
#btn-madrededios{
	color:#FFF; background-color: #7272B1; border: 2px solid #FFFFFF;
}
#btn-madrededios:hover{
	color:#7272B1; background-color: #FFF; border: 2px solid #7272B1; font-weight:bolder;
}