.photos-modal {position: fixed;-ms-flex-align: center;align-items: center;display: -ms-flexbox;display: flex;width: 100%;background-color: rgba(0,0,0,.95);top: 0;left: 0;height: 100vh;z-index: 1001;}
.wrapper {max-width: 1170px;width: 100%;margin-left: auto;margin-right: auto;}
.photos-modal .relative {position: relative;}
.photos-modal_close {position: absolute;right: 70px;color: #fff;font-weight: normal;font-size: 14px;width: 50px;top: 20px;transform: translateX(calc(100% + 15px));}
.photos-modal_close i {font-size: 45px;}
.photos-modal_close:hover {color: inherit;}
.photos-modal_keyboard-info {color: #fff;font-size: 13px;display: -ms-flexbox;display: flex;margin-bottom: 5px;-ms-flex-pack: center;justify-content: center;width: 100%;}
.photos-modal_keyboard-info i {font-size: 18px;color: #fff;margin-right: 5px;}
.photos-modal_keyboard-info .text {margin: 0;}

/*Resim Kategorileri*/
.photos-modal_categories {position: relative;}
.photos-modal_categories .categories {max-height: 620px;height: calc(100vh - 200px);overflow-y: auto;padding-right: 10px;}
.photos-modal_categories .categories_link {display: -ms-flexbox;display: flex;margin-bottom: 20px;color: #fff;font-weight: 400;font-size: 14px;width: 190px;cursor: pointer;}
.photos-modal_categories .categories_link:hover,
.photos-modal_categories .categories_link:focus,
.photos-modal_categories .categories_link.active {color: #3dbef3;}
.photos-modal_categories .categories_link-category-name {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 175px;}

/*Carousel*/
.photos-modal_carousel {position: relative;max-height: 620px;height: calc(100vh - 200px);border-radius: 3px;overflow: hidden;}
.photos-modal_carousel .image-count {position: absolute;right: 10px;bottom: 10px;height: 35px;padding: 0 10px;border-radius: 3px;background-color: rgba(0,0,0,.8);color: #fff;display: -ms-flexbox;display: flex;-ms-flex-align: center;align-items: center;box-sizing: border-box;}
.photos-modal_carousel .image {position: absolute;left: 0;top: 0;width: 100%;height: 100%;background-size: cover;background-position: 50%;background-repeat: no-repeat;border-radius: 3px;}
.photos-modal_carousel .image.active {display: block;}

/*Thumbnails*/
.photos-modal_thumbnails {-ms-flex-pack: center;justify-content: center;overflow: hidden;position: relative;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;}
.photos-modal_thumbnails .thumbnails_next, .photos-modal_thumbnails .thumbnails_prev {width: 87px;display: -ms-flexbox;position: absolute;height: 60px;line-height: 72px;bottom: 0;background-color: #000;z-index: 1;color: #fff;-ms-flex-pack: center;justify-content: center;border: 0;}
.photos-modal_thumbnails .thumbnails_prev {left: 0;}
.photos-modal_thumbnails .thumbnails_next {right: 0;}
.photos-modal_thumbnails .thumbnails_next i, .photos-modal_thumbnails .thumbnails_prev i {color: #c5c5c5;font-size: 24px;}
.photos-modal_thumbnails .thumbnails {margin-top: 30px;width: calc(100% - 170px);overflow-x: hidden;padding-left: 15px;padding-right: 15px;display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;-ms-flex-pack: justify;justify-content: space-between;}
.photos-modal_thumbnails .thumbnails_carousel {display: -ms-flexbox;display: flex;-ms-flex-wrap: nowrap;flex-wrap: nowrap;margin-left: auto;margin-right: auto;transition: linear all 500ms;}
.photos-modal_thumbnails .thumbnails_item {cursor: pointer;width: 87px;position: relative;height: 60px;overflow: hidden;margin: 0 5px;border-radius: 3px;-ms-flex: 0 0 auto;flex: 0 0 auto;/*background: #ddd;*/}
.photos-modal_thumbnails .thumbnails_item .image {width: 100%;height: 60px;opacity: .5;display: block;background-size: cover;background-position: 50%;transition: all .3s linear;}
.photos-modal_thumbnails .thumbnails_item.active .image {opacity: 1;}

@media(max-width: 768px){
    .photos-modal_carousel {max-height: 340px;}
    .photos-modal_categories {margin: 10px;}
    .photos-modal_categories .categories {height: auto !important;}
    .photos-modal_categories .categories_link {width: 33.3%;float: left;margin-bottom: 7px;}
    .photos-modal_thumbnails .thumbnails {margin-top: 0;}
    .photos-modal_close i {font-size: 25px;}
}
.open-photo-modal-carousel {background: #27a6d9;padding: 5px;color: #fff;font-size: 0.8rem;cursor: pointer;border-radius: 4px;}
.open-photo-modal-carousel:hover {color: #fff;}
@media(max-width: 768px){ 
    .photos-modal_categories .categories_link {width: 50%;}
}