* {
    margin: 0px;
    padding: 0px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Arial;
}

body {
    font-family: Arial;
    margin: 0px;
    padding: 0px;
    text-decoration: none;
    list-style: none;
}
/************************************************************* INICIO ctroCABECERA Grid**********************************************************************/
.ctroCabecera {
    max-width:1200px;
    height:100px;
    margin:0px auto;
    display:grid;
    grid-gap:10px;
    grid-template-rows:100px 40px;
    grid-template-columns:auto auto 1fr 1fr;
    align-items:center;
}
    .ctroCabecera .logo > a > img{
        height:100px;
        padding:6px 0px;
    }
    .ctroCabecera .nombrePrinc > a > h1 {
        font-size: 18px;
        font-weight: 900;
        text-transform: uppercase;
        font-family: Arial;
        line-height: 120%;
        color: #093039;
    }
    .ctroCabecera .nombrePrinc > a > p {
        font-size: 15px;
        font-family: Arial;
        font-style: oblique;
        color: #ffffff;
    }
    .li-buscar{
        display:none;
    }
    .ctroCabecera .buscador {
        grid-column-start: 4;
        grid-column-end: 5;
        min-width:40px;
        display:flex;
        align-items:center;
        justify-content:flex-end;
    }
    .textBox-Buscmenu {
        width: 80%;
        padding:0 15px;
        height:40px;
        line-height:40px;
        border:1px solid #15dac7;
        background-color:#10c9b7;
        font-size:16px;
        color:#035b52;
        outline: none;
        display:block;
        visibility:visible;
    }
        .textBox-Buscmenu::placeholder {
            color: #057b6f;
        }
        .textBox-Buscmenu:hover,
        .textBox-Buscmenu:focus {
            outline: none !important;
            outline-width: 0 !important;
            box-shadow: none;
            -moz-box-shadow: none;
            -webkit-box-shadow: none;
        }
    .imgButton-BuscMenu{
        width:40px;
        height:40px;
        border:1px solid #15dac7;
        border-left:none;
        background-color:#057b6f;
        padding:10px;
        display:block;
        visibility:visible;
    }
        .imgButton-BuscMenu:hover {
            background-color: #4b4c4a;
            transition: background-color 1s ease-out;
        }
    .ctroCabecera .menu {
        height: 40px;
        background-color: #4b4c4a;
        grid-column-start: 1;
        grid-column-end: -1;
        grid-row-start: 2;
        grid-row-end: 3;
    }
/************************************************************* FIN ctroCABECERA Grid**********************************************************************/


/************************************************************* INICIO ctroCUERPO Grid**********************************************************************/
.ctroCuerpo {
    max-width: 1200px;
    margin: 60px auto;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(4,1fr);
    grid-template-rows: auto;
    align-items: center;
    -webkit-transition: all 0.5s 0s ease;
    -moz-transition: all 0.5s 0s ease;
    -o-transition: all 0.5s 0s ease;
    transition: all 0.5s 0s ease;
}
/************************************************************* FIN ctroCUERPO Grid**********************************************************************/

/************************************************************* INICIO ctroPIE Grid**********************************************************************/
.ctroPie {
    max-width: 1200px;
    margin:0px auto;
    padding:40px 5px 100px 5px;
    display: grid;
    grid-gap: 40px;
    grid-template-columns: repeat(3,1fr);
    grid-template-rows: auto;
    align-items:start;
    -webkit-transition: all 0.5s 0s ease;
    -moz-transition: all 0.5s 0s ease;
    -o-transition: all 0.5s 0s ease;
    transition: all 0.5s 0s ease;
}

.ctroPieContIzq {
    grid-column: span 1;
    height: auto;
    display:flex;
    flex-direction:column;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:20px;
}

    .ctroPieContIzq > h3 {
        width:100%;
        font-size: 20px;
        font-weight: 600;
        color: #f6f6f6;
        text-transform: uppercase;
        margin-top:0px;
    }
    .ctroPieContIzq > p {
        width:100%;
        font-size: 16px;
        font-weight: 400;
        color: #f6f6f6;
    }
    .ctroPieContIzq > ul > li {
        list-style: none;
        margin:10px 0px;
    }
    .ctroPieContIzq > ul > li > a{
        color:#ffffff;
        font-size:16px;
    }
    .ctroPieContIzq > ul > li img{
        height:12px;
        margin:0px 10px 0px 0px;
    }
/*.ctroPieContDer {
    grid-column: span 2;
    height: auto;
    display: grid;*/
