/*дописываем bootstrap*/
a.left.carousel-control {
    /* border: 2px solid #f00; */
    width: 100%;
    height: 100%;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
    background-repeat: repeat-x;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 10%;
	padding-right: 3%;  
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    opacity: 0.5;
}
.carousel-control .icon-prev, .carousel-control .icon-next {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: inline-block;
    width: 30px;
    height: 59px;
    margin-top: -10px;
    font-family: serif;
    line-height: 1;
}

a.right.carousel-control {
    right: 0;
    left: auto;
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
    background-repeat: repeat-x;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    width: 10%; 
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    opacity: 0.5;
}
.carousel-control:focus, .carousel-control:hover {   
    color: #fff;
    text-decoration: none;
    outline: 0;
	opacity: .9 !important;
}
.carousel-item .img {
    width: 70vw;
    height: 90vh;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.modal-dialog { max-width: min-content !important; margin-bottom: 0 !important;}
.photo-items-list .container {padding: 0 10px !important;}
.photogallery-list .row { width: 100%; margin: 0 auto; justify-content: center;}
.photogallery-list .col-xl-3, .photogallery-list .col-lg-3 	{flex: 0 0 23%;  max-width: 23%; cursor: pointer;}
.photo-item-inner {
	height: 10vw !important;
    background-size: cover;
    margin: 0 5px 10px 5px;
    border-radius: 5px;
}
.c_card.text.photo-items-list { margin-top: 15px;}
.modal.and.carousel { position: fixed;}
.modal-content{background-color: #2e2e2e !important;}
.modal.show { z-index: 1999;}
@media only screen and (max-width: 1240px) and (min-width: 992px){
	.carousel-item .img { height: 85vh !important; width: 90vw !important;}
}
@media only screen and (max-width: 991px) and (min-width: 581px){
	.carousel-control .icon-prev, .carousel-control .icon-next{    width: 18px; height: 40px;}
	.modal-dialog {margin: 100px auto 0 !important;}
	.photogallery-list .col-md-6.col-sm-6{flex: 0 0 48%;  max-width: 48%;    height: 155px !important;  background-position: center;}	
	a.right.carousel-control{    padding-right: 2% !important;} 
	.modal-body {padding: 10px !important;} 
}
@media only screen and (max-width: 991px) and (min-width: 768px) and (max-height: 900px) and (min-height: 601px){.carousel-item .img { height: 61vh !important; width: 90vw !important;}}
@media only screen and (max-width: 767px) and (min-width: 581px) and (max-height: 900px) and (min-height: 601px){.carousel-item .img { height: 53vh !important; width: 90vw !important;}}
@media only screen and (max-width: 991px) and (min-width: 581px) and (max-height: 600px) and (min-height: 531px){.carousel-item .img { height: 60vh !important; width: 85vw !important;}}
@media only screen and (max-width: 991px) and (min-width: 581px) and (max-height: 530px) and (min-height: 450px){.carousel-item .img { height: 68vh !important; width: 88vw !important;}}
@media only screen and (max-width: 991px) and (min-width: 581px) and (max-height: 449px) and (min-height: 240px){.carousel-item .img { height: 90vh !important; width: 88vw !important;} .modal-dialog {margin: 1% auto 0 !important;}}
@media only screen and (max-width: 580px) and (min-width: 240px){
	.photo-items-list .container {  padding: 0 0px !important;}
	.carousel-control .icon-prev, .carousel-control .icon-next{    width: 18px; height: 40px;}
	.modal-dialog {margin: 50% auto  !important;}
	.photogallery-list .col-sm-6.col-6	{flex: 0 0 45%;  max-width: 45%; max-height: 155px !important; background-position: center; min-height: 80px;}
	a.right.carousel-control{    padding-right: 8%  !important;} 
	.modal-body {padding: 8px  !important;}
}
@media only screen and (max-width: 580px) and (min-width: 240px) and (max-height: 900px) and (min-height: 601px){.carousel-item .img { max-height: 32vh  !important; width: 92vw  !important;}}
@media only screen and (max-width: 580px) and (min-width: 240px) and (max-height: 600px) and (min-height: 531px){.carousel-item .img { max-height: 40vh  !important; width: 90vw  !important;}}
@media only screen and (max-width: 580px) and (min-width: 240px) and (max-height: 530px) and (min-height: 450px){.carousel-item .img { max-height: 45vh  !important; width: 93vw  !important;}}
@media only screen and (max-width: 580px) and (min-width: 240px) and (max-height: 449px) and (min-height: 240px){.carousel-item .img { max-height: 80vh  !important; width: 93vw  !important;} .modal-dialog {margin: 6% auto 0  !important;}}
/* .modal-content{background-color: #ef7f1bc9 !important;} */