.animar {
    opacity: 0;
    transform: translateY(30px);
    transition: 0.8s;
}

.animar.visible {
    opacity: 1;
    transform: translateY(0);
}

.img-hover {
    width: 250px;
    transition: 0.3s;
}

.img-hover:hover {
    transform: scale(1.05);
    box-shadow: 0px 4px 15px rgba(0,0,0,0.3);
}


.media-box {
    display: inline-block;
    margin: 10px;
    text-align: center;
    z-index: -10;
}


.caption {
    font-size: 14px;
    font-style: italic;
    margin-top: 5px;
    color: #444;
}
@media screen and (max-width: 768px) {

  
    /* Titulos */
    h1, h2 {
        padding: 0 10px;
    }

    /* Textos */
    p {
        padding: 0 15px;
        font-size: 16px;
        line-height: 1.5;
    }

    /* Imagenes */
    .img-hover {
        width: 90%;
        max-width: 350px;
        height: auto;
        border-radius: 10px;
    }

    .media-box {
        display: block;
        margin: 20px auto;
        width: 100%;
    }

    /* Videos */
    video {
        width: 95%;
        height: auto;
        border-radius: 10px;
    }

    .centrar {
        text-align: center;
    }

    /* Menu lateral */
    .cont-menu {
        width: 75%;
        max-width: 300px;
    }

    /* Separacion general */
    section {
        padding: 10px;
    }
}