.territorio {
    color: black;
    padding: 0.5em;
    font-family: CastleT;
    letter-spacing: 5px;
    font-size: 1.5em;
    text-align: right;
}

.logoMapaGp{
    text-align: left;
    height: 20px;
}

.mapaPadding{
    padding-bottom: 5em;
    padding-left: 2.5em;
    padding-right: 2.5em;
}

#container {
    display: flex;
    justify-content: right;
}

.message{
    position: absolute;
    display: none;
    width: 300px;
    top:150px;
    justify-self: start;
}

.textoMapaIzquierda{
    display: block;
    width: 300px;
    height: auto;
    text-align: left;
    font-size: large;
    font-family: CastleT;
}

.submessage{
    display: block;
    width: 300px;
    height: auto;
    /* padding: 0px 30px 10px 30px;
    border-radius: 25px;
    background-color: black;
    color:aliceblue; */
    text-align: center;
    margin-right: 10px;
}


/* @media (min-width: 992px) {
    .territorio {
        color: black;
        padding: 1.5em;
        font-family: CastleT;
        letter-spacing: 5px;
        font-size: 3em;
    }
} */


/* X-Small devices (portrait phones, less than 576px) */
@media (min-width: 0px) {
    .message{
        position: absolute;
        display: none;
        width: 80px;
        top:0px;
        justify-self: start;
    }
    .submessage{
        display: block;
        width: 80px;
        height: auto;
        /* padding: 0px 30px 10px 30px;
        border-radius: 25px;
        background-color: black;
        color:aliceblue; */
        text-align: center;
        margin-right: 10px;
    }
    .mapaPadding{
        padding-bottom: 2em;
        padding-left: 2em;
        padding-right: 2em;
    }
    .textoMapaIzquierda{
        display: block;
        width: 150px;
        height: auto;
        text-align: left;
        font-size: xx-small;
        font-family: CastleT;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 
    .message{
        position: absolute;
        display: none;
        width: 120px;
        top:20px;
        justify-self: start;
    }
    .submessage{
        display: block;
        width: 150px;
        height: auto;
        /* padding: 0px 30px 10px 30px;
        border-radius: 25px;
        background-color: black;
        color:aliceblue; */
        text-align: center;
        margin-right: 10px;
    }
    .mapaPadding{
        padding-bottom: 2em;
        padding-left: 2em;
        padding-right: 2em;
    }
    .textoMapaIzquierda{
        display: block;
        width: 200px;
        height: auto;
        text-align: left;
        font-size: small;
        font-family: CastleT;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    .message{
        position: absolute;
        display: none;
        width: 150px;
        top:20px;
        justify-self: start;
    }
    .submessage{
        display: block;
        width: 150px;
        height: auto;
        /* padding: 0px 30px 10px 30px;
        border-radius: 25px;
        background-color: black;
        color:aliceblue; */
        text-align: center;
        margin-right: 10px;
    }
    .mapaPadding{
        padding-bottom: 2em;
        padding-left: 2em;
        padding-right: 2em;
    }
    .textoMapaIzquierda{
        display: block;
        width: 300px;
        height: auto;
        text-align: left;
        font-size: small;
        font-family: CastleT;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    .territorio {
        color: black;
        padding: 1em;
        font-family: CastleT;
        letter-spacing: 5px;
        font-size: 3em;
    }
    .logoMapaGp{
        text-align: left;
        height: 100px;
    }

    .mapaPadding{
        padding-bottom: 4em;
        padding-left: 4em;
        padding-right: 4em;
    }
     .message{
        position: absolute;
        display: none;
        width: 270px;
        top:20px;
        justify-self: start;
    }
    .submessage{
        display: block;
        width: 230px;
        height: auto;
        /* padding: 0px 30px 10px 30px;
        border-radius: 25px;
        background-color: black;
        color:aliceblue; */
        text-align: center;
        margin-right: 10px;
    }
    .textoMapaIzquierda{
        display: block;
        width: 300px;
        height: auto;
        text-align: left;
        font-size: medium;
        font-family: CastleT;
    }
}

/* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    .message{
        position: absolute;
        display: none;
        width: 270px;
        top:20px;
        justify-self: start;
    }
    .submessage{
        display: block;
        width: 270px;
        height: auto;
        /* padding: 0px 30px 10px 30px;
        border-radius: 25px;
        background-color: black;
        color:aliceblue; */
        text-align: center;
        margin-right: 10px;
    }
    .textoMapaIzquierda{
        display: block;
        width: 300px;
        height: auto;
        text-align: left;
        font-size: large;
        font-family: CastleT;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) { 
    /* .message {
        position: absolute;
        display: none;
        width: 600px;
        height: auto;
        /* padding: 0px 30px 10px 30px; */
        /* border-radius: 25px; */
        /* background-color: #1e1c2b; */
        /* color: #fff;
        top: 0;
        left: 0;
        text-align: center; */
        .message{
            position: absolute;
            display: none;
            width: 270px;
            top:20px;
            justify-self: start;
        }
        .submessage{
            display: block;
            width: 270px;
            height: auto;
            /* padding: 0px 30px 10px 30px;
            border-radius: 25px;
            background-color: black;
            color:aliceblue; */
            text-align: center;
            margin-right: 10px;
        }
        .textoMapaIzquierda{
            display: block;
            width: 300px;
            height: auto;
            text-align: left;
            font-size: large;
            font-family: CastleT;
        }
}


.fondoMapa{
    position: relative;
}

/* .message {
    position: absolute;
    display: none;
    width: 300px;
    height: auto;
    /* padding: 0px 30px 10px 30px; */
    /* border-radius: 25px; */
    /* background-color: #1e1c2b; */
    /* color: #fff;
    top: 0;
    left: 0;
    text-align: center;
}  */

.message img {
    width: 100%;
    height: auto;
    box-sizing: content-box;
}

.para {
    text-align: center;
}

.estado {
    display: block;
    width: 100%;
}

.imagenes {
    display: flex;
    width: 100%;
    /* background-color: #fff; */
    flex-wrap: wrap;
    /* border-radius: 25px; */
}

#container-fluid {
    background-color: rgba(207, 207, 207, 255);
}

#MEX2707 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2711 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2721 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2719 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2718 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2720 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2728 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2715 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2727 {
    fill: rgba(78, 174, 184, 255);
}

#MEX2724 {
    fill: rgba(78, 174, 184, 255);
}