@charset "utf-8";
/* CSS Document */


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*    СТИЛОВЕ НА ГАЛЕРИЯТА    */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~ */

html {
	padding: env(safe-area-inset);
	/* Използва се за да се скрият белите полета отстрани при хоризонтално завъртян iPhone */
	/* Работи в комбинация с мета-тага viewport в html, в който трябва да се добави параметъра viewport-fit=cover */
}

.rezon-carousel-theme-wrapper {
	position: relative;
	height: 495px;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN {
	height: auto;
	background: #000;
}

.rezon-carousel-theme-wrapper.showFromFullscreenExit {
	animation: initGalerryAn 0.35s ease both;
}

@keyframes initGalerryAn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

.owl-carousel {
    width: 100%;
    height: 100%;
}

.owl-carousel .owl-stage-outer {
    display: grid;
    height: 100%;
}

.owl-carousel .owl-stage {
    height: 100%;
}

.owl-carousel .owl-item {
    min-height: 100%;
    display: grid;
    align-items: center;
	user-select: none;
}

.rezon-carousel-theme-wrapper .owl-carousel .owl-item .item {
	height: 495px;
}

.rezon-carousel-theme-wrapper .item img {
	cursor:zoom-in !important;
	object-fit: cover;
    width: 100%;
    height: 100%;
	max-height: 495px;
}

.rezon-carousel-theme-wrapper div.zoom {
	display: block;
	position: absolute;
	z-index: 3;
	right: 0;
	bottom: 0;
	text-align: left;
	background-image: url("//www.imot.bg/images/picturess/icons/gallery/zoom.svg");
	background-position: left 7px center;
	background-repeat: no-repeat;
	background-color: #00000066;
	color: #FFF;
	font-size: 14px;
	text-decoration: none !important;
	line-height: 27px;
	padding: 0 7px 0 32px;
	/*opacity: 0;*/
	user-select: none;
	cursor: pointer;
	transition: background-color .35s ease, padding .15s ease;
}

.rezon-carousel-theme-wrapper div.zoom:hover {
	background-color: #000000AA;
	padding-left: 32px;
	padding: 0 23px 0 32px;
}

.rezon-carousel-theme-wrapper div.zoom.zoomOut {
	background-position: left 10px top -23px;
}

.rezon-carousel-theme-wrapper span.nums {
    display: block;
    position: absolute;
    z-index: 3;
    left: 0;
    bottom: 0;
	overflow: hidden;
    text-align: left;
    background-image: url(//www.imot.bg/images/picturess/icons/gallery/gallery.svg);
    background-position: left 7px center;
    background-repeat: no-repeat;
    background-color: #00000066;
    color: #DDD;
    font-size: 14px;
    text-decoration: none !important;
    line-height: 26px;
    padding: 0px 7px 0 33px;
	cursor: zoom-in;
	pointer-events: none;
	user-select: none;
    opacity: 0;
    transition: all .3s ease-in-out;
	transition-delay: .1s;
}

.rezon-carousel-theme-wrapper span.nums.show {
    opacity: 1;
	transition-duration: .5s;
	transition-delay: .3s;
}

.rezon-carousel-theme-wrapper span.nums.fastSpeed {
	transition-duration: .3s;
	transition-delay: .1s;
}

.rezon-carousel-theme-wrapper span.nums .inner{
    position: relative;
    bottom: -23px;
}

.rezon-carousel-theme-wrapper span.nums .inner.show {
    animation: galerryNumsCountAn 0.36s .47s cubic-bezier(.36,.07,.19,.97) both;
}

@keyframes galerryNumsCountAn {
	0% {
		bottom: -23px;
	}

	100% {
		bottom: 0;
	}
}

.rezon-carousel-theme-wrapper span.nums strong {
    color: #FFF;
}

.rezon-carousel-theme-wrapper div.Next {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: absolute;
	z-index: 2;
    right: 0;
    top: 0;
    bottom: 0;
    width: 70px;
    text-align: right;
	cursor: pointer;
}

.rezon-carousel-theme-wrapper div.Next ico {
    display: inline-block;
    width: 50px;
    height: 80px;
    background-image: url(//www.imot.bg/images/picturess/icons/gallery/next.svg);
    background-position: 16px center;
    background-repeat: no-repeat;
    background-color: #000000AA;
    opacity: .5;
    border-radius: 10px 0 0 10px;
    transition: all .3s ease-in-out;
}

.rezon-carousel-theme-wrapper div.Next:hover ico {
    opacity: 1;
}

.rezon-carousel-theme-wrapper div.Prev {
    display: flex;
    align-items: center;
    position: absolute;
	z-index: 2;
    left: 0;
    top: 0;
    bottom: 0;
    width: 70px;
	cursor: pointer;
}

.rezon-carousel-theme-wrapper div.Prev ico {
    display: inline-block;
    width: 50px;
    height: 80px;
    background-image: url(//www.imot.bg/images/picturess/icons/gallery/back.svg);
    background-position: 12px center;
    background-repeat: no-repeat;
    background-color: #000000AA;
    opacity: .5;
    border-radius: 0 10px 10px 0;
    transition: all .3s ease-in-out;
}

.rezon-carousel-theme-wrapper div.Prev:hover ico {
    opacity: 1;
}

.rezon-carousel-theme-wrapper .promo {
    position: absolute;
    z-index: 2;
    top: -6px;
    left: -6px;
    width: 70px;
    height: 70px;
    background: none;
	cursor: zoom-in;
	pointer-events: none;
	user-select: none;
}

.rezon-carousel-theme-wrapper .kaparo {
    position: absolute;
    z-index: 2;
    top: -8px;
    right: -8px;
    width: 170px;
    height: 170px;
	background: none;
	cursor: zoom-in;
	pointer-events: none;
	user-select: none;
}

.rezon-carousel-theme-wrapper .rGalerryCloseOnFullscreen {
	display: none;
}

.rezon-carousel-theme-wrapper .galleryInfoWrapper {
	display: none;
	position: absolute;
	z-index: 10;
	bottom: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	max-width: 980px;
	padding: 20px;
	box-sizing: border-box;
}

.rezon-carousel-theme-wrapper .galleryInfo {
	background: #00000077;
	color: #FFF;
	text-align: center;
	padding: 9px 15px 10px;
	border-radius: 3px;
	cursor: pointer;
	transition: .25s ease;
	animation: galleryInfoAn 0.4s 0.10s cubic-bezier(.36,.07,.19,.97) both;
}

.rezon-carousel-theme-wrapper .galleryInfo:hover {
	background: #FFFE;
	color: #333;
}

.rezon-carousel-theme-wrapper .galleryInfo .title {
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 1px;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-moz-line-clamp: 2;
	display: -webkit-box;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	user-select: none;
	animation: galleryInfoAn 0.4s 0.12s cubic-bezier(.36,.07,.19,.97) both;
}

.rezon-carousel-theme-wrapper .galleryInfo .params {
	font-size: 12px;
	opacity: .75;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	-moz-box-orient: vertical;
	-moz-line-clamp: 2;
	display: -webkit-box;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	user-select: none;
	animation: galleryInfoAn 0.4s 0.12s cubic-bezier(.36,.07,.19,.97) both;
}

@keyframes galleryInfoAn {
	0% {
		transform: translateY(75px);
	}

	100% {
		transform: translateY(0);
	}
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .rGalerryCloseOnFullscreen {
	display: none;
	position: absolute;
	z-index: 3;
	top: 10px;
	right: 10px;
	width: 56px;
	height: 56px;
	border-radius: 100px;
	background: url("//www.imot.bg/images/picturess/icons/gallery/close-gallery.svg") center 9px no-repeat #26262699;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	animation: cloxeXan 0.4s cubic-bezier(.36,.07,.19,.97) both;
}

@keyframes cloxeXan {
	0% {
		transform: translateY(-75px);
	}

	100% {
		transform: translateY(0);
	}
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .rGalerryCloseOnFullscreen:before {
	content: "";
    display: block;
    position: relative;
    top: -10px;
    right: 10px;
    z-index: -1;
    width: 80px;
    height: 76px;
    background: #FFF0;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .galleryInfoWrapper {
	display: block;
	cursor: zoom-out;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .promo {
	top: -9px;
    left: -9px;
    width: 100px;
    height: 100px;
	cursor: zoom-out;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .owl-carousel .owl-item .item {
	height: 100%;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .item img {
	cursor:zoom-out !important;
	object-fit: contain;
    width: 100vw;
    max-width: none;
    height: 100vh;
    max-height: none;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .kaparo {
    display: none;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN div.zoom {
	display: none;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN div.infoScroll {
	display: none;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .rGalerryCloseOnFullscreen {
	display: block;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN .rGalerryCloseOnFullscreen:hover {
	background-position: center -41px;
}

.rezon-carousel-theme-wrapper.rznFULLSCREEN span.nums {
	cursor: zoom-out;
}

.rezon-carousel-theme-wrapper.inZOOMmode div.zoom,
.rezon-carousel-theme-wrapper.inZOOMmode div.Next,
.rezon-carousel-theme-wrapper.inZOOMmode div.Prev,
.rezon-carousel-theme-wrapper.inZOOMmode .promo, 
.rezon-carousel-theme-wrapper.inZOOMmode .kaparo,
.rezon-carousel-theme-wrapper.inZOOMmode .rGalerryCloseOnFullscreen,
.rezon-carousel-theme-wrapper.inZOOMmode .galleryInfo,
.rezon-carousel-theme-wrapper.inZOOMmode span.nums
{	
	opacity: 0;
	transition: .35s .15s ease;
}

.rezon-carousel-theme-wrapper.outZOOMmode div.zoom,
.rezon-carousel-theme-wrapper.outZOOMmode div.Next,
.rezon-carousel-theme-wrapper.outZOOMmode div.Prev,
.rezon-carousel-theme-wrapper.outZOOMmode .promo, 
.rezon-carousel-theme-wrapper.outZOOMmode .kaparo,
.rezon-carousel-theme-wrapper.outZOOMmode .rGalerryCloseOnFullscreen,
.rezon-carousel-theme-wrapper.outZOOMmode .galleryInfo,
.rezon-carousel-theme-wrapper.outZOOMmode span.nums
{	
	opacity: 1;
	transition: .6s ease;
}

.rezon-carousel-theme-wrapper.withOneImage div.Next,
.rezon-carousel-theme-wrapper.withOneImage div.Prev
{	
	opacity: 0;
	transition: .35s .15s ease;
}

.rezon-carousel-theme-wrapper.withOneImageRemoveArrows div.Next,
.rezon-carousel-theme-wrapper.withOneImageRemoveArrows div.Prev
{	
	display: none !important;
}

/* Забранява при местене на снимките с пръст, да се скролва и цялата страница под галерията на телефон */
/* Но се запазва функцията за зуум на страницата при iPhone, защото недялков иска да я има */
/* Забранява всички интеракции с пръсти, освен zoom */
/* Скролването на страницата докато се плъзгат снимките с пръст, забавя бързодействието и води до нежелани странични ефекти. Затова го забраняваме в режим Цял Екран. */
/* Наблюдава се при iPhone, защото на другите устройства галерията се изпълнява в нативен FULSCREEN режим и там проблема не съществува */
.rezon-carousel-theme-wrapper.rznFULLSCREEN .owl-carousel .owl-item,
.rezon-carousel-theme-wrapper.rznFULLSCREEN div.zoom,
.rezon-carousel-theme-wrapper.rznFULLSCREEN span.nums,
.rezon-carousel-theme-wrapper.rznFULLSCREEN div.Next,
.rezon-carousel-theme-wrapper.rznFULLSCREEN div.Prev,
.rezon-carousel-theme-wrapper.rznFULLSCREEN .promo, 
.rezon-carousel-theme-wrapper.rznFULLSCREEN .kaparo,
.rezon-carousel-theme-wrapper.rznFULLSCREEN .rGalerryCloseOnFullscreen,
.rezon-carousel-theme-wrapper.rznFULLSCREEN .galleryInfo
{	
	-ms-touch-action: pinch-zoom;
	touch-action: pinch-zoom ;
}

/* Събира цялата снимка на екрана при кликане върху нея на телефон в режим landscape (при отворена галерия на цял екран) */
/* Стила се добавя към снимките от скрипта за отваряне и затваряне на галерията */
.rezon-carousel-theme-wrapper .imageFit .item img {
    object-fit: contain !important;
}

/* Стил за цял екран на галерията, когато устройството е iPhone */
.rezon-carousel-theme-wrapper.rznIPHONE {
	position: fixed;
	height: auto;
	z-index: 999999999;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #000;
	overflow: hidden;
}

.rezon-carousel-theme-wrapper.rznIPHONE .item img {
	object-fit: contain;
	width: 100%;
	height: 100%;
}
/* End */


@media (max-width: 860px){
	.rezon-carousel-theme-wrapper {
		overflow-x: hidden;
		overflow-x: clip;
		overflow-y: visible;
	}
}


@media (max-width: 660px){
	
	.rezon-carousel-theme-wrapper {
		height: 260px;
	}
	
	.rezon-carousel-theme-wrapper .owl-carousel .owl-item .item {
		height: 260px;
	}
	
	.rezon-carousel-theme-wrapper .item img {
		max-height: 260px;
	}	
	
	.rezon-carousel-theme-wrapper.rznFULLSCREEN .promo {
		top: -8px;
		left: -8px;
		width: 80px;
		height: 80px;
	}
	
	.rezon-carousel-theme-wrapper .kaparo {
		top: -5px;
		right: -5px;
		width: 126px;
		height: 126px;
	}
	
	.rezon-carousel-theme-wrapper .galleryInfoWrapper {
		bottom: 60px;
		left: auto;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);		
		padding: 0 10px;
	}
	
	.rezon-carousel-theme-wrapper .galleryInfo {
		padding: 10px 10px 10px;
	}
	
	.rezon-carousel-theme-wrapper .galleryInfo:hover {
		background: #00000077;
		color: #FFF;		
	}
	
	.rezon-carousel-theme-wrapper .galleryInfo .title {
		margin-bottom: 8px;
		font-size: 16px;
    	line-height: 22px;
	}

	
	.rezon-carousel-theme-wrapper .galleryInfo .params {
		font-size: 14px;
    	line-height: 18px;
	}
	
	.rezon-carousel-theme-wrapper.rznFULLSCREEN span.nums {
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		transform: translateX(-50%);
		bottom: 15px;
		background-color: #00000066;
		font-size: 14px;
	}
	
	.rezon-carousel-theme-wrapper div.Prev {
		width: 67px;
	}
	
	.rezon-carousel-theme-wrapper div.Prev ico {
		width: 42px;
		height: 80px;		
		background-position: 8px center;
		opacity: .5 !important;
		transition: all .2s ease-in-out;
	}
	
	.rezon-carousel-theme-wrapper div.Next {
		width: 67px;
	}
	
	.rezon-carousel-theme-wrapper div.Next ico {
		width: 42px;
		height: 80px;
		background-position: 12px center;
		opacity: .5 !important;
		transition: all .2s ease-in-out;
	}
	
	.rezon-carousel-theme-wrapper div.zoom {
		right: 0;
	}
	
	.rezon-carousel-theme-wrapper div.infoScroll {
		display: none;
	}
}


@media screen and (max-height: 667px) and (orientation: landscape) {
	.rezon-carousel-theme-wrapper .galleryInfo {
		display: none;
	}
	
	.rezon-carousel-theme-wrapper.rznFULLSCREEN .item img {
		object-fit: cover;
		width: 100vw;
		height: 100vh;
	}
	
	.rezon-carousel-theme-wrapper.rznFULLSCREEN div.Prev {
		width: 90px;
	}
	
	.rezon-carousel-theme-wrapper.rznFULLSCREEN div.Next {
		width: 90px;
	}
}

/* END of owlCarousel Styles */
/* ~~~~~~~~~~~~~~~~~~~~~~~~ */
