*{
    margin: 0; padding: 0; box-sizing: border-box;
    font-family: 'Josefin Sans', sans-serif;
 }
 .hed{
    background-color: #000!important;
}
.sub{
    border:1px solid #cdaa35!important;
    background-color: #cdaa35!important;
}
.abt-para{
    text-align: justify!important;
}

/*social media styles start here*/

.social{
    float:left;
    display:flex;   
}

.fa-youtube{
    background: #f70000!important;
    padding:8px;
    color:#fff;
    margin-left:10px;
}
.fa-facebook-f{
    background: #34518c!important;
    padding:8px;
    width:30px;
    text-align: center;
    color:#fff;
    margin-left:10px;
}
.fa-instagram{
    background: #962fbf!important;
    padding:8px;
    color:#fff;
    margin-left:10px;  
}


.channels{
    background: linear-gradient(108deg, rgba(62, 62, 62, 0.09) 0%, rgba(62, 62, 62, 0.09) 30%,rgba(234, 234, 234, 0.09) 30%, rgba(234, 234, 234, 0.09) 100%),linear-gradient(116deg, rgba(101, 101, 101, 0.06) 0%, rgba(101, 101, 101, 0.06) 51%,rgba(231, 231, 231, 0.06) 51%, rgba(231, 231, 231, 0.06) 100%),linear-gradient(258deg, rgba(103, 103, 103, 0.07) 0%, rgba(103, 103, 103, 0.07) 1%,rgba(209, 209, 209, 0.07) 1%, rgba(209, 209, 209, 0.07) 100%),linear-gradient(43deg, rgba(17, 17, 17, 0.09) 0%, rgba(17, 17, 17, 0.09) 7%,rgba(159, 159, 159, 0.09) 7%, rgba(159, 159, 159, 0.09) 100%),linear-gradient(63deg, rgba(211, 211, 211, 0.1) 0%, rgba(211, 211, 211, 0.1) 94%,rgba(233, 233, 233, 0.1) 94%, rgba(233, 233, 233, 0.1) 100%),linear-gradient(207deg, rgba(179, 179, 179, 0.1) 0%, rgba(179, 179, 179, 0.1) 57%,rgba(11, 11, 11, 0.1) 57%, rgba(11, 11, 11, 0.1) 100%),linear-gradient(25deg, rgba(118, 118, 118, 0.07) 0%, rgba(118, 118, 118, 0.07) 98%,rgba(248, 248, 248, 0.07) 98%, rgba(248, 248, 248, 0.07) 100%),linear-gradient(90deg, #000,#000);
}


.articles-news{    
    margin-top:-5%;
}
.new-videos{
    margin-top:-5%;
}



@media (max-width:767px){
    .insta{        
        margin-top:20px;
    }
    .facebook{        
        margin-top:20px;
    }
    .zoom{        
        margin-top:20px;
    }
    .recent{
        margin-top:-17%;
        background: #e2e3e9 !important;
    }
    .articles-news{
        margin-top:-10%;
        background: #e2e3e9 !important; 
    }
    .article{
        margin-top:-1%;
    }
    .channels{
        margin-top:5%;
    }
    .title-block{        
        margin-top:-12%;
    }
    .embla{
        border:1px solid #000;
        margin-bottom: 12%!important;
    }
    .ft-zoom{        
        text-align: center;
    }
    .social{             
        align-items: center;
        justify-content: center;
        margin-top:10%;       
    }
    .gray{
        position: relative;
    }
    .second{
        position: absolute;        
        top:6%!important;
    }
    .phonepay{
        margin-top:10px!important;
    }

}

.topbar{
    background-color: #81b079;
    padding: 2px;
}
.tob-box a, .time{
    color: #fff;
}
.tob-box .fa{
    color: yellow;
}
.banner-bar{
    background-color: #000;
    padding: 3%;
}

.register-btn{
    background-color: #fff;
    color: #000;
    font-weight: 600;
    padding: 10px 20px;
    border-radius: 3px;
}
.far{
    color: red;
}
.banner-btn{
    position: absolute;
    top: 60%;
    left: 6%;
}
.banner-btn button{
    background-color: #000;
    color: #fff;
    padding: 15px;
    border-radius: 100px;
    margin-top:50%;
}

@media (max-width:767px){
    .tob-box{
        text-align: center;
    }
    .banner-bar .text{
        color: #fff;
        font-size: 20px;
        font-weight: 600;
        text-align: center;
    }
    .reg-bnt{
        display: flex;
        justify-content: center;
        margin-top: 2%;
    }
    .course-banner{
        width: 100% !important;
        height: 100% !important;
    }
}

@media (min-width:768px) { 
    .tob-box{
        display: flex;
        width: 80%;
    }
    .banner-bar-box{
        display: flex;
        justify-content: center;
    }
    .banner-bar .text{
        color: #fff;
        font-size: 30px;
        font-weight: 600;
    }
    .course-banner{
        width: 75% !important;
        height: 100% !important;
    }
    .recent{
    background: #e2e3e9 !important;
}
}
@media (min-width:992px){
    .tob-box{
        display: flex;
        width: 50%;
    }
    .banner-section img{
        width: 100%;
    }
    .banner-bar-box{
        display: flex;
        justify-content: center;
    }
    .banner-bar .text{
        color: #fff;
        font-size: 30px;
        font-weight: 600;
    }
    .course-banner{
        width: 50% !important;
        height: 100% !important;
    }
}