*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
    text-decoration: none;
    scroll-behavior: smooth;

    font-family: Monse;
}

body{
    overflow-x: hidden;

}


@font-face {
    font-family: Monse;
    src: url(../fonts/Montserrat/Montserrat-VariableFont_wght.ttf);
}
/* ______________________ */


@keyframes show {
    from {
        opacity: 0;
        scale: 30%;
    }

    to {
        opacity: 1;
        scale: 100%;
    }


}

.content-img{
    view-timeline-name: --image;
    view-timeline-axis:  block;

    animation-timeline: --image;
    animation-name: show;

    animation-range: entry 30%  cover 30%;
    animation-fill-mode: both;
}





/* _____________________ */
:root{
    --back-:linear-gradient(90deg, rgb(36, 21, 210) , rgb(116, 1, 218) ) ;
}


/* _____________________ */

.pre-sec{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;

}

.img-bc{
    width: 100%;
    height: 100%;
    background-image:  url(../../img/taller1.jpg);
    background-size: cover;
    background-position: center;   
    border-radius: 20px;

    display: flex;
    align-items: flex-end;
    justify-content: flex-end;

}

.who{
    color: #fff;
    padding-top: 0px;
    background-size: cover;
    background-position: center;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;

}

.who h1{
    /* padding: 0 0 20px ; */
    font-size: 2.4em;
    text-align: center;
    font-weight: 500;

}

.who span{
    text-shadow: rgb(5, 103, 250) 
    0px 0px 5px, rgb(5, 103, 250) 
    0px 0px 10px, rgb(5, 103, 250)  
    0px 0px 15px, rgb(5, 103, 250) 
    0px 0px 25px;
}

.who h3{
    padding:  20px 25px;
    font-weight: 400;
    text-align: center;
    font-size: 1.2em;
    

}
/* _________________ */
.btn-one{
    color: #fff;

    box-shadow: 5px 5px 0 #222;
    padding: 10px  20px;
    margin: 20px;
    background: linear-gradient(90deg, rgb(36, 21, 210) , rgb(116, 1, 218) );
    border-radius: 20px;
    text-decoration: none;

    font-size: 1.4em;
    font-weight: 400;
}



/* ____________________________________ */


.content-present{
    padding: 20px;
    min-height: auto;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background:  linear-gradient(90deg, rgb(13, 7, 71) , rgb(49, 1, 91) );
} 

.info1-title{
    color: #fff;
    font-size: 2em;
    font-weight: 500;
    text-align: center;
    margin: 10px;

}
.present-ord{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.content-info1{
    margin: 10px;
    border: 2px solid #f3f3f3;
    border-radius: 20px;
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
    text-align: center;
}

.content-info1 img{
    width: 70px;
    margin: 5px;
    

    
}

.content-info1 h2{
    font-weight: 500;

}

.content-info1 h3{
    font-weight: 400;
    margin-top: 10px;

}






/* ___________________________________ */

.content-home{
    padding: 10px;
    margin: 10px;
    width: 95vw;
    height: 55vh;
    /* border: 2px solid #444; */
    border-radius: 20px;
    background-color: #fff;
    /* background-color: #5e2424; */
    display: flex;
    align-items: center;
    flex-direction: column;


}

.content-home h2{
    padding-bottom: 10px;
    font-size: 2em;
    font-weight: 600;
    text-align: center;
}



.content-img img{
    border-radius: 20px;
    position: relative;
    object-fit: cover;
    width: 100%;
    height: 77vh;

}


.content-iframe{
    margin: 2px;

    /* border: 3px solid #444; */
    border-radius: 15px;

}



.content-iframe iframe{
    border-radius: 15px;
    width: 80vw;
    height: 40vh;

}

/* .content-img{

} */







/* ____________________________________________________ */


@media only screen and (max-width: 900px) {


    .who{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;

    }


    .btn-one{
        font-size: 1.2em;
    }

}

@media only screen and (max-width: 600px) {
    .who h1{
        font-size: 2.1em;
    }

    .content-home{
        padding: 0;
    }
}

@media only screen and (max-width: 700px) {
    .content-info1{
        width: 80vw;
    }

    .content-img img{
        width: 100%;
        height: 55vh;
    
    }


}


@media only screen and (min-width: 900px) {

    

    .who h1{
        font-size: 3.7em;
    }
    .who h3{
        font-size: 1.5em;
        margin: 0 200px;
    }

    .content-home{
        padding: 10px;
        margin: 10px;
        width: 45vw;
        height: 80vh;

    }
}