:root{
    --color-1:rgb(255, 255, 255);
    --color-2:#ffffff;
    --black:#000;
}

/* home */

/* .bg */



.home{
    background: #000;
    height: 30vh;
    margin: 50px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    box-shadow: rgba(0, 0, 0, 0.4) 0px 30px 90px;
}
.home h2{
    font-size: 40px;
    color: #fff;
}
 /* services */
.services .active{
    background-color: var(--color-2);
    border: none;
    color: var(--black);
    font-size: 20px;
}

.COL-US{
    background: rgb(155, 239, 155);
    padding: 30px;
    width: 350px;
    margin: 20px auto;
    display: none;
}
.COL-US a{
    border: 1px solid var(--black);
    margin: 5px 0;
}
.COL-US a:hover{
    border: 1px solid var(--black);
}


/* services */

.services .col-md-4,.col-md-8{
    width: 80%;
    margin: 0 auto;

}
/* about-us */
.about-us {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
    gap: 20px;
}
.about-us .box{
    padding: 20px;
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}
.about-us .box h5{
    text-align: center;
}



.card{
    border: none !important;

}


footer{
    background-color:#000;
    margin-top: 30px;
}

footer .container{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px,1fr));
    gap: 20px; 
}

footer .container .box{
    padding: 20px;
    margin-top: 40px;
    color: #ffff;
}

footer .container .box h6{
    font-size: 20px;
}
footer .container .box p{
    font-size: 14px;
}
footer .container .box ul li a{
    font-size: 10px;
    color: #ffff;
}
footer .container .box ul li a:hover{
    color: var(--color-2);
}
footer .container .box i{
    font-size: 24px;
    margin: 10px;
}

@media screen and (max-width: 767px) {
    .COL-US{
        display: block;
    }
  }


  .bttn{
    width: 100%;
    background: rgb(118, 227, 149);
    text-align: center;
    position: sticky;
    bottom: 0;
    z-index: 131;
}
.bttn a{
      font-size: 24px;
  }

  .whats{
    font-size: 40px;
    position: fixed;
    bottom: 50px;
    right: 20px;
    z-index: 131;
}
.whats a{
    color: green;
    
  }


  /* kay-word */

  .kay-word {
    font-size: 14px;
  }