html {
   scroll-behavior: smooth;
   scroll-padding-top:50px;
 }

.gradient_green{
   background: rgb(31,167,199);
   background: linear-gradient(300deg, rgba(31,167,199,1) 0%, rgba(117,227,169,1) 100%);
}
.gradient_green_dark{
   background: rgb(117,161,59);
   background: linear-gradient(300deg, rgba(81,132,56,1) 0%, rgba(117,161,59,1) 100%);
}
.gradient_blue{
   background: rgb(51,71,176);
   background: linear-gradient(300deg, rgba(51,71,176,1) 0%, rgba(188,138,237,1) 100%);
}
.gradient_pink{
   background: rgb(157,34,230);
   background: linear-gradient(300deg, rgba(157,34,230,1) 0%, rgba(235,117,184,1) 100%);
}
.gradient_orange{
  background: #ffc107;
  background: linear-gradient(300deg, #ff9800 0%, #ffc107 100%);
}
.gradient_black{
   background: rgb(32 32 32);
   background: linear-gradient(150deg, rgb(32 32 32) 0%, rgb(110 110 110) 100%);
}
.gradient_red{
  background: rgb(197 12 12);
  background: linear-gradient(150deg, rgb(245 89 89) 0%, rgb(197 12 12) 100%);
}
.gradient_brown{
  background: #795548;
  background: linear-gradient(300deg, #795548 0%, rgb(181 127 107) 100%);
}


.font-10{font-size:10px !important}
.font-11{font-size:11px !important}
.font-12{font-size:12px !important}
.font-13{font-size:13px !important}
.font-14{font-size:14px !important}
.font-15{font-size:15px !important}
.font-16{font-size:16px !important}
.font-17{font-size:17px !important}
.font-18{font-size:18px !important}
.font-19{font-size:19px !important}
.font-20{font-size:20px !important}
.font-21{font-size:21px !important}
.font-22{font-size:22px !important}
.font-23{font-size:23px !important}
.font-24{font-size:24px !important}
.font-25{font-size:25px !important}
.font-26{font-size:26px !important}
.font-27{font-size:27px !important}
.font-28{font-size:28px !important}
.font-29{font-size:29px !important}
.font-30{font-size:30px !important}
.font-31{font-size:31px !important}
.font-32{font-size:32px !important}
.font-33{font-size:33px !important}
.font-34{font-size:34px !important}
.font-35{font-size:35px !important}
.font-36{font-size:36px !important}
.font-37{font-size:37px !important}
.font-38{font-size:38px !important}
.font-39{font-size:39px !important}
.font-40{font-size:40px !important}
.font-41{font-size:41px !important}
.font-42{font-size:42px !important}
.font-43{font-size:43px !important}
.font-44{font-size:44px !important}
.font-45{font-size:45px !important}
.font-46{font-size:46px !important}
.font-47{font-size:47px !important}
.font-48{font-size:48px !important}
.font-49{font-size:49px !important}
.font-50{font-size:50px !important}





/* ========= CARD ========= */
.card{
   transition: .5s;
 }
 .card:hover{
   box-shadow: 0 0 15px #673ab785;
 }
 .card_0{
     border: 1px solid #9e9eef !important;
   }
   .card_0 > .card-header,
   .card_0 > .card-footer{
     background:-webkit-linear-gradient(top left, #8c8bf6, #afaefa);
     color:white !important;
   }
   
   .card_1, .card_2, .card_3, .card_4{transition: .5s;}
   .card_1:hover, .card_2:hover, .card_3:hover, .card_4:hover{
      box-shadow: 0 0 15px #25154285;
   }
   
   .card_1{
     border: 1px solid #43dcbd !important;
   }
   .card_1 .card-header,
   .card_1 .card-footer{
     background:-webkit-linear-gradient(top left, #0ed7b3, #58dfc3);
     color:white !important;
     border-radius: 0px !important;
   }
 
 
   .card_2{
     border: 1px solid #50a3ff !important;
   }
   .card_2 .card-header,
   .card_2 .card-footer{
     background:-webkit-linear-gradient(top left, #459dff, #71b3ff);
     color:white !important;
     border-radius: 0px !important;
   }
   
   
   
   
   
   .card_3{
     border: 1px solid #ffc167 !important;
   }
   .card_3 .card-header,
   .card_3 .card-footer{
     background:-webkit-linear-gradient(top left, #ffb538, #ffc97d);
     color:white !important;
     border-radius: 0px !important;
   }
   
   
   .card_4{
     border: 1px solid #ff6c85 !important;
   }
   .card_4 .card-header,
   .card_4 .card-footer{
     background:-webkit-linear-gradient(top left, #ff5d79, #fe8497);
     color:white !important;
     border-radius: 0px !important;
   }
   


   .card_d{
    border: 1px solid #dbdbdb !important;
    cursor: not-allowed;
    }
    .card_d .card-header,
    .card_d .card-footer{
      background:-webkit-linear-gradient(top left, #dbdbdb, #dbdbdb);
      color:rgb(97, 97, 97) !important;
      border-radius: 0px !important;
    }
   /* ========= CARD END ========= */


   .text-circle div {
      width: 25px;
      height: 25px;
      border-radius: 50%;
      text-align:center;
    }

    .text-square {
      width: 25px;
      height: 25px;
      text-align:center;
    }
    .aliceblue{
      background: aliceblue;
    }