*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.gen-div{
    background: rgba(171, 202, 241, 0.075);
}
.main-service{
    background:#020281;
    width: 80%;
    margin: auto;
    
}
.servive{
    width: 100%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
}
.servive img{
    width: 80%;
    border-radius: 0px 0px 3rem 0px;
}
.service-content{
    width: 60%; 
    padding: 0px 0px 0px 1rem;  
}
.service-content p{
    color: #fff;
    font-size: 4rem;
    padding: 4rem 0px 0.5rem 0px; 
}
.service-content span {
    margin: 0px 1rem 0px 0px;
    background: red; 
    padding:4rem 0px 0px 0px; 
}
.ul{
    padding: 6rem 0px 0px 1rem;
    color: #fff;
}
 .ul li{
    padding: 0.3rem;
 }
 .servvice-con{
    background: #fff;
    width: 80%;
    margin: auto;
    height: auto;
    margin-top: 1rem;
 }
 .blue{
    background: #020281;
    border: 14x solid;
    height: 20vh;
    position: relative;
    

 }
 .blue i{
    color: #fff;
    font-size: 4rem;
    margin: auto;
    position: relative;
    top: 30%;
    left: 40%;
     
 }
 .service2{
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
 }
 .brand{
    width: 32%;
 }
 .yellow{
    background: rgb(235, 89, 5);
    height: 10vh;
    color: #fff;
    text-align: center;
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.5rem;
 }
  
 .white p{
    padding: 0.5rem;
    width: 100%;
     
 }
 .white i{
    color: red; 
    padding: 0.5rem 0.5rem 0px 0px ;
 }
 .service3{
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 6rem;
 }
 @media screen and (max-width:768px) {
   .servvice-con{
      border: 2px solid;
      
   }
   .brand{
      border: 1px solid;
      font-size: 1rem;
   }
 }