#section-gallery {margin-bottom: 20px;}
.category-wrapper {display: flex; align-items: center; justify-content: space-evenly; margin-bottom: 50px;}
.category-item {color: #46c1be; font-size: 16px; font-weight: bold; text-align: center; flex-grow: 1; cursor: pointer; transition: var(--transition);}
.category-item:hover {color: var(--blue);}
.category-item.active .category-name {color: var(--blue); border-bottom: 3px solid #45c0be; padding-bottom: 5px; padding-left: 10px; padding-right: 10px; display: inline-block}
.category-item-separator {width: 2px; height: 40px; background-color: #45c0be;}

.gallery-title-wrapper {display: flex; justify-content: space-between; margin-bottom: 40px;}
#section-gallery .section-title {width: 50%; position: relative;}
.gallery-title-desc {font-size: 16px; width: 50%;}
.title-decor-green {width: 33px; height: 32px; background: url('../images/title-decor-green.png') no-repeat 0 0; position: absolute; top: -20px; left: -33px; background-size: 100% 100%;}

.photo-wrapper {display: flex; flex-wrap: wrap; margin-bottom: 20px;}
.photo-item {border-radius: 15px; width: 32%; margin-right: 2%; position: relative; margin-bottom: 25px; overflow: hidden; cursor: pointer;}
.photo-item.last-in-row {margin-right: 0;}
.photo-item-image {background-repeat: no-repeat; background-size: cover; background-position: center center; height: 200px;}
.photo-more-button {cursor: pointer; transition: var(--transition); background: var(--blue); border: 1px solid var(--blue); color: #FFF; border-radius: 5px 20px 5px 20px; padding: 5px 20px; font-size: 11px; font-weight: bold; letter-spacing: 1px;}
.photo-more-button:hover {background: #FFF; color: var(--blue);}
.photo-more-button img {margin-left: 10px;}
.photo-screen {position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url('../images//icon-popup.png') no-repeat center center; background-color: rgba(56,56,56,0.4); display: none;}
.big-image-wrapper {position: relative; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 90vw; max-height: 90vh; border-radius: 25px; overflow: hidden;}
.big-image {}
.big-image-close {width: 20px; height: 20px; background: url('../images//icon-close.png') no-repeat 0 0; background-size: 100% 100%; position: absolute; right: 15px; top: 15px; cursor: pointer; transition: var(--transition);}
.big-image-close:hover {opacity: var(--imageopacity);}

@media screen and (max-width: 1100px) {
    .big-image-wrapper {width: 100%;}
}

@media screen and (max-width: 800px) {
    .photo-item {width: 48%;}
    .photo-item.last-in-row {margin-right: 2%;}
    .photo-item:nth-child(odd) {margin-right: 1% !important; margin-left: 0 !important;}
    .photo-item:nth-child(even) {margin-left: 1% !important; margin-right: 0 !important;}
}

@media screen and (max-width: 600px) {
    .gallery-title-wrapper {flex-direction: column;}
    .gallery-title-wrapper .section-title {width: 100% !important; margin-bottom: 20px;}
    .gallery-title-desc {width: 100%;}
    .gallery-title-wrapper .title-decor-green {width: 26px; height: 25px; top: -15px; left: -15px;}
}

@media screen and (max-width: 550px) {
    .photo-item {width: 100%;}
    .photo-item:nth-child(odd) {margin-right: 0 !important; margin-left: 0 !important;}
    .photo-item:nth-child(even) {margin-left: 0 !important; margin-right: 0 !important;}
}