html, body{
    height:100%;
    margin:0;
}

body{
    display:flex;
    flex-direction:column;
    min-height:100vh;
}

main{
    flex:1;
}        
footer{
  margin:10px 0px 0px 0px;
  padding:0;
}
#f-container{
  background: linear-gradient(135deg, #0f172a, #1e293b);
color: white;
display: flex;
flex-direction: column;
width: 100%;
}
#f-firstContainer{
    display: flex;
justify-content: space-around;
/* background-color: antiquewhite; */
}
#f-container>hr{
    margin:0px 1vw;
}
.f-smallContainer{
    display: flex;
    flex-direction: column; 
text-align: center;
padding:.5vw 1vw;
border-radius: 10px;
}
.f-smallContainer>p,h3{
    margin: .7vw;
}
.f-smallContainer>hr{
    width: 90%;
}
#NotesForUg>p{
     margin: .8vw;
       font-size: large;
}
.f-smallContainer>div>span{
    margin: .7vw;
}
.socialMedia{
    display: flex;
   gap:3.4vw;
   font-size:2.3vw;
  
}
.socialMedia-2{
 padding-top: 1vw;
}
.socialMedia>a>i:hover{
    opacity:.6;
    color:blue;
}
.socialMedia>a>i{
    color:white;
}
.f-smallContainer>p>a{
    color: aliceblue;
    text-decoration: none;
       font-size: large;
}
.f-smallContainer>p>a:hover{
    color:rgb(20, 20, 222);
       text-decoration: underline;
}
#f-firstContainer>hr{
display: none;
}
/* mobile */
/* tablet / small laptop */
@media (min-width: 800px) and (max-width: 1100px) {
    .socialMedia{
        gap: 3vw;
        font-size: 30px;
    }
}
@media  (min-width: 700px) and  (max-width:800px){
    .socialMedia{
         gap:4vw;
   font-size: 25px;
}
}
/* moble */
@media(max-width:700px){
#f-firstContainer{
    flex-direction:column;
}
.f-smallContainer>h3{
color:red;
}
#f-firstContainer>hr{
    width:100%;
display:inline ;
}
#NotesForUg{
    display: none;
}
#mediaMainContainer{
    padding: 10px;
    display: flex;
    justify-content: center;
  gap:60px;
}
.socialMedia{
    display: flex;
gap:50px;
   font-size:25px;
}
#f-container>hr{
    margin:0px 0px;
}
.socialMedia-2{
 padding-top: 0;
}
.f-smallContainer>hr{
    width: 100%;
}
#contactUs{
  width: 99%;
  text-align: center;
}
}