.modal-dialog {
    max-width: 800px;
    }

    .features-btn{
        cursor: pointer;
    }

    .wrap-modal-slider {
    padding: 0 30px;
    opacity: 0;
    transition: all 0.3s;
    }

    .wrap-modal-slider.open {
    opacity: 1;
    }

    .slick-prev:before, .slick-next:before {
    color: red;
    }



    .caption {
        opacity: 0;
        transition-property: opacity, transform;
        transition-duration: .8s;
    }

    .caption:hover {
        opacity: 1;
        transform: scale(1,1);
    }

    .thumbnail {
        position: relative;
        width: 450px;
    }

    .thumbnail img {
        transition: transform .8s;
        transform-origin: 0, 0;
    }

    .thumbnail:hover img {
        transform: scale(1,1);
        overflow: hidden;
    }

    .caption {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        background: rgba(0, 0, 0, .65);
        border: 5px solid #088A68;
    }

    .umbrellas {
        border: 5px solid #FFB037;
    }

    .code {
        border: 5px solid #2E2C2D;
    }

    .canvas {
        border: 5px solid #AD6A3E;
    }

    .cow {
        border: 5px solid #31490B;
    }

    .beer {
        border: 5px solid #792002;
    }

    .dog {
        border: 5px solid #4E68C1;
    }

    .bike {
        border: 5px solid #4DB74F;
    }

    .caption h3,
    .caption p {
        color: #fff;
    }

    #video_youtube{
        width: 80%;
        z-index: 2; 
        margin: 0 auto;
        margin-top:10px !important;
        display: block;            

    }

    .carousel-control-next, .carousel-control-prev
    {
        top:300px !important;
    }

    .image_header
    {
        width: 500px; margin-top:100px !important; margin: auto; z-index: 2;
        display: block;
    }

    .imagen_header3
    {
        width: 80%;
    }

    /* Media Query */
    @media (max-width: 768px) {
        .carousel-item-first
        {
            padding-bottom: 52px;;
        }

        .main-header {
            margin: initial;
        }


        .image_header
        {
            width: 500px; 
            margin-top:100px !important; 
            margin: auto; 
        }

        .image_header::before
        {
            z-index: 9999;
        }

        .main-header:hover {
            text-indent: .1rem;
            letter-spacing: .1rem;
            transform: scale(1.1, 1.1);
        }

        .title {
            line-height: initial;
        }

        .thumbnail
        {
            width: 260px;
        }

        .thumbnail:hover img {
            transform: scale(1, 1);
        }

        .caption:hover {
            transform: scale(1, 1);
        }
        
        #video_youtube{
            width: 100%;
            margin-top: 40px !important;
            z-index: 999;
            display: block;            
        }
    }

    @media (min-width: 769px) and (max-width: 1040px) {
        .main-header:hover {
            text-indent: .1rem;
            letter-spacing: .1rem;
            transform: scale(1.05, 1.05);
        }
        .thumbnail
        {
            width: 400px;
        }
    }

    
    @media (min-width: 520px) and (max-width: 664px) {
        .imagen_header2
        {
            width: 80%;
        }

        .imagen_header3
        {
            width: 80%;
        }
    }

    @media (min-width: 665px) and (max-width: 768px) {
        .imagen_header2
        {
            width: 60%;
        }
        .imagen_header3
        {
            width: 70%;
        }
    }

    @media (min-width: 768px) and (max-width: 810px) {
        .imagen_header2
        {
            width: 70%;
            margin-left: 50px;;
        }
        .imagen_header3
        {
            width: 70%;
            margin-left: 100px;;
        }
    }

    @media (min-width: 810px) and (max-width: 991px) {
        .imagen_header2
        {
            width: 50%;
            margin-left: 50px;;
        }
        .imagen_header3
        {
            width: 50%;
            margin-left: 100px;;
        }
    }

