/*  -------------------------------------------------------------------------------
 *  [ 17 ] - Media Queries
 *  -------------------------------------------------------------------------------
 *  
 *  This part contains the all changes that needed for elements for the Bootsrap
 *  widths like iPhone image in About Us section
 *  
 *  It's divided to the following sections:
 *  
 *     |
       |-->   - Width between 1200px to 0
       |-->   - Width between 992px to 1199px
 *     |-->   - Width between 768px to 991px
       |-->   - Width between 767px to 0
       |-->   - Width between 600px to 0
 *     |-->   - Width between 480px to 0
 *     |-->   - Width between 320px to 0


*/


/** Width between 1200x to 0 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 1200px) {}


/** Width between 992px to 1199px 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 992px) and (max-width: 1199px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }
    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    /* .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    } */

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    .max-width {
        max-width: 100%;
        margin: 0px auto 0 auto;
    }

    #blog .container,
    #project .container-fluid,
    #testimonials .container-fluid {
        width: 750px !important;
    }



    /* About Us */

    #aboutus .block-aboutus .d-none-r {
        display: inherit;
    }

    #aboutus .block-aboutus .plr-0 {
        padding-left: 15px;
        padding-right: 15px;
    }


    /* Contact */
    #contact .cnt-new .plr-0{
        padding-left: 15px;
        padding-right: 15px;
    }
}


/** Width between 768px to 991px 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (min-width: 768px) and (max-width: 991px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }
    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    /* .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    } */

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    .max-width {
        max-width: 350px;
        margin: 0px auto 0 auto;
    }

    #blog .container,
    #project .container-fluid,
    #testimonials .container-fluid {
        width: 750px !important;
    }

    /* Navbar Menu */

    nav.navbar.bootsnav .navbar-header {
        background: #fff;
    }

    nav.navbar.bootsnav.navbar-fixed {
        box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1) !important;
    }

    nav.navbar.bootsnav .navbar-toggle {
        margin-top: 16px;
        border-radius: 0;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #888;
        margin-bottom: 5px;
    }

    nav.navbar.bootsnav.navbar-transparent .logo {
        height: 60px;
        float: left;
        margin-top: 0;
    }

    .navbar .navbar-header img {
        margin-top: 12px;
        float: right;
    }

    .navbar-header .logo {
        float: left;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in {
        display: block !important;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        max-height: initial;
    }

    nav.navbar.bootsnav .navbar-nav {
        background: #fff;
        padding: 20px 20px;
    }

    nav.navbar.bootsnav.navbar-transparent.white ul.nav>li>a,
    nav.navbar.bootsnav.no-background.white ul.nav>li>a {
        color: #292929;
        padding: 10px 0px;
        border: none;
    }

    nav.navbar.bootsnav ul.nav>li>a {
        padding: 10px 15px;
        border: none;
    }

    /* Banners */

    .banner:after {
        display: none !important;
    }

    .banner .banner-text {
        width: 100%;
    }

    .banner .banner-text h1 {
        font-size: 30px !important;
        line-height: 35px !important;
    }

    .banner-text .btn {
        /* padding: 10px 10px; */
    }

    .auto-container .circle-two,
    .auto-container .icon-four {
        display: none;
    }

    #home .icon-three {
        top: 24%;
    }

    #home .icon-one {
        left: 14%;
    }

    #home .icon-two {
        top: 68%;
    }

    /* Slider */
    
    .imgtest img {
        display: none;
    }

    .slide-text {
        left: 0;
        right: 0;
        padding: 0;
        width: 100%;
        float: none !important;
        text-align: center !important;
        margin-left: auto;
        margin-right: auto;
    }

    .slide-text > h1 {
        max-width: 95%;
        margin-right: auto;
        margin-left: auto;
    }

    /* we do */

    #wedo .item-wedo {
        margin: 0px auto 0 auto
    }

    /* About Us */

    #aboutus .block-aboutus {
        padding: 40px 20px;
        overflow: hidden;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        background: #fff;
    }

    #aboutus .block-aboutus .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
        max-width: 100%;
    }

    .aboutus .content-about .title-section {
        margin: 0 0 60px 0;
    }

    /* Counter */

    #counter .counetr-block {
        display: inherit;
    }

    .timeline-wave {
        display: none;
    }

    #counter:before {
        top: 25%;
        right: 0%;
        height: 45%;
        width: 100%;
    }

    #counter .counetr-block .counter-item {
        margin: 0;
        margin-left: auto;
        margin-right: auto;
    }

    /* Services */

    #services {
        background: #fff !important;
    }

    #services .title-section,
    #pricing .title-section {
        margin-bottom: 30px;
    }

    .btn-services-top {
        margin-top: 0px;
        text-align: center;
        margin-bottom: 60px !important;
    }

    .btn-services-top .btn {
        margin-top: 0 !important;
        float: none !important;
    }

    .btn-content-about .btn {
        margin-right: 10px;
    }

    /* Pricing */

    .pricing .nav-tabs {
        display: flex;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 60px;
        width: 100%;
        float: none !important;
    }

    #pricing .tab-content .col-md-6.col-lg-4 {
        float: left;
    }

    /* Testimonials */

    .testimonials .cnt-testimonials {
        padding-top: 0px;
    }

    #testimonials .item-testimonials {
        margin-right: 15px;
        margin-left: 15px;
        margin-left: auto;
        margin-right: auto;
    }

    #testimonials .title-section {
        margin-bottom: 60px !important;
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Project */

    .owl-carousel .owl-stage .item-project {
        height: 400px !important;
    }

    .project .owl-dots {
        left: 0 !important;
    }

    /* Blog */

    #blog {
        padding-bottom: 60px;
    }

    /* Project Start */

    #project-start .project-item {
        padding: 40px 20px;
    }

    #project-start .project-item .text-item h2 {
        margin-bottom: 30px;
    }

    #project-start .project-item .btn-item .btn-orong {
        color: #fff;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    #project-start .project-item .btn-item {
        text-align: left;
    }

    /* Client */

    .client-item {
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Contact */

    .cnt-new .fix-blok {
        padding: 40px 20px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    #contact .cnt-new {
        padding: 0;
        box-shadow: none;
        display: inherit;
    }

    #contact .contact-form {
        margin-top: 0;
    }

    #contact .cnt-new .list-contact {
       /*  margin-left: 20px; */
    }

    #contact .cnt-new .list-contact li {
        /* padding-left: 10px; */
    }

    #contact .cnt-new .list-contact li i {
        padding-right: 10px;
    }

    #contact .btn-send {
        margin-left: 0px;
        margin-right: 0px;
    }

    /* Footer */

    .footer {
        position: initial !important;
        height: auto;
    }

    .footer .footer-top {
        display: inline-block !important;
        border-bottom: none !important;
    }

    .footer .footer-btm {
        display: inline-block !important;
    }

    .footer .footer-btm .footer-social-media {
        display: flex;
        justify-content: center;
    }

    .footer-height {
        display: none;
    }

}


