/* PORTADA  :: CONTACTO ----------------------------------------- */
.conPORTADA{
    width: 100%; height: 30vh; margin: 0px;
    display: flex; flex-flow: row wrap;
    background-image: url(/ADD/CECOREY/FND10.jpg);
    background-position: center center; background-repeat: no-repeat;
    background-size: cover; }
    .cpTITULO{
        width: 80%; height: 60px; margin: auto;
        font-size: 90px; text-align: end; color: white; }

/* CONTACTO :: Redes Sociales | Mapas | Mensajes ---------------- */
        /*--------------------- MAPA -------------------- */  
    .cMAPA{
        width: 100%; height: 800px; margin: 80px 0px 20px 0px;
        display: flex; flex-flow: column wrap;
        justify-content: space-between; align-items: center;
        text-align: center; }
        .cmNOMBRE{
            width: 100%; height: 40px; margin: 0px;
            text-align: center; color: rgb(47, 47, 47); }
        .cmTEXTO{
            width: 100%; height: auto; margin: 0px;
            text-align: center; color: rgb(49, 49, 49); }
        .cmVERMAPA{
            width: 100%; height: 600px; margin: 0px; }
        
        /*---------------- REDES SOCIALES --------------- */  
    .cSOCIAL{
        width: 100%; height: 700px; margin: 100px 0px;
        display: flex; flex-flow: row wrap;
        justify-content: center; align-items: center; } 
        .csFONDO{
            width: 100%; height: 500px; 
            display: flex; flex-flow: column wrap;
            justify-content: center; align-items: flex-end;
            background-color: rgba(106, 126, 19, 0.76);}

        .csMENSAJE{
            width: 100%; height: 700px; 
            display: flex; flex-flow: row wrap;
            justify-content: center; align-items: center;
            position: absolute; z-index: 1; }
            .csmCAJA, .csmMENVI{
                width: 700px; height: 700px;  
                display:flex; flex-flow: column wrap;
                justify-content: center; 
                color: white;
                background-color: rgb(56, 71, 42); }
                .csmCAJA-TITULO{
                    width: 90%; height: auto; margin:  0px auto 0px auto ; 
                    display: flex; flex-flow: column wrap;
                    color: white; text-align: center; }
                .csmCAJA-SUBTITULO{
                    width: 70%; height: auto; margin: 5px auto ; 
                    display: flex; flex-flow: column wrap;
                    color: white; }
                .csmCAJA-DATO{
                    width: 70%; height: 25px; margin: 0px auto 30px auto ; 
                    display: flex; flex-flow: column wrap;
                    font-family: 'Be Vietnam', sans-serif; 
                    font-style: normal; font-weight: normal; font-size:13px;
                    color: rgb(36, 36, 36);
                    background-color: rgb(251, 251, 251); }
                .csmCAJA-BOTON{
                    width: 70%; height: 30px; margin: 0px auto 20px auto ;
                    border: 0px; border-radius: 9px; 
                    font-family: 'Be Vietnam', sans-serif; 
                    font-style: normal; font-weight: normal; font-size:16px;
                    color: rgb(255, 255, 255); text-align: center;
                    background-color:  rgb(37, 58, 18);
                    cursor: pointer; }
                    .csmCAJA-BOTON:hover{ background-color: rgba(106, 126, 19, 0.76); box-shadow: 2px 3px 4px rgb(47, 47, 47);}
            
            .csmMENVI{ 
                display:none; flex-flow: row wrap; 
                justify-content: center; align-items: center; background-color: rgb(25, 79, 122);}
                .csmMENVI-porta{
                    width: 390px; height: 390px; padding: 40px;
                    display: flex; flex-flow: column wrap;
                    justify-content:center; align-items: center;     }


            .csmREDES{
                width: 40%; height: 100%; margin-left: 20px;
                display: flex; flex-flow: column wrap;
                justify-content: center; align-items: flex-start;
                color: white; }
                .csmREDES-titulo{
                    width: 100%; height: auto; margin: 0; color: white; }
                .csmREDES-ICONOS{
                    width: 300px; height:auto; margin: 0px;
                    display: flex; flex-flow: row wrap;    }
                    .csmREDES-facebook{
                        width: 100px; height: 100px; margin: auto;
                        display: flex; flex-flow: column wrap;
                        background-image: url(/ADD/B1ONE/facebook/icoFACE-CirculoSolido-Blanco.png);
                        background-repeat: no-repeat; background-size: 50%;
                        background-position: center center; 
                        cursor: pointer;                }
                        .csmREDES-facebook:hover{
                            transition: 0.3s;
                            background-image: url(/ADD/B1ONE/facebook/icoFACE-CirculoSolido-Azul.png);
                            background-repeat: no-repeat; background-size: 90%; }
                    .csmREDES-whatsapp{
                        width: 100px; height: 100px; margin: auto;
                        display: flex; flex-flow: column wrap;
                        background-image: url(/ADD/B1ONE/whatsapp/icoWA-CirculoSolido-Blanco.png);
                        background-repeat: no-repeat; background-size: 50%;
                        background-position: center center;  
                        cursor: pointer;                 }
                        .csmREDES-whatsapp:hover{
                            transition: 0.3s;
                            background-image: url(/ADD/B1ONE/whatsapp/icoWA-CirculoSolido-Verde.png); 
                            background-repeat: no-repeat; background-size: 90%; }
                    .csmREDES-youtube{
                        width: 100px; height: 100px; margin: auto;
                        display: flex; flex-flow: column wrap;
                        background-image: url(/ADD/B1ONE/youtube/icoYOUTUBE-CirculoSolido-Blanco.png);
                        background-repeat: no-repeat; background-size: 50%;
                        background-position: center center;        
                        cursor: pointer;           }
                        .csmREDES-youtube:hover{
                            transition: 0.3s;
                            background-image: url(/ADD/B1ONE/youtube/icoYOUTUBE-CirculoSolido-Rojo.png);
                            background-repeat: no-repeat; background-size: 90%; }

/* Recursos adicionales */
.conB1-LINEA{
    width: 80%; height: 1px; margin:8px 0px;
    background-color: rgb(255, 255, 255);}