body {
  background-image: linear-gradient(black, black);
  font-family: 'Cardo', serif;
  margin:0;
}


.top-banner{
  background-image: url(../images/TokyoBackground.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 260px;  
}

.small-logo{
  margin-top: -60%;
  margin-left: 17%;
}
.small-logo img{
transform: scale(0.7);
}

.stats{
  margin-left: 15%;
  margin-top: 25%;
  display: flex;
  orientation: row;
  color:goldenrod;
}


.wrap-icon{
  margin-right:20px;
}

.wrap-awards i{
  margin-left: 17px;
}
.wrap-awards .value{
margin-left: 16px;
}

.wrap-shopping i{
  margin-left: 27px;
}

.wrap-shopping .value{
  margin-left: 19px;
}

.wrap-scenery i{
  margin-left: 17px;
}

.wrap-scenery .value{
  margin-left: 4px;
}

.wrap-weather i{
  margin-left: 17px;
}

.wrap-weather .value{
  margin-left: 7px;
}

.info-text{
  margin-left:5%;
  margin-top: 5%;
  margin-bottom: 5%;
  padding: 5px;
  border-radius: 10px;
  width: 90%;
  border: 2px solid goldenrod;
}
.city-text{
color:goldenrod;
}

.image-slide{
  margin-top: 7%;
  margin-left: 10%;
  width: 80%;
}

.image-slide img{
  height: 220px;
}

.footer{
  color:white;
  font-size: 12px;
  margin-top: 5%;
  margin-left:20%
}

.book-button{
  margin-left: 36%;
}

@media (min-width: 600px){
.top-banner{
  margin-top: -10%;
  height: 650px;
}

.small-logo{
  margin-top: -65%;
  margin-left: 35%;
}
.small-logo img{
transform: scale(1);
}

.stats{
  margin-top: 20%;
  margin-left: 33%;
}

.footer{
  font-size: 15px;
  margin-left: 30%;
}

.image-slide img{
  height: 390px;
}
.image-slide{
  margin-top: 2%;
  margin-left: 10%;
  width: 80%;
}

.book-button{
  margin-left: 42%;
}

}

@media (min-width: 1024px){
  body{
    background-image: url(../images/TokyoBackground.jpg);
    background-repeat: no-repeat;
    background-position:top;
    background-size: cover;
    background-position-y: 20%;    
  }

  .top-banner{display: none;
  }
  
  .small-logo{
    margin-top: 2%;
    margin-left: 43.5%;
  }
  .small-logo img{
  transform: scale(1.2);
  }
  
  .stats{
    background-color: rgb(0,0,0, 0.7); 
    width: fit-content;
    padding: 10px;
    border-radius: 10px;
    padding-left: 30px;
    margin-top: 22%;
    margin-left: 57%;
    border: 2px solid goldenrod;
  }
  
  .footer{
    font-size: 15px;
    margin-left: 30%;
  }
  
  .image-slide img{
    height: 500px;

  }
  .image-slide{
    margin-top: -10%;
    margin-left: 10%;
    width: 30%;
  }
  
.info-text{
  background-color:rgb(0,0,0, 0.8);
  width: 30%;
}
.text1{
  margin-left: 51%;
  margin-top:-25%;
  margin-bottom: 5%;
}
.text2{
margin-top: -17%;
  margin-left: 51%;
}

.footer{
  margin-top: 5%;
  margin-left: 43%;
}

.book-button{
  margin-top: 10%;
  margin-left: 21%;
}

.book-button a{
  transform: scale(1.5);
}

}