/** Width between 767px to 0 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 767px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }

    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    .max-width {
        max-width: 350px;
        margin: 0px auto 0 auto;
    }

    /* Navbar Menu */

    nav.navbar.bootsnav .navbar-header {
        background: #fff;
    }

    nav.navbar.bootsnav.navbar-fixed {
        box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1) !important;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 0;
        padding-bottom: 0;
    }

    nav.navbar.bootsnav .navbar-toggle {
        margin-top: 16px;
        border-radius: 0;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #888;
        margin-bottom: 5px;
    }

    nav.navbar.bootsnav.navbar-transparent .logo {
        height: 60px;
        float: left;
        margin-top: 3px;
    }

    .navbar .navbar-header img {
        margin-top: 12px;
        margin-bottom: 12px;
        float: right;
    }

    .navbar-header .logo {
        float: left;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in {
        display: block !important;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        max-height: initial;
    }

    nav.navbar.bootsnav .navbar-nav {
        background: #fff;
        padding: 20px 20px;
    }

    nav.navbar.bootsnav.navbar-transparent.white ul.nav>li>a,
    nav.navbar.bootsnav.no-background.white ul.nav>li>a {
        color: #292929;
        padding: 10px 0px;
        border: none;
    }

    nav.navbar.bootsnav ul.nav>li>a {
        padding: 10px 15px;
        border: none;
    }

    /* Serache */

    #search form {
        width: 89%;
    }

    /* Banners */

    .banner:after {
        display: none !important;
    }

    .banner .banner-text {
        width: 100%;
    }

    .banner .banner-text h1 {
        font-size: 30px !important;
        line-height: 35px !important;
    }

    .banner-text .btn {
        margin-left: 10px;
        margin-right: 10px;
    }

    .auto-container .circle-two,
    .auto-container .icon-four {
        display: none;
    }

    #home .icon-three {
        top: 24%;
    }

    #home .icon-one {
        left: 14%;
    }

    #home .icon-two {
        top: 68%;
    }

    /* Slider */
    
    .imgtest img {
        display: none;
    }

    .slide-text {
        left: 0;
        right: 0;
        padding: 0;
        width: 100%;
        float: none !important;
        text-align: center !important;
        margin-left: auto;
        margin-right: auto;
    }

    .slide-text > h1 {
        max-width: 95%;
        margin-right: auto;
        margin-left: auto;
    }

    /* About Us */

    #aboutus .block-aboutus {
        padding: 40px 20px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        background: #fff;
    }

    .aboutus .content-about .title-section {
        margin: 0 0 30px 0;
    }

    /* Counter */

    .timeline-wave {
        display: none;
    }

    #counter:before {
        top: 25%;
        right: 0%;
        height: 45%;
        width: 100%;
    }

    #counter .counetr-block .counter-item {
        margin: 0;
        margin-left: auto;
        margin-right: auto;
    }

    /* Services */

    #services {
        background: #fff !important;
    }

    #services .title-section,
    #pricing .title-section {
        margin-bottom: 30px;
    }

    .btn-services-top {
        margin-top: 0px;
        text-align: center;
        margin-bottom: 60px !important;
    }

    .btn-services-top .btn {
        margin-top: 0 !important;
        float: none !important;
    }

    .btn-content-about .btn {
        margin-right: 10px;
    }

    /* Pricing */

    .pricing .nav-tabs {
        display: flex;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 60px;
        width: 100%;
        float: none !important;
    }

    #pricing .nav-tabs .nav-item {
        padding: 0;
        margin-bottom: 10px;
    }

    #pricing .nav-tabs>li {
        margin-bottom: 0;
        margin-left: 0;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    /* Testimonials */

    .testimonials .cnt-testimonials {
        padding-top: 0px;
    }

    #testimonials .item-testimonials {
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    #testimonials .title-section {
        margin-bottom: 60px !important;
        margin-left: 15px;
        margin-right: 15px;
    }

    #testimonials .container-fluid,
    #project .container-fluid {
        max-width: 540px;
    }

    /* Project */

    .owl-carousel .owl-stage .item-project {
        height: 400px !important;
    }

    .project .owl-dots {
        left: 0 !important;
    }

    /* Blog */

    #blog {
        padding-bottom: 60px;
    }

    #blog .container {
        width: 100%;
        max-width: 540px;
        margin: 0 auto;
    }

    /* Project Start */

    #project-start .project-item {
        padding: 40px 20px;
    }

    #project-start .project-item .text-item h2 {
        margin-bottom: 30px;
    }

    #project-start .project-item .btn-item .btn-orong {
        color: #fff;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    #project-start .project-item .btn-item {
        text-align: left;
    }

    /* Contact */

    .cnt-new .fix-blok {
        padding: 40px 20px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    #contact .cnt-new {
        padding: 0;
        box-shadow: none;
        display: inherit;
    }

    #contact .contact-form {
        margin-top: 0;
    }

    #contact .cnt-new .list-contact {
        /* margin-left: 20px; */
    }

    #contact .cnt-new .list-contact li {
        /* padding-left: 10px; */
    }

    #contact .cnt-new .list-contact li i {
        padding-right: 10px;
    }

    #contact .btn-send {
        margin-left: 0px;
        margin-right: 0px;
    }

    /* Footer */

    .footer {
        position: initial !important;
        height: auto;
    }

    .footer .footer-top {
        display: inline-block !important;
        border-bottom: none !important;
    }

    .footer .footer-btm {
        display: inline-block !important;
    }

    .footer .footer-btm .footer-social-media {
        display: flex;
        justify-content: center;
    }

    .footer-height {
        display: none;
    }

}


