/* Add your styles here */

body {
  font-family: "Lato", sans-serif;
}


/* Main content */
.main {
  padding-top: 45px;
  text-align: center;
  margin-right: 10px;
  margin-left: 10px;
  font-size: 20px; /*Increased text to enable scrolling */
  /* padding: 0px 10px; */
  line-height: 32px;   /* within paragraph */
  margin-bottom: 30px; /* between paragraphs */
}
.main p.big {
  padding-top: 35px;
  font-size: 30px;
  line-height: 1.6;   /* within paragraph */
}
.main p.text {
  font-size: 20px;
}
p.mid {
  margin-top: 15px;
  font-family:Arial;
  font-style: italic;
}

p.small {
  margin-top: 15px;
  font-family: Lucida;
  font-style: italic;
  text-align: center;
  margin-bottom: 15px;
  font-size: 4px;
}

p.promo {
  margin-top: 20px
}

body {
  background-image: url('nigtclub.avif');
  color: rgb(244, 217, 9);
  font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
}

/* main pic */
.logo1 img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  /* padding-right: 130px; */
  padding-top: 30px;
  max-width: 35%;
  /* mix-blend-mode: multiply; */
}

.logo1 img:hover {
  transition: transform .4s;
  transform: scale(1.3); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.logo2 img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  /* padding-right: 130px; */
  padding-top: 30px;
  max-width: 55%;
  mix-blend-mode: multiply;
}

.homelogo img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  padding-right: 10px;
  max-width: 25%;
  mix-blend-mode: multiply;
}

h1 {
    /* background: black; */
  text-align: center;
  padding: 20px;

}

/* Photosssssssssssssssssssssssssssssss */
.features{
  /* margin-right: 120px; Same as the width of the sidenav */
  text-align: center;
  font-size: 20px; /* Increased text to enable scrolling */
  padding: 0px 0px;
  color: gray;
  display: flex;
  flex-direction: column;
  padding: 0px;
  margin: 10px;
}

.features figure img{
  margin: 10px;

  border-radius: 5%;
  box-shadow: white, 0, 0, 2000px;
  width:  340px;
  height: 580px;
  object-fit: cover;
}

@media (hover: hover) {
  .features figure img:hover{
    transition: transform .4s;
    transform: scale(1.08); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }
  }



/* HEART Likeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee COUNTER */
.container{
  /* background-color:#eee; */
  height:10vh;
  display:flex;
  justify-content:center;
  align-items:center;
}

.heart{
   background-color:#0b82f0;
   height:40px;
   width:40px;
   display:flex;
   justify-content:center;
   align-items:center;
   border-radius:10px;
   font-size:19px;
   cursor:pointer;
   transition:all 0.5s;
   position:relative;
   
  
}

.heart:hover{
   color:#9cf905;
   background-color:#fb076d40;
}

.heart .counter{
   position:absolute;
   display:flex;
   justify-content:center;
   align-items:center;
   color:#0e0303;
   border-radius:10px;
   z-index:-1;
   font-size:16px;
   height:35px;
   width:35px;
   background-color:#f15ca7;
    
}

.heart:hover .counter{
   animation: anim 1s forwards; 
   z-index:1;
   
}

@keyframes anim{
   from{
       top:0px;
   }
   
   to{
       top:-38px;
   }
   
}
/* List Description */
.main ul {
  display: block;
  list-style-type: disc;
  display: table;
  margin: 0 auto;
  /* padding-right: 35px; */
}


/* Index Page */
.mainDisclaimer {
  text-align: center;
  margin-bottom: 50px;

}
.enter {
  text-align: center;
  margin-right: 50px;
  font-size: 25px;
  margin-bottom: 40px;
}

.exit {
  text-align: center;
  margin-bottom: 50px;
  margin-right: 50px;
  font-size: 25px;
}

.divider{
  width:85px;
  height:auto;
  display:inline-block;
}

.buttons {
  text-align: center;

}
.button1 {
  background-color: green; /* Green */
  border: round;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  border-radius: 80%;
}
.button2 {
  background-color: gray; /* Green */
  border: round;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  border-radius: 80%;
}

footer {
  background: black;
  padding: 10px 20px;
}

.wrapper {
  width: 100%;
  height: 10vh;
  text-align: center;

  }