.over-area {
    /*display: inline-block;*/
    /*text-align: center;*/
    /*position: absolute;*/
    /*z-index: 3;*/
    /*!*padding: 10% 8%;*!*/
    /*top: 0;*/
    /*left: 0;*/

    opacity: 0;
    /*background: rgba(0, 0, 0, 0.55);*/
    -webkit-transition: background 0.5s, opacity 0.5s 0.5s;
    -moz-transition: background 0.5s, opacity 0.5s 0.5s;
    -o-transition: background 0.5s, opacity 0.5s 0.5s;
    -ms-transition: background 0.5s, opacity 0.5s 0.5s;
    transition: background 0.5s, opacity 0.5s 0.5s;
}

.over-area:hover {
    opacity: 1;
    -webkit-transition: background 0.25s, opacity 0.25s 0s;
    -moz-transition: background 0.25s, opacity 0.25s 0s;
    -o-transition: background 0.25s, opacity 0.25s 0s;
    -ms-transition: background 0.25s, opacity 0.25s 0s;
    transition: background 0.25s, opacity 0.25s 0s;
    transition-delay: 0.25s;
    -webkit-transition-delay: 1;
}


#videoBG{
    position: absolute;
    width: 100%;
    height: auto;
    /*display: inline-block;*/
    align-items: center;
    justify-content: center;
    overflow: hidden;

}

.video-container{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;

}
 .ol-md-12 .logo{
    font-size: 3.8em;
    line-height: 1.15em;
    text-align: center;
    margin-top: 50px;
}

 .card-background .card-subtitle,
 .back-background .card-subtitle,
 .front-background .card-subtitle {
     color: #FFFFFF;
     margin-top: 5px;
     font-size: 30px;
     font-family: "Roboto Slab", "Times New Roman", serif;
     text-decoration: none;
 }