body{
margin: 0;
padding: 0;
scroll-behavior: smooth;
}
header{
background-color: black;
width: 100%;
height: 150px;
position: relative;
}
.container{
margin: 0 auto;
width: 1440px;
}
.icons-block-header{
display: none;
}
.nav-big-img{
display: none;
background-image: url(assets/images/burger-menu/burger\(1\).webp);
}
.nav-small-img{
display: none;
background-image: url(assets/images/burger-menu/burger\(2\).webp);
}
.nav-second-small-img{
display: none;
background-image: url(assets/images/burger-menu/burger\(3\).webp);
}
.logo-block{
width: 200px;
height: 35px;
display: flex;
margin-bottom: 41px;
padding-left: 7px;
}
.svg-block{
background-image: url(assets/svg/logo.svg);
width: 49px;
height: 26px;
margin-top: 25px;
}
.titleoflogo{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
color: white;
margin-left: 25px;
padding-top: 8px;
}
a{
text-decoration: none;
}
li{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
color: rgb(255, 255, 255);
list-style: none;
margin-left: 55px;
}
li:hover {
color: #9d8665;
}
li:active{
color: #710707;
}
.button-discover:hover {
background-color: #9D8665;
}
.scroll:hover{
color: #9D8665;
}
.scroll:active{
color: #710707;
}
.list-header{
display: flex;
position: absolute;
right: 226px;
top: 50px;
}
nav{
max-width: 720px;
}
.burger{
display: none;
position: relative;
z-index: 50;
align-items: center;
justify-content: flex-end;
width: 32px;
height: 18px;
}
.museum-link{
text-decoration: none;
color: black;
}
.museum-link:hover{
text-decoration: underline;
}
.burger span{
height: 2px;
width: 32px;
transform: scale(1);
background-color: white;
}
.top-line{
position: absolute;
top: 0;
width: 32px;
height: 2px;
background-color: white;
transition: all 0.4s ease 0s;
}
.header-navigation{
animation: burgerAnimation 0.4s;
}
@keyframes burgerAnimation {
from {opacity: 0}
to {opacity: 1;}
}
.bot-line{
position: absolute;
bottom: 0;
width: 32px;
height: 2px;
background-color: white;
transition: all 0.4s ease 0s;
}
.burger::before .burger::after{
content: '';
position: absolute;
height: 2px;
width: 32px;
background-color: white;
transition: all 0.4s ease 0s;
}
.burger::before {
top: 0;
}
.burger::after {
bottom: 0;
}
.burger.active  span{transform: scale(0);
transition: 0.4s ease 0s;
}
.burger.active .top-line{
top: 50%;
transform: rotate(-45deg);
translate: (0, -50%);
transition: 0.4s ease 0s;
}
.burger.active .bot-line{
bottom: 50%;
transform: rotate(45deg);
translate: (0,50%);
transition: 0.4s ease 0s;
}
.header_inner{
display: flex;
justify-content: space-between;
align-items: center;
height: 150px;
}
.welcome-section{
width: 100%;
background-color: black;
height: 810px;
position: relative;
}
.welcome_liza{
background-position: calc(100% - 20px) calc(100% - 10px);
object-fit: cover;
flex-shrink: 0;
-webkit-user-drag: none;
-webkit-user-drag: none;
}
.welcome-texts{
width: 600px;
height: 380px;
padding-top: 83px;
padding-left: 5px;
position: absolute;
z-index: 99;
}
.welcome-first-half{
height: 842px;
width: 600px;
}
.tittle{
color: white;
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
}
.subtittle{
font-family: Roboto;
font-weight: 300;
font-size: 28px;
line-height: 100%;
letter-spacing: 2px;
color: white;
position: absolute;
bottom: 49px;
left: 5px;
}
.btn-buy:hover{
background-color: #9D8665;
}
.btn-buy:hover .buynow-t{
color: #000000;
}
.button-discover{
background-color: #710707;
width: 360px;
height: 75px;
border-radius: 10px;
margin-top: 134px;
}
.card:hover .card-line{
width: 100%;
transition: 1s;
}
.card-denon:hover .card-line-denon{
width: 100%;
transition: 1s;
}
.card-colo:hover .card-line-colo{
width: 100%;
transition: 1s;
}
.card-mona:hover .card-line-mona{
width: 100%;
transition: 1s;
}
.card-night:hover .card-line-night{
width: 100%;
transition: 1s;
}
.card-greek:hover .card-line-greek{
width: 100%;
transition: 1s;
}
.btn-text{
color: white;
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
text-align: center;
padding-top: 27px;
padding-left: 5px;
}
.welcome-second-half{
height: 842px;
width: 1000px;
position: relative;
}
.welcome_inner{
display: flex;
}
.slider{
width: 600px;
height: 90px;
background-color: black;
display: flex;
position: absolute;
bottom: 59px;
right: 200px;
justify-content: center;
align-items: center;
}
.absolute_inner{
width: 600px;
height: 90px;
display: flex;
position: relative;
justify-content: center;
align-items: center;
}
.squareun{
width: 16px;
height: 16px;
background-color: #D2B183;
margin-left: 25px;
}
.square{
width: 16px;
height: 16px;
background-color: white;
margin-left: 25px;
z-index: 99;
}
.text-slider{
color: white;
font-family: Roboto;
font-weight: 400;
font-size: 22px;
line-height: 40px;
letter-spacing: 1px;
vertical-align: middle;
text-transform: uppercase;
position: absolute;
right: 453px;
bottom: -13px;
}
.slider-track {
display: flex;
transition: transform 0.5s ease-in-out;
cursor: grab;
}
.welcome-slider-wrapper {
  width: 1000px;
  height: 750px;
  overflow: hidden;
  position: relative;
}
.explore-box{
--position: 50%;
  position: relative;
  width: 100%;
  max-width: 720px;
  height: 700px;
  overflow: hidden;
  margin-top: 80px;
}
.squares{
display: flex;
padding-top: 30px;
padding-right: 8px;
transition: background-color 0.3s;
z-index: 99;
}
.arrow-right{
transform: rotate(-180deg);
position: absolute;
bottom: 26px;
right: 75px;
cursor: pointer;
z-index: 99;
}
.arrow-left{
position: absolute;
bottom: 26px;
right: 124px;
cursor: pointer;
z-index: 99;
}
.visiting-section{
width: 100%;
height: 1116px;
}
.title-visblock{
color: #9D8665;
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 10px;
padding-left: 7px;
}
.sub-line{
width: 100%;
height: 3px;
background-color: #710707;
margin-top: -43px;
margin-left: 7px;
}
.cards-row{
display: flex;
width: 100%;
height: 500px;
justify-content: space-between;
margin-top: 76px;
flex-wrap: wrap;
}
.card{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-denon{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-colo{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-greek{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-mona{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-night{
width: 30%;
height: 480px;
position: relative;
margin-right: 5px;
}
.card-text-greek{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 296px;
left: 7px;
}
.card-text{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 276px;
left: 8px;
}
.card-text-night{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 296px;
left: 4px;
}
.line-burger{
display: none;
}
.card-text-mona{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 295px;
left: 5px;
}
.card-text-colo{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 276px;
left: 3px;
}
.card-text-denon{
font-family: Forum;
font-weight: 400;
font-size: 32px;
letter-spacing: 5px;
text-transform: uppercase;
color: #000000;
position: absolute;
top: 276px;
left: 5px;
}
.card-line{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 354px;
left: 0px;
}
.card-line-greek{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 372px;
left: 6px;
}
.card-line-night{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 373px;
left: -1px;
}
.card-line-mona{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 373px;
left: 4px;
}
.card-line-colo{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 354px;
left: -1px;
}
.card-line-denon{
background-color: #710707;
width: 302px;
height: 2px;
position: absolute;
top: 354px;
left: 0px;
}
.card-second-text{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 347px;
left: 8px;
}
.card-second-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 367px;
left: 8px;
}
.card-second-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 366px;
left: 3px;
}
.card-second-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 366px;
left: 5px;
}
.card-second-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 348px;
left: 4px;
}
.card-second-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 347px;
left: 5px;
}
.card-third-text{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 384px;
left: 7px;
}
.card-third-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 404px;
left: 7px;
}
.card-third-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 405px;
left: 4px;
}
.card-third-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 405px;
left: 5px;
}
.card-third-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 386px;
left: 4px;
}
.card-third-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
color: black;
position: absolute;
top: 386px;
left: 5px;
}
.second-row-ofcards{
display: flex;
width: 100%;
height: 500px;
justify-content: space-between;
}
.Explore-section{
width: 100%;
height: 865px;
background-color: black;
margin-top: 84px;
}
.explore-title{
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 100px;
letter-spacing: 5px;
text-transform: uppercase;
color: #FFFFFF;
padding-left: 8px;
}
.leftside{
width: 50%;
height: 865px;
position: relative;
}
.explore_inner{
display: flex;
}
.rightside{
width: 50%;
height: 865px;
}
.explore-subline{
background-color: #710707;
height: 3px;
width: 660px;
position: absolute;
top: 190px;
margin-left: 8px;
}
.exp-sub-text{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 38.5px;
letter-spacing: 0%;
color: white;
position: absolute;
top: 247px;
left: 10px;
}
.exp-sub-sec-text{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 38.5px;
letter-spacing: 1%;
color: white;
position: absolute;
top: 348px;
left: 10px;
}
.yellow-veil{
color: #9D8665;
}
.exp-sub-thi-text{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 38.5px;
letter-spacing: 3%;
color: white;
position: absolute;
top: 450px;
left: 10px;
}
.explore-img-before,
.explore-img-after {
   position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.before-wrapper{
width: var(--position);
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: 2;
}
.explore-img-before{
 width: var(--position);
  overflow: hidden;
  z-index: 2;
}
.explore-img-after{
z-index: 1;
}
.explore-slider{
position: absolute;
inset: 0;
z-index: 10;
opacity: 0;
cursor: ew-resize;
}
.explore-slider:focus-visible ~ .explore-slider-btn{
outline: 5px solid black;
outline-offset: 3px ;
}
.explore-slider-btn{
position: absolute;
  top: 50%;
  left: var(--position);
  transform: translate(-50%, -50%);
  z-index: 20;
  pointer-events: none;
}
.slider-image{
width: 100%;
height: 100%;
object-fit: cover;
object-position: left;
}
.images-box{
width: 720px;
height: 700px;
position: relative;
}
.video-section{
width: 100%;
height: 1246px;
position: relative;
}
.top-side{
display: flex;
width: 100%;
}
.video-title{
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
color: #9D8665;
white-space: nowrap;
padding-top: 10px;
padding-left: 7px;
}
.video-subtitle{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 38.5px;
color: #000000;
margin-left: 115px;
margin-top: 82px;
white-space: nowrap;
}
.main-poster{
width: 1440px;
height: 650px;
margin-left: 6px;
margin-top: 10px;
display: block;
}
.video-options{
background-color: #000000;
width: 100%;
height: 85px;
display: flex;
align-items: center;
margin-left: 6px;
justify-content: space-between;
}
.img-opt{
padding-left: 30px;
}
.img-full{
padding-right: 28px;
}
.progress {
background: linear-gradient(to right, #710707 0%, #710707 40%, #fff 40%, #fff 100%);
border: solid 2px #710707;
border-radius: 8px;
height: 7px;
width: 929px;
outline: none;
transition: background-color 450ms ease-in;
-webkit-appearance: none;
}
.progress::-webkit-slider-thumb {
width: 15px;
height: 15px;
border-radius: 50%;
-webkit-appearance: none;
cursor: ew-resize;
background: #ffffff;
}
.progress-volume::-webkit-slider-thumb {
-webkit-appearance: none;
width: 15px;
height: 15px;
background: #ffffff;
border-radius: 50%;
cursor: ew-resize;
}
.progress-volume {
background: linear-gradient(to right, #710707 0%, #710707 40%, #fff 40%, #fff 100%);
border: solid 2px #710707;
border-radius: 8px;
height: 7px;
width: 155px;
outline: none;
transition: background-color 450ms ease-in;
-webkit-appearance: none;
}
.general-button{
position: absolute;
left: 850px;
top: 455px;
}
.video-row{
display: flex;
width: 100%;
margin-top: 40px;
justify-content: space-between;
}
.first-video{
width: 452px;
height: 254px;
padding-left: 10px;
}
.second-video{
width: 452px;
height: 254px;
padding-left: 10px;
}
.third-video{
width: 452px;
height: 254px;
padding-left: 10px;
}
.menu_inner{
display: flex;
justify-content: center;
margin-top: 37px;
margin-left: 13px;
}
.btns{
display: flex;
width: 200px;
height: 12px;
justify-content: space-between;
}
.circle-first{
width: 12px;
height: 12px;
border-radius: 50%;
background-color: #333333;
}
.circle{
width: 12px;
height: 12px;
background-color: #999999;
border-radius: 50%;
}
.gallery-section{
width: 100%;
background-color: black;
height: 2200px;
margin-top: 150px;
}
.gallery-title{
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
color: #FFFFFF;
padding-left: 7px;
padding-top: 7px;
}
.gallery-container{
max-height: 2200px;
overflow: hidden;
}
.gallery-columns{
display: flex;
column-gap: 36px;
margin-top: 75px;
}
.column-1{
display: flex;
flex-direction: column;
row-gap: 24px;
margin-top: 50px;
}
.column-2{
display: flex;
flex-direction: column;
row-gap: 24px;
transform: translateY(-50px);
margin-top: 50px;
}
.column-3{
display: flex;
flex-direction: column;
row-gap: 24px;
margin-top: 50px;
}
.column-photo11{
width: 456px;
height: 570px;
}
.column-photo12{
width: 456px;
height: 570px;
}

.gallery-columns img {
  opacity: 0;
  transform: translateY(60px) scale(0.95);
  transition: all 0.8s ease-out;
  will-change: opacity, transform;
}
.gallery-columns img.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.column-photo13{
width: 464px;
height: 464px;
}
.column-photo14{
width: 464px;
}
.column-photo21{
width: 464px;
height: 464px;
}
.column-photo22{
width: 394px;
height: 570px;
}
.column-photo23{
width: 394px;
height: 570px;
}
.column-photo24{
width: 464px;
}
.column-photo31{
width: 394px;
height: 570px;
}
.column-photo32{
width: 464px;
height: 464px;
}
.column-photo33{
width: 464px;
height: 464px;
}
.column-photo34{
width: 464px;
}
.tickets-section{
width: 100%;
height: 743px;
background-color: white;
}
.tickets-title{
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
color: #9D8665;
padding-left: 6px;
padding-top: 6px;
}
.title-subline{
width: 100%;
height: 3px;
background-color: #710707;
margin-left: 7px;
margin-top: -39px;
}
.twoblocks{
width: 100%;
margin-top: 75px;
display: flex;
}
.left-block{
width: 50%;
height: 100%;
}
.ticket-image{
margin-right: 10px;
}
.rightblock{
width: 50%;
height: 100%;
position: relative;
}
.parallax{
width: 100%;
height: 400px;
background-image: url(assets/images/parallax.jpg);
background-attachment: fixed;
background-repeat: no-repeat;
margin-top: 83px;
background-size: cover;
}
.radio-row {
display: block;
position: relative;
padding-left: 107px;
margin-top: 40px;
cursor: pointer;
font-size: 22px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.radio-row input {
position: absolute;
opacity: 0;
cursor: pointer;
}
.checkmark {
position: absolute;
top: 36px;
left: 67px;
height: 17px;
width: 17px;
background-color: #eee;
border-radius: 50%;
}
.checkmark-second {
position: absolute;
top: 74px;
left: 67px;
height: 17px;
width: 17px;
background-color: #eee;
border-radius: 50%;
}
.radio-row:hover input ~ .checkmark {
background-color: #ccc;
}
.radio-row:hover input ~ .checkmark-second {
background-color: #ccc;
}
.radio-row input:checked ~ .checkmark {
background-color: #021524de;
}
.radio-row input:checked ~ .checkmark-second {
background-color: #021524de;
}
.checkmark:after {
content: "";
position: absolute;
display: none;
}
.checkmark-second:after {
content: "";
position: absolute;
display: none;
}
.radio-row input:checked ~ .checkmark:after {
display: block;
}
.radio-row input:checked ~ .checkmark-second:after {
display: block;
}
.radio-row .checkmark:after {
top: 6px;
left: 6px;
width: 5px;
height: 5px;
border-radius: 50%;
background: white;
}
.radio-row .checkmark-second:after {
top: 6px;
left: 6px;
width: 5px;
height: 5px;
border-radius: 50%;
background: white;
}
.checkmark-third {
position: absolute;
top: 109px;
left: 67px;
height: 17px;
width: 17px;
background-color: #eee;
border-radius: 50%;
}
.radio-row:hover input ~ .checkmark-third {
background-color: #ccc;
}
.radio-row input:checked ~ .checkmark-third {
background-color: #021524de;
}
.checkmark-third:after {
content: "";
position: absolute;
display: none;
}
.radio-row input:checked ~ .checkmark-third:after {
display: block;
}
.radio-row .checkmark-third:after {
top: 6px;
left: 6px;
width: 5px;
height: 5px;
border-radius: 50%;
background: white;
}
.ticket-text{
font-family: Roboto;
font-weight: 700;
font-size: 28px;
line-height: 100%;
counter-reset: black;
margin-left: 68px;
margin-top: 2px;
}
.label-text{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 34px;
left: 106px;
}
.label-text-second{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 70px;
left: 107px;
}
.label-text-third{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 107px;
}
.number {
  all: unset;
  width: 3em;
  text-align: center;
}
.number-block{
width: 200px;
height: 400px;
margin-left: 600px;

}
.btn-count{
width: 150px;
height: 50px;
display: flex;
justify-content: space-between;
border: 1px black solid;
position: absolute;
top: 99px;
left: 575px;
}
.btn-buy{
width: 175px;
height: 50px;
background-color: black;
position: absolute;
top: 395px;
left: 550px;
display: flex;
justify-content: center;
align-items: center;
}
.Amount-t{
font-family: Roboto;
font-weight: 700;
font-size: 28px;
line-height: 100%;
color: black;
position: absolute;
top: -25px;
left: 625px;
}
.basic-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 40px;
left: 578px;
}
.senior-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 142px;
left: 576px;
}
.btn-count-2{
width: 150px;
height: 50px;
display: flex;
justify-content: space-between;
border: 1px black solid;
position: absolute;
top: 200px;
left: 575px;
}
.total-t{
font-family: Roboto;
font-weight: 700;
font-size: 28px;
line-height: 100%;
letter-spacing: 1.65px;
color: #000000;
position: absolute;
top: 275px;
left: 577px;
white-space: nowrap;
}
.buynow-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
text-align: center;
color: white;
}
.contacts-section{
width: 100%;
height: 813px;
}
.contacts-title{
font-family: Forum;
font-weight: 400;
font-size: 80px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
color: #9D8665;
padding-top: 10px;
padding-left: 5px;
}
.info-block{
width: 30%;
height: 813px;
position: relative;
}
.nameof{
font-family: Roboto;
font-weight: 500;
font-size: 28px;
line-height: 100%;
color: black;
position: absolute;
top: 49px;
left: 8px;
}
.address-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 170px;
left: 8px;
}
.phone-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 220px;
left: 9px;
}
.mail-t{
font-family: Roboto;
font-weight: 300;
font-size: 22px;
line-height: 100%;
color: black;
position: absolute;
top: 270px;
left: 8px;
}
.map-block{
width: 960px;
height: 620px;
}
#mapin{
width: 100%;
height: 100%;
margin-top: 81px;
}
.main-block{
display: flex;
}
footer{
width: 100%;
height: 392px;
background-color: #000000;
margin-top: 81px;
}
.logo-footer-block{
width: 195px;
height: 50px;
display: flex;
align-items: center;
padding-top: 79px;
}
.logo-text-footer{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
color: white;
padding-left: 25px;

}
.logo-footer{
padding-right: 7px;
}
.icons-block{
display: flex;
width: 361px;
height: 48px;
margin-left: 888px;
margin-top: 163px;
}
.icons{
margin-left: 25px;
}
.navigation-block{
width: 453px;
height: 128px;
display: flex;
justify-content: space-between;
position: absolute;
left: 485px;
top: 51px;
}
.footer-f-navigation{
width: 107px;
height: 126px;
}
.footer-li-text{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
color: white;
padding-top: 27px;
}
.footer-li-text-v{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
color: white;
padding-top: 27px;
}
.footer-li-text-g{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
color: white;
padding-top: 27px;
}
.footer-s-navigation{
width: 107px;
height: 126px;
}
.footer_inner{
display: flex;
}
footer{
position: relative;
}
.footer-line{
width: 100%;
height: 3px;
background-color: #666666;
margin-top: 55px;
}
.footer-makeby{
width: 100%;
height: 24px;
display: flex;
justify-content: space-between;
margin-top: 31px;
margin-left: 8px;
}
.makeby-text{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 22px;
letter-spacing: 2px;
color: #FFFFFF;
}
.makeby-text-s{
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 22px;
letter-spacing: 2px;
color: #FFFFFF;
margin-left: 15px;
}
.frame-f{
width: 48px;
height: 48px;
border-radius: 50%;
border: 1px gray solid;
display: flex;
justify-content: center;
align-items: center;
margin-left: 28px;
}
.frame-f:hover .logos{
fill: #9D8665;
}
.frame-f:hover{
border: 1px #9D8665 solid;
}
iframe {
border: none;
}
.scroll{
text-decoration: none;
font-family: Roboto;
font-weight: 200;
font-size: 22px;
line-height: 100%;
letter-spacing: 2px;
color: white;
padding-top: 27px;
}

