@media all and (max-width:768px){
    .cl {
        color: white;
    }
    .wd {
        width: 90%;
    }

    .flex_ {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .flex_ .w50 {
        width: 100%;
        margin-top: 20px;
    }
    .flex_ .w20 {
        width: 100%;
        margin-top: 20px;
    }
}

@media all and (min-width:769px){
    .cl {
        color: white;
    }
    .wd {
        width: 80%;
    }

    .flex_ {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 20px;
        margin-bottom: 20px;
    }
    .flex_ .w50 {
        width: 50%;
        margin-top: 20px;
    }
    .flex_ .w20 {
        width: 20%;
        margin-top: 20px;
    }
}

@media all and (min-width:751px){
    .hpc {
        display: none !important;
    }
}

@media all and (max-width:750px){
    .hmb {
        display: none !important;
    }
}