/*grid-gap: 20px;*/
/*grid-column-gap:40px;
    grid-row-gap:20px;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: repeat(4,auto);
    grid-template-areas:    "txtTitulo          txtTitulo"
                            "txtNombre          txtE-mail"
                            "textNombre         textE-Mail"
                            "txtAsunto          txtPais"
                            "textAsunto         textPais"
                            "txtMensaje         txtMensaje"
                            "textMensaje        textMensaje"
                            "btnEnviar          btnEnviar";
}*/
.ctroPieContDer {
    grid-column: span 2;
    height: auto;
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(2,1fr);
    grid-template-rows: repeat(4,auto);
    place-items: start;
    grid-template-areas:    "txtTitulo          txtTitulo"
                            "textNombre         textE-Mail"
                            "textAsunto         textPais"
                            "textMensaje        textMensaje"
                            "btnEnviar          btnEnviar";
}
.ctroPieContDer .txtTitulo{
    grid-column-start:txtTitulo;
    grid-column-end:txtTitulo;
}
/*.ctroPieContDer .txtNombre{
    grid-area:txtNombre;
}
.ctroPieContDer .txtE-mail{
    grid-area:txtE-mail;
}
.ctroPieContDer .txtAsunto{
    grid-area:txtAsunto;
}
.ctroPieContDer .txtPais{
    grid-area:txtPais;
}
.ctroPieContDer .txtMensaje{
    grid-column-start:txtMensaje;
    grid-column-end:txtMensaje;
}*/
.ctroPieContDer .textNombre{
    grid-area:textNombre;
}
.ctroPieContDer .textE-mail{
    grid-area:textE-mail;
}
.ctroPieContDer .textAsunto{
    grid-area:textAsunto;
}
.ctroPieContDer .textPais{
    grid-area:textPais;
}
.ctroPieContDer .textMensaje{
    grid-column-start:textMensaje;
    grid-column-end:textMensaje;
}
.ctroPieContDer .btnEnviar{
    grid-column-start:btnEnviar;
    grid-column-end:btnEnviar;
}

.txtTitulo {
    font-size: 20px;
    font-weight: 600;
    color: #f6f6f6;
    text-transform: uppercase;
}
/*.txtNombre, .txtE-mail,
.txtAsunto, .txtPais, .txtMensaje {
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
}*/

    .animacion-1:hover,
    .animacion-1:focus {
        opacity: 1;
    }
.textNombre, .textE-Mail,
.textAsunto, .textPais, .textMensaje {
    width: 100%;
    padding: 10px;
    font-size: 15px;
    font-weight: 400;
    border: none;
    background: #3e3e3e;
    /*background: none;*/
    outline: 0;
    color: #fff;
    border-bottom: 1px solid #09ab9b;
}
    .btnEnviar {
        width:100%;
        background: #09ab9b;
        color: #ffffff;
        border: 0;
        text-transform: uppercase;
        padding: 20px;
        cursor: pointer;
    }

    .btnEnviar:hover,
    .btnEnviar:focus {
        background: #057b6f;
        color: #fff;
        transition: background-color 1s ease-out;
        outline: 0;
    }
/************************************************************* FIN ctroPIE Grid**********************************************************************/
@media ( max-width:960px) {
    .ctroCabecera {
        height: 100px;
        margin: 0px auto;
        display: grid;
        grid-gap: 10px;
        grid-template-rows: 100px;
        grid-template-columns: auto auto 1fr 1fr;
        align-items: center;
    }
    .ctroCabecera .menu {
        height: 0px;
    }
    .textBox-Buscmenu,
    .imgButton-BuscMenu{
        display:none;
        visibility:hidden;
    }
    .li-buscar {
        display: block;
        background-color: #057b6f;
    }
    .li-buscar a img{
        margin-left:16px;
    }
    /************************************************************* INICIO ctroCUERPO Grid**********************************************************************/
    .ctroCuerpo {
        margin: 10px auto;
        -webkit-transition: all 0.5s 0s ease;
        -moz-transition: all 0.5s 0s ease;
        -o-transition: all 0.5s 0s ease;
        transition: all 0.5s 0s ease;
    }
    /************************************************************* FIN ctroCUERPO Grid**********************************************************************/
    /************************************************************* INICIO ctroPIE Grid**********************************************************************/
    .ctroPieContIzq{
        grid-column:span 3;
        grid-row:2/3; /*Cambiando de lugar arriba ----> abajo*/

    }
    .ctroPieContDer {
        grid-column: span 3;
        grid-row: 1/2; /*Cambiando de lugar abajo ----> arriba*/
    }
    /************************************************************* INICIO ctroPIE Grid**********************************************************************/
}
@media ( max-width:640px) {
    .ctroPieContDer {
        grid-template-areas:    "txtTitulo          txtTitulo"
                                "textNombre         textNombre"
                                "textE-Mail         textE-Mail"
                                "textAsunto         textPais"
                                "textMensaje        textMensaje"
                                "btnEnviar          btnEnviar";
    }
}