@import url('https://fonts.googleapis.com/css2?family=42dot+Sans:wght@300..800&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+Display:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Space+Grotesk:wght@300..700&display=swap');
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
    scroll-behavior: smooth;
  }
body{
    margin: 0;
    padding: 0; 
    width: 100%;
    
}
h1{
    font-family:"Space Grotesk", serif ;
}
h2{
    font-family:"Space Grotesk", serif ;
}


h2{
    font-size: 40px;
    text-align: center;
    margin-bottom: -40px!important;
    
}
h2 span{
    position: relative;
}

h2 span::after { 
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    display: block;
    background: none repeat scroll 0 0 transparent;
    height: 2px;
    width: 0;
    background: #5e5d5d;
    transition: width 0.3s ease 0s, left 0.3s ease 0s;
  }
  
  h2 span:hover{ 
    cursor: pointer;
  }
  h2 span:hover::after { 
    width: 100%; 
    left: 0; 
  }


h3{
    font-family:"poppins", serif ; 
}
p{
    font-family: "Inter", serif;
}
a{
    font-family:"poppins", serif
}


.logo{
    width: 200px;
    
}
.logo img{
    width: 100%;

}

/*============================================ footer ==============================================================*/

  .footer{
    background: #3b3939;
    padding: 3% 0 0;
    background: linear-gradient(47deg,rgba(59, 57, 57, 1) 8%, rgba(1, 26, 23, 1) 100%);
  }
  .footer h2{
    background: -webkit-linear-gradient(#e2e2e2, #00d7fd);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .footer p{
    margin-top:10% 0 2%;
  }
  .footer p a{
    text-decoration: none;
    color: #fff;
    text-transform: uppercase;
  }
  .footer p a:hover{
    transform: scale(1.5);
    color: #00d7fd;
  }




  .social-icons{
    text-align: center;
  }
  .social-icons a{
    color:#fff;
    line-height:30px;
    font-size:30px;
    margin: 0 5px;
    text-decoration:none;
    
  }
  .social-icons a i{
    line-height:30px;
    font-size:30px;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1); 
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1); 
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1);
    transition: all 200ms ease-in;
    transform: scale(1);
  }
  .social-icons a:hover i{
    box-shadow: 0px 0px 150px #000000;
    z-index: 2;
    -webkit-transition: all 200ms ease-in;
    -webkit-transform: scale(1.5);
    -ms-transition: all 200ms ease-in;
    -ms-transform: scale(1.5);   
    -moz-transition: all 200ms ease-in;
    -moz-transform: scale(1.5);
    transition: all 200ms ease-in;
    transform: scale(1.5);
  }

  .copyright{
    color: #fff;
  }



  
  @media (max-width:450px){
    .copyright{
      font-size: 14px;
    }
    .footer p{
      margin-top:10% 0 5%;
    }
  }