.booking-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 900;
}

/* Модалка */
.booking-modal {
  position: fixed;
  top: 50px;
  left: -100%;
  width: 1300px;
  height: 845px;
  background: white;
  z-index: 1000;
  transition: left 0.4s ease;
  box-shadow: 2px 0 10px rgba(0,0,0,0.2);
  padding: 20px;
  border-radius: 6px;
}
.booking-modal.open {
  left: 50%;
  transform: translateX(-50%);
}

.booking-header {
  display: flex;
  justify-content: flex-end;
}

.booking-close {
  font-size: 40px;
  background: none;
  border: none;
  cursor: pointer;
}

.booking-content {
  display: flex;
  gap: 0;
}

.booking-left, .booking-right {
  flex: 1;
}
.booking-right{
border: 1px black solid;
padding: 30px;
margin-right: 190px;
height: 700px;
}
.booking-left{
width: 400px;
margin-left: 100px;
}
.book-t-te {
  font-family: Forum;
  font-size: 32px;
  color: #9D8665;
  margin-top: -7px;
}

.book-sub-t {
  font-family: Roboto;
  font-size: 18px;
  color: #710707;
  margin-top: -10px;
}

.book-line {
  width: 400px;
  height: 3px;
  background: #740C11;
  margin: 10px 0 20px;
}

