.w-100{
    width: 100%;
}
h2 span{
    color: #007fff;
}
h3 span{
    color: #007fff;
}
.ccard{
    box-shadow: 0px 0px 5px 0px #80808061;
    border-radius: 4px;
    margin: 10px;
    padding: 7px;
    width: 220px;
    border: 0px;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    cursor: pointer;
}
.ccard img{
    /* float :left; */
    margin:0px 5px ;
    height: 60px;
}
.ccard span{
    font-size: 16px;
}
@media(max-width:500px){
    .ccard span{
        display: none;
    }
    .ccard{
        width: unset;
    }

}
.ccard:hover{
    box-shadow: 0px 0px 5px 1px #8080809a;
}

.dcard{
    box-shadow: 0px 0px 5px 0px #80808061;
    padding: 8px 15px;
    margin: 5px 0px;
    border-radius: 5px;
    margin-top: 20px;
}
@media(max-width:640px){
    .dcard{
    box-shadow: 0px 0px 5px 0px #80808061;
    padding: 8px 15px;
    margin: 5px 0px;
    border-radius: 5px;
    text-align: justify;
    }
}

#inf,#ui,#ux,#uniq{
    display: none;
}
#inf{
    display: block;
}
.dcard  h3{
    font-size: 1rem;
    color: #007fff;
}
.tab-container{
    display: flex;
    align-items: center;
    flex-direction: column;
}
.tablinks{
    border-bottom: 1px solid rgba(128, 128, 128, 0.486);
    margin: 30px 10px ;
    width: 600px;
}
.tablinks ul{
    padding: unset;
    list-style: none;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 10px;
}
.tablinks ul li{
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 20px;
    position: relative;
    cursor: pointer;
}
.tablinks ul li.activ, .tablinks ul li.activi{
    color: #007fff;
    
}
.tablinks ul li.activ::after,.tablinks ul li.activi::after{
    content: ' ';
    position: absolute;
    top:34px;
    left: -9px;
    width:161px;
    height: 3px;
    background-color: #007fff;
    
}
.tablinks ul li.activi::after{
   left: -8px;
    width:181px;
}
.tabb{
    width: 550px;
}


.img-logo{
    margin: 10px;
    padding: 15px;
    border: 1px solid rgba(128, 128, 128, 0.486);
    border-radius: 5px;
}
.img-logo img{
    width: 80px;
}
@media(max-width:450px){
    .tabb{
        width: 95%;
    }
    .img-logo{
        margin: 7px;
        padding: 10px;
        border: 1px solid rgba(128, 128, 128, 0.486);
        border-radius: 5px;
    }
    .img-logo img{
        width: 60px;
    }
    .tablinks{
        width: 95%;
    }
    .tablinks ul li.activ::after, .tablinks ul li.activi::after {
     
        top: 70px;
        left: -20px;
    }
    
}