#male {
    max-width:100%;
    min-height: 110vh;
    padding-top: 80px;
    display:flex;
    flex-direction:column;
    align-items:center;
    background-image: url("/img/top100adminbackground.jpg");
    overflow:hidden;
}

#male h3 {
    color: #aebfd1;
    font-size:2.7vw;
    padding:25px 0;
}

#male .table-responsive {
    width: 80%;
}

#male td,
th {
    color: #fff;
}
#male .row{
    width:80%;
    margin-top: 40px;
    justify-content:center;
    text-align:center;
}
#male .categorybox {
    background-color: #343A40;
    margin-right:5px;
    color: #ebebeb;
}
#male .box{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 35px 20px;
    text-align: center;
}
#male h4{
    font-size: 1.7vw;
}
#male .box a{
    font-size: 2vw;
}
@media (max-width: 992px) {
    #male {
        padding-top: 120px;
    }
    #male h3 {
        font-size: 3vw;
    }
    #male h4{
        font-size: 2.1vw;
    }
    #male .box a{
        font-size: 2.4vw;
    }
}

@media (max-width: 768px) {
    #male .row{
        width: 100%;
    }
    #male .table {
        width: 90%;
    }
    #male h3 {
        font-size: 3.3vw;
    }
    #male th {
        padding-right: 30px;
    }
    #male th , #male td{
        font-size: 2vw;
    }
    #male h4{
        font-size: 3vw;
    }
    #male .box a{
        font-size: 3.3vw;
    }
}

@media (max-width: 500px) {
    #male {
        padding-top: 100px;
    }
    #male h3 {
        font-size: 4.2vw;
    }
    
    #male th , #male td{
        font-size: 2.7vw;
    }
 
    #male h4{
        font-size: 3.5vw;
    }
    #male .box a{
        font-size: 3.8vw;
    }
}

@media (max-width: 350px) {
    #male {
        padding-top: 80px;
    }
}