*{
    margin:0px;
    padding:0px;

}
body{
    overflow-x: hidden;
    background-image: linear-gradient(to bottom right, rgb(116 31 175), rgb(204 0 0));
     color: white;
     font-weight: 900;
}
 
.trial{
    display: flex;
}
 
.home{
    padding-top:1em ;
    display: flex;
    justify-content:flex-start;
}
.home a img{
    max-inline-size: 50%;
    block-size: auto;
}
.thank{
    
    display: flex;
    justify-content: center;
    font-size:2vw;
    padding: 1em;
}
 
.f h2{
    color: yellow;

}
    
@media only screen and (max-width: 600px){
    .thank{
        font-size: 4vw;
    }
    
}
  .am{display: flex;
justify-content: center;
 
padding: 2rem;
font-size:2rem;
}
@media only screen and (max-width: 600px){
    .am{
        font-size: 4vw;
    }
}
.am h2{
    font-size: 5vw;
    display: flex;
    justify-content: center;
}
 .how{ color: yellow;
    display: flex;
    justify-content: center;
    font-size: 4vw;
 }
 .why{
    display: flex;
    justify-content: center;
    padding: 1rem;
    margin: 1rem;
 }
 @media only screen and (max-width: 600px){
    .why{
        display: flex;
        flex-wrap: wrap-reverse;
        justify-content: center;
        gap:1rem;
        margin: 2rem;
    }}
    
 
 .inn{
    box-shadow: 3px 3px 3px 2px rgb(219, 31, 31);
    border: 2px solid whitesmoke;
    margin-right: 1rem;
    padding: 1rem;
    
 }
 .out{
    box-shadow: 3px 3px 3px 2px rgb(79, 215, 34);
    border: 2px solid whitesmoke;
    margin-right: 1rem;
    padding: 1rem;
 }
 .eff{
    box-shadow: 3px 3px 3px 2px rgb(227, 227, 37);
    border: 2px solid whitesmoke;
    margin-right: 1rem;
    padding: 1rem;
 }
 .rel{
    box-shadow: 3px 3px 3px 2px rgb(13, 50, 218);
    border: 2px solid whitesmoke;
    margin-right: 1rem;
    padding: 1rem;
 }
 .why p{
    color: rgb(18 247 10);
    font-size:1.5rem;
 }
 .back2{
    background-image: linear-gradient(to bottom right, rgb(18 230 214), rgb(211 182 182));     
 }
 .connect{
    
    color:white;
    display: flex;
    justify-content: center;
   font-size: 1.5rem;
   font-weight: bolder;
    padding: 1rem;
    margin: 1rem;
 }
  .con { 
     
    display: flex;
    justify-content: center;
     
 }
 .con img{
    max-inline-size: 100%;
    block-size: auto;

 }
 @media only screen and (max-width: 600px){
    .connect{
        font-size: 4vw;
    }
 }
 .link{
    display: flex;
    justify-content: center;
    padding: 2rem;
    gap: 7vw;
}
 .link img{ max-inline-size: 100%;
    block-size: auto;
}
.footer{
    background-color: black;
    padding:30px 0px;
    font-family: 'Play', sans-serif;
    text-align:center;
    }
    
    .footer .row{
    width:100%;
    margin:1% 0%;
    padding:0.6% 0%;
    color:rgb(239, 234, 234);
    font-size:0.8em;
    }
    
    .footer .row a{
    text-decoration:none;
    color:rgb(230, 218, 218);
    transition:0.5s;
    }
    
    .footer .row a:hover{
    color:#b24444;
    }
    
    .footer .row ul{
    width:100%;
    }
    
    .footer .row ul li{
    display:inline-block;
    margin:0px 30px;
    }
    
    .footer .row a i{
    font-size:2em;
    margin:0% 1%;
    }
    
    @media (max-width:720px){
    .footer{
    text-align:left;
    padding:5%;
    }
    .footer .row ul li{
    display:block;
    margin:10px 0px;
    text-align:left;
    }
    .footer .row a i{
    margin:0% 3%;
    }
    }
    .name{
      color:#ff1361;
      font-size: large;
    }