/*STANDARD*/



.card {

    width: 350px;

    height: 350px;

    padding: 10px;

    background-color: #000000;

}







.card-title {

    color: cornsilk;

}







.card-text {

    font-size: medium;

    color: aliceblue;

}







.card-body {

    text-align: center;

}







.card-img-top {

    width: 100%;

    text-align: center;

}







    .card-img-top img {

        width: 100%;

    }











/*NEW*/







.video-single-container {

    margin-bottom:15px;

}







.video-container {

    /*width: 1100px;*/

    /*    height: 480px;*/



    display: flex;

    background: rgb(0 0 0);

}







    .video-container .videos {

        width: 20%;

        padding: 10px 0 10px 10px;

        border: 1px solid silver;

        display: flex;

        flex-direction: column;

        justify-content: space-between;

        overflow-y: auto;

        overflow-x: hidden;

    }







        .video-container .videos .anteprima {

            width: 80%;

            height: 100px;

            margin: 2px;

            object-fit: scale-down;

            cursor: pointer;

            transition: 0.2s;

            border: 1px solid #ffffff;

        }







            .video-container .videos .anteprima:nth-child(1) {

                margin-top: 0;

            }





            .video-container .videos .anteprima:hover,

            .video-container .videos .active {

                transform: scale(1.06);

                border: 2px solid silver;

            }







    .video-container .main-video {

        width: 100%;

        height: 90%;

        padding: 10px;

        border: 1px solid silver;

    }





        .video-container .main-video .anteprima {

            width: 50%;

            height: 50%;

            object-fit: cover;

            border: 3px solid silver;

        }



        .video-container .main-video .video-single-container {

            margin-top:15px;

            width: 75%;

        }





h3,

.video-titolo {

    background-color: #f5f256;

    color: black;

    font-weight: bolder;

    text-transform: capitalize !important;

    padding: 10px;

    border-radius: 10px;

}



.video-descrizione {

    text-align:center;

}



video {

    width:100%;

    border:1px solid silver;

}



.linkEsterno {

    width:50%;

    padding:3px;

    border:2px solid white;

    border-radius:8px;

    font-size:small;

    background-color:#333;

    opacity:0.5;

    float:right;

    margin:3px;

}



.linkEsterno:hover {    

    background-color: black;

    opacity: 1;

}