/********************************************************************************
*                             BEM Methodology                                   *
*  [$] Block = block                                                            *
*  [$] Element = block__element                                                 *
*  [$] Modifier = block__element--modifier                                      *
*                                                                               *
*                             gallery Component                                 *
*                                                                               *
*  [^]gihe = gallery Image Hover effet                                          *                                                             
*  [^]gtoi = gallery Text On Image                                              *
*  [^]fi = Filter Items                                                         *
*                                                                               *
*                                                                               *
*                                                                               *
*                                                                               *
********************************************************************************/


/* [$] Element *****************************************/

    .box-gallery-shadow {
        box-shadow: 0 3px 6px rgba(0,0,0, 0.16), 0 3px 6px rgba(0,0,0, 0.23);
    }
    
    .square-boxe .gallery__caption--text-under-image {
        padding-top: 0;
    }
    
    figure > figcaption {
        display: block
    }
    
    figcaption {
        display: grid;
        display: -ms-grid;
        -ms-grid-columns: 100%;
    }
    
    .gallery__column figure {
        max-height: 250px;
        min-height: 100px;
        overflow: hidden;
        position: relative;
    }
    
    .gallery__column figure > div img {
        display: block;
        width: 100%;
        height: auto;
    }
    
    .gallery__column{
        padding-right:30px;
        padding-left:30px;
    }
        
    .gallery__caption > div {
        font-size: 1.1em;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        width: 90%;
        overflow:hidden;
    }
    
    .filter-tag.selected {
       /* background-color: #f26522;*/
        color: #f26522;
    }
    
    /* [^]gtoi */
        
        @media (min-width:1200px){
            .gallery__container .gallery__column.col-lg-1:nth-child(12n+1){clear:left;}
            .gallery__container .gallery__column.col-lg-2:nth-child(6n+1){clear:left;}
            .gallery__container .gallery__column.col-lg-3:nth-child(4n+1){clear:left;}
            .gallery__container .gallery__column.col-lg-4:nth-child(3n+1){clear:left;}
            .gallery__container .gallery__column.col-lg-6:nth-child(odd){clear:left;}
        }
        @media (min-width:992px){
            .gallery__container .gallery__column.col-md-1:not(.hidden):nth-child(12n+1){clear:left;}
            .gallery__container .gallery__column.col-md-2:not(.hidden):nth-child(6n+1){clear:left;}
            .gallery__container .gallery__column.col-md-3:not(.hidden):nth-child(4n+1){clear:left;}
            .gallery__container .gallery__column.col-md-4:not(.hidden):nth-child(3n+1){clear:left;}
            .gallery__container .gallery__column.col-md-6:not(.hidden):nth-child(odd){clear:left;}
        }
        @media (min-width:768px) and (max-width:991px){
            .gallery__container .gallery__column.col-sm-1:nth-child(12n+1){clear:left;}
            .gallery__container .gallery__column.col-sm-2:nth-child(6n+1){clear:left;}
            .gallery__container .gallery__column.col-sm-3:nth-child(4n+1){clear:left;}
            .gallery__container .gallery__column.col-sm-4:nth-child(3n+1){clear:left;}
            .gallery__container .gallery__column.col-sm-6:nth-child(odd){clear:left;}
        }
        @media (max-width:767px){
            .gallery__container .gallery__column.col-xs-1:nth-child(12n+1){clear:left;}
            .gallery__container .gallery__column.col-xs-2:nth-child(6n+1){clear:left;}
            .gallery__container .gallery__column.col-xs-3:nth-child(4n+1){clear:left;}
            .gallery__container .gallery__column.col-xs-4:nth-child(3n+1){clear:left;}
            .gallery__container .gallery__column.col-xs-6:nth-child(odd){clear:left;}
        }  
        
        
        .gallery__column-clear-left{clear:left !important;}
        .gallery__column-clear-none{clear:none !important;}

    /* end of [^]gtoi */


  /* [^]gt */
    
    .gallery__title{
      text-align: center;
    }
    
  /* end of [^]bt */

  /* [^]gihe */
      
    /* Overlay with margin */
    .gallery__image-hover-effect--overlay {
        position: absolute;
        top: 5%;
        bottom: 0;
        left: 2.5%;
        right: 0;
        height: 90%;
        width: 95%;
        opacity: 0;
        transition: .5s ease;
        overflow: hidden;
    }
    
    /* Overlay without margin
    .gallery__image-hover-effect--overlay {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        height: 100%;
        width: 100%;
        opacity: 0;
        transition: .5s ease;
        overflow: hidden;
    }
    */
    
    /*.gallery__image-hover-effect .gallery__column {
        cursor:pointer;
    }*/
    
    .gallery__image-hover-effect .gallery__column:hover .gallery__image-hover-effect--overlay {
        opacity: 1;
    }
    
    
    
  /* end of [^]gihe */
     
  
     /* [^]fi */
        
