section.gallery{
  position: relative;
  padding: 10px 0;
  font-family: 'Montserrat', sans-serif;
}
h2.title{
  font-size: 44px;
  font-weight: bold;
  text-align: center;
  padding-bottom: 45px;
  position: relative;
}
h2.title:after{
  content: "";
  position: absolute;
  width: 100px;
  height: 3px;
  background-color: #111111;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
}
.gallery-list{
  position: relative;
  flex-wrap: wrap;
  overflow: hidden;
  font-size: 0;
}
.gallery-item{
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
.gallery-item-hover{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,.7);
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  opacity: 0;
  transition: opacity .5s ease;
  z-index: 2;
}
.gallery-item:hover .gallery-item-hover{
  opacity: 1;
}
.gallery-item:hover img{
  transform: scale(1.3) rotate(5deg);
}
.gallery-item img{
  max-width: 100%;
  transition: all .5s ease;
  min-width: 100%;
  min-height: 100%;
  flex-shrink: 0;
}
@media (max-width: 991px){
  .gallery-item{
    flex: 33.3%;
  }
}
@media (max-width: 768px){
  .gallery-item{
    flex: 50%;
  }
}
@media (max-width: 530px){
  .gallery-item{
    flex: 100%;
  }
}



.container__gallery {
 width: 1070px;
 margin: auto;
 padding-top: 15px;
}


.grid-paradise {
	display: grid;
	gap: 10px;
	grid-template-rows: repeat(4, 230px);
	grid-auto-rows: 380px;
	grid-template-areas:
			"gp1 gp1 gp6 gp6"
			"gp1 gp1 gp4 gp4"
			"gp5 gp3 gp2 gp2"
			"gp5 gp3 gp2 gp2";
}

.gp1 { grid-area: gp1; }
.gp2 { grid-area: gp2; }
.gp3 { grid-area: gp3; }
.gp4 { grid-area: gp4; }
.gp5 { grid-area: gp5; }
.gp6 { grid-area: gp6; }


.grid-holmi {
	display: grid;
	gap: 10px;
	grid-template-rows: repeat(4, 230px);
	grid-auto-rows: 380px;
	grid-template-areas:
			"gh1 gh1 gh5 gh5"
			"gh1 gh1 gh3 gh3"
			"gh6 gh7 gh4 gh4"
			"gh6 gh7 gh4 gh4";
}

.gh1 { grid-area: gh1; }
.gh3 { grid-area: gh3; }
.gh4 { grid-area: gh4; }
.gh5 { grid-area: gh5; }
.gh6 { grid-area: gh6; }
.gh7 { grid-area: gh7; }


.grid-spa {
	display: grid;
	gap: 10px;
	grid-template-rows: repeat(4, 230px);
	grid-auto-rows: 380px;
	grid-template-areas:
			"gspa1 gspa1 gspa2 gspa3"
			"gspa1 gspa1 gspa2 gspa3"
			"gspa5 gspa6 gspa4 gspa4"
			"gspa5 gspa6 gspa4 gspa4"
                "gspa7 gspa7 gspa8 gspa8"
                "gspa7 gspa7 gspa9 gspa9"
                "gspa10 gspa11 gspa12 gspa12"
                "gspa10 gspa11 gspa12 gspa12"
            "gspa13 gspa13 gspa14 gspa15"
            "gspa13 gspa13 gspa14 gspa15"
            "gspa16 gspa17 gspa18 gspa18"
            "gspa16 gspa17 gspa18 gspa18"
                "gspa19 gspa20 gspa20 gspa21"
                "gspa19 gspa22 gspa23 gspa21"
                "gspa24 gspa22 gspa23 gspa26"
                "gspa24 gspa25 gspa25 gspa26";
}

.gspa1 { grid-area: gspa1; }
.gspa2 { grid-area: gspa2; }
.gspa3 { grid-area: gspa3; }
.gspa4 { grid-area: gspa4; }
.gspa5 { grid-area: gspa5; }
.gspa6 { grid-area: gspa6; }

.gspa7 { grid-area: gspa7; }
.gspa8 { grid-area: gspa8; }
.gspa9 { grid-area: gspa9; }
.gspa10 { grid-area: gspa10; }
.gspa11 { grid-area: gspa11; }
.gspa12 { grid-area: gspa12; }

.gspa13 { grid-area: gspa13; }
.gspa14 { grid-area: gspa14; }
.gspa15 { grid-area: gspa15; }
.gspa16 { grid-area: gspa16; }
.gspa17 { grid-area: gspa17; }
.gspa18 { grid-area: gspa18; }

.gspa19 { grid-area: gspa19; }
.gspa20 { grid-area: gspa20; }
.gspa21 { grid-area: gspa21; }
.gspa22 { grid-area: gspa22; }
.gspa23 { grid-area: gspa23; }
.gspa24 { grid-area: gspa24; }
.gspa25 { grid-area: gspa25; }
.gspa26 { grid-area: gspa26; }


.title_gallery {
    text-align: center;
    font-family: 'Dancing Script', cursive;
    font-size: 55px;
    background: url(../img/logo_2.svg) no-repeat;
    height: 60px;
    line-height: 0.9em;
    background-position: center center;
    margin-bottom: 30px;
}

.nav_gallery {
    text-align: center;
    margin-bottom: 35px;
}

.title_hotel{
    font-size: 24px;
    font-family: 'Cormorant', italic;
    font-weight: 700;
    width: 1070px;
    margin: 35px auto 15px;
}

.title_up {
    margin-top: 35px;
}

.video_width {
    width: auto;
}

.gallery_activ {
    display: block;
}


/* 320px - 1070px*/
@media screen and (max-width: 1070px) {
.title_hotel, .container__gallery {
    width: 100%;
   }
.title_hotel {
    font-size: 20px;
    }
}  

/* 320px - 768px*/
@media screen and (max-width: 768px) {
    .nav_gallery, #nav-icon6 {
        background: none;
    }
}    
    
       

/* 320px - 576px*/
@media screen and (max-width: 576px) {
.gallery_activ {
    display: none;
}