body{
    background: #3F5EFB;
    background: radial-gradient(circle, rgba(63, 94, 251, 1) 0%, rgba(252, 70, 107, 1) 100%);
    color: #fff;
    font-family:'Public Sans',sans-serif; font-size:14px; 
}
a{ text-decoration: none;}
.btn{ border-radius: 12px;}

header{ border: solid 1px #6d2424; border-radius: 20px; padding: 25px; background-color: rgba(252, 70, 107, 0.3);}

.logout{ color: #444; background-color: #fff; border-radius: 12px; padding: 4px 10px;}

.info-box{ background-color: #2c3480; color: #fff; text-align: center; border-radius: 10px; border: solid 1px #4D5CF0; height: 100%; padding: 20px; font-weight: bold; font-size: 15px; font-weight: bold; 
background: #020024;
background: linear-gradient(90deg, rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(0, 212, 255, 1) 100%);
}

.info-box .text-muted1{ color: #ccc; font-size: 12px;}

.form-referral, .form-referral:focus{ background-color: transparent; color: #fff; border-color: #1b2264;}

.steps-wrapper ul{ list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; column-gap: 15px;}
.steps-wrapper ul li{ background-color: #1b2264; padding: 15px; color: #fff; border-radius: 12px; }
.steps-wrapper ul li b{ font-size: 16px; font-weight: bold; margin-bottom: 12px;}
.steps-wrapper ul li .steps-box div{ color: #9e9d9d; font-size: 14px; margin-left: 40px; padding-top: 10px; }
.why-choose-us ul li .steps-box div{ color: #9e9d9d; font-size: 14px; margin-left: 0; }
.steps-wrapper ul li .steps-box span{ color: #fff; background-color: #4cc887; display: inline-block; border-radius: 8px; padding: 4px; width: 30px; text-align: center; margin-right: 10px;}

footer{ background-color: rgba(0, 0, 0, 0.5); padding: 20px; color: #fff; text-align: center;}
.social-icons{ display: flex; justify-self: center; justify-content: space-between; column-gap: 10px; margin: 20px 0;}
.social-icons img{ width: 30px;}

.page-header{ display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;}
.page-header h5{ font-weight: bold;}

.semi-transaparent{ background-color: rgba(51, 30, 35, 0.5);}
.tiles-view{ background-color: rgba(11, 5, 100, 0.5); padding: 15px; color: #fff; border-radius: 12px;}
.tiles-view label{ font-size: 14px; color: #ccc; margin-bottom: 12px;}
.tiles-view .textinfo{ font-size: 16px; font-weight: bold;}

.card-body{ color: #444; 
background: #833AB4;
background: linear-gradient(43deg, rgba(131, 58, 180, 1) 0%, rgba(23, 27, 122, 0.49) 75%);
border-radius: 0.25rem;
}

.btn-xs { 
 padding: 2px 8px; 
 font-size: 90%
 } 

 .header-box-bg{
    background: #1BFE01;
background: linear-gradient(90deg, rgba(27, 254, 1, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100%);
 }