
.container{
  display:flex;
}


nav{
  padding:5px
}

nav a{
  color:black;
  margin:0 10px 0 10px;
  display:inline-block;
  width:20%;
  text-align:center;
}

.center{
  align-items:center;
  justify-content:center;
}

body{
  font-family:Georgia;
}

a{
  text-decoration:none;
}

nav a:hover{
  border-bottom:2px solid white;
  background-color:rgb(78, 32, 74);
  color:rgb(231, 223, 193);
  transition:0.5s;
}

#banner{
  align-items:center;
  justify-content:center;
  background-image: url("banner.jpg");
  background-size:cover;
  background-position:center;
  color:white;
  height:545px;
  transition:filter 0.3s;
}

#banner:hover{
  filter:blur(0.8px);
}

#banner h1{
  background-color:rgb(39, 12, 43);
  color:rgb(247, 203, 203);
  padding:10px;
  border-radius:8px;
}

#banner2{
  align-items:center;
  justify-content:center;
  background-image: url("banner2.webp");
  color:rgb(158, 184, 160);
  height:545px;
  background-size:cover;
  background-position:center;
  transition:1.0s;
  text-decoration:underline;
  font-family:"Times New Roman";
}

#banner2:hover{
  background-image: url("banner22.webp");
  background-size:cover;
  background-position:center;
}

#banner2 h1{
  background-color:rgb(55, 87, 62);
  color:rgb(186, 241, 208);
  padding:10px;
  border-radius:8px;
}

#banner3{
  align-items:center;
  justify-content:center;
  background-image: url("banner3.avif");
  background-size:cover;
  background-position:center;
  height:545px;
}

#banner3 h1{
  background-color:rgb(41, 72, 107);
  color:rgb(205, 227, 252);
  padding:10px;
  border-radius:8px;
}

#banner3:hover{
  background-size:180%;
}

#banner4{
  align-items:center;
  justify-content:center;
  background-image: url("banner4.jpg");
  background-size:cover;
  background-position:center;
  color:white;
  height:545px;
}

#banner4:hover{
  background-image: url("banner44.jpg");
  transition:1.5s;
}

#banner4 h1{
  background-color:rgb(222, 240, 179);
  color:rgb(59, 115, 160);
  padding:10px;
  border-radius:8px;
}

h1{
  font-size:80px;
}

#info img:hover{
    transform:rotate(6deg);
}

#info img{
    border-radius:6px;
    height:200px;
    width:400px;
}

#info{
  flex-direction: column;
}

#info p{
  font-size:19px;
}

#one{
  font-size:21px;
  background-color:rgb(177, 71, 115);
  color:white;
  transition:0.5s;
  padding:2px;
}

#two p:hover{
  font-size:21px;
  background-color:rgb(236, 242, 173);
  color:rgb(27, 91, 131);
  transition:1.2s;
}


.column{
  flex-direction:column;
  font-size:25px
}

.center{
  align-items:center;
  justify-content:center;
}

#tea p:hover{
  font-size:23px;
  background-color:rgb(21, 86, 43);
  color:rgb(174, 253, 223);
  transition:1.2s;
}

#art p:hover{
  font-size:23px;
  background-color:rgb(40, 51, 106);
  color:rgb(196, 224, 241);
  transition:1.2s;
}

#paper p:hover{
  font-size:23px;
  background-color:rgb(85, 38, 110);
  color:rgb(248, 242, 180);
  transition:1.2s;
}

#main img{
    border-radius:6px;
    height:200px;
}

#main img:hover{
    filter:blur(0.1px);
    filter: drop-shadow(9px 9px 11px gray);
}

#main img{
    border-radius:6px;
    height:200px;
    filter:blur(0.9px);
}

#art{
  text-align:right;
}

.sidebar{
  flex-direction:row;
  justify-content:center;
  align-items:center;
}

.sidebar img{
  height:170px;
  width:240px;
}

.sidebar:hover{
  scale: 0.9;
  transition:1.0s;
}

.sidebar{
  flex-direction:row;
  justify-content:center;
}

.attraction{
  flex-direction:column;
  align-items:center;
  margin-bottom:40px;
}

body ul{
  text-align:center;
  align-items:center;
}

ul{
  font-size:21px;
  font-family:Verdana, Geneva, Tahoma, sans-serif;
}

ul:hover{
  color:rgb(19, 79, 161);
  font-size:25px;
  font-family:Cambria;
}


#food img{
  height:250px;
  width:400px;
  padding:6px;
  border-radius:50%;
  filter: drop-shadow(12px 12px 15px rgb(193, 200, 243));
}

#food{
  flex-direction:column;
  justify-content:center;
  align-items:center;
}

#food p{
  font-size:18px;
  font-family:monospace;
  text-align:center;
  align-items:center;
  text-shadow: 2px 2px 4px #d4b31e;
}

#food p:hover{
  font-size:20px;
  text-align:center;
  align-items:center;
  text-shadow: 2px 2px 4px #9bb4eb;
}

#footer p{
   flex:1;
   text-align:center;
   color:rgb(218, 220, 243);
   background-color:rgb(101, 62, 128);
   height:37px
}

#footer2 p{
   flex:1;
   text-align:center;
   color:rgb(173, 248, 217);
   background-color:rgb(20, 144, 182);
   height:37px
}

#footer3 p{
   flex:1;
   text-align:center;
   color:rgb(245, 148, 169);
   background-color:rgb(41, 69, 78);
   height:37px
}

#footer4 p{
   flex:1;
   text-align:center;
   color:rgb(232, 238, 206);
   background-color:rgb(28, 90, 109);
   height:37px
}
