﻿@media only screen and (max-width: 992px) {
    .icon-bar {
        display: block;
        transition-delay: 0s;
        transform: scaleY(0.7) scaleX(0.2);
    }
    .logo-up {
        margin-left: 15px !important;
    }
    .sub-menu {
        display: inline;
        background: rgba(255,255,255,.5);
        transform-origin: 0 0;
        transition: transform var(--duration) var(--easing), color var(--duration) var(--easing);
        transition-delay: var(--delay-out);
    }
    .tooglebutton {
        display: block;
    }
    ul.navbar-nav {
        left: 0 !important;
        margin-top: 0 !important;
    }
    .navbar-expand-lg .navbar-collapse {
        float: none !important;
        background: #fff;
        border: 1px solid #f90;
    }
    ul.navbar-nav li.active {
        max-height: 40px !important;
    }
    .navbar-light .navbar-nav .nav-link {
        font-size: 13px !important;
        padding: 10px !important;
    }
    .navbar .pull-right {
float:none !important;                 
    }
    .navigarionbar {
        --duration: .5s;
        --easing: ease-in-out;
        position: relative;
    }

        .navigarionbar a {
            transform-origin: 0 0;
            transition: transform var(--duration) var(--easing), color var(--duration) var(--easing);
            transition-delay: var(--delay-out);
        }

        .navigarionbar .icon-bar {
            transform: translateY(calc(var(--top) * -1)) scaleY(0.1) scaleX(0.2);
            transition-delay: var(--delay-in);
            color: transparent;
        }

    .company-statemant img {
        width: 100%;
    }

    header {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}



@media only screen and (max-width:767px) {
    .top-header {
        overflow: hidden;
        padding:15px 0  5px 0;
        margin: 0;
    }
    .header-phone{margin:0 0 5px 0;}
    .banner-bg{padding:15px 0 0 0;}
    .top-header .d-flex {
        display: inline-block !important;
        width: 100%;
        text-align: center;
    }
    .company-statemant{padding:50px 0 0 0;}
    .header-phone i {
        margin-right: 0px;
    }

    .header-info + *, .header-phone + * {
        margin-left: 0px;
        padding-left: 0px;
    }

    .top-header > div {
        padding-left: 0px;
        padding-right: 0px;
    }

    .header-phone a {
        padding-left: 10px;
    }

    .responsive-nav {
        background-color: #1e75bd;
        padding: 17px 24px;
        margin: 0;
        border-radius: 50%;
        display: inline-block;
    }

        .responsive-nav i {
            color: #fff;
        }

    .header-phone i {
        color: #fff;
        font-size: 18px;
        margin-left: 7px !important;
    }
    .ml-auto, .mx-auto {
         margin-left: 0 !important; 
    }

    .logo-up {
        text-align: left;
        display: block;
        width: 100%;
        float: none;
        margin: 0;
        clear: both;
        overflow: hidden;
    }

        .logo-up a {
            display: inline;
            height: auto !important;
        }

        .logo-up img {
            position: static;
            max-height: none;
            max-width: 100%;
        }

    .login-boxes .btn-login {
        position: relative;
        left: 9%;
        right: 0%;
        top: -29%;
    }

    .trans-bottom-40 {
        transform: translate(0%, -10%);
    }

    .trans-top-15 {
        transform: translate(0%, 5%);
    }

    .progress {
        height: 120px;
        width: 120px;
    }

        .progress .inner-circle {
            height: 37px;
            width: 37px;
        }

        .progress .progress-value {
            width: 50px;
            height: 50px;
        }

    .company-statics h5 {
        font-size: 20px;
    }

    .banner-bg .banner-text {
        padding: 12px 14px 20px 20px;
    }

        .banner-bg .banner-text h2 {
            font-size: 20px;
            line-height: 30px;
        }

        .banner-bg .banner-text h5 {
            font-size: 18px;
            line-height: 20px;
        }

    .company-statemant .about-vm {
        padding: 0;
    }

    .login-boxes .login-text {
        padding: 0px;
    }

    .login-boxes p {
        font-size: 14px !important;
        line-height: 26px !important;
        padding: 0 !important;
        margin: 0;
        text-align: justify;
    }
    .works .bg-grey h1 {
        font-size:26px;
    }
    .works img {
        width: 90%;
    }

    .testimonial .description {
        padding: 61px 11px 24px 24px;
        margin: 0;
        line-height: 25px;
        font-size: 13px;
    }
    .testimonials h5 {
        font-size: 16px;
        font-weight: 500;
    }
    .testimonials h1 {
        font-size: 30px;
        font-weight: 500;
        padding-bottom:0px;
    }
    .testimonials p {
        font-size:14px;
    }
    .footer .location p {
        padding-top: 10px;
    }

    .footer .location button {
        padding: 8px;
        margin-left: 16px;
    }

    .footer .logo {
        margin: 45px 0px 30px 21px;
    }

    .footer .text-box input {
        width: 84%;
    }

    .contactform .title h4 {
        font-size: 25px;
        font-weight: 600;
        line-height: 15px;
        margin:3px 0 0;
    }
    .contactform .comment-form .input-fields input, .contactform .comment-form .input-fields textarea {
        font-size: 13px;
        height: 45px;
        padding: 10px 10px 10px 10px;
        margin-bottom: 5px !important;
    }

    .footer .mail-box {
        margin-bottom: 30px;
    }

    .company-statics {
        min-height: 332px;
    }

    .pagetop h1 {
        position: absolute;
        left: 24px;
        top: 21px;
        font-size:22px;
    }
    .pagetop ul li {
        margin-right:0px;
        padding-right:0px;
        font-size:15px;
    }
    .cd-faq-trigger::before, .cd-faq-trigger::after {
        position: absolute;
        right: 24px;
        top: 50%;
        height: 2px;
        width: 13px;
        background: #cfdca0;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-transition-property: -webkit-transform;
        -moz-transition-property: -moz-transform;
        transition-property: transform;
        -webkit-transition-duration: .2s;
        -moz-transition-duration: .2s;
        transition-duration: .2s;
    }

    .cd-faq-trigger::before {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        right: 32px;
    }

    .cd-faq-trigger::after {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .about-vm h3 {
        font-size:24px;
    }
    .company-statemant .vision-mission span {
        font-size:22px;
    }
    .company-statemant .vision-mission > div {
        font-size:14px;
    }
    .login-boxes .login-text h2 {
        font-size:26px;
        padding-top:10px;
    }
    .login-boxes .btn-login {
        position:absolute;
        left:42% !important;
        top: auto; right:auto; bottom:30px;
        margin:0px auto;
        display: table; clear:both;
    }
    .login-boxes img{margin:25px auto 30px auto; display:table; width:80%;}
    .login-boxes{margin:30px 0;}


}

@media only screen and (min-width:768px) and (max-width:1024) {
    .progress {
        height: 130px;
        width: 130px;
    }

        .progress .inner-circle {
            height: 42px;
            width: 42px;
        }

        .progress .progress-value {
            width: 55px;
            height: 55px;
        }

    .company-statics h5 {
        font-size: 20px;
    }
}

@media only screen and (min-width:561px) and (max-width:768px) {

}

@media only screen and (min-width:900px) and (max-width:1160px) {
    .login-boxes .btn-login {
        position: relative;
        left: -40% !important;
        right: 0%;
        top: 29%;
    }
}

@media only screen and (min-width:768px) and (max-width:1040px) {
    .login-boxes .btn-login {
        position: relative;
        left: 6% !important;
        right: 0;
        top: -13%;
    }

    .login-boxes .login-text {
        position: relative;
        top: 55%;
    }
}

@media only screen and (min-width:1041px) and (max-width:1165px) {
    .login-boxes .btn-login {
        position: relative;
        left: -44% !important;
        right: 0;
        top: 20%;
    }

    .login-boxes .login-text {
        position: relative;
    }
}

@media only screen and (min-width:1181px) and (max-width:1440px) {
    .about-img img {
        width: 400px;
    }
}


@media only screen and (max-width: 1366px) {
    .search-bg {
        background-size: contain !important;
    }

    footer .socialicon li {
        margin-right: 35px !important;
        margin-top:5px;
    }

    footer .location li a {
        font-size: 15px;
    }
    .banner-bg .banner-text {
        /*padding: 32px 70px 20px 70px;*/
    }
}

@media only screen and (max-width: 1200px) {
    .top-header ul li:first-child {
        font-size: 13px !important;
    }

    .navbar-light .navbar-nav .nav-link {
        font-size: 13px !important;
        padding: 10px !important;
    }

    ul.navbar-nav li.active a {
        padding: 15px 10px !important;
    }

    ul.navbar-nav li.active:after {
        top: -28px !important;
        left: 18px !important;
    }

    ul.navbar-nav li.active {
        max-height: 40px !important;
    }

    .search-bg .recent-searches-content {
        position: relative !important;
        transform: translate(-50%, 0%) !important;
        left: 44% !important;
        width: 76% !important;
    }

    footer .ml-35 {
        margin-left: 10px !important;
    }
    .a-container label {
        font-size:14px;
    }
    .a-content p {
        font-size:14px;
    }
    .a-content {
        padding: 15px 15px 5px;
    }
    .main-banner-three {
        padding:0px;
    }
    .address-sec h4 {
        font-size: 25px;
        margin: 0 0 3px;
        font-weight:600;
    }
    .address-sec p {
        font-size:14px;
        margin:0 0 10px;
    }
    .address-sec ul li .contactus {
        font-size:13px;
    }
    .address-sec ul li span i {
        font-size:20px;
    }
    footer .socialicon li {
        margin-right: 27px !important;
    }

    footer .location li a {
        font-size: 15px;
    }

    .top-header .header-info li a {
        font-size: 13px !important;
    }

    .loginforbid h4 {
        font-size: 22px !important;
    }

    .login-section h3 {
        font-size: 22px;
        padding-bottom: 0 !important;
    }

    .login-section h5 {
        font-size: 16px !important;
    }

    .btn {
        min-width: 135px !important;
        padding: 8px 35px !important;
    }
}

@media only screen and (max-width: 992px) {
    .banner-text h2 {
        line-height: 30px !important;
        padding-top: 40px !important;
        font-size: 26px;
    }

    .banner-text h5 {
        font-size: 16px;
    }

    .btn {
        margin-top: 5px !important;
        font-size: 14px !important;
        min-width: 111px !important;
        padding: 10px 3px !important;
        width: 100px;
       
    }

    .right-arrow {
        font-size: 18px !important;
        position: relative !important;
        left: 6px !important;
        top: 3px !important;
    }

    .company-statistic .stistic h3 {
        font-size: 24px !important;
    }

    .services-box {
        width: 100% !important;
    }

    .loginforbid h4 {
        font-size: 19px !important;
    }

    .login-section h3 {
        padding-top: 0 !important;
    }

    footer {
        padding: 50px 15px !important;
    }

        footer .emailreceive {
            font-size: 14px !important;
            line-height:20px;
        }
        footer .emailsend input {
            font-size:12px;
        }
        footer .usefil-links h3 {
            font-size:20px;
            font-weight:600;
        }
            footer .usefil-links:before {
                top:28px !important;
            }
        footer .location h3 {
            font-size: 20px;
            font-weight: 600;
        }
        footer .location span.btn2 {
            width:100% !important;
        }
        footer .socialicon li {
            margin-right: 17px !important;
        }

            footer .socialicon li a {
                padding: 7px 11px !important;
                height: 40px !important;
                width: 40px !important;
            }

                footer .socialicon li a img {
                    width: 18px !important;
                }

        footer .location li a {
            font-size: 13px !important;
        }

        footer .ml-35 {
            margin-left: 0px !important;
        }

        footer .usefil-links ul li a {
            font-size: 14px;
        }

    .loginforbid .stistic-bids:after {
        padding-top: 0 !important;
    }

    .login-section h3 {
        padding-top: 0 !important;
        font-size: 20px;
    }

    .login-section h5 {
        font-size: 14px !important;
        padding-top: 0 !important;
        line-height: 23px !important;
    }

    img[alt="bidder-login"] {
        margin-top: 10px !important;
    }

    .search-bg h3 {
        font-size: 22px !important;
    }

    .search-bg .search-wrap input[type=text] {
        width: auto !important;
    }

    .search-bg .search-wrap {
        width: 84% !important;
    }

    .search-bg .recent-searches-content .recent-searches-search .recent-searches-search-title {
        font-size: 16px !important;
    }

        .search-bg .recent-searches-content .recent-searches-search .recent-searches-search-title .dosage {
            font-size: 14px !important;
        }

    .search-bg .recent-searches-content .recent-searches-search .recent-searches-search-view {
        font-size: 13px !important;
    }

    .top-header .header-info li a {
        margin-left: 0 !important;
    }

    .navbar-expand-lg .navbar-collapse {
        float: none !important;
        background: #fff;
        border: 1px solid #1e75bd;
    }

    .navbar-light .row {
        width: 100% !important;
    }

    /*.navbar-light .navbar-toggler {
        position: absolute !important;
        right: 0 !important;
        top: 29px !important;
    }*/

    ul.navbar-nav {
        left: 0 !important;
        margin-top: 0 !important;
        padding: 0px !important;
        text-align: left !important;
        float: left !important;
        width: 100% !important;
    }
        ul.navbar-nav li.active {
            max-height: 33px !important;
            margin-left: 0 !important;
            padding-left: 0 !important;
            margin-bottom: 15px;
            background: #5bb65c;
            margin-top: 0px;
            padding-top: 6px;
        }
            ul.navbar-nav li.active a {
                color: #fff;
            }
    .navigarionbar ul li {
        padding-left: 10px;
        padding-bottom: 15px;
        padding-top:10px;
    }
    .banner-bg .banner-text h1 {
        font-weight:500;
        margin-bottom:3px;
        font-size:32px;
        padding-bottom:10px;
    }
    .banner-bg .banner-text p {
        font-size:14px;
        text-align:justify;
    }
  
}

@media only screen and (max-width: 768px) {
    .top-header .header-info {
        text-align: center !important;
        width: 100%;
        left:0;
    }

    .banner-text h2 {
        line-height: 23px !important;
        padding-top: 0px !important;
        font-size: 18px;
    }
    .header-social a:before, .header-social a:last-child:after {
        display: none;
    }
    header-info + *:before, .header-phone + *:before {
        display: none;
    }

    .banner-text h5 {
        font-size: 13px !important;
    }

    .company-statistic .stistic h3 {
        font-size: 22px !important;
        padding-bottom: 10px !important;
    }

    .company-statistic .statistictxt {
        font-size: 14px !important;
    }

    .company-statistic .stistic-bids h2 {
        padding-top: 13px !important;
        font-size: 24px !important;
        padding-bottom: 0 !important;
    }

    .stistic-bids {
        margin-bottom: 20px !important;
    }

    .login-section h3 {
        padding-top: 15px !important;
    }

    .search-bg .search-wrap {
        width: 100% !important;
    }

    .search-bg .recent-searches-content {
        width: 93% !important;
    }

    .sub-footer span {
        font-size: 13px !important;
    }

    .sub-footer span {
        font-size: 13px !important;
    }

    .sub-footer ul li a {
        font-size: 13px !important;
    }

    .sub-footer {
        padding: 12px 20px 8px 20px !important;
    }

    .search-bg {
        background-size: cover !important;
    }

    .p-60 {
        padding:10px;
    }
}

@media only screen and (max-width: 480px) {
    .top-header .header-info li {
        padding-left: 6px !important;
    }

    .main-banner-three {
        overflow: auto !important;
    }

    .banner-text > div {
        position: relative !important;
    }

    .search-bg .search-wrap .btn {
        width: auto !important;
        padding: 13px 16px !important;
    }

    .search-bg .recent-searches-content .recent-searches-search .recent-searches-search-title {
        font-size: 12px !important;
    }

    .read-more-btn {
        right: 30px !important;
        font-size: 13px !important;
    }

    .sub-footer ul {
        position: relative !important;
    }

        .sub-footer ul li {
            margin-left: 20px !important;
        }

    footer {
        padding: 20px 15px !important;
    }

    .company-statistic {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .loginforbid {
        padding-top: 20px !important;
        padding-bottom: 20px !important;
    }

    .company-statistic .statistictxt {
        padding-bottom: 20px !important;
    }

    .search-bg {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .login-section {
        margin-top: 20px !important;
        margin-bottom: 20px !important;
    }

    .search-bg .recent-searches-content {
        width: 100% !important;
    }

    .search-bg .recent-searches-content {
        left: 50% !important;
    }
}

@media only screen and (max-width:1420px) {
    .faq-img img {
        width: 100%;
        position: unset;
    }

    .about-img img {
        width: 100%;
    }
}
@media only screen and (max-width:576px) {

    .login-boxes img {
        width:100%; max-width:420px;
    }
    .login-boxes .btn-login{left:40% !important; bottom:22px;}
}


@media only screen and (max-width:480px) {

    .login-boxes img {
        width: 100%;
        max-width: 320px;
    }
    .login-boxes .btn-login {
        left: 40% !important;
        bottom: 32px;
    }

}