.form-row {
  display: flex;
  gap: 10px;
  width: 423px;
}

.form-group {
  display: flex;
  align-items: center;
  border: 1px solid black;
  padding: 0 10px;
  height: 45px;
  width: 400px;
  margin-top: 10px;
}

.form-group .icon {
  margin-right: 8px;
}

.form-group input,
.form-group select {
  border: none;
  outline: none;
  width: 100%;
  font-size: 16px;
  background: transparent;
}

.entry-title {
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
text-transform: capitalize;
color: #9D8665;
}

.ticket-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 10px;
}
.tickets-boxina{
border: 1px black solid;
width: 400px;
height: 135px;
padding: 10px;
margin-top: 10px;
}
.senior-book{
font-family: Roboto;
font-weight: 400;
font-size: 18px;
line-height: 100%;
color: black;
}
.entry-line{
background-color: #740C11;
width: 370px;
height: 2px;
}
.booking-counter {
  display: flex;
  align-items: center;
  border: 1px solid black;
}

.booking-counter input {
  width: 40px;
  text-align: center;
  border: none;
  outline: none;
  background: transparent;
}

.booking-counter button {
  width: 30px;
  height: 30px;
  border: none;
  background: black;
  color: white;
  cursor: pointer;
}
.overview-subtitle{
font-family: Roboto;
font-weight: 500;
font-size: 22px;
color: #740C11;
line-height: 100%;
}
#overviewDate{
padding-left: 5px;
}
.overview-title {
font-family: Roboto;
font-weight: 500;
font-size: 32px;
line-height: 100%;
color: black;
}
.bookimg{
position: absolute;
top: 132px;
left: 870px;
}
#overviewSenior{
padding-left: 5px;
font-family: Roboto;
font-weight: 300;
font-size: 18px;
line-height: 100%;
color: black;
}
.total-booked-line{
width: 470px;
height: 2px;
background-color: #740C11;
}
#overviewBasic{
padding-left: 5px;
font-family: Roboto;
font-weight: 300;
font-size: 18px;
line-height: 100%;
color: black;
}
.total-cost{
font-family: Roboto;
font-weight: 400;
font-size: 32px;
color: black;
line-height: 100%;
}
#overviewType{
padding-left: 5px;
font-family: Roboto;
font-weight: 300;
font-size: 18px;
line-height: 100%;
color: black;
}
#overviewTime{
padding-left: 5px;
font-family: Roboto;
font-weight: 300;
font-size: 18px;
line-height: 100%;
color: black;
}
.overview-item {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 8px;
}
#overviewTotal{
padding-left: 5px;
font-family: Roboto;
font-weight: 500;
font-size: 32px;
line-height: 100%;
color: black;
}
.overview-total {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  font-size: 18px;
}
.creditcard-firstpart{
position: absolute;
top: 505px;
left: 745px;
}
.creditcard-secondpart{
position: absolute;
top: 490px;
left: 630px;
}
.date-booked{
font-family: Roboto;
font-weight: 300;
font-size: 18px;
line-height: 100%;
color: black;
margin-left: 3px;
}
.btn-confirmbook{
width: 220px;
height: 45px;
background-color: #740C11;
display: flex;
justify-content: center;
align-items: center;
position: absolute;
top: 768px;
left: 850px;
cursor: pointer;
z-index: 99;
}
.confirm-text{
font-family: Roboto;
font-weight: 400;
font-size: 22px;
line-height: 100%;
color: white;
}

