/*======================================
Theme Name: Berlin-Jalousien
Theme URI: https://divicake.com/
Description: The Divi-Child-Theme for Berlin-Jalousien.
Version: 1.0
Author: doqode
Author URI: https://doqode.de
Template: Divi
======================================*/

/** Berlin-Jalousien Galerie (3 Spalten) **/
.doq-gallery .et_pb_gallery_item {
    position: relative;
}

.doq-gallery .et_pb_gallery_item img {
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
}

.doq-gallery .et_pb_gallery_title,
.doq-gallery .et_pb_gallery_caption {
    position: absolute;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /*flex: 2 1 auto;*/
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;


    margin: 0 !important;
    padding: 0 20px;
    left: 0;
    width: 100%;
    opacity: 1;

    -webkit-transition: all .5s ease;
    transition: all .5s ease;
}

.doq-gallery .et_pb_gallery_title {
  top: 0;
  bottom: 70%;
  height: 30%;
  background: rgba(14, 87, 160, 0.90);

  justify-content: center;
}

.doq-gallery .et_pb_gallery_caption {
  top: 30%;
  bottom: 0;
  height: 70%;
  background: rgba(255, 255, 255, .75);

  padding-top: 1em;
  justify-content: flex-start;
}

/*Show the title & caption on hover*/
.doq-gallery .et_pb_gallery_item:hover .et_pb_gallery_title,
.doq-gallery .et_pb_gallery_item:hover .et_pb_gallery_caption {
    height: 50%;
    opacity: 0;
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

/*Add the dividing line and set its animation*/
.doq-gallery .et_pb_gallery_item::before {
    position: absolute;
    z-index: 1;
    top: 30%;
    right: 0;
    left: 0;
    height: 2px;
    content: '';
    opacity: 1;
    background-color: #000000;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s;
}


/*Show the dividing line on hover*/
.doq-gallery .et_pb_gallery_item:hover:before {
    left: 50%;
    right: 50%;
    opacity: 0;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
}

/*Fade the gallery image on hover*/
.doq-gallery .et_pb_gallery_item:hover img {
    opacity: 1;
}

/*Adjust the gallery column widths and margins*/
.et_pb_column .doq-gallery .et_pb_grid_item {
    width: 32.5% !important;
    margin: 0 1% 2% 0 !important;
}

.et_pb_column .doq-gallery .et_pb_grid_item:nth-child(3n) {
    margin-right: 0 !important;
}

@media all and (max-width: 980px) {
    .et_pb_column .doq-gallery .et_pb_grid_item:nth-child(n) {
        width: 32% !important;
        margin: 0 2% 2% 0!important;
    }
    .et_pb_column .doq-gallery .et_pb_grid_item:nth-child(3n) {
        margin-right: 0 !important;
    }
}

@media all and (max-width: 767px) {
    .et_pb_column .doq-gallery .et_pb_grid_item:nth-child(n) {
        width: 49% !important;
        margin: 0 2% 2% 0!important;
    }
    .et_pb_column .doq-gallery .et_pb_grid_item:nth-child(2n) {
        margin-right: 0 !important;
    }
}

@media all and (max-width: 479px) {
    .et_pb_column .doq-gallery .et_pb_grid_item:nth-child(n) {
        width: 100% !important;
    }
}