/* ==========================================================================
   Author's custom styles
   ========================================================================== */


body {
    background-image: url(../img/background1.png);
}

.jumbotron {
    background:transparent;
}

.jumbotron .container img {
    filter: drop-shadow(12px 12px 7px rgba(0,0,0,0.6));
    -webkit-filter: drop-shadow(rgba(0,0,0,0.6) 12px 12px 7px);
}

.panel {
    border-radius: 0px;
    border: none;
}

.panel .panel-heading {
    background-color: #ff9000;
    color: #fff;
    padding: 10px 15px;
    border-radius: 0px;
    border: none;
    background-image: none;
}

.panel .panel-heading .panel-title {
    font-size: 23px;
    background-color: #ff9000;
    color: #fff;
    display: flex;
    text-align: center;
    justify-content: center;
    flex-direction: column;
    height: 25px;
}

.img_video {
    border-bottom: 21px solid #000;
    border-top: 21px solid #000;
}

.fancyVideo img {
    width: 100%;
}

.videos .panel .panel-heading .panel-title {
    font-size: 16px;
}

a.fancyVideo:not(.noButton)::after {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -32px;
    margin-top: -20px;
    opacity: 0.8;
    content: url("../img/play-icon.png");
}

.videos.container {
    margin-top: 20px;
}

.videos a.fancyVideo:not(.noButton)::after {
        transform: scale(.5);
}

@media (min-width: 768px) {
    .videos .fancyVideo img {
        height: 225px;
    }
}
@media (min-width: 992px) {
    .videos .fancyVideo img {
        height: 162px;
    }
}
@media (min-width: 1200px) {
    .videos .fancyVideo img {
        height: 145px;
    }
}


.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}