/* [$] Block ****************************************/ 

    .filter-items .navbar-default .navbar-nav>li>a {
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 1.5em;
        font-weight: 500;
    }
    
    .filter-items .navbar-header p{
        padding-top: 20px;
        padding-bottom: 20px;
        font-size: 1.5em;
        font-weight: 500; 
    }
    
    /*.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover{
        color: white; 
        background-color: #F26115;
        background:#F26115;
    }*/
    
    .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
        color: inherit;
        background-color: transparent;
    }
    
    .filter-items .navbar{
        border-radius: 0px;
    } 
    .filter-items .navbar-default .navbar-nav>li:focus, .filter-items .navbar-default .navbar-nav>li:hover,
    .filter-items .navbar-default .navbar-nav>li.selected{
        background-color: white;
        background:white;
        color: #F26115;
    }
    
    .filter-items .navbar-default .navbar-nav>li:focus a, .filter-items .navbar-default .navbar-nav>li:hover a,
    .filter-items .navbar-default .navbar-nav>li.selected a{
        color: #F26115 !important;
    }
    
    .filter-items .navbar-default .navbar-nav>li a, .bg-color-orange .navbar-brand, .bg-color-orange .navbar-brand:focus, .bg-color-orange .navbar-brand:hover{
        color: #fff;
    }
    
    .filter-items .menu__tags-xs{
        padding-top:15px;
    }
    
    .filter_title {
        text-align: center;
    }
    
    
     /* end of [^]fi */
     
/* [$] Modifier ****************************************/     
     
    .gallery__title--section-h2 {
        font-size:3em;
        margin: 0;
    }
    .list-tags--li li {
      /*  border: 1px solid #f26522;*/
        margin-right: 40px;
        /*padding: 5px 30px;*/
    }
    
    .list-tags--li a {
        color: inherit;
        text-decoration:none;
    }
    
    .filter-by--padding{
         padding: 5px 0;    
    }
    
    .filter-button--btn {
        border-radius: 0;
        border: 1px solid #F26522;
        padding: 12px 24px;
        margin: auto;
    }
    
    .filter-button--btn:hover {
        color: #fff;
        background-color: #f26522;
        border-color:#f26522;
    }
    
    .list-tags--dropdown-menu {
        border-radius: 0;
        right: 0;
        left: 0;
    }
    
    .list-tags--dropdown-menu>li>a:focus, .list-tags--dropdown-menu>li>a:hover {
        color: #fff;
        text-decoration: none;
        background-color: #f26522;
    }
    
    .gallery__column:hover .gallery__caption--text-under-image{
       color:#808080; 
    }
    
    .gallery__caption--text-under-image {
        padding-top: 20px;
    }
    
    .gallery__column a {
        text-decoration: none;
    
    }
    
    
    
    
    /* [#] md screen */
    @media (min-width: 992px) and (max-width: 1199px) {
        
        .list-tags--li li {
            margin-right: 28px;
           /* padding: 5px 18px;*/
        }
        .gallery__column{
            padding-right:15px;
            padding-left:15px
        }
        
    }
    
    /* [#] sm screen */
    @media (min-width: 768px) and (max-width: 991px) {
        
        .list-tags--li li {
            margin-right: 13px;
            padding: 5px 6px;
        }
        .gallery__column{
            padding-right:15px;
            padding-left:15px
        }
                 
    }
    
    /* [#] xs screen */
    @media (max-width: 767px) { 
        
        .gallery__title--section-h2 {
            font-size:2em;
        }
        
    .gallery__column {
        padding-right: 0;
        padding-left: 0;
    }
        
    }