@media only screen and (min-width: 768px) and (max-width: 991px) { 
    .single_feature i {left: 38%}
    .story_image {margin-bottom: 20px}
    .skills {margin-top: 50px}
    .company_address {padding: 10px 26px}
    .well {width:75%}
    .new_h2 {font-size: 20px}
    .header_area_text {
        padding-bottom: 20px;
        padding-top: 140px;
    }
    .recent-work h4 {
        font-size: 14px;
    }
    .articlelisting {
        max-height: 270px;
    }
    .articlelisting p {
        font-size: 12px;
    }
}

@media only screen and (max-width: 990px) {    
    .events-area .event {display: none; }
    .events-area .event-details {margin-left: 0px;top: 0;}
    .events-area .event-details h5 {height: inherit}
    .header-row:after { border: none!important}
    .header-row h2 {float: none;text-align: center;display: block!important;}
    .header-row p {float: none; text-align: center;}
    .events-area .event-details {border:none;border-bottom: 1px solid rgba(255,255,255,.3);}
    a:last-child .event-details {border-bottom:none;}
    #footer_area .col-md-6{text-align: center!important}
    .events-header{display: none;}
    #slideshow > div {margin-top: 0px;float: none;width: 100%}
    .headertop{text-align: center;display: inline-block;}
    .story_text .cover { position: relative;}
}
@media only screen and (max-width: 390px) {
    .new_h2 {font-size: 18px!important;} 
    header.sticky {height: 65px!important;}
    .navbar-nav>li>a { text-align: center;}
    .header_area_text h2 {font-size: 16px!important; margin: 10px 0;width: 100%;}
    .header_area_text{padding-bottom: 80px!important;padding-top: 140px;}
    .header_area_text h3 {font-size: 20px!important;width: 100%;}
    .header_area_text h4 {font-size: 16px!important;width: 100%;}
    .section_padding {padding: 40px 0;}
    .header-row h2 {font-size: 24px;}
    .services_area .textcenter {height: 255px;}
    .textcenter img {padding: 15px 0 !important;}
    .h3, h3 {font-size: 18px!important;}
    .header-row h4 {  width: 90%;}
    .textcenter {background: #fff!important;margin: 20px 30px;}
    .company_address {text-align: center;}
    .bodybackground {padding: 0px;}
    .section_padding_ {margin: 0px!important;padding: 0px!important;}
    .course_area .container{padding-left: 0;padding-right: 0}    
    .logo{margin: 0;float: none}
    #header_area .logo img {    margin-left: 0px;    display: block;    margin-left: auto!important;    margin-right: auto!important;
    }
    .headertop {font-size: 12px;line-height: 1.2;}

@media only screen and (max-width: 767px) {   
    .header_area_text h2 {font-size: 22px}
    .header_area_text {padding-right: 0px}
    .header_area_text {padding-top: 160px;padding-bottom: 5px}
    .header_area_text a,
    .story_text a,
    .experience a,
    .call_project a {padding: 8px 10px;margin-top: 0px}
    .single_feature i {left: 40%}
    .story_text h2,.experience h2 {margin-bottom: 10px;margin-top: 10px}
    .clients_say p::before {display: none}
    .say {width: 100%}
    .c_img {width: 15%}
    .clients_say p {padding: 10px}
    .clients_say {margin-bottom: 60px}
    .skills h2 {margin-top: 20px;margin-bottom: 10px}
    .single_blog h2 {font-size: 16px}
    .single_blog {margin-bottom: 30px}
    .call_to_action_text h2 {font-size: 22px}
    .single_blog p,.call_to_action_text p {font-size: 16px;margin-top: 5px}
    .text-right {text-align: left}
    .header_area_text p {font-size: 12px}
    h2 {font-size: 22px}
    .company_address p {font-size: 16px}
    .company_address h2 {font-size: 16px}
    .company_address {padding: 10px 15px}
    .section_padding {padding: auto;}
    .well {width:75%}
    #links img {margin: 5px;width: 90%;}   
    .header_area_text h2 {font-size: 24px;}
    .navbar-collapse { margin-top: 0px!important;width: 100%!important;}
    .navbar-nav > li > a {padding: 15px 0 !important;}   
    .viewall {margin-top: 0;}
    .header-row {margin-bottom: 10px;line-height: 1.5 !important;}
    .header-row h4 {margin-bottom: 10px;
    line-height: 1.4;
    font-size: 15px;}
    .story_image {margin-bottom: 20px;}
    .viewall a{margin-top: 20px;}
    .servicecourse .story_image {display: none;}
    .header-row img {filter: grayscale(0);}
    .coursedetails .textcenter{background: #dddfd4 !important;margin: 0;padding: 30px !important;height: auto!important}
    p {font-size: 15px;color: #555;line-height: 1.6;}
    header, .navbar, header {position: relative;background: var(--acolor);}
    .headertop{box-shadow:none;}
    .flex-caption {margin:-11em 7% 4.5em;text-align: center}
    .flex-caption h1 { font-size: 20px;line-height: 1.4}
    .course_area .textcenter img {height: auto;width: 100%;}
    #about_area h1 {font-size: 16px;padding: 0;}
    .navbar-toggle{float: none;margin-top: 0px}
    .navbar-nav > li > a {font-size: 17px;}
    .course_area .textcenter h3{padding-top: 15px;padding-bottom: 10px !important;margin-bottom: 5px;}
    .course_area .textcenter {height: 210px;}
    .course_area .textcenter p, prow { height: 100px !important;}
    .header_area_text_ { padding-top: 0px;}
    .header_area_text_ p {font-size: 14px;padding-bottom: 10px;}
}
/* Wide Mobile Layout: 480px. */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .single_feature i {left: 46%;top: -22%}
    .single_blog img {width: 100%}
}

@media only screen and (min-width: 1200px) {
    .navbar {position: relative;}
}

@media only screen and (max-width: 1280px) {
.section_padding_ {margin: 20px;padding: 20px;background: #eadcbf !important;} 
}
@media only screen and (max-width: 1200px) { 
    header.sticky{height:90px;}
    .new_h2 {font-size: 20px}
    #login {text-align: right;}
    #login {margin-top: -96px;}
    .navbar-toggle .icon-bar {background-color: #fff}
    .navbar-header {float: none;}
    .navbar-toggle {
        display: block;
        margin-right:0;
        background-color: var(--bcolor)!important;
        border-radius: 0px;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
        margin-top: 19px;
        width: 300px;
        float: right;
        margin-bottom: 10px;
    }
    .navbar-collapse.collapse {display: none!important;}
    .navbar-nav {
        float: none!important;
        margin: 0;
    }
    .navbar-nav>li {float: none;}
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .navbar-text {
        float: none;
        margin: 15px 0;
    }
    .navbar-collapse.collapse.in {display: block!important;}
    .collapsing {overflow: hidden!important;}    
}