/** Width between 600px to 0 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 600px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }

    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    .max-width {
        max-width: 350px;
        margin: 0px auto 0 auto;
    }

    /* Navbar Menu */

    nav.navbar.bootsnav .navbar-header {
        background: #fff;
    }

    nav.navbar.bootsnav.navbar-fixed {
        box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1) !important;
        padding-top: 0;
        padding-bottom: 0;
    }
    nav.navbar.bootsnav .navbar-toggle {
        margin-top: 16px;
        border-radius: 0;
    }
    .navbar-default .navbar-toggle .icon-bar {
        background-color: #888;
        margin-bottom: 5px;
    }
    nav.navbar.bootsnav.navbar-transparent .logo {
        height: 60px;
        float: left;
        margin-top: 3px;
    }

    .navbar .navbar-header img {
        margin-top: 12px;
        margin-bottom: 12px;
        float: right;
    }

    .navbar-header .logo {
        float: left;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in {
        display: block !important;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        max-height: initial;
    }

    nav.navbar.bootsnav .navbar-nav {
        background: #fff;
        padding: 20px 20px;
    }

    nav.navbar.bootsnav.navbar-transparent.white ul.nav>li>a,
    nav.navbar.bootsnav.no-background.white ul.nav>li>a {
        color: #292929;
        padding: 10px 0px;
        border: none;
    }

    nav.navbar.bootsnav ul.nav>li>a {
        padding: 10px 15px;
        border: none;
    }

    /* Serache */

    #search form {
        width: 89%;
    }

    /* Banners */

    .banner:after {
        display: none !important;
    }

    .banner .banner-text {
        width: 100%;
    }

    .banner .banner-text h1 {
        font-size: 30px !important;
        line-height: 35px !important;
    }

    .banner-text .btn {
        margin-left: 10px;
        margin-right: 10px;
    }

    .auto-container .circle-two,
    .auto-container .icon-four {
        display: none;
    }

    #home .icon-three {
        top: 24%;
    }

    #home .icon-one {
        left: 14%;
    }

    #home .icon-two {
        top: 68%;
    }

    /* Slider */
    
    .imgtest img {
        display: none;
    }

    .slide-text {
        left: auto;
        right: 0;
        width: 100%;
        float: none;
        z-index: 99999;
    }

    .slide-text > h1 {
        font-size: 30px;
        width: 100% !important;
        max-width: 68%;
    }


    /* About Us */

    #aboutus .block-aboutus {
        padding: 40px 20px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        background: #fff;
    }

    .aboutus .content-about .title-section {
        margin: 0 0 60px 0;
    }

    /* Counter */

    .timeline-wave {
        display: none;
    }

    #counter:before {
        top: 32%;
        right: 0%;
        height: 30%;
        width: 100%;
    }

    /* Services */

    #services {
        background: #fff !important;
    }

    #services .title-section,
    #pricing .title-section {
        margin-bottom: 30px;
    }

    .btn-services-top {
        margin-top: 0px;
        text-align: center;
        margin-bottom: 60px !important;
    }

    .btn-services-top .btn {
        margin-top: 0 !important;
        float: none !important;
    }

    .btn-content-about .btn {
        margin-right: 10px;
    }

    /* Pricing */

    .pricing .nav-tabs {
        display: flex;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 60px;
        width: 100%;
        float: none !important;
    }

    #pricing .nav-tabs .nav-item {
        padding: 0;
        margin-bottom: 10px;
    }

    #pricing .nav-tabs>li {
        margin-bottom: 0;
        margin-left: 5px;
        margin-right: 5px;
        display: block;
        justify-content: center;
        width: auto;
    }

    /* Testimonials */

    .testimonials .cnt-testimonials {
        padding-top: 0px;
    }

    #testimonials .item-testimonials {
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    #testimonials .title-section {
        margin-bottom: 60px !important;
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Project */

    .owl-carousel .owl-stage .item-project {
        height: 400px !important;
    }

    .project .owl-dots {
        left: 0 !important;
    }

    /* Blog */

    #blog {
        padding-bottom: 60px;
    }

    /* Project Start */

    #project-start .project-item {
        padding: 40px 20px;
    }

    #project-start .project-item .text-item h2 {
        margin-bottom: 30px;
    }

    #project-start .project-item .btn-item .btn-orong {
        color: #fff;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    #project-start .project-item .btn-item {
        text-align: left;
    }

    /* Client */

    .client-item {
        margin-left: auto;
        margin-right: auto;
    }

    /* Contact */

    .cnt-new .fix-blok {
        padding: 40px 20px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    #contact .cnt-new {
        padding: 0;
        box-shadow: none;
        display: inherit;
    }

    #contact .contact-form {
        margin-top: 0;
    }

    #contact .cnt-new .list-contact {
       /*  margin-left: 20px; */
    }
    #contact .cnt-new .list-contact li {
        /* padding-left: 10px; */
    }
    #contact .cnt-new .list-contact li i {
        padding-right: 10px;
    }
    #contact .btn-send {
        margin-left: 0px;
        margin-right: 0px;
    }

    /* Footer */

    .footer {
        position: initial !important;
        height: auto;
    }

    .footer .footer-top {
        display: inline-block !important;
        border-bottom: none !important;
    }

    .footer .footer-btm {
        display: inline-block !important;
    }

    .footer .footer-btm .footer-social-media {
        display: flex;
        justify-content: center;
    }

    .footer-height {
        display: none;
    }

}


