body{
    margin: 0;
    padding: 0;
    background-color:rgb(97, 111, 161);
}
.container{
    display: flex;
     flex-direction: column;
}
#image0{
    height: 40px;
     width:40px;
     margin-top: -3px;
}
.navbar
{
    background-color:#29275c;
    width: 100%;
    height: 60px;
    display: flex;
    justify-content: space-between;
}
.navbar-left{
    width: 15%;
    padding-right: 40px;
    display: flex;
    justify-content:space-between;
    background-color:rgb(185, 14, 48);
}
.navbar-right {
    width: 100%;
    justify-content: space-around;
}
.l1{
    width: 100%;
    display: flex;
    list-style-type: none;
}

.l2 {
    width: 60%;
    display: flex;
    padding-left: 400px;
    justify-content: space-between;
    list-style-type: none;
}
.l2 li a{
    
    color: white;
    font-size: 20px;
    font-family:cursive;
    text-decoration: none;
}
.l1 li a{
    
    color: white;
    font-size: 20px;
    font-family:cursive;
    text-decoration: none;
    
}
.l2 a:hover{
    transition: 0.2s;
    color:crimson;
}

.image-slider{
    height: 150%;
}
.images{
    padding-top: 150px;
    display: flex;
    justify-content: space-evenly;
}
img{
    height: 300px;
    width: 300px;
  /* background: red; */
  transition: width 1s, height 1s;
  /* mix-blend-mode: */
}
img:hover{
    height: 400px;
    width: 400px;
}
button{
    border: 0px;
    background-color: #29275c;
    font-family: cursive;
    color: white;
    font-size: 20px;
}
.dropdown{
    position: relative;
    display: block;
}
.dropdown-content{
    display: none;
    position: absolute;
    background-color: #29275c;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}
.dropdown-content a{
    color : white;
    background-color: #29275c;
    padding: 15px 20px;
    text-decoration: none;
    display: block;
    font-family: cursive;
    font-size: 15px;
}
.dropdown:hover .dropdown-content{
    display: block;
}
button:hover{
    color: crimson;
}