@font-face {
font-family: head;
src: url(../fonts/Yeager-Regular.otf);
}

@font-face {
font-family: para;
src: url(../fonts/paragraph.woff2);
}

footer{
     width: 100vw;
     margin-top: 100px;
     height: auto;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: #b3ffec;
}

.footercontainer{
     width: 90%;
     padding-top: 100px;
     padding-bottom: 100px;
     display: flex;
     flex-direction: row;
     justify-content: space-between;
     gap: 50px;
}

.footercontainer div{
     width: 100%;
}

.footeraboutcomp{
     font-size: 20px;
     color: rgb(91, 91, 91);
     text-align: justify;
     
}

.footeraboutcomp p{
     font-family: para;
     font-weight: 400;
}

.footerlogodiv{
     height: 100px;
}

.linksheading{
     display: flex;
     align-items: center;
     font-size: 30px;
     color: orangered;
     height: 100px;
}

.gallaryheading{
     display: flex;
     align-items: center;
     font-size: 30px;
     color: orangered;
     height: 100px;
}

.addressheading{
     display: flex;
     align-items: center;
     font-size: 30px;
     color: orangered;
     height: 100px;
}

.footerlogo{
     width: 100%;
}

.footerlinkdiv{
     height: 100%;
     display: flex;
     flex-direction: column;
}

.footerlinks{
     height: 100%;
     display: flex;
     flex-direction: column;
     padding-left: 30px;
     justify-content: space-between;
}

.footerlinks a{
     text-decoration: none;
     color: rgb(91, 91, 91);
     font-size: 25px;
}

.footerlinks a:hover{
     letter-spacing: 2px;
     color: orangered;
     transition: all 250ms ease-in-out;
}

.footergallery{
     display: grid;
     grid-template-columns: repeat(3,1fr);
     gap: 30px;
}

.footergallery div img{
     width: 100%;
     height: 100%;
     border-radius: 10px;
}

.footergallery div img:hover{
     filter: opacity(0.5);
}

.footeraddress{
     font-size: 18px;
     color: rgb(91, 91, 91);
}

.footeraddress:hover{
     font-size: 20px;
     color: orangered;
     transition: all 250ms ease-in-out;
}

.footeraddress p{
     padding-top: 5px;
     font-family: para;
}

@media screen and (min-width: 300px) and (max-width:500px){
     .footercontainer{
          display: flex;
          flex-direction: column;
     }
     .footerlogodiv{
          padding-bottom: 50px;
     }
     .footeraboutcomp{
          margin-top: 50px;
     }
}