






.logo{
height: 90px;
width: 150px;
margin-left: 30px;
}
.navbar > ul{
list-style-type: none;
padding: 0;
margin:0;
text-align: right ;
}
.navbar a{
color: rgb(122, 122, 122);
font-family: Arial, Helvetica, sans-serif;
}
.navbar li{
display: inline-block;
margin: 10px;
font-size: 25px;
transition: transform 0.3s ease;
}
.navbar li:hover{
transform: scale(1.1);
}
.logobar{
display:flex;
justify-content: space-between;
position: sticky;
top: 0;
background-color: rgba(255, 255, 255, 0.8);
backdrop-filter: blur(10px);
}
.galleryr1{
display: flex;
justify-content: space-between;
font-family: Arial, Helvetica, sans-serif;
}
.ambull{
height:340px;
width: 340px;
margin-left: 340px;
border-radius: 13px;
}
.archar{
height:340px;
width: 340px;
border-radius: 13px;
}
.spinylump{
height:340px;
width: 340px;
margin-right: 340px;
border-radius: 13px;
}
.galleryr2{
display: flex;
justify-content: space-between;
font-family: Arial, Helvetica, sans-serif;
}
.axo{
height:340px;
width: 340px;
margin-left: 340px;
border-radius: 13px;
}
.bamb{
height:340px;
width: 340px;
border-radius: 13px;
}
.reefshark{
height:340px;
width: 340px;
margin-right: 340px;
border-radius: 13px;
}
.galleryr3{
display: flex;
justify-content: space-between;
font-family: Arial, Helvetica, sans-serif;
}
.lion{
height:340px;
width: 340px;
margin-left: 340px;
border-radius: 13px;
}
.rockfish{
height:340px;
width: 340px;
border-radius: 13px;
}
.nemo{
height:340px;
width: 340px;
margin-right: 340px;
border-radius: 13px;
}
.t1{
width: 340px;
margin-left: 340px;
}
.t2{
width: 340px;
}
.t3{
width: 340px;
}
.t4{
width: 340px;
margin-left: 340px;
}
.t5{
width: 340px;
}
.t6{
width: 340px;
}
.t7{
width: 340px;
margin-left: 340px;
}
.t8{
width: 340px;
}
.t9{
width: 340px;
}
.h1{
margin-left: 340px;
}
.h4{
margin-left: 340px;
}
.h7{
margin-left: 340px;
}
.title{
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 40px;
}
.transport{
color: rgb(85, 124, 184);
transition: transform 0.3s ease;
}
.transport:hover{
transform: scale(1.03);
}
.transport1{
margin-left: 340px;
color: rgb(85, 124, 184);
transition: transform 0.3s ease;
}
.transport1:hover{
transform: scale(1.03);
}
.transport4{
margin-left: 340px;
color: rgb(85, 124, 184);
transition: transform 0.3s ease;
}
.transport4:hover{
transform: scale(1.03);
}
.transport7{
margin-left: 340px;
color: rgb(85, 124, 184);
transition: transform 0.3s ease;
}
.transport7:hover{
transform: scale(1.03);
}
.comment2{
width: 420px;
margin-left: 100px;
color: rgb(91, 91, 91);
}
.footer{
display: flex;
justify-content: space-between;
background-color: rgb(44, 97, 126);
color: white;
font-family: Arial, Helvetica, sans-serif;
}
.title1{
font-size: 19px;
}
.text{
width:400px;
}
.address{
margin-left: 30px;
}
.story{
margin-right: 55px;
}
.list1{
font-family: Arial, Helvetica, sans-serif;
font-size: 25px;
}
.rankings{
display: flex;
justify-content: center;
}
.listitle{
font-size: 30px;
font-family: Arial, Helvetica, sans-serif;
margin-top: 50px;
text-align: center;
}