/* MEDIA */
@media screen and (max-width: 1024px) {
.list-header{
display: none;
}
.logo-block{
padding-bottom: 24px;
padding-left: 1px;
}
.tittle{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 90px;
letter-spacing: 5px;
text-transform: uppercase;
}
.subtittle{
font-family: Roboto;
font-weight: 300;
font-size: 24px;
line-height: 100%;
letter-spacing: 2px;
bottom: 83px;
left: 1px;
}
.welcome-texts{
padding-left: 1px;
margin-top: -94px;
}
.button-discover{
width: 300px;
height: 60px;
border-radius: 10px;
margin-top: 103px;
}
.btn-text{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 100%;
letter-spacing: 2px;
text-align: center;
padding-top: 19px;
padding-left: 1px;
}
.welcome_liza{
width: 700px;
height: 525px;
position: absolute;
left: -208px;
top: -20px;
}
.welcome-first-half{
width: 512px;
height: 585px;
}
.welcome-second-half{
width: 512px;
height: 585px;
}
.welcome-section{
height: 565px;
}
.slider{
width: 700px;
height: 120px;
bottom: 20px;
right: 0px;
}
.text-slider{
font-family: Roboto;
font-weight: 400;
font-size: 20px;
line-height: 40px;
text-transform: uppercase;
letter-spacing: 2px;
bottom: 5px;
right: 353px;
}
.square{
width: 12px;
height: 12px;
}
.squares{
padding-top: 0;
margin-left: 147px;
}
.squareun{
width: 12px;
height: 12px;
}
.arrow-left{
bottom: 42px;
right: 75px;
}
.arrow-right{
bottom: 42px;
right: 25px;
}
.visiting-section{
height: 1307px;
width: 984px;
}
.title-visblock{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 19px;
padding-left: 20px;
}
.sub-line{
margin-top: -22px;
margin-left: 20px;
width: 984px;
}
.cards-row{
justify-content: space-evenly;
}
.card{
width: 330px;
height: 345px;
}
.card-colo{
width: 330px;
height: 345px;
}
.card-denon{
width: 330px;
height: 345px;
}
.card-greek{
width: 330px;
height: 345px;
}
.card-mona{
width: 330px;
height: 345px;
}
.card-night{
width: 330px;
height: 345px;
}
.card-text{
top: 198px;
left: 22px;
}
.card-line{
top: 265px;
left: 23px;
width: 150px;
height: 2px;
}
.card-image{
width: 330px;
height: 215px;
position: absolute;
left: 20px;
top: -17px;
}
.card-image-2{
width: 330px;
height: 215px;
position: absolute;
left: 20px;
top: 43px;
}
.card-image-3{
width: 330px;
height: 215px;
position: absolute;
left: 21px;
top: 105px;
}
.card-text{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
}
.card-text-denon{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
top: 198px;
left: 21px;
}
.card-line-denon{
width: 150px;
height: 2px;
top: 265px;
left: 23px;
}
.card-second-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 257px;
left: 23px;
}
.card-third-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 295px;
left: 22px;
}
.card-text-colo{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
white-space: nowrap;
left: 24px;
top: 259px;
}
.card-text-greek{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
white-space: nowrap;
left: 22px;
top: 259px;
}
.card-text-mona{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 22px;
top: 319px;
}
.card-line-mona{
width: 150px;
height: 2px;
top: 385px;
left: 22px;
}
.card-second-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 378px;
left: 22px;
}
.card-third-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 416px;
left: 22px;
}
.card-text-night{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 22px;
top: 319px;
}
.card-line-night{
width: 150px;
height: 2px;
top: 385px;
left: 22px;
}
.card-second-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 378px;
left: 22px;
}
.card-third-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 416px;
left: 22px;
}
.card-line-greek{
width: 150px;
height: 2px;
top: 325px;
left: 23px;
}
.card-second-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 318px;
left: 23px;
}
.card-third-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 356px;
left: 23px;
}
.card-line-colo{
width: 150px;
height: 2px;
top: 325px;
left: 23px;
}
.card-second-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 318px;
left: 23px;
}
.card-third-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 356px;
left: 23px;
}
.card-second-text{
font-family: Roboto;
font-weight: 200;
font-size: 20px;
line-height: 100%;
top: 257px;
left: 23px;
}
.card-third-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 295px;
left: 22px;
}
.container{
width: 984px;
}
.explore-title{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 60px;
margin-left: -8px;
}
.explore-subline{
top: 155px;
margin-left: 1px;
width: 984px;
}
.exp-sub-text{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 38.5px;
white-space: nowrap;
top: 198px;
left: -3px;
}
.Explore-section{
height: 1149px;
}
.explore-img{
position: absolute;
top: 2447px;
left: 144px;
}
.rightside{
height: 1px;
}
.exp-sub-sec-text{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 35px;
white-space: nowrap;
top: 237px;
left: -3px;
}
.explore_inner{
display: initial;
}
.gap {
display: none;
}
.exp-sub-thi-text{
display: none;
}
.video-subtitle{
display: none;
}
.video-title{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-left: 1px;
padding-top: 19px;
}
.main-poster{
width: 984px;
height: 444px;
margin-left: 0px;
margin-top: -2px;
}
.video-options{
height: 60px;
margin-left: 0px;
}
footer{
height: 369px;
}
.general-button{
width: 152px;
height: 152px;
top: 321px;
left: 436px;
}
.img-opt{
width: 30px;
height: 30px;
padding-left: 36px;
}
.img-full{
padding-right: 40px;
width: 26px;
height: 26px;
}
.progress{
width: 571px;
height: 5px;
}
.progress-volume{
width: 143px;
height: 5px;
}
.img-vol{
width: 26px;
height: 20px;
padding-right: 10px;
}
.first-video{
width: 300px;
height: 170px;
padding-left: 0px;
}
.second-video{
width: 300px;
height: 170px;
padding-left: 41px;
}
.third-video{
width: 300px;
height: 170px;
padding-left: 43px;
}
.menu_inner{
margin-left: 0px;
margin-top: 39px;
}
.gallery-title{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-left: 0px;
padding-top: 19px;
}
.gallery-section{
height: 1460px;
margin-top: -245px;
}
.column-photo11{
width: 304px;
height: 304px;
}
.column-photo12{
width: 304px;
height: 380px;
}
.column-photo13{
width: 304px;
height: 304px;
}
.column-photo14{
width: 304px;
height: 155px;
}
.column-1{
margin-top: 35px;
}
.column-photo21{
width: 304px;
height: 380px;
}
.column-photo22{
width: 304px;
height: 380px;
}
.column-photo23{
width: 304px;
height: 228px;
}
.column-photo24{
width: 304px;
height: 205px;
}
.column-2{
margin-top: 35px;
}
.column-photo31{
width: 304px;
height: 228px;
}
.column-photo32{
width: 304px;
height: 380px;
}
.column-photo33{
width: 304px;
height: 304px;
}
.column-photo34{
width: 304px;
height: 231px;
}
.column-3{
margin-top: 35px;
}
.tickets-section{
height: 598px;
}
.tickets-title{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-left: 0px;
padding-top: 19px;
}
.title-subline{
margin-left: 0px;
margin-top: -22px;
}
.ticket-image{
width: 700px;
height: 440px;
margin-top: -15px;
}
.ticket-text{
display: none;
}
.radio-row{
display: none;
}
.Amount-t{
top: -41px;
left: 288px;
}
.basic-t{
top: 28px;
left: 288px;
}
.btn-count{
width: 174px;
height: 51px;
top: 81px;
left: 287px;
}
.senior-t{
top: 143px;
left: 289px;
}
.btn-count-2{
top: 196px;
left: 288px;
width: 173px;
}
.total-t{
top: 248px;
left: 288px;
letter-spacing: 1.99px;
}
.btn-buy{
top: 375px;
left: 288px;
}
.parallax{
margin-top: 79px;
background-size: auto;
}
.contacts-section{
height: 614px;
}
.contacts-title{
font-family: Forum;
font-weight: 400;
font-size: 50px;
line-height: 75px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 19px;
padding-left: 0px;
}
.nameof{
font-family: Roboto;
font-weight: 500;
font-size: 24px;
line-height: 100%;
top: 40px;
left: -1px;
}
.address-t{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 100%;
top: 132px;
left: 0px;
}
.phone-t{
top: 169px;
left: 0px;
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 100%;
}
.progress::-webkit-slider-thumb {
width: 13px;
height: 13px;
}
.progress-volume::-webkit-slider-thumb {
width: 13px;
height: 13px;
}
.mail-t{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 100%;
top: 206px;
left: -2px;
}
.map{
width: 694px;
height: 454px;
top: 60px;
left: -5px;
}
footer{
margin-top: 78px;
}
.logo-footer-block{
padding-top: 49px;
margin-left: 0px;
}
.logo-footer{
padding-right: 4px;
}
.logo-text-footer{
padding-left: 21px;
padding-top: 7px;
}
.navigation-block{
left: 137px;
top: 27px;
justify-content: space-evenly;
}
.footer-s-navigation{
padding-left: 100px;
}
.footer-makeby{
margin-top: 29px;
margin-left: 0px;
}
.footer-line{
margin-top: 50px;
}
.list2{
padding-left: 116px;
}
.icons-block{
width: 400px;
margin-left: 425px;
margin-top: 145px;
}
.frame-f{
margin-left: 23px;
}
.burger{
display: flex;
margin-top: -23px;
}
.header-navigation{
display: none;
flex-direction: column;
position: fixed;
height: 615px;
width: 414px;
left: 0;
top: 100px;
z-index: 9999;
overflow-y: auto;
background-color: black;
}
.list-header{
flex-direction: column;
display: flex;
row-gap: 30px;
}
.header-navigation.open {
  display: flex;
}
.list-header{
row-gap: 26px;
right: 258px;
}

