*{
    margin: 0;
    padding: 0;
}

@font-face {
    font-family: roboto-b;
    src: url(Roboto-Bold.ttf);
}

@font-face {
    font-family: roboto-l;
    src: url(Roboto-Light.ttf);
}

@font-face {
    font-family: roboto-r;
    src: url(Roboto-Regular.ttf);
}

.font-b{
    font-family: roboto-b;
}

.font-l{
font-family: roboto-l;
}

.font-r{
    font-family: roboto-r;
}

.color{
    color: #000000;
}

.navigate{
    border-top: 1.5px solid gray;
    border-bottom: 1.5px solid gray;
}

.head-color{
    color: #D9D9D9 !important;
}

.heading-color{
    color: #333333;
}

.bg{
    background-color: #FBFBFB;
}

.btn-white{
    background-color: white;
}

.num-color{
    color: #F2F2F2;
}

.box{
    height: 200px !important;
    width: 450px !important;
}

@media screen and (min-width:0px) and (max-width:1200px) {
    .wrap{
        flex-wrap: wrap !important;
    }
}

.back{
    background-color: #F3F3F3;
    height: 17% !important;
    border: none !important;
    color: #8D8D8D;
}

.bk{
    background-color: #F3F3F3;   
    border: none !important;
    color: #8D8D8D;
}

.bg-color{
    background-color: #2C2C2C;
    margin-bottom: 0px !important;
}

.line{
    border-top:0.2px solid #5f5f5f !important;
    color: #727272 !important;
}

.bang{
    height: 100px !important;
    width: 100% !important;
    background-color: #2C2C2C;
}