#overlay_leftmenu {position:fixed;top:0;bottom:0;left:0;right:0;width:100%;height:100%;background-color: rgb(0 0 0 / 63%);z-index: 4;display:none;}
#overlay {position:fixed;top:0;bottom:0;left:0;right:0;width:100%;height:100%;background-color: #000000b8;z-index: 10;display:none;}

.title-text {transition: transform 0.5s ease-in-out;position: fixed;z-index: 1;top:0;left:0;right:0;width: 100%;min-height: 50px;background-image: linear-gradient(0deg,rgba(0,0,0,0),rgba(0,0,0,0.4));}
.title-text .wrap {margin: 30px 44px 32px 0;text-align: right;transition: margin 0.5s ease-out;width: auto;}
#title_text {font-size: 24px;color: #fff;font-family: 'VinnytsiaSansBold';font-weight: 700;text-shadow: 1px 1px 0px #000000a6;line-height: 1.3;text-align: center;}

.left-menu {position: fixed;top: 0;left: 0;height: 100%;z-index: 4;transition: transform 0.5s ease-out;box-shadow: 1px 0 7px 0 #0000006e;}
.left-menu.close {transform: translateX(-290px);transition: transform 0.5s ease-out;}
.left-menu.open {transform: translateX(0px);}
.left-menu-wrap {background: #257033db;width: 246px;padding: 24px 4px 4px 0;overflow: hidden;height: 100%;}

.hide-left-menu {position:absolute;top: 18px;left: 232px;border-radius: 47px;box-shadow: 0px 0px 0px 2px #31703a;width: 30px;height: 30px;cursor: pointer;background-color: #FFDD00;background-image: url(resources/icon/close/green.svg);background-size: 18px;background-position: 50% 50%;background-repeat: no-repeat;}
.hide-left-menu:hover {background-size: 22px;}
.hide-left-menu .tooltip {position:absolute;top: 0px;left: 46px;background-color: #31703a;min-width: 120px;min-height: 30px;display: flex;align-items: center;justify-content: center;border-radius: 5px;visibility: hidden;}
.hide-left-menu .tooltip span {display:block;font-family: Helvetica;font-size: 13px;color: #fff;text-align: center;}
.hide-left-menu .tooltip:before {content:'';display:block;position:absolute;top: 10px;left: -4px;width: 10px;height: 10px;background-color: #31703a;transform: rotate(45deg);}

.hide-left-menu-mobver {display:none;position:absolute;top: 20px;left: 264px;border-radius: 50px;width: 36px;height: 36px;cursor: pointer;background-color: #FFDD00;background-image: url(resources/icon/close/green.svg);background-size: 22px;background-position: 50% 50%;background-repeat: no-repeat;}

.show-left-menu {z-index:2;transform: translateX(-280px);transition: transform 0.5s ease-in;position:absolute;top: 20px;left: 20px;border-radius: 47px;background-color: #1FA138;width: 52px;height: 52px;cursor: pointer;background-image: url(resources/icon/menu/menu-arrow.svg);background-size: 30px;background-position: 12px 50%;background-repeat: no-repeat;box-shadow: 0 0 0 4px rgb(255 255 255 / 24%);}
.show-left-menu:hover {box-shadow: 0 0 0 4px #ffffffa6;}
.show-left-menu.enabled {transform: translateX(0px);transition: transform 0.5s ease-out;}

.left-menu-title {color: #ffffff;margin: 0 14px 6px 16px;padding-bottom: 16px;border-bottom: 4px dotted #fff;}
.left-menu-title .definition {font-size: 15px;font-family: 'VinnytsiaSansReg';display: block;}
.left-menu-title .name {font-size: 20px;line-height: 1.3;display: block;font-family: 'VinnytsiaSerif';margin-top: 12px;}
.en .left-menu-title .name {font-size: 24px;}

.left-menu-wrap .scroll-container {overflow-y: auto;height: calc(100% - 128px);padding: 6px 11px 20px 16px;}
.en .left-menu-wrap .scroll-container {height: calc(100% - 138px);}
.left-menu-wrap .scroll-container::-webkit-scrollbar {width: 2px;}
.left-menu-wrap .scroll-container::-webkit-scrollbar-thumb {background-color: #f3f3f380;border-radius: 9em;box-shadow: inset 1px 1px 10px #f3f3f380;display:none;}
.left-menu-wrap .scroll-container:hover::-webkit-scrollbar-thumb {display:block;}
.left-menu-wrap:hover .scroll-container::-webkit-scrollbar-thumb {display:block;}

.item_div {margin-top: 16px;color: #fff;border-radius: 8px;position: relative;overflow: hidden;}
.item_div.leave {cursor:pointer}
.item_div:after {content:'';display:block;position:absolute;width:100%;height:100%;top:0;left:0;right:0;bottom:0;border-radius: 8px;z-index: 2;box-sizing: border-box;border: 2px solid #ffffff80;}
.item_div.active::after{border: 2px solid #FFDD00;}
.item_div.leave.item_div::after {border: 2px solid #FFDD00;}
.item_div:hover.item_div.active::after {cursor:default;}

.item_div img {width: 100%;display: block;border-radius: 8px;}
.item_div .title {display:block;font-size: 14px;font-family: 'VinnytsiaSansReg';padding: 18px 10px 14px 16px;width: 100%;z-index: 2;position: absolute;bottom: 0;left: 0;right: 0;background: linear-gradient(#06060600, #06060673, #000000ad);border-radius: 0 0 8px 8px;}

/* powered-menu */
.left-menu .powered-block {color: #cacaca;text-align: left;margin: 12px auto 0 auto;font-family: 'e-Ukraine', sans-serif;font-weight: 300;}
.left-menu .powered-block .border-top {width: 96%;margin: 22px auto 0;border-top: 2px dotted #9f9f9f;}
.left-menu .powered-block .border-bottom {width: 72%;margin: 0 auto 30px;border-top: 2px dotted #9f9f9f;}
.left-menu .powered-block .information {font-size: 12px;padding: 22px 6px 0;line-height: 1.7;}
.left-menu .powered-block .information a{color: #cacaca;}
.left-menu .powered-block .information a:hover{color: #90caf9;}
.left-menu .powered-block .developer {font-size: 12px;padding: 22px 6px 0;}
.left-menu .powered-block .developer a{color: #cacaca;font-size: 12px;}
.left-menu .powered-block .developer a:hover {text-decoration:underline;color: #fff;}
.left-menu .powered-block .feedback {font-size: 12px;padding: 22px 6px 0;line-height: 1.5;}
.left-menu .powered-block .feedback a{text-decoration: none;color: #fff;}
.left-menu .powered-block .feedback a:hover {text-decoration: underline;}
.left-menu .powered-block .copyright {font-size: 12px;padding: 18px 6px 0;line-height: 1.5;}
.left-menu .powered-block .warning {font-size: 12px;padding: 18px 6px 0;line-height: 1.5;}

.mobile-menu {display:none;position: fixed;left: 0;z-index: 3;}
.mobile-menu .button {border-radius: 50%;background-repeat: no-repeat;background-color:#1FA138;background-color: #137826;}
.mobile-menu .menu {background-image: url(resources/icon/menu/brg.svg);}


/* ----------------------------------------------------- */
/* ----------------------------------------------------- */
/* MOBILE DOWN  ------------------------------ */
/*** 1010px  (!!!! for 962) *******************/
@media screen and (max-width: 1010px) {
.title-text {background-image: linear-gradient(0deg,rgba(0,0,0,0),rgb(0 0 0 / 62%));}
.left-menu-wrap {width: 282px;padding: 28px 4px 4px 4px;}
.left-menu {transform: translateX(-320px);box-shadow: none;}
.left-menu-wrap .scroll-container {height: calc(100% - 134px);padding: 4px 11px 24px 16px;}
.left-menu.close {transform: translateX(-320px);}
.left-menu.open {transform: translateX(0px);}
.left-menu-title .name {font-size: 23px;}
.left-menu-title .definition {}
.left-menu-wrap .links-menu .link {font-size: 13px;}
.show-left-menu, .hide-left-menu {display:none;}
.hide-left-menu-mobver {left: 264px;}
.item_div img {height: 150px;}
.item_div:hover.item_div:after {border: 2px solid #ffffff80;}
.item_div:hover.item_div.active:after {border: 2px solid #FFDD00;}
.left-menu .powered-block .information {font-size:13px;}
.left-menu .powered-block .feedback {font-size:13px;}
.left-menu .powered-block .warning {font-size:13px;}
.left-menu .powered-block .copyright {font-size:13px;}
.left-menu .powered-block .developer {font-size:13px;}
.left-menu .powered-block .developer a {font-size: 13px;}

.mobile-menu {display:block;top: 32px;left: 32px;}
.mobile-menu .button {width: 52px;height: 52px;box-shadow: 0 0 0 4px rgb(255 255 255 / 34%);}
.mobile-menu .menu {background-size: 28px;background-position:50%;}
}

/*** 770px (!!!! for 768) *******************/
@media screen and (max-width: 770px) {
.title-text .wrap {margin: 30px 36px 32px 124px;}
}

/*** 642px (!!!! for 640) *******************/
@media screen and (max-width: 642px) {
#title_text {font-size: 20px;}
}

/*** 482px (!!!! for 480) *******************/
@media screen and (max-width: 482px) {
.title-text .wrap {margin: 22px 32px 32px 100px;}
#title_text {font-size: 18px;}
.mobile-menu {top: 22px;left: 22px;z-index: 2;}
.mobile-menu .button {width: 46px;height: 46px;background-size: 24px;}
}

/*** 377px (!!!! for 375) ***********************/
@media screen and (max-width: 377px) {
.title-text .wrap {margin: 20px 20px 32px 90px;}
.mobile-menu {top: 20px;left: 20px;}
.mobile-menu .button {width: 46px;height: 46px;background-size: 24px;}
}

/*** 343px (!!!! for 342) ***********************/
@media screen and (max-width: 343px) {
#title_text {font-size: 15px;}
.mobile-menu .button {width: 42px;height: 42px;box-shadow: 0 0 0 3px #ffffff78;}
}

.navigation_scene {position: fixed;transition: all 0.5s ease-out;z-index: 2;bottom: 26px;left: calc(50% + 90px);transform: translateX(-50%);display: flex;align-items: center;}
.navigation_scene.center-position {left: 50%;transition: all 0.5s ease-out;}
.navigation_scene .wrap {background-color: #161616a3;border-radius: 30px;display: flex;flex-direction: row;justify-content: space-between;align-items: center;padding: 0px 5px;gap: 2px;height: 44px;}
.navigation_scene .icon {opacity: 1;border-radius: 34px;width: 36px;height: 36px;background-image: url(resources/icon/shevron-bold-white.svg);background-repeat: no-repeat;background-size: 26px;background-position: 7px 50%;overflow: hidden;border-radius: 50%;/* background-color: #8bc34a; */}
.navigation_scene .icon.disabled  {opacity: 0.5;}

.navigation_scene .icon.enabled:hover {cursor:pointer;background-color: #1b1b1c;}
.touchevents .navigation_scene .icon.enabled:hover {background-color: #161616a3;}
#button_prev {transform: scaleX(-1);}

#tooltip-down-menu {position:absolute;left: -52px;bottom: 82px;background-color: #1b1b1c;height: 32px;display: none;align-items: center;justify-content: center;border-radius: 5px;z-index: 9;}
#tooltip-down-menu span {display:block;font-family: Helvetica;font-size: 13px;color: #fff;text-align: center;margin: 0 14px;white-space: nowrap;}
#tooltip-down-menu:before {content:'';display:block;position:absolute;top: 27px;left: 50%;transform: translateX(-50%);width: 10px;height: 10px;background-color: #1b1b1c;transform: translateX(-50%) rotate(45deg);}

.control_menu {position: fixed;transition: all 0.5s ease-out;z-index: 1;bottom: 26px;display: flex;align-items: center;left: calc(50% + 90px);transform: translateX(-50%);width: 194px;justify-content: space-between;}
.control_menu.center-position {left: 50%;transition: all 0.5s ease-out;}

.control_menu .button {width: 44px;height: 44px;background: #161616a3;border-radius: 50%;background-repeat: no-repeat;margin: 0 4px;}
.control_menu .button:hover {cursor:pointer;background-color: #1b1b1c;}
.touchevents .control_menu .button:hover {background-color: #161616a3;}
.control_menu .map {background-image: url(resources/icon/map/map.svg);background-size: 26px;background-position: 50% 50%;}
.control_menu .fullscreen.on {background-image: url(resources/icon/fullscreen-on.svg);background-size: 20px;background-position: 50% 50%;}
.control_menu .fullscreen.off {background-image: url(resources/icon/fullscreen-off.svg);background-size: 20px;background-position: 50% 50%;}

#map-container {position:fixed;top:0;bottom:0;left: 0;right: 0;display:none;width: 100%;height:100%;background-color: #000000eb;z-index: 99;padding: 20px 20px 70px 20px;overflow: hidden;}
#map-container:after {content:'';pointer-events: none;position:absolute;width: calc(100% - 44px);height: calc(100% - 94px);top: 20px;left: 20px;border: 2px solid #fff;border-radius: 10px;}
#map-iframe {width:100%;height:100%;background-color: #e0e0e0;border-radius: 10px;}
#map-container iframe {width:100%;height:100%;outline: none;border-radius: 10px;}
#close-map {display: flex;width: 232px;height: 36px;background-color: #1FA138;align-items: center;justify-content: center;border-radius: 3px;margin: 10px auto 0px;}
#close-map:hover{background-color: #1d8531;cursor: pointer;}
#close-map span {display:block;color: #fff;font-size: 15px;font-family: 'VinnytsiaSansReg';line-height: 1;}

/* ----------------------------------------------------- */
/* ----------------------------------------------------- */
/* MOBILE DOWN  ------------------------------ */

/*** 1030px  (!!!! for 1024) *******************/
@media screen and (max-width: 1030px) {
#tooltip-down-menu {opacity:0;}
}

/*** 1010px  (!!!! for 962) *******************/
@media screen and (max-width: 1010px) {
.navigation_scene {left: 50%;z-index: 3;}
.control_menu {left: 0;display: flex;justify-content: flex-start;padding: 0 32px;transform: none;}
.control_menu .fullscreen {display:none;}
.navigation_scene .wrap {background: none;gap: 8px;height: auto;padding: 0;}
.navigation_scene .icon {background-color: #161616a3; width: 44px; height: 44px; background-size: 26px; background-position: 10px 50%;}
}

/*** 770px (!!!! for 768) *******************/
@media screen and (max-width: 770px) {
#map-container {padding: 20px 20px 100px 20px;}
#map-container:after {height: calc(100% - 124px);}
#close-map {margin: 30px auto 0px;}
}

/*** 482px (!!!! for 480) *******************/
@media screen and (max-width: 482px) {
.navigation_scene {bottom: 22px;}
.control_menu {bottom: 22px;padding: 0;left: 22px;}
#map-container {padding: 12px 12px 80px 12px;}
#map-container:after {top: 12px;left: 12px;width: calc(100% - 28px);height: calc(100% - 96px);}
#close-map {margin: 20px auto 0px;width: 98%;}
}

/*** 432px ***********************/
@media screen and (max-width: 432px) {
.navigation_scene {bottom: 18px;}
.control_menu {bottom: 18px;left: 18px;}
.navigation_scene .wrap {gap:6px;}
}

/*** 343px (!!!! for 342) ***********************/
@media screen and (max-width: 343px) {
#map-container {padding: 10px 10px 60px 10px;}
#map-container:after {top: 10px;left: 10px;width: calc(100% - 24px);height: calc(100% - 74px);}
#close-map {margin: 11px auto 0px;width: 100%;}
}