/** Width between 480px to 0 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 480px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }

    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    .max-width {
        max-width: 350px;
        margin: 0px auto 0 auto;
    }

    /* Navbar Menu */

    nav.navbar.bootsnav .navbar-header {
        background: #fff;
    }

    nav.navbar.bootsnav.navbar-fixed {
        box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1) !important;
        padding-top: 0;
        padding-bottom: 0;
    }

    nav.navbar.bootsnav .navbar-toggle {
        margin-top: 16px;
        border-radius: 0;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #888;
        margin-bottom: 5px;
    }

    nav.navbar.bootsnav.navbar-transparent .logo {
        height: 60px;
        float: left;
        margin-top: 3px;
    }

    .navbar .navbar-header img {
        margin-top: 12px;
        margin-bottom: 12px;
        float: right;
    }

    .navbar-header .logo {
        float: left;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in {
        display: block !important;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        max-height: initial;
    }

    nav.navbar.bootsnav .navbar-nav {
        background: #fff;
        padding: 20px 20px;
    }

    nav.navbar.bootsnav.navbar-transparent.white ul.nav>li>a,
    nav.navbar.bootsnav.no-background.white ul.nav>li>a {
        color: #292929;
        padding: 10px 0px;
        border: none;
    }

    nav.navbar.bootsnav ul.nav>li>a {
        padding: 10px 15px;
        border: none;
    }
    
    /* Serache */

    #search form {
        width: 89%;
    }

    /* Banners */

    .banner:after {
        display: none !important;
    }

    .banner .banner-text {
        width: 100%;
    }

    .banner .banner-text h1 {
        font-size: 30px !important;
        line-height: 35px !important;
    }

    .banner-text .btn {
        margin-left: 10px;
        margin-right: 10px;
    }

    .auto-container .circle-two,
    .auto-container .icon-four {
        display: none;
    }

    #home .icon-three {
        top: 24%;
    }

    #home .icon-one {
        left: 14%;
    }

    #home .icon-two {
        top: 68%;
    }

    /* Slider */
    
    .imgtest img {
        display: none;
    }

    .slide-text {
        left: auto;
        right: 0;
        width: 100%;
        float: none;
    }
    .slide-text > h1 {
        font-size: 30px;
        width: 100% !important;
        max-width: 100%;
    }

    /* About Us */

    #aboutus .block-aboutus {
        padding: 40px 20px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        background: #fff;
    }

    .aboutus .content-about .title-section {
        margin: 0 0 30px 0;
    }

    /* Counter */

    .timeline-wave {
        display: none;
    }

    #counter:before {
        top: 32%;
        right: 0%;
        height: 30%;
        width: 100%;
    }

    /* Services */

    #services {
        background: #fff !important;
    }

    #services .title-section,
    #pricing .title-section {
        margin-bottom: 30px;
    }

    .btn-services-top {
        margin-top: 0px;
        text-align: center;
        margin-bottom: 60px !important;
    }

    .btn-services-top .btn {
        margin-top: 0 !important;
        float: none !important;
    }

    .btn-content-about .btn {
        margin-right: 10px;
    }

    /* Pricing */

    .pricing .nav-tabs {
        display: flex;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 60px;
        width: 100%;
        float: none !important;
    }

    #pricing .nav-tabs .nav-item{
        padding: 0;
        margin-bottom: 10px;
    }

    #pricing .nav-tabs>li {
        margin-bottom: 0 !important;
        margin-left: 5px;
        margin-right: 5px;
        width: 100%;
    }

    /* Testimonials */

    .testimonials .cnt-testimonials {
        padding-top: 0px;
    }

    #testimonials .item-testimonials {
        left: auto;
        right: auto;
        margin-left: auto;
        margin-right: auto;
        overflow: hidden;
    }

    #testimonials .title-section {
        margin-bottom: 60px !important;
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Project */

    .owl-carousel .owl-stage .item-project {
        height: 400px !important;
    }

    .project .owl-dots {
        left: 0 !important;
    }

    /* Blog */

    #blog {
        padding-bottom: 60px;
    }

    /* Project Start */

    #project-start .project-item {
        padding: 40px 20px;
    }

    #project-start .project-item .text-item h2 {
        margin-bottom: 30px;
    }

    #project-start .project-item .btn-item .btn-orong {
        color: #fff;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    #project-start .project-item .btn-item {
        text-align: left;
    }

    /* Client */

    .client-item {
        margin-left: auto;
        margin-right: auto;
    }

    /* Contact */

    .cnt-new .fix-blok {
        padding: 40px 20px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    #contact .cnt-new {
        padding: 0;
        box-shadow: none;
        display: inherit;
    }

    #contact .contact-form {
        margin-top: 0;
    }

    #contact .cnt-new .list-contact li {
       /*  padding-left: 10px; */
    }

    #contact .cnt-new .list-contact li i {
        padding-right: 10px;
    }

    #contact .btn-send {
        margin-left: 0px;
        margin-right: 0px;
    }

    /* Footer */

    .footer {
        position: initial !important;
        height: auto;
    }

    .footer .footer-top {
        display: inline-block !important;
        border-bottom: none !important;
    }

    .footer .footer-btm {
        display: inline-block !important;
    }

    .footer .footer-btm .footer-social-media {
        display: flex;
        justify-content: center;
    }

    .footer-height {
        display: none;
    }

}