@media screen and (max-width: 768px) {
.container{
width: 728px;
}
.logo-block{
margin-top: -12px;
}
.burger{
margin-top: -40px;
}
header{
height: 110px;
}
.welcome-section{
height: 861px;
}
.button-discover{
display: none;
}
.tittle{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-align: center;
text-transform: uppercase;
position: absolute;
top: 61px;
left: 201px;
}
.subtittle{
font-family: Roboto;
font-weight: 300;
font-size: 20px;
line-height: 100%;
letter-spacing: 2px;
bottom: 184px;
left: 199px;
}
.welcome_liza{
width: 728px;
height: 546px;
left: -363px;
top: 215px;
}
.slider{
width: 700px;
height: 98px;
bottom: -275px;
right: 88px;
}
.visiting-section{
height: 1102px;
}
.title-visblock{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 0;
padding-left: 0;
margin-top: 40px;
margin-left: -109px;
}
.sub-line{
width: 728px;
margin-left: -108px;
margin-top: -13px;
}
.card-image{
width: 280px;
height: 180px;
left: 19px;
top: 18px;
}
.card{
margin-right: -47px;
}
.card-colo{
margin-right: -47px;
}
.card-denon{
margin-right: -47px;
}
.card-greek{
margin-right: -47px;
}
.card-mona{
margin-right: -47px;
}
.card-night{
margin-right: -47px;
}
.cards-row{
margin-left: -125px;
margin-top: 22px;
}
.card-text{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
top: 202px;
left: 19px;
}
.card-line{
top: 257px;
left: 19px;
}
.card-second-text{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
top: 253px;
left: 19px;
}
.card-third-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 286px;
}
.card-text-denon{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
top: 202px;
left: 17px;
}
.card-line-denon{
top: 257px;
left: 18px;
}
.card-second-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
top: 253px;
left: 19px;
}
.card-third-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 286px;
}
.card-image-2{
width: 280px;
height: 180px;
left: 18px;
top: 14px;
}
.card-text-colo{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 18px;
top: 199px;
}
.card-line-colo{
top: 253px;
left: 19px;
}
.card-second-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
left: 19px;
top: 249px;
}
.card-third-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 282px;
left: 18px;
}
.card-text-greek{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 18px;
top: 199px;
}
.card-line-greek{
top: 253px;
left: 18px;
}
.card-second-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
left: 19px;
top: 249px;
}
.card-third-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 282px;
left: 18px;
}
.card-image-3{
width: 280px;
height: 180px;
left: 19px;
top: 10px;
}
.card-text-mona{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 19px;
top: 194px;
}
.card-line-mona{
top: 249px;
left: 19px;
}
.card-second-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
top: 245px;
left: 18px;
}
.card-third-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 278px;
}
.card-text-night{
font-family: Forum;
font-weight: 400;
font-size: 22px;
line-height: 100%;
letter-spacing: 3px;
text-transform: uppercase;
left: 19px;
top: 194px;
}
.card-line-night{
top: 249px;
left: 18px;
}
.card-second-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
top: 245px;
left: 18px;
}
.card-third-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 278px;
}
.explore-title{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 41px;
margin-left: -8px;
}
.leftside{
width: 54%;
}
.explore-subline{
top: 120px;
width: 728px;
margin-left: 0;
}
.exp-sub-text{
display: none;
}
.exp-sub-sec-text{
display: none;
}
.exp-sub-thi-text{
display: none;
}
.explore-img{
top: 2270px;
left: 12px;
width: 728px;
height: 705px;
}
.Explore-section{
height: 908px;
}
.video-section{
height: 1082px;
}
.video-title{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 7px;
padding-left: 0;
}
.main-poster{
width: 728px;
height: 386px;
margin-left: 0;
margin-top: -13px;
}
.general-button{
width: 80px;
height: 80px;
top: 245px;
left: 344px;
}
.progress{
width: 724px;
height: 5px;
position: absolute;
top: -3px;
left: -2px;
}
.third-video{
display: none;
}
.first-video{
width: 354px;
height: 199px;
}
.second-video{
width: 354px;
height: 199px;
padding-left: 20px;
}
.img-opt{
position: absolute;
top: 17px;
left: -10px;
}
.img-vol{
top: 23px;
left: 89px;
position: absolute;
}
.img-full{
position: absolute;
top: 19px;
right: -9px;
}
.progress-volume{
top: 27px;
left: 147px;
position: absolute;
width: 485px;
}
.video-options{
position: absolute;
height: 60px;
top: 446px;
width: 728px;
}
.video-row{
margin-top: 20px;
}
.menu_inner{
margin-left: -1px;
margin-top: 20px;
}
.btns{
width: 190px;
}
.circle{
width: 10px;
height: 10px;
}
.circle-first{
width: 10px;
height: 10px;
}
.gallery-section{
height: 1220px;
}
.gallery-title{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-left: 0;
padding-top: 7px;
}
.progress::-webkit-slider-thumb {
width: 13px;
height: 13px;
}
.progress-volume::-webkit-slider-thumb {
width: 13px;
height: 13px;
}
.column-3{
display: none;
}
.column-1{
overflow: hidden;
}
.column-photo11{
width: 352px;
height: 331px;
}
.column-photo12{
width: 352px;
height: 440px;
}
.column-photo13{
width: 352px;
height: 191px;
}
.column-photo14{
display: none;
}
.column-photo21{
width: 352px;
height: 264px;
}
.column-photo22{
width: 352px;
height: 264px;
}
.column-photo23{
width: 352px;
height: 440px;
}
.column-photo24{
width: 352px;
height: 40px;
}
.gallery-columns{
column-gap: 24px;
}
.column-2{
transform: translateY(-70px);
}
.tickets-title{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 7px;
}
.title-subline{
margin-top: -13px;
}
.ticket-image{
width: 444px;
height: 340px;
margin-top: -35px;
}
.Amount-t{
top: -61px;
left: 140px;
}
.basic-t{
top: 17px;
left: 141px;
}
.btn-count{
top: 70px;
left: 140px;
}
.senior-t{
top: 129px;
left: 141px;
}
.btn-count-2{
top: 182px;
left: 140px;
}
.total-t{
top: 245px;
left: 140px;
}
.btn-buy{
top: 345px;
left: 140px;
}
.parallax{
width: 768px;
height: 300px;
margin-top: 2px;
}
.contacts-title{
font-family: Forum;
font-weight: 400;
font-size: 40px;
line-height: 60px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 7px;
}
.nameof{
font-family: Roboto;
font-weight: 500;
font-size: 20px;
line-height: 100%;
top: 22px;
left: 0;
}
.address-t{
left: 0px;
top: 109px;
white-space: nowrap;
font-size: 18px;
}
.phone-t{
font-size: 18px;
top: 146px;
left: -1px;
}
.mail-t{
left: 0px;
top: 181px;
font-size: 18px;
}
.contacts-section{
height: 814px;
}
.map{
width: 728px;
height: 476px;
top: 258px;
left: -218px;
}
.logo-footer-block{
padding-top: 37px;
}
.footer-li-text{
font-family: Roboto;
font-weight: 200;
font-size: 18px;
line-height: 100%;
letter-spacing: 2px;
padding-top: 25px;
}
.footer-f-navigation{
width: 183px;
}
.navigation-block{
left: 220px;
top: 14px;
}
.icons-block{
margin-left: 79px;
margin-top: 219px;
}
.footer-line{
margin-top: 41px;
}
.footer-makeby{
margin-top: 18px;
}
.list-header{
right: 565px;
top: 19px;
row-gap: 26px;
}
.header-navigation{
width: 100%;
height: 871px;
}
.nav-big-img{
display: block;
width: 656px;
height: 194px;
position: absolute;
top: 333px;
left: 55px;
}
.nav-small-img{
display: block;
width: 319px;
height: 161px;
position: absolute;
top: 546px;
left: 55px;
}
.nav-second-small-img{
display: block;
width: 319px;
height: 161px;
position: absolute;
top: 546px;
right: 7px;
}
.icons-block-header{
display: flex;
position: absolute;
top: 777px;
left: 190px;
}
.line-burger{
display: block;
width: 658px;
height: 1px;
background-color: white;
position: absolute;
top: 743px;
left: 54px;
}
}
@media screen and (max-width: 420px) {
.container{
width: 380px;
}
header{
height: 90px;
}
.welcome-section{
height: 544px;
}
.svg-block{
width: 29px;
height: 16px;
background-size: cover;
margin-top: 16px;
}
.titleoflogo{
font-family: Forum;
font-weight: 400;
font-size: 16px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
}
.burger{
margin-top: -60px;
padding-right: 0px;
z-index: 9999;
}
.tittle{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-align: center;
text-transform: uppercase;
top: 77px;
left: 64px;
}
.subtittle{
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
letter-spacing: 2px;
left: 52px;
bottom: 225px;
}
.welcome_liza{
width: 380px;
height: 285px;
left: -190px;
top: 179px;
}
.square{
width: 7px;
height: 7px;
margin-left: 10px;
}
.squareun{
width: 7px;
height: 7px;
}
.squares{
width: 75px;
height: 7px;
margin-left: 114px;
margin-top: -1px;
}
.slider{
width: 262px;
height: 30px;
bottom: 65px;
right: 115px;
}
.absolute_inner{
width: 230px;
height: 40px;
}
.text-slider{
font-family: Roboto;
font-weight: 400;
font-size: 16px;
line-height: 40px;
vertical-align: middle;
text-transform: uppercase;
bottom: -15px;
right: 117px;
}
.arrow-left{
width: 20px;
height: 8px;
bottom: 17px;
right: -22px;
}
.arrow-right{
width: 20px;
height: 8px;
bottom: 17px;
right: -55px;
}
.title-visblock{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
margin-left: -282px;
}
.sub-line{
width: 380px;
margin-top: -3px;
margin-left: -282px;
}
.visiting-section{
height: 2029px;
}
.cards-row{
margin-left: -300px;
}
.card-text{
top: 200px;
left: 17px;
}
.card-line{
left: 19px;
top: 253px;
}
.card-second-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 251px;
left: 18px;
}
.card-third-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 280px;
left: 18px;
}
.card-denon{
margin-top: -10px;
}
.card-text-denon{
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
top: 206px;
left: 19px;
}
.card-line-denon{
top: 253px;
left: 19px;
}
.card-second-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 251px;
left: 18px;
}
.card-third-text-denon{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 280px;
}
.card-colo{
margin-right: -49px;
margin-top: -6px;
}
.card-text-colo{
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
left: 18px;
top: 202px;
}
.card-line-colo{
top: 249px;
left: 18px;
}
.card-second-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
left: 18px;
top: 246px;
}
.card-third-text-colo{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 276px;
left: 17px;
}
.card-greek{
margin-right: -49px;
margin-top: -10px;
}
.card-text-greek{
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
top: 202px;
left: 17px;
}
.card-line-greek{
top: 249px;
}
.card-second-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 247px;
left: 17px;
}
.card-third-text-greek{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 276px;
left: 17px;
}
.card-mona{
margin-right: -48px;
margin-top: -6px;
}
.card-text-mona{
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
left: 19px;
top: 198px;
}
.card-line-mona{
top: 245px;
}
.card-second-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 242px;
left: 18px;
}
.card-third-text-mona{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 272px;
}
.card-night{
margin-top: -10px;
}
.card-text-night{
font-family: Forum;
font-weight: 400;
font-size: 18px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
left: 19px;
top: 198px;
}
.card-line-night{
left: 19px;
top: 245px;
}
.card-second-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 243px;
}
.card-third-text-night{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
top: 272px;
}
.Explore-section{
height: 551px;
}
.explore-title{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 41px;
margin-left: -8px;
white-space: nowrap;
}
.explore-img{
width: 380px;
height: 368px;
top: 2840px;
}
.explore-subline{
width: 380px;
top: 100px;
}
.video-title{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 14px;
}
.main-poster{
width: 380px;
height: 172px;
margin-top: -4px;
}
.general-button{
width: 50px;
height: 50px;
top: 157px;
left: 185px;
}
.video-options{
width: 380px;
height: 62px;
top: 260px;
}
.img-opt{
width: 14px;
height: 18px;
top: 28px;
left: -16px;
}
.img-vol{
width: 18px;
height: 14px;
top: 30px;
left: 64px;
}
.progress-volume{
top: 31px;
left: 108px;
width: 200px;
height: 4px;
}
.img-full{
width: 18px;
height: 18px;
right: -20px;
top: 28px;
}
.progress{
width: 376px;
height: 4px;
top: 3px;
left: -2px;
}
.progress::-webkit-slider-thumb {
width: 10px;
height: 10px;
}
.progress-volume::-webkit-slider-thumb {
width: 10px;
height: 10px;
}
.first-video{
width: 180px;
height: 101px;
}
.second-video{
width: 180px;
height: 101px;
}
.video-row{
margin-top: 94px;
}
.menu_inner{
margin-top: 40px;
}
.btns{
width: 174px;
height: 8px;
}
.circle-first{
width: 8px;
height: 8px;
}
.circle{
width: 8px;
height: 8px;
}
.arrows{
width: 7px;
height: 8px;
}
.gallery-section{
margin-top: -531px;
height: 757px;
}
.gallery-title{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 18px;
}
.column-photo11{
width: 178px;
height: 223px;
}
.column-photo12{
width: 178px;
height: 223px;
}
.column-photo21{
width: 178px;
height: 223px;
}
.column-photo22{
width: 178px;
height: 178px;
}
.column-photo23{
width: 178px;
height: 133px;
}
.column-photo24{
width: 178px;
height: 30px;
}
.column-photo13{
width: 178px;
height: 93px;
}
.column-1{
margin-top: 14px;
}
.tickets-section{
height: 679px;
}
.tickets-title{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 18px;
}
.title-subline{
margin-top: -4px;
}
.ticket-image{
width: 380px;
height: 160px;
}
.Amount-t{
top: 150px;
left: -30px;
font-family: Roboto;
font-weight: 700;
font-size: 16px;
line-height: 100%;
}
.basic-t{
top: 190px;
left: -89px;
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
}
.btn-count{
top: 236px;
left: -89px;
}
.btn-count-2{
top: 340px;
left: -89px;
}
.senior-t{
top: 294px;
left: -88px;
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
}
.total-t{
top: 418px;
left: -41px;
font-family: Roboto;
font-weight: 700;
font-size: 16px;
line-height: 100%;
letter-spacing: 0px;
}
.buynow-t{
font-family: Roboto;
font-weight: 300;
font-size: 16px;
letter-spacing: 2px;
}
.btn-buy{
top: 491px;
left: -88px;
}
.parallax{
width: 420px;
height: 300px;
background-size: auto;
background-repeat: round;
background-attachment: local;
margin-top: 57px;
}
.contacts-title{
font-family: Forum;
font-weight: 400;
font-size: 28px;
line-height: 40px;
letter-spacing: 5px;
text-transform: uppercase;
padding-top: 17px;
}
.nameof{
font-family: Roboto;
font-weight: 500;
font-size: 16px;
line-height: 100%;
white-space: nowrap;
top: 28px;
}
.address-t{
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
left: -1px;
top: 104px;
}
.phone-t{
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
top: 138px;
white-space: nowrap;
}
.mail-t{
font-family: Roboto;
font-weight: 300;
font-size: 16px;
line-height: 100%;
white-space: nowrap;
left: -1px;
top: 172px;
}
.map{
width: 380px;
height: 248px;
top: 245px;
left: -114px;
}
footer{
margin-top: -201px;
height: 400px;
}
.logo-text-footer{
font-family: Forum;
font-weight: 400;
font-size: 16px;
line-height: 100%;
letter-spacing: 5px;
text-transform: uppercase;
padding-left: 17px;
padding-top: 6px;
}
.logo-footer{
width: 29px;
height: 16px;
}
.logo-footer-block{
padding-top: 23px;
}
.icons-block{
margin-left: -106px;
margin-top: 208px;
}
.frame-f{
margin-left: 4px;
}
.makeby-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 22px;
letter-spacing: 2px;
white-space: nowrap;
}
.makeby-text-s{
display: none;
}
.footer-li-text{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
letter-spacing: 2px;
padding-top: 30px;
}
.navigation-block{
left: -75px;
top: 58px;
}
.footer-li-text-v{
position: absolute;
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
letter-spacing: 2px;
top: 17px;
left: 200px;
}
.footer-li-text-g{
position: absolute;
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
letter-spacing: 2px;
top: 66px;
left: 200px;
}
.list2{
padding-left: 182px;
margin-top: 16px;
}
.scroll{
font-family: Roboto;
font-weight: 200;
font-size: 16px;
line-height: 100%;
letter-spacing: 2px;
}
.header-navigation{
width: 420px;
height: 534px;
}
.header-navigation.open{
display: flex;
}
.list-header{
right: 285px;
top: 8px;
}
.nav-big-img{
width: 95px;
height: 95px;
top: 323px;
left: 163px;
background-size: cover;
}
.nav-second-small-img{
width: 95px;
height: 95px;
top: 323px;
background-size: cover;
right: 55px;
}
.nav-small-img{
width: 95px;
height: 95px;
top: 323px;
background-size: cover;
}
.line-burger{
top: 438px;
left: 55px;
width: 310px;
}
.icons-block-header{
top: 461px;
left: 74px;
}
}
}