.nTitulo{
    width: 100%;
    padding: 3% 2% 0 2%;
    color: #002E6C;
    text-align: center;
}
.nTitulo h1, .nTitulo h2{ font-size: 3.6em; }
.cSeccion{
    width: 100%;
    padding: 3% 2% 0 2%;
    background-color: #FFF;
}
.cSecTit{
    width: 30%;
    float: left;        
    color: #002E6C;
    text-align: center;
}
.cSecTit h2{ font-size: 2.6em; }
.cSecTex{
    width: 70%;
    float: left;
    color: #333;
}
.cSecTex p{ font-size: 1.2em; }
@media only screen and (max-width: 960px){ /* 960 hacia abajo */
    .cSecTit{ width: 100%; }
    .cSecTex{ width: 100%; text-align: center;}
}
#nValores{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 2%;
    background-color: #FFF;
    align-items: center;
}
#valIzq{
    width: 70%;
    background-color: #FFF;
    font-size: 1.6em;
}
#valIzq ul{ 
    width: 90%;
    margin: 0 auto;
    list-style: none;
    display: grid;   
    grid: auto / auto auto auto auto;
}
#valIzq ul li{    
    padding: 5px;    
    text-align: left;
    cursor: pointer;
}
#valIzq ul li:hover{
    color: #FFF;
    background-color: crimson;    
}
#valDer{
    width: 30%;
}
#valDer img{
    width: 100%;
    display: block;
    margin: 0 auto;
}
@media screen and (max-width: 980px){
    #valIzq{ width: 80%; font-size: 1.2em;}
    #valDer{ width: 20%;}
}
@media screen and (max-width: 650px){
    #valIzq{ width: 70%; font-size: 1em;}
    #valDer{ width: 30%;}
}
@media screen and (max-width: 620px){
    #valIzq{ width: 100%; font-size: 1em; text-align: center; }
    #valDer{ width: 100%;}
}
@media screen and (max-width: 480px){
    #valIzq ul{    
        grid: auto / auto auto auto;
    }
}
#proIzq, #proDer{
    width: 50%;
    padding: 2%;
    background-color: #FFF;
    float: left;
}
@media screen and (max-width: 480px){
    #proIzq, #proDer{
        width: 100%;
        padding: 4%;
    }
    #proIzq h2, #proDer h2{
        text-align: center;
    }
    #proIzq p, #proDer p{
        text-align: justify;
    }
}
#proIzq{
    border-right: 1px solid #c7c7c7;
}
#proIzq ul, #proDer ul{ list-style: none; }
#proIzq li{
    text-align: right;
    font-size: 1.2em;
    margin-bottom: 10px;
}
#proDer li{
    text-align: left;
    font-size: 1.2em;
    margin-bottom: 10px;
}
#proIzq h2, #proDer h2{
    display: block;
    color: crimson;
    padding-bottom: 5px;
    margin-bottom: 10px;
    margin-top: 10px;
    border-bottom: 1px solid #000;    
}
#proIzq p, #proDer p{
    margin-bottom: 10px;
}