/** Width between 320px to 0 
 *  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 */

@media (max-width: 320px) {

    /* General styling */

    .plr-0 {
        padding-left: 0px;
        padding-right: 0px;
    }

    .mb-r-10 {
        margin-bottom: 10px !important;
    }

    .mb-r-30 {
        margin-bottom: 30px !important;
    }

    .mb-h-0 {
        margin-bottom: 0 !important;
    }

    .mt-80 {
        margin-top: 0px !important;
    }

    .mt-134 {
        margin-top: 0px !important;
    }

    .mt-14O {
        margin-top: 0px !important;
    }

    .flot-r {
        float: none !important;
    }

    .txt-r-center {
        text-align: center !important;
    }

    .txt-r-left {
        text-align: left !important;
    }

    .txt-r-right {
        text-align: right !important;
    }

    .pull-sm-left {
        float: left !important;
    }

    .d-none-r {
        display: none;
    }

    .title-section h2 {
        font-size: 20px;
        letter-spacing: 1px;
    }

    .paddsection {
        padding: 60px 0;
    }

    .h-trans:hover {
        transform: translateY(0px);
    }

    /* Navbar Menu */

    nav.navbar.bootsnav .navbar-header {
        background: #fff;
    }

    nav.navbar.bootsnav.navbar-fixed {
        box-shadow: none;
        padding-top: 0;
        padding-bottom: 0;
        box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.1) !important;
    }

    nav.navbar.bootsnav .navbar-toggle {
        margin-top: 16px;
        border-radius: 0;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #888;
        margin-bottom: 5px;
    }

    nav.navbar.bootsnav.navbar-transparent .logo {
        height: 60px;
        float: left;
        margin-top: 3px;
    }

    .navbar .navbar-header img {
        margin-top: 12px;
        margin-bottom: 12px;
        float: right;
    }

    .navbar-header .logo {
        float: left;
    }

    nav.navbar.bootsnav .navbar-collapse.collapse.in {
        display: block !important;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        max-height: initial;
    }

    nav.navbar.bootsnav .navbar-nav {
        background: #fff;
        padding: 20px 20px;
    }

    nav.navbar.bootsnav.navbar-transparent.white ul.nav>li>a,
    nav.navbar.bootsnav.no-background.white ul.nav>li>a {
        color: #292929;
        padding: 10px 0px;
        border: none;
    }

    nav.navbar.bootsnav ul.nav>li>a {
        padding: 10px 15px;
        border: none;
    }

    /* Serache */

    #search form {
        width: 89%;
    }

    /* Banners */

    .banner:after {
        display: none !important;
    }

    .banner .banner-text {
        width: 100%;
    }

    .banner .banner-text h1 {
        font-size: 30px !important;
        line-height: 35px !important;
    }

    .banner-text .btn {
        margin-left: 0px;
        margin-right: 0px;
    }

    .auto-container .circle-two,
    .auto-container .icon-four {
        display: none;
    }

    #home .icon-three {
        top: 24%;
    }

    #home .icon-one {
        left: 14%;
    }

    #home .icon-two {
        top: 68%;
    }

    /* Slider */

    .imgtest img {
        display: none;
    }

    .slide-text {
        left: auto;
        right: 0;
        width: 100%;
        float: none;
    }
    .slide-text > h1 {
        font-size: 30px;
        line-height: 45px;
        width: 100% !important;
        max-width: 100%;
    }

    /* About Us */

    #aboutus .block-aboutus {
        padding: 40px 20px;
        overflow: hidden;
        margin-left: 15px;
        margin-right: 15px;
        box-shadow: 0 0 15px 0 rgba(0, 0, 0, .05);
        background: #fff;
    }

    .aboutus .content-about .title-section {
        margin: 0 0 30px 0;
    }

    /* Counter */

    .timeline-wave {
        display: none;
    }

    #counter:before {
        top: 32%;
        right: 0%;
        height: 30%;
        width: 100%;
    }

    /* Services */

    #services {
        background: #fff !important;
    }

    #services .title-section,
    #pricing .title-section {
        margin-bottom: 30px;
    }

    .btn-services-top {
        margin-top: 0px;
        text-align: center;
        margin-bottom: 60px !important;
    }

    .btn-services-top .btn {
        margin-top: 0 !important;
        float: none !important;
    }

    .btn-content-about .btn {
        margin-right: 0px;
        margin-left: 0px;
    }

    /* Pricing */

    .pricing .nav-tabs {
        display: inline-block;
        justify-content: center;
        margin-top: 0;
        margin-bottom: 60px;
        width: 100%;
    }

    #pricing .nav-tabs .nav-item {
        padding: 0;
        margin-bottom: 10px !important;
    }
    #pricing .nav-tabs>li {
        margin-bottom: 0;
        margin-left: 0;
        display: flex;
        justify-content: center;
        width: 100%;
    }

    /* Testimonials */
    .testimonials .cnt-testimonials {
        padding-top: 0px;
    }

    #testimonials .title-section {
        margin-bottom: 60px !important;
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Project */

    .owl-carousel .owl-stage .item-project {
        height: 400px !important;
    }

    .project .owl-dots {
        left: 0 !important;
    }

    /* Blog */

    #blog {
        padding-bottom: 60px;
    }

    /* Project Start */

    #project-start .project-item {
        padding: 40px 20px;
    }

    #project-start .project-item .text-item h2 {
        margin-bottom: 30px;
    }

    #project-start .project-item .btn-item .btn-orong {
        color: #fff;
        font-weight: bold;
        margin-left: 0px;
        margin-right: 0px;
    }

    #project-start .project-item .btn-item {
        text-align: left;
    }

    /* Client */

    .client-item {
        margin-left: 15px;
        margin-right: 15px;
    }

    /* Contact */

    .cnt-new .fix-blok {
        padding: 40px 20px;
        margin-top: 0;
        margin-bottom: 30px;
    }

    #contact .cnt-new {
        padding: 0;
        margin-left: 15px;
        margin-right: 15px;
        box-shadow: none;
    }

    #contact .contact-form {
        margin-top: 0;
    }

    #contact .cnt-new .list-contact li {
        padding-left: 0px;
    }

    #contact .cnt-new .list-contact li i {
        padding-right: 10px;
    }

    #contact .btn-send {
        margin-left: 0px;
        margin-right: 0px;
    }
    
    /* Footer */
    
    .footer {
        position: initial !important;
        height: auto;
    }
    
    .footer .footer-top {
        display: inline-block !important;
        border-bottom: none !important;
    }
    
    .footer .footer-btm {
        display: inline-block !important;
    }
    
    .footer .footer-btm .footer-social-media {
        display: flex;
        justify-content: center;
    }
    
    .footer-height {
        display: none;
    }
    
}