/*Small Devices*/
@media (max-width: 576px){

}

/*Tablets*/
@media(min-width: 768px){

    /*===========================
            Homepage CSS
    ===========================*/

    /*CTA: Candidate or Hirer*/
    .placeholder-img-candidate{
        width: 40%;
    }

    .placeholder-img-hirer{
        width: 42.6%;
    }

    /*Callout*/
    section.callout{
        width: 50%;
    }

    /*Owl Carousel*/
    .testimonial-carousel .owl-nav{
        text-align: left;
    }

}

/* Mobile */
@media(max-width: 500px){

    /*CTA: Candidate or Hirer*/
    .placeholder-img-candidate{
        width: 90%;
    }

    .placeholder-img-hirer{
        width: 92.6%;
    }

}

/*Netbooks*/
@media(min-width: 992px){

    /*Navlinks*/
    a.nav-link.active.selected:before {
        content: '';
        background:#ff8201;;
        position: absolute;
        top:0;
        margin-top: -0.4rem;
        padding: 2px;
        width: 100%;
        left:0;
        border-radius:0 0 5px 5px;
    }
    a.nav-link.active.selected:after{
        display: none;
    }

    /*Mega Menu*/
    .mega-menu{
        width: 98%;
    }


    /*===========================
            Homepage CSS
    ===========================*/

    /*Hero*/
    .bg-2{
        /*height: 920px;*/
        height: 650px;
    }

    /*Callout*/
    section.callout{
        width: 35%;
    }

    /*Jobs Page Sidebar*/
    /*li.category-list{
        height: 100%;
    }*/

    li.category-list a:hover,
    li.category-list a:focus,
    li.category-list a:hover i,
    li.category-list a:focus i,
    li.category-list.active a,
    li.category-list.active a  i{
        padding-left: 1rem;
    }

    li.category-list a:hover:before,
    li.category-list a:focus:before,
    li.category-list.active a:before{
        content: '>';
        font-family: 'Consolas',monospace;
        position: absolute;
        top: 0.25rem;
        left: 1rem;
        color:#ff8201;
        font-size: 1.25rem;
        font-weight: bold;
    }

    li.category-list a:hover,
    li.category-list a:focus,
    li.category-list.active a{
      border-radius: 0 50px 50px 0;
    }

    .mask-scroll{
        -webkit-mask-image: linear-gradient(to right, #000 100%, transparent 0%);
    }

    .category-link{
        font-size: 1rem;
        width: 100%;
    }

    /*=====================
          Testimonials
    =====================*/
    .testimonial-card{
      height: 240px;
      overflow: hidden;
    }

}

/*Laptops*/
@media(min-width: 1024px){
    
    /*Section*/
    section.section{
        margin: 4rem 0;
    }

    /*Big Margin-Y-axis*/
    .my-big{
        margin: 8rem 0;
    }
}

/*Desktops*/
@media(min-width: 1440px){

    /*===========================
            Homepage CSS
    ===========================*/
    
    /*Testimonials*/
    .testimonial-cartoon{
        width: 16%;
    }
}