@media only screen and (max-width: 320px){
    #about .content{
        text-align: center;
    }

    #testimonials .content p{
        font-size: 14px;
        line-height: 20px;
        width: 100%;        
    }

    #contact .text{
        width: 210px;
    }

    .portfolio-list{
        margin-left: 5px !important;
    }

    .team-container{
        margin-bottom: 20px;
    }

    #clients .img-container img{
        left: 100%;
    }    

}


@media only screen and (max-width: 480px) {

    .home .navbar-default .navbar-nav > li > a{
        color: #555;
    }

    .navbar-header{
        display: inherit;
    }

    .navbar-default .navbar-collapse{
        background: #fff !important;
    }

    .nav>li{
        color: #555;
        padding: 0;
    }

    .nav>li a:hover{
        color: #555;
    }

    .navbar-collapse .navbar-nav>.active>a:hover{
        color: #555 !important;
    }

    .scroll-fix.navbar-default .navbar-nav > li > a{
        display: block;
        vertical-align: top;
    }

    .scroll-fix{
        display: none !important;
    }

    #logo img{
        margin-bottom: 15px;
    }

    .dropdown-menu{
        -webkit-box-shadow:none;
        box-shadow:none;
        border: 0;
    }

    .dropdown-menu a:hover{
        color: #555;
    }

    .dropdown-menu > .active > a, 
    .dropdown-menu > .active > a:hover, 
    .dropdown-menu > .active > a:focus{
        background: none;
        color: #555;
    }

     .promo-section .learn-more a{
        display: block;    
        padding-bottom: 20px;
    }

    .promo-section h2{        
        font-size: 28px !important;
        margin-top: 30px;
    }

    .promo-section p{
        width: 100%;
    }

    #about-1 .inner-content{
        width: 100%;
    }

    .flexslider .slides img{
        height: 100%;
        object-fit: cover;
    }

    .slider .caption{
        top: 20%;        
    }

    .slider .caption h1{
        font-size: 20px !important;
    }

    .slider .caption p{
        width: 80%;
    }

    .slider-buttons a{
        display: block;
        margin-bottom: 0px;
    }

    .scroll-down{
        bottom: 50px;
    }

    .slider .flex-control-nav{
        bottom: 20px;
        margin-left: 20px;
        text-align: left;
    }

    .slider:hover .flex-control-nav{
        bottom: 20px;
        margin-left: 20px;
        text-align: left;
    }

    #about .content{
        text-align: center;
    }

    #testimonials .content p{
        font-size: 14px;
        line-height: 20px;
        width: 100%;        
    }

    #testimonials #text-carousel{
        padding: 0;
    }

    .portfolio-list{
        margin-left: 20px;
    }

    #clients .img-container img{
        left: 100%;
    }

    .content-404 p{
        margin-bottom: 50px;
    }

    #contact .icon{
        margin-bottom: 15px;
    }

    .scroll-down{
        left: 51%;    
    }

    
}


@media only screen and (min-width: 481px) and (max-width: 767px) {  

    .home .navbar-default .navbar-nav > li > a{
        color: #555 !important;
    }

    .navbar-header{
        display: inherit;
    }

    .navbar-default .navbar-collapse{
        background: #fff !important;
    }

    .nav>li{
        color: #555;
        padding: 0;
    }

    .nav>li a:hover{
        color: #555;
    }

    .navbar-collapse .navbar-nav>.active>a:hover{
        color: #555 !important;
    }

    .scroll-fix.navbar-default .navbar-nav > li > a{
        display: block;
        vertical-align: top;
    }

    .scroll-fix{
        display: none !important;
    }

    #logo img{
        margin-bottom: 15px;
    }

    .dropdown-menu{
        -webkit-box-shadow:none;
        box-shadow:none;
        border: 0;
    }

    .dropdown-menu a:hover{
        color: #555;
    }

    .dropdown-menu > .active > a, 
    .dropdown-menu > .active > a:hover, 
    .dropdown-menu > .active > a:focus{
        background: none;
        color: #555;
    }

    .slider .slides li{
        height: 700px !important;
    }

    .flexslider .slides img{
        height: 100%;       
        object-fit: cover;
    }

    .slider .caption{
        top: 40%;        
    }

    .list_item .hovereffect img {    
        
    }    

    #clients .img-container img{
        left: 100%;
    }   

    .list_item .hovereffect {  
        width: 290px;
    } 
}



@media only screen and (max-width: 767px) {
    .home .navbar-default .navbar-nav > .active > a, 
    .home .navbar-default .navbar-nav > .active > a:focus, 
    .home .navbar-default .navbar-nav > .active > a:hover{
        color: #555 !important;
    }

    .home .navbar-default .navbar-nav > li > a{
        color: #555 !important;
    }

    .navbar-default .navbar-nav > .active > a, 
    .navbar-default .navbar-nav > .active > a:focus, 
    .navbar-default .navbar-nav > .active > a:hover{
        color: #555 !important;   
    }

    .navbar-default .navbar-nav>li>a{
        color: #555 !important;
    }

    .dropdown-menu > li > a{
         color: #555 !important;
    }

    .dropdown-menu > li > a:hover, 
    .dropdown-menu > li > a:focus{
        color: #fff !important;
    }

}


@media only screen and (min-width: 768px) and (max-width: 980px) {  
    .flexslider .slides img{
        height: 100%;
        max-height: 100%;
        background-size: cover;
    }
}

@media only screen and (min-width: 768px) and (max-width: 2560px) {  
    .home .navbar-default .navbar-nav > .active > a, 
    .home .navbar-default .navbar-nav > .active > a:focus, 
    .home .navbar-default .navbar-nav > .active > a:hover{
        color: #fff !important;
    }

    .home .navbar-default .navbar-nav > li > a{
        color: #fff !important;
    }

    .navbar-default .navbar-nav > .active > a, 
    .navbar-default .navbar-nav > .active > a:focus, 
    .navbar-default .navbar-nav > .active > a:hover{
        color: #555 !important;   
    }

    .navbar-default .navbar-nav>li>a{
        color: #555 !important;
    }

    .scroll-fix.navbar-default .navbar-nav>li>a{
        color: #555 !important;
    }

    .scroll-fix.navbar-default .navbar-nav>li.active>a,
    .scroll-fix.navbar-default .navbar-nav>li.active>a:hover,
    .scroll-fix.navbar-default .navbar-nav>li.active>a:focus{
         color: #555 !important;
    }
}