/*Presentacion*/
/*Presentacion Imagen*/
/*para movil (ya se coloca automaticamente por el display block predecifinido)*/
/*para tablet*/
@media(min-width: 768px){
    .contenido-presentacion{
        display: grid;
        grid-template-columns: 50% 50%;
        grid-template-rows: 1fr;
        justify-content: space-between;
    }
    .contenedor-imgPresentacion{
        grid-row: 1/2;
        height: 100%;
        overflow: hidden;
    }
    .contenedor-imgPresentacion img{
        width: 100%;
        height: 100%;
        object-fit: cover; 
    }
}
@media(min-width: 1024px){
    .contenido-presentacion{
        display: grid;
        grid-template-columns: 50% 25% 25%;
        grid-template-rows: 1fr;
        justify-content: space-between;
    }
    .contenedor-imgPresentacion{
        grid-row: 1/3;
        height: 100%;
        overflow: hidden; 
    }
}
/*Presentacion Nombre y descripcion*/
.contenedor-presentacionNombre{
    grid-column: 2/3;
    padding: 3rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.contenedor-presentacionNombre h2{
    font-size: 4rem;
    color: var(--granate);
    font-weight: bold;
    text-align: center;
}
.contenedor-presentacionNombre h3{
    font-size: 2rem;
    color: var(--granate);
    font-weight: bold;
    text-align: right;
}
.contenedor-presentacionNombre p{
    text-align: center;
}
@media(min-width: 1024px){
    .contenedor-presentacionNombre{
        grid-column: 2/4;
        padding: 6rem;
    }
}
/*Presentacion Habilidades*/
.contenedor-habilidadies{
    background-color: var(--verde3);
    color: var(--blanco);
    padding: 3rem;
}
.contenedor-habilidadies h3{
    text-align: center;
}
.contenedor-habilidadies p{
    margin: 1rem 0;
    text-align: center;
}
@media(min-width: 768px){
    .contenedor-habilidadies p{
        text-align: left;
    }
}
/*Presentacion Informacion personal*/
.contenedor-datos{
    background-color: var(--granate3);
    color: var(--blanco);
    padding: 3rem;
}
.contenedor-datos h3{
    text-align: center;
}
.contenedor-datos p{
    text-align: center;
}
.contenedor-datos a:hover{
    color: var(--verde3);
}
@media(min-width: 768px){
    .contenedor-datos p{
        text-align: left;
    }
}
/*Formaciones*/
.formacion{
    padding: 3rem;
}
.formacion h2{
    font-size: 4rem;
    text-align: center;
}
.formacion h3{
    font-size: 3rem;
    margin: 4rem 0 2rem 0;
    text-align: center;
}
.formacion h4{
    font-size: 2rem;
    text-align: center;
}
.formacion p{
    font-size: 1.8rem;
    text-align: justify;
}
@media(min-width: 1024px){
    .formacion{
        margin: 0 6rem;
    }
}
@media(min-width: 768px){
    .contenido-formacion {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 3rem;
    }
}
/*Video separador*/
.video-separador{
    background-color: #000;
    position: relative;
}
.texto-video{
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;     /*cambiamos la direccion, ahora align-items alinea de izq a der*/
    align-items: center;
    justify-content: center;
}
.texto-video h2{
    color: var(--blanco);
    font-size: 2rem;
    margin: 0.5rem;
}
.texto-video h3{
    color: var(--blanco);
    font-size: 1.6rem;
    margin: 0.5rem;
}
video{
    display: block;
    width: 100%;
    height: 100%;
}
@media(min-width: 768px){
    .texto-video h2{
        font-size: 4rem;
        margin: 0.5rem;
    }
    .texto-video h3{
        font-size: 3rem;
        margin: 0.5rem;
    }
}

/*formacion adicional y otros*/
.formacion-adicional{
    padding: 3rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.formacion-adicional h2{
    font-size: 4rem;
    text-align: center;
}
.formacion-adicional h3{
    font-size: 3rem;
    margin: 4rem 0 2rem 0;
}
.formacion-adicional p{
    text-align: justify;
}
.formacion-adicional div {
    display: inline-block;
}
@media(min-width: 1024px){
    .contenedor-form-adic{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
    .formacion-adicional{
        margin: 0 6rem;
    }
}
/*Otros*/
.otros{
    display: block;
}
.idiomas{
    background-color: var(--granate3);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.instrumentos{
    background-color: var(--verde3);
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.programas{
    background-color: var(--marron);
}
.programas div {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}
.programas div p{
    margin: .8rem auto;
}
.idiomas, .programas, .instrumentos{
    color: var(--blanco);
    padding: 3rem;
}
.otros h3{
    text-align: center;
}
.otros p{
    text-align: center;
}
@media(min-width: 425px){
    .otros{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
    .idiomas{
        grid-column: 1/2;
    }
    .instrumentos{
        grid-column: 2/3;
    }
    .programas{
        grid-column: 1/3;
    }
}
@media(min-width: 768px){
    .otros{
        display: grid;
        grid-template-columns: repeat(4, 1fr);
    }
    .idiomas{
        grid-column: 1/2;
    }
    .instrumentos{
        grid-column: 2/3;
    }
    .programas{
        grid-column: 3/5;
    }
}
/*
@media(min-width: 768px){
    .otros p{
        text-align: left;
    }
}
*/
/*Video separador 2*/
.video-separador{
    background-color: #000;
    position: relative;
}
.video-separador video{
    display: block;
    width: 100%;
    height: 100%;
}
/*porfolio*/
.cont-port-curr {
    display: block;
}
.contenedor-titulo-port-curr {
    width: 70%;
    margin: 10rem auto;
    text-align: center;
}
@media(min-width: 768px){
    .cont-port-curr {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }
}