/* ************* Media Queries Tablets ****************** */

@media only screen and (max-width: 1590px) {

    .perInfo {
        min-height: 666px;
    }

    .timelineRight {
        height: 1075px;
    }

    .timelineRightAction {
        height: 1146px;
    }

    .orderPdetails .orderStatus {
        max-width: 35%;
    }

    .orderPdetails .custDetail {
        width: 65%;
    }

}

@media only screen and (max-width: 1480px) {


    .res-4 {
        width: 33.33333333% !important;
    }

    .res-6 {
        width: 50% !important;
    }

    .res-12 {
        width: 100% !important;
    }

    .res-5 {
        width: 41.66666667% !important;
    }

    .res-4 {
        width: 33.33333333% !important;
    }

    .res-3 {
        width: 25% !important;
    }

    .res-2 {
        width: 16.66666667% !important;
    }


}

@media only screen and (max-width: 1479px) {


    .perInfo {
        height: 687px;
    }

    .timelineRight {
        height: 1095px;
    }

    .timelineRightAction {
        height: 1166px;
    }

    .addNewSpd .cols2 {
        width: 33.33333333%;
    }

    .addNewSpd .cols6 {
        width: 100%;
    }

    .reportFilter .filterCols {
        padding-right: 0;
    }

    .filterCols .reportBtn .filterSearch {
        position: relative;
        top: 0;
        right: auto;
        float: right;
    }

    .filterCols .reportBtn {
        margin-top: 15px;
    }

    .RIAfilter .filterCols .cols7.colsP0 {
        width: 50%;
    }

    .RIAfilter .filterCols .cols5.colsP0 {
        width: 50%;
    }



}

@media only screen and (max-width: 1366px) {

    .contractIcon,
    .customerIcon,
    .salesPersonIcon {
        max-width: 100px;
    }



    .customerSection .customerTabbing ul {
        margin: 0 0 10px;
    }


    ul.newsListing {
        height: 398px;
    }

    .custDetail {
        width: 65%;
        padding-right: 30px;
    }

    .orderStatus {
        max-width: 35%;
    }

    .orderPdetails .custDetail {
        width: 55%;
        padding-right: 30px;
    }

    .orderPdetails .orderStatus {
        max-width: 45%;
    }

    .remarkAuto {
        float: left;
        margin: 0 15px 25px 0;
        width: 100%;
    }

    .spCharCols .row .cols3 {
        width: 50%;
    }

    .customerSection.tabContainer h2 {
        margin-bottom: 10px;
    }

    .custRight {
        width: 100%;
        position: relative;
    }

    .customerSection .customerTabbing {
        width: 100%;
        margin: -10px 0 0;
    }

    .customerSection .dateFilter {
        position: absolute;
        right: 0;
        top: -50px;
    }

    .productSec .productImg {
        margin: 0 40px 35px 10px;
    }

    .cols6 .cpListing {
        min-height: 160px;
    }

    .filterCols .equalAfter {
        padding-left: 0;
    }

    .filterCols .equalAfter::after {
        left: -10px;
    }

}

@media only screen and (max-width: 1365px) {

    /* .customerSection .customerTabbing { width: 100%; margin: 0; } */

    .summaryTx {
        width: 52%;
    }

    .summaryTx .contTx {
        margin: 0 0 15px;
    }

    .statisticBlock .cols3 .contractIcon {
        display: block;
        margin: 0 auto;
        text-align: center;
    }

    .statisticBlock .cols3 .growthUpDown {
        padding: 0;
        text-align: center;
        top: 0;
    }

    .statisticBlock .cols3 .blockText {
        margin: 0 0 5px;
        text-align: center;
        width: 100%;
    }

    .statisticBlock .cols3 .numberBlock {
        min-height: 240px;
    }

    .perInfo .custLogo {
        position: relative;
        top: 0;
        left: 0;
    }

    .perInfo .contListing {
        padding-left: 0;
    }

    .perInfo {
        height: 811px;
    }

    .leadPage .filter.filterCols .cols5 {
        width: 60%;
    }

    .leadPage .filter.filterCols .cols3 {
        width: 40%;
    }

    .leadPage .filter.filterCols .cols4 {
        width: 100%;
    }

    .timelineNote {
        height: 295px;
    }

    .timelineRightAction {
        height: 1236px;
    }

    .editAgreeDetail .cols12 .cols5 {
        width: 33.33333333%;
    }

    .editAgreeDetail .cols12 .cols7 {
        width: 66.66666667%;
    }

    .twrCustRight {
        float: right;
        width: 100%;
        position: relative;
    }

    .twrCustRight .twrDate {
        position: absolute;
        right: 0;
        top: -50px;
        margin-left: 0;
    }

    .adChartRange {
        margin-top: 10px;
    }

    .adChartRange ul li {
        margin-bottom: 12px;
    }

    .acrNm {
        line-height: 15px;
    }

    .twrChart .chartArea {
        padding-top: 20px;
    }

    .aspdFilter .filterCols .cols7 {
        width: 50%;
    }

    .aspdFilter .filterCols .cols5 {
        width: 50%;
    }

    .lconTitleBx,
    .lconListing li {
        padding: 10px 15px;
    }

    .lconTitleBx h3 {
        font-size: 21px;
    }

}


@media only screen and (max-width: 1279px) {
    .cols2 {
        width: 50%;
    }

    .custCntBx {
        min-height: 210px;
    }

    .rrRow .cols4 {
        width: 41.66666667%
    }

    .rrRow .cols6 {
        width: 41.66666667%
    }

    .rrRow .cols2 {
        width: 16.66666667%;
    }

    .spProduct .cols2 {
        width: 16.66666667%;
    }

    .spDetail .cols5 {
        width: 50%;
    }

    .spDetail .cols3 {
        width: 50%;
    }

    .spDetail .cols2 {
        width: 50%;
    }

    .anCustomer .cols2 {
        width: 16.66666667%;
    }

    .ambToAdd .cols2 {
        width: 16.66666667%;
    }

    .reportsSection .cols4,
    .dataSegment .cols4 {
        width: 41.66666667%;
    }

    .reportsSection .cols8,
    .dataSegment .cols8 {
        width: 58.33333333%;
    }

    .custSection .cols8 {
        width: 100%;
    }

    .custSection .cols4 {
        width: 50%;
    }

    .leadPage .contentRow>.row>.cols5.colsP0 {
        width: 100%;
        margin-bottom: 30px;
    }

    .leadPage .contentRow>.row>.cols7 {
        width: 100%;
    }

    .perInfo {
        min-height: inherit;
        height: auto;
    }

    .perInfo .contListing {
        padding-left: 90px;
    }

    .perInfo .custLogo {
        position: absolute;
        top: 15px;
        left: 0px;
    }

    .perInfo .contListing .icoOut {
        width: auto;
    }

    .leadPage .filter.filterCols .cols5 {
        width: 41.66666667%;
    }

    .leadPage .filter.filterCols .cols3 {
        width: 25%;
    }

    .leadPage .filter.filterCols .cols4 {
        width: 33.33333333%;
    }

    .timelineRight,
    .timelineRightAction {
        height: auto;
    }

    .leadPage .contentRow>.row>.cols7>.borderBox {
        padding-bottom: 0;
    }

    .timelineNote {
        height: 330px;
    }

    .editAgreeDetail .cols8 {
        width: 50%;
    }

    .editAgreeDetail .cols2 {
        width: 25%;
    }

    .editAgreeDetail .cols12 .cols5 {
        width: 100%;
    }

    .editAgreeDetail .cols12 .cols7 {
        width: 100%;
    }

    .editAgreeDetail .cols12 .cols5 .remarkBx {
        margin-bottom: 5px;
    }

    .twrCustRight {
        width: auto;
    }

    .twrCustRight .twrDate {
        position: relative;
        top: 0;
    }

    .twrChart .chartArea {
        padding-top: 40px;
    }

    .adChartRange {
        margin-top: 40px;
    }

    .twrChart .chartArea {
        width: 65%;
    }

    .bspFilter .searchFilter .cols5 {
        width: 100%;
    }

    .bspFilter .searchFilter .cols3 {
        width: 33.33333333%;
    }

    .bspFilter .searchFilter .cols2 {
        width: 33.33333333%;
    }

    .reportFilter .filterCols .cols3 {
        width: 66.66666667%;
    }

    .reportFilter .filterCols .cols3:first-child {
        width: 33.33333333%;
    }

    .reportFilter .filterCols .cols4 {
        width: 50%;
    }

    .reportBtn {
        width: 16.66666667%;
    }

    .reportFilter.YTDfilter .filterCols .cols4 {
        width: 66.66666667%;
    }

    .reportFilter.YTDfilter .filterCols .cols2 {
        width: 33.33333333%;
    }

    .reportFilter.YTDfilter .filterCols .reportBtn {
        width: 16.66666667%;
    }

    .RIAfilter .filterCols .cols2 {
        width: 16.66666667%;
    }

    .RIAfilter .filterCols .cols7.colsP0 {
        width: 100%;
    }

    .RIAfilter .filterCols .cols5.colsP0 {
        width: 100%;
    }

    .reportFilter.PRfilter .filterCols .cols3 {
        width: 50%;
    }

    .ABPfilter .cols6 {
        width: 100%;
    }

    .ABPfilter .cols2 {
        width: 33.33333333%;
    }

    .ABPfilter .cols2.reportBtn {
        width: 16.66666667%;
    }

    .ARfilter .filterCols .cols4 {
        width: 33.33333333%;
    }

    .ARfilter .filterCols .cols6 {
        width: 41.66666667%;
    }

    .ARfilter .filterCols .cols2 {
        width: 25%;
    }

    .ARfilter .filterCols .cols2.reportBtn {
        width: 16.66666667%;
    }

    .spFilter .filterCols .cols6 {
        width: 41.66666667%;
    }

    .spFilter .filterCols .cols3.inSearchCol {
        width: 33.33333333%;
    }

    .lconListing li .lconImg {
        display: inline-block;
        height: auto;
        width: 100%;
        float: left;
    }

    .lconListingBx {
        padding: 0;
        float: left;
        height: auto;
        width: 100%;
        margin-top: 10px;
    }

    .lconListing li {
        height: 130px;
    }


}


@media only screen and (max-width: 1169px) {

    .equalHight .cols8,
    .equalHight .cols4 {
        width: 100%;
    }

    .rfpChart .subTitleRow {
        width: auto;
    }

    .rfpChart .tabbing {
        float: right;
        width: auto;
    }

    .rfpChart .tabbing ul li:last-child {
        margin-right: 0;
    }

    .equalHight .borderBox {
        min-height: inherit;
    }

    .dataSegment .cols8,
    .dataSegment .cols4 {
        width: 100%;
    }

    .dataSegment .customerSection {
        margin: 0 0 30px;
    }

    ul.newsListing {
        height: 260px;
    }

    .customerSection .customerTabbing {
        width: auto;
        margin: -10px 0 0;
    }

    .customerSection .dateFilter {
        position: relative;
        top: 0;
        margin-left: 10px;
    }

    .productSec .productImg {
        margin: 0 30px 35px 0;
    }

    .owl-carousel .owl-dots {
        margin: 20px 0 20px;
    }

    .finalPrice span {
        font-size: 28px;
    }

    .rrRow .cols4 {
        width: 100%
    }

    .rrRow .cols6 {
        width: 66.66666667%
    }

    .rrRow .cols2 {
        width: 33.33333333%;
    }

    .spProduct .cols7 {
        width: 100%;
    }

    .spProduct .cols3 {
        width: 66.66666667%;
    }

    .spProduct .cols2 {
        width: 33.33333333%;
    }

    .contractIcon,
    .customerIcon,
    .salesPersonIcon {
        display: block;
        text-align: center;
        margin: 0 auto;
    }

    .blockText {
        margin-top: -5px;
        display: block;
        text-align: center;
        padding-bottom: 20px;
    }

    .custRight {
        width: auto;
    }

    .statisticBlock .cols3 {
        width: 50%;
        margin-bottom: 30px;
    }

    .statisticBlock .cols3 .contractIcon {
        display: inline-block;
        margin: 0;
    }

    .statisticBlock .cols3 .blockText {
        margin: 8px 0 0;
        text-align: left;
        width: auto;
        display: inline-block;
    }

    .statisticBlock .cols3 .growthUpDown {
        padding: 0 0 0 20px;
        text-align: left;
        top: -10px;
    }

    .statisticBlock .cols3 .numberBlock {
        min-height: 155px;
    }

    .adminStatisticBlock {
        margin-bottom: 0px;
    }

    .pbsLegend {
        margin-bottom: 15px;
    }

    .trpCustTbl table td br {
        display: none;
    }

    .trpCustTbl table td .dasTblTitle {
        min-width: 50%;
        padding: 0 !important;
        display: inline-block;
    }

    .trpCustTbl table {
        margin-bottom: 0;
    }

    .equalHight .cols4 .borderBox.mrgB0 {
        margin-bottom: 30px !important;
    }

    .bilToAddCont .cols4,
    .shipToAddCont .cols4 {
        width: 50%;
    }

    .contentRow .row .cols4:nth-child(3) .custCntBx {
        margin-top: 30px;
    }

    .bilToAddCont .custCntBx,
    .shipToAddCont .custCntBx {
        min-height: 190px;
    }

    .shipToAddCont .cols4:nth-child(3n+1),
    .bilToAddCont .cols4:nth-child(3n+1) {
        clear: none;
    }

    .shipToAddCont .cols4:nth-child(2n+1),
    .bilToAddCont .cols4:nth-child(2n+1) {
        clear: both;
    }

    .custDetail,
    .orderPdetails .custDetail {
        width: 100%;
        padding-right: 0;
    }

    .orderStatus,
    .orderPdetails .orderStatus {
        max-width: 100%;
        float: left;
        width: 100%;
        margin-top: 15px;
    }

    .statusBx.border0 {
        padding-left: 0;
    }

    .erAmout {
        float: left;
        margin: 20px 0 15px;
    }

    .tableOut.trpCustTbl {
        overflow-x: hidden;
        height: auto;
        overflow-y: auto;
        padding: 0;
    }

    .popBox .orderDetail .custDetail {
        width: 60%;
    }

    .popBox .orderPdetails .orderStatus {
        max-width: 40%;
        float: right;
        width: auto;
    }

    .RIAfilter .filterCols .cols10 {
        width: 100% !important;
    }

    .RIAfilter .filterCols .cols2 {
        width: 25%;
    }

    .RIAfilter .filterCols .cols7.colsP0 {
        width: 75%;
    }

    .RIAfilter .filterCols .cols5.colsP0 .cols5 {
        width: 41.66666667%;
    }

    .aspdFilter .filterCols .cols7 {
        width: 41.66666667%;
    }

    .aspdFilter .filterCols .cols5 {
        width: 58.33333333%;
    }

    .resOD .erAmout {
        float: right;
        margin: 0;
    }

    .resOD .custDetail {
        width: calc(100% - 170px);
    }

    .acdStatus {
        margin-top: 30px !important;
    }

    .umFilter .filterCols .cols4 {
        width: 41.66666667%;
    }

    .umFilter .filterCols .cols8 {
        width: 58.33333333%;
    }

    .odStatus {
        margin: 15px 0 10px;
    }

    .ARfilter .filterCols .cols4 {
        width: 41.66666667%;
    }

    .ARfilter .filterCols .cols6 {
        width: 33.33333333%;
    }

    .spFilter .filterCols .cols3 {
        width: 25%;
    }

    .pvdFilter .cols4 {
        width: 66.66666667%;
    }

    .pvdFilter .cols3 {
        width: 33.33333333%;
    }

    .pvdFilter .cols5.inSearchCol {
        width: 100%;
    }

    .lconListing li {
        height: 140px;
    }

}


@media only screen and (max-width: 1024px) {

    .cols4 {
        width: 50%;
    }

    .cols4.colsP0 {
        width: 100%;
    }

    .cols6.colsP0 {
        width: 100%;
    }

    .cols8.colsP0 {
        width: 100%;
    }

    .cols2.colsP0 {
        width: 100%;
    }

    .cols10.colsP0 {
        width: 100%;
    }

    .cols3 {
        width: 50%;
    }

    .cols5 {
        width: 50%;
    }

    .cols9 {
        width: 50%;
    }

    .res6 {
        width: 50% !important;
    }

    .res12 {
        width: 100% !important;
    }

    .res-4 {
        width: 50% !important;
    }

    .cols8 {
        width: 50%;
    }

    #content {
        /*padding: 30px 25px;*/
        padding: 15px;
    }

    .navigation-trigger {
        display: block;
    }

    .sideBar {
        position: absolute;
        left: -300px;
        top: 0;
        height: 100%;
        z-index: 11;
        background: #ffffff;
        width: 260px;
        -webkit-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }



    .sideBar.mobileMenu {
        left: 0;
    }

    .rightBar {
        padding-left: 0;
    }

    .userProfile {
        float: left;
        width: 100%;
        padding: 25px;
    }

    .userImage {
        float: left;
        width: 50px;
        height: 50px;
        position: absolute;
        top: 25px;
        z-index: 1;
    }

    .userDtlToggle {
        background: transparent;
        position: relative;
        z-index: 0;
        visibility: visible;
        opacity: 1;
        left: auto;
        top: auto;
        float: left;
        width: 100%;
        border: 0;
    }

    .userDtlToggle::before {
        display: none;
    }

    .userProfile h3 {
        padding: 0 0 0 65px;
        font-size: 18px;
        color: #b78642;
    }

    .userProfile h4 {
        padding: 0 0 0 65px;
        font-size: 15px;
        color: #565656;
    }

    .usrContact {
        padding: 15px 0 0;
        margin-top: 20px;
        border-top-color: #d0d0d0;
    }

    .usrContact li {
        padding: 5px 0;
    }

    ul.navigation>li::after {
        display: none;
    }

    ul.navigation>li {
        padding: 7px 16px;
        float: left;
        width: 100%;
    }

    .navIcon {
        float: left;
        transform: scale(0.8);
        position: absolute;
        left: 10px;
        top: 2px;
    }

    ul.navigation ul.subMenu.smOpen {
        height: auto;

    }
    .menu-btn{display: flex;}
    .subMenuToggle::before {
        background: url('../images/sprite.png') -185px -105px no-repeat;
        content: "";
        position: absolute;
        width: 30px;
        height: 30px;
        right: 0;
        top: 5px;z-index: 9999;
    }

    .subMenuToggle.smOpen::before {
        background-position: -148px -105px;
    }

    ul.navigation ul.subMenu.smOpen li:first-child a {
        color: #b78642;
    }

    ul.navigation ul.subMenu {
        position: relative;
        left: auto;
        top: auto;
        opacity: 1;
        visibility: visible;
        padding-left: 55px;
        border: 0;
        height: 40px;
        overflow: hidden;
        width: 100%;
    }

    .subMenu::after,
    ul.navigation ul.subMenu li:first-child a::before {
        display: none;
    }

    ul.navigation ul.subMenu li:first-child a {
        background: transparent;
        font-size: 16px;
        color: #565656;
    }

    ul.navigation ul.subMenu li a {
        padding: 8px 0;
        color: #757575;
        font-size: 15px;
        background: transparent !important;
    }

    ul.navigation ul.subMenu li:first-child a:hover {
        color: #b78642;
    }


    .editProfile {
        top: 25px;
        right: 0;
        background-position: -216px 2px;
    }

    ul.navigation {
        float: left;
        width: 100%;
        /*padding: 15px 0 30px;*/
        padding: 60px 0 30px;
    }

    #logo {
        max-width: inherit;
        width: 80px;
        text-align: center;
        margin: 0;
        padding: 20px 25px;
        border-right: 1px solid #eee;
        -webkit-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }

    #logo a {
        display: inline-block;
        vertical-align: top;
        width: 30px;
        position: relative;
        overflow: hidden;
        height: 29px;
        -webkit-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }

    #logo img {
        width: 134px;
        height: 29px;
        max-width: inherit;
        position: absolute;
        right: 0;
        top: 0;
    }

    #logo.logoOpen {
        width: 260px;
    }

    #logo.logoOpen a {
        width: 134px;
    }

    .syncERP a .syncHistory {
        line-height: 14px;
    }

    #header {
        padding: 0px;
        z-index: 15;
        position: relative;
    }

    .rightTop {
        padding: 9px 25px 9px 0;
    }

    .notifyIcon {
        border-color: transparent;
    }

    .notiCount {
        top: 0;
        right: 0;
    }

    .notificationBar {
        margin-right: 10px;
    }

    .dropPopup {
        top: 61px;
    }

    .usrSettings {
        margin-top: 13px;
        margin-right: 10px;
    }

    .shipAddress>.cols4:nth-child(3n+1) {
        clear: none;
    }

    .syncERP {
        margin-top: 13px;
        margin-right: 20px;
    }

    .shipAddress>.cols4:nth-child(2n+1) {
        clear: left;
    }

    .contentRow .row .cols4:nth-child(3) .custCntBx {
        margin-top: 30px;
    }

    .popBox .cols8 {
        width: 66.66666667%;
    }

    .popBox .cols4 {
        width: 33.33333333%;
    }

    .anCustomer .cols3 {
        width: 25%;
    }

    .anCustomer .cols9 {
        width: 75%;
    }

    .anCustomer .cols5 {
        width: 41.66666667%;
    }

    .statisticBlock .cols4 {
        width: 33.33%;
    }

    .searchBar {
        width: 50px;
        position: relative;
        margin-top: 0px;
    }

    .searchControl {
        float: left;
        width: 100%;
        height: 51px;
    }

    input[type="button"].searchBtn {
        padding: 0;
        width: 50px;
        height: 51px;
        background: transparent !important;
        position: relative;
        background: transparent url("../images/svgs/search2.svg") no-repeat center center !important;
        z-index: 9;
    }

    input[type="text"].searchField {
        background: transparent !important;
        position: absolute;
        right: 0;
        z-index: 10;
        width: 50px;
        min-width: auto;
        padding: 0;
        height: 51px;
        font-size: 0;
        border-color: transparent;
        cursor: pointer;
        -webkit-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
    }

    input[type="text"].searchField:focus {
        background: #ffffff !important;
        width: 420px;
        padding: 0 50px 0 15px;
        font-size: 18px;
        border-color: #c8c8c8;
        z-index: 8;
        cursor: auto;
        -webkit-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
        box-shadow: 0 0 6px rgba(0, 0, 0, 0.1) !important;
    }

    .chartAreaBox {
        padding: 30px 25px 15px 25px;
    }

    .borderBox.agreementBox {
        padding: 30px 25px;
    }

    .customerSection {
        padding: 30px 25px 5px 25px;
    }

    .latestNews {
        padding: 30px 25px 5px 25px;
    }

    .editAgreeDetail .cols9 {
        width: 66.66666667%;
    }

    .editAgreeDetail .cols3 {
        width: 33.33333333%;
    }

    .editAgreeDetail .cols8 {
        width: 100%;
    }

    .editAgreeDetail .cols2 {
        width: 33.33333333%;
    }

    .multiBtnsRow .button {
        margin-left: 30px;
        width: calc(50% - 15px);
        margin-bottom: 10px;
        text-align: center;
        float: left;
    }

    .multiBtnsRow .btnsGroup {
        width: 100%;
    }


}



@media only screen and (max-width: 1023px) {
    .dataSegment .cols8 {
        width: 100%;
    }

    .dataSegment .cols4 {
        width: 100%;
    }

    .reportsSection .cols8 {
        width: 100%;
    }

    .reportsSection .cols4 {
        width: 100%;
    }


    .buyListing .cols3,
    .buyListing .cols4,
    .buyListing .cols2 {
        width: 50%;
        margin-bottom: 15px;
    }

    .formControls .exlargeCol {
        width: 56%;
    }

    .formControls .smallCol {
        width: 44%;
    }

    .formControls .largeCol {
        width: 34%;
    }

    .formControls .midiumCol {
        width: 33%;
    }

    .customerDetail .cols4,
    .customerDetail .cols3,
    .customerDetail .cols5 {
        width: 100%;
        margin-bottom: 5px;
    }

    .formControls .cols4 {
        width: 50%;
    }

    .chartArea {
        width: 100%;
        overflow-x: auto;
        z-index: 0;
        position: relative;
    }

    #SalesPerformance,
    #quarterlyReport {
        min-width: 660px !important;
    }

    .productSec .productImg {
        max-width: 280px;
    }

    .proDtlSlider li {
        height: 30px;
    }

    .proName {
        font-size: 30px;
        line-height: 32px;
    }

    .custDetail .noteBx.mrgB0 {
        margin-bottom: 30px !important;
    }

    .summaryTx {
        width: 50%;
    }

    .summaryOut .btnGroup {
        position: relative;
        right: auto;
        bottom: auto;
        width: 100%;
        text-align: center;
        margin: 15px 0 20px;
    }

    .summaryOut .btnGroup .button {
        margin: 0 10px;
        float: none;
        display: inline-block;
        vertical-align: top;
    }

    .billAddress>.cols6 {
        width: 100%;
    }

    .erAmout {
        float: left;
        margin: 15px 0 10px;
    }

    .accordion .accTrigger .accNm {
        width: 55%;
    }

    .accordion .accTrigger {
        height: 80px;
    }

    .button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    button,
    .button {
        font-size: 16px;
    }

    .productSec .productImg {
        max-width: 280px;
    }

    .proDtlSlider li {
        height: 280px;
    }

    .imgOut img {
        max-width: 240px;
        max-height: 240px;
    }

    .productDtl .contTx {
        margin-bottom: 15px;
    }

    .cols6 .cpListing {
        min-height: inherit;
    }

    .spdFilterCols .cols5 {
        width: 100%;
    }

    .spdFilterCols .cols3 {
        width: calc(50% - 120px);
    }

    .spdFilterCols .cols2 {
        width: 25%;
    }

    .spdFilterCols .cols2.inSearchCol {
        width: calc(25% + 120px);
    }

    .orderBox.EQDetails {
        padding-left: 0;
    }

    .EQDetails .orderDetail {
        padding-left: 105px;
        display: inline-block;
        width: 100%;
    }

    .editQuotDetail .cols9 {
        width: 66.66666667%;
    }

    .editQuotDetail .cols3 {
        width: 33.33333333%;
    }

    .editQuotDetail .cols2 {
        width: 33.33333333%;
    }

    .editQuotDetail .cols2 .button.addBtn {
        width: 100%;
        text-align: center;
        background-position: 38% center !important;
    }

    .separator .feildCol::after {
        top: 5px;
    }

    .bspFilter .searchFilter .cols3 {
        width: 40%;
    }

    .bspFilter .searchFilter .cols2 {
        width: 30%;
    }

    .tableOut .invoiceTbl {
        min-width: 1024px;
    }

    .reportFilter .filterCols .cols3:first-child {
        width: 50%;
    }

    .reportFilter .filterCols .cols3 {
        width: 50%;
    }

    .reportFilter .filterCols .cols10 {
        width: 66.66666667%;
    }

    .filterCols .reportBtn {
        width: 33.33333333% !important;
    }

    .reportFilter.YTDfilter .filterCols .cols4 {
        width: 50%;
    }

    .reportFilter.YTDfilter .filterCols .cols3:nth-child(3) {
        width: 66.66666667%;
    }



    .reportFilter.PRfilter .filterCols .cols10 {
        width: 50%;
    }

    .reportFilter.PRfilter .filterCols .reportBtn {
        width: 50% !important;
    }

    .reportFilter.PRfilter .filterCols .radioGroup label {
        padding-right: 20px;
    }

    .addNewBtnRow .cols6 {
        width: 100%;
    }

    .acdStatus {
        margin-top: 0 !important;
    }

    .ARfilter .filterCols .cols4 {
        width: 100%;
    }

    .ARfilter .filterCols .cols6 {
        width: 66.66666667%;
    }

    .ARfilter .filterCols .cols2 {
        width: 33.33333333%;
    }

    .spFilter .filterCols .cols6 {
        width: 100%;
    }

    .spFilter .filterCols .cols3 {
        width: 50%;
    }

    .spFilter .filterCols .cols3.inSearchCol {
        width: 50%;
    }

    .lconList {
        float: left;
        width: 100%;
    }

    .lconTitle {
        height: auto;
        text-align: center;
        padding: 5px 0;
    }

    .lconListing li {
        height: 140px;
        width: 33.33333333%;
        float: left;
        border-right: 1px solid #dadada;
    }

    .lconList {
        padding-bottom: 30px;
    }

    .lconListing li::after {
        bottom: -30px;
        height: 30px;
        background-size: 100% 100%;
    }

    .lconList {
        border-left: 0;
    }

    .lconListing {
        border-left: 1px solid #dadada;
    }


}


@media only screen and (max-width: 991px) {


    .custRight {
        width: 100%;
    }

    .customerSection .dateFilter {
        position: absolute;
        top: -50px;
        margin-left: 0px;
    }

    #revenueReport .highcharts-legend {
        transform: translate(38%, 4px);
    }

    .popBox .orderDetail .custDetail {
        width: 100%;
    }

    .popBox .orderPdetails .orderStatus {
        max-width: 100%;
        float: left;
        width: 100%;
        margin-bottom: 10px;
    }

    .aspdFilter .filterCols .cols7 {
        width: 100%;
    }

    .aspdFilter .filterCols .cols5 {
        width: 100%;
    }

}

@media only screen and (max-width: 768px) {


    .statisticBlock .numberBlock {
        padding: 15px 10px 0px;
    }


    .tableOut {
        clear: both;
        display: block;
        width: 100%;
    }

    .filter .largeCol {
        width: 100%;
        margin-bottom: 15px;
        ;
        padding-right: 0;
    }

    .filter .midiumCol {
        width: 30%;
    }

    .formControls .cols4 {
        width: 100%;
    }

    .signUpForm .formControls>.row>.cols6 {
        width: 100%;
        margin-bottom: 30px;
    }

    .signUpForm .formControls>.row {
        margin-bottom: 0;
    }

    .loginContainer {
        transform: none;
        top: 0;
        margin: 20% auto 2% auto;
    }

    .orderAddress {
        margin-top: 30px;
        padding-top: 10px;
    }

    .multiBtnsRow .btnsGroup {
        width: 100%;
    }

    .EQDetails .orderAddress {
        margin-top: 10px;
        padding-top: 15px;
    }



}

@media only screen and (min-width: 768px) {
    .rightDropIn {
        display: block !important;
    }

    .searchFilter {
        display: block !important;
    }
}

/* ************* Mobiles Media Queries ****************** */
@media only screen and (max-width: 767px) {
    .tableOut table {
        min-width: 768px;
    }

    .titleRow .titleBtnCol {
        margin-bottom: 25px;
    }

    .addNewProfile {
        position: relative;
        width: 100%;
        margin-bottom: 20px;
    }

    .newUserForm {
        padding-left: 0;
    }

    .productSec .productImg {
        max-width: 100%;
        width: 100%;
        margin: 0 0 15px;
    }

    .proName {
        font-size: 28px;
    }

    .imgOut img {
        max-width: 100%;
    }

    .addressBox {
        width: 100%;
        margin-top: 15px;
    }

    .cols5-5 {
        width: 100%;
    }

    .addNewBtn .cols1 {
        width: 100%;
    }

    .addNewBtn .cols1 .feildCol {
        min-height: inherit;
        margin: -20px 0 10px;
    }

    .EQDetails .orderAddress {
        padding-top: 0px;
    }

    .filterCols2 {
        padding-right: 0;
    }

    .button.filterILbtn {
        float: right;
        margin-left: 30px;
    }

    .bilShipToAdd>.cols6 {
        width: 100%;
    }

    .bilShipToAdd>.cols6 .custCntBx {
        min-height: inherit;
        padding-bottom: 20px;
    }

    .borderBox .filterCols2 .button {
        position: relative;
        float: left;
        right: auto;
        top: auto;
    }

    .btnCol2 {
        float: right;
        margin-bottom: 10px;
    }

    .accordion .accTrigger .accNm {
        font-size: 16px;
    }

    .accordion .accTrigger .proNo {
        font-size: 15px;
    }

    .loginScreens {
        background-image: none !important;
    }

    .ucTitle {
        font-size: 34px;
        line-height: 21px;
    }

    .documentUpload {
        height: 180px;
    }

    .phoneCall .cols6 {
        width: 100%;
    }

    .phoneCall .feildCol.radioGroup {
        margin-top: 0;
        margin-bottom: 10px;
    }

    .ambToAdd .cols2 {
        width: 50%;
    }

    .popBox.ambToAdd .cols4 {
        width: 50%;
    }

    .ambToAdd .cols6:last-child {
        width: 100%;
    }

    .ambToAdd .cols6:last-child .feildCol {
        margin-top: 0;
        margin-bottom: 10px;
    }

    #logo.logoOpen {
        width: 185px;
    }

    .rightDrop {
        float: right;
        position: absolute;
        width: 40px;
        height: 40px;
        right: 10px;
        top: 15px;
    }

    .notificationBar {
        margin-top: 5px;
    }

    .notifyIcon {
        width: 40px;
        height: 40px;
        background-position: -253px -118px;
    }

    .searchBar,
    input[type="text"].searchField,
    input[type="button"].searchBtn {
        width: 40px;
    }

    input[type="text"].searchField:focus {
        width: 275px;
    }

    .rightTop {
        padding: 9px 50px 9px 0;
    }

    .rightDropBtn {
        background: url("../images/svgs/menu_2.svg") no-repeat center center;
        display: inline-block;
        width: 100%;
        height: 100%;
        cursor: pointer;
    }

    .rightDropIn {
        position: absolute;
        top: 55px;
        right: 15px;
        width: 200px;
        background: #fff;
        padding: 10px 15px;
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
        display: none;
    }

    .syncERP {
        width: 100%;
        margin: 10px 0;
        padding-left: 40px;
    }

    .usrSettings {

        width: 100%;
        margin: 10px 0;
        padding-left: 40px;

    }

    .dropPopup {
        top: 56px;
        right: -40px;
    }

    .quarterlyReportBox .subTitleRow,
    .salesPerformanceSection .subTitleRow {
        display: inline-block;
        width: auto;
    }

    .chartTopRow .chartDate {
        position: relative;
        top: -7px;
    }

    .salesPerformanceSection .chartDate {
        position: relative;
        right: auto;
        float: right;
        margin-left: 10px;
        margin-bottom: 10px;
    }

    #SalesPerformance .highcharts-legend {
        transform: translate(-10px, 0) !important;
    }

    #quarterlyReport .highcharts-legend {

        transform: translate(-10px, 0) !important;

    }

    #SalesPerformance .highcharts-title,
    #quarterlyReport .highcharts-title {
        display: none;
    }

    .trpCustTbl table td .dasTblTitle {
        min-width: inherit;
    }

    .trpCustTbl table td br {
        display: block;
    }

    .twrCustRight {
        width: 100%;
        position: relative;
    }

    .twrCustRight .twrDate {
        margin: 0;
        position: absolute;
        right: 0;
        top: -55px;
    }

    .twrChart .chartArea {
        width: 100%;
        padding-top: 30px;
    }

    .adChartRange {
        width: 100%;
        margin-top: 20px;
    }

    .adCustRight {
        width: 100%;
        margin: -10px 0 20px;
        position: relative;
    }

    .custSection .viewAllBtn {
        position: absolute;
        right: -10px;
        top: -45px;
    }

    #revenueReport .highcharts-title {
        display: none;
    }

    #revenueReport .highcharts-legend {
        transform: translate(-10px, 0px) !important;
    }

    .timelineNote table {
        min-width: inherit;
    }


    .leadPage .filter.filterCols .cols5 {
        width: 60%;
    }

    .leadPage .filter.filterCols .cols3 {
        width: 40%;
    }

    .leadPage .filter.filterCols .cols4 {
        width: 100%;
    }

    .timelineRight .tableOut table {
        min-width: inherit;
    }

    .filterTogle {
        display: block;
    }

    .searchFilter {
        display: none;
        float: left;
        width: 100%;
        margin-top: 15px;
    }

    .topBtn .searchFilter {
        margin-top: 0;
    }

    .timelineRight.timelineDeals {
        padding-top: 5px;
    }

    .timelineDeals .tableOut {
        width: calc(100% + 30px);
    }

    .titleRow h1 {
        font-size: 24px;
    }

    .productDtl {
        display: inline-block;
        width: 100%;
        margin: 0 0 15px;
    }

    .inBtnSearch .filterSearch {
        position: absolute !important;
        right: 0 !important;
        top: 0 !important;
        width: 80px !important;
        padding: 9px 12px !important;
    }

    .inBtnSearch>.feildCol {
        width: calc(100% - 100px);
    }

    .bilToAddCont .cols4,
    .shipToAddCont .cols4 {
        width: 100%;
    }

    .contentRow .row .cols4:nth-child(2) .custCntBx {
        margin-top: 30px;
    }

    .bilToAddCont .custCntBx,
    .shipToAddCont .custCntBx {
        min-height: inherit;
        padding-bottom: 20px;
    }

    .custCntBx.newAdd {
        height: 80px;
    }

    .spdFilterCols .cols3 {
        width: 100%;
    }

    .spdFilterCols .cols2 {
        width: calc(50% - 60px);
    }

    .spdFilterCols .cols2.inSearchCol {
        width: calc(50% + 60px);
    }

    .multiBtnsRow .button {
        width: 100%;
        margin: 10px 0;
    }

    .multiBtnsRow .button:first-child {
        margin-top: 0;
    }

    .editAgreeDetail .cols9 {
        width: 100%;
    }

    .editAgreeDetail .cols3 {
        width: 50%;
    }

    .editAgreeDetail .cols8 {
        width: 50%;
    }

    .editAgreeDetail .cols2 {
        width: 50%;
    }

    .radioGroup label {
        font-size: 15px;
        line-height: 24px;
    }

    .reportFilter .radioGroup>label {
        line-height: 15px;
        margin-bottom: 10px;
    }

    .editAgreeDetail .feildCol.radioGroup {
        margin-top: 5px;
    }

    .spCharCols .row .cols3 {
        width: 100%;
    }

    .EQDetails .addressBox .feildCol {
        max-width: inherit;
        padding-right: 120px;
    }

    .row.searchFilter {
        width: calc(100% + 30px);
        margin: 0 0 0 -15px;
    }

    .numberBlock strong {
        font-size: 36px;
    }

    .tableOut.trpCustTbl table {
        min-width: inherit;
    }

    .addNewSpd .cols2 {
        width: 50%;
    }

    .addNewSpd .cols6 {
        width: 50%;
    }

    .separator {
        margin-top: 0 !important;
    }

    .separator .radioGroup label {
        margin-bottom: 5px;
    }

    .bspFilter .filterTogle {
        margin-bottom: 20px;
    }

    .bspFilter .searchFilter {
        margin-top: 0;
    }

    .bspFilter .searchFilter form {
        margin-top: -8px;
    }

    .bspFilter .searchFilter .cols3 {
        width: 50%;
    }

    .bspFilter .searchFilter .cols2 {
        width: 50%;
    }

    .bspFilter .searchFilter .cols5 {
        width: 50%;
    }

    .listOrderBox .listInd {
        margin: 0 0 15px;
    }

    .reportFilter .filterCols .cols2 {
        width: 100%;
    }

    .reportFilter .filterCols .cols4 {
        width: 100%;
    }

    .reportFilter .filterCols {
        margin: 0;
    }

    .reportFilter .filterTogle {
        margin-bottom: 12px;
    }

    .reportFilter .filterCols .separator .feildCol::after {
        display: none;
    }

    .reportFilter .separator .feildCol {
        width: 100%;
        padding-right: 0;
        margin-right: 0;
    }

    .RIAfilter .filterCols .cols10 {
        width: 66.66666667% !important;
    }

    .RIAfilter .filterCols .cols2 {
        width: 33.33% !important;
        margin-top: 70px;
    }

    .RIAfilter .filterCols .cols7.colsP0 {
        width: 100%;
    }

    .reportFilter.PRfilter .filterCols .cols2 {
        width: 50%;
    }

    .reportFilter.PRfilter .filterCols .reportBtn {
        width: 100% !important;
        margin: 0 0 15px !important;
    }

    .reportFilter.PRfilter .filterCols .cols4 {
        width: 100%;
    }

    .aspdFilter .filterTogle {
        margin-bottom: 20px;
    }

    .aspdFilter .searchFilter {
        margin-top: 0;
    }

    .addressBox {
        padding-right: 0px;
    }

    .titleRow.umTitleRow {
        width: calc(100% - 55px);
    }

    .umFilter {
        position: relative;
        float: left;
    }

    .umFilter .filterTogle {
        float: right;
        position: absolute;
        right: 0;
        top: -62px;
    }

    .umFilter .filterCols {
        margin-top: 0px;
    }

    .umFilter .filterCols .cols8 {
        width: 100%;
    }

    .umFilter .filterCols .cols4 {
        width: 100%;
    }

    .odStatus {
        margin: 10px 0 10px;
    }

    .ABPfilter .filterCols .cols2 {
        width: 33.33333333%;
    }

    .ARfilter .filterCols .cols2 {
        width: 33.33333333%;
    }

    .spFilter .filterTogle {
        margin-bottom: 20px;
    }

    .spFilter .searchFilter {
        margin-top: 0;
    }

    .pgFilter .filterTogle {
        margin-bottom: 20px;
    }

    .pgFilter .searchFilter {
        margin-top: 0;
    }

    .pvdFilter .filterTogle {
        margin-bottom: 20px;
    }

    .pvdFilter .searchFilter {
        margin-top: 0;
    }

    .pvdFilter .cols4 {
        width: 50%;
    }

    .pvdFilter .cols3 {
        width: 50%;
    }

    .ypsBox .subTitleRow {
        display: inline-block;
        float: left;
        width: auto;
    }

    #yearlyPipeline .highcharts-title {
        display: none;
    }

    .lconListing li {
        width: 50%;
        height: 100px;
    }

    .lconListing li .lconImg {
        display: table-cell;
        width: 46px;
        float: none;
        height: 100%;
    }

    .lconListingBx {
        margin: 0;
        float: none;
        display: table-cell;
        height: 100%;
        padding-left: 10px;
    }

    #yearlyPipeline .highcharts-legend {
        transform: translate(-10px, 0);
    }


}

@media only screen and (max-width: 639px) {
    .statisticBlock .cols4 {
        display: block;
        width: 100%;
        margin-bottom: 20px;
    }

    .statisticBlock .numberBlock {
        padding: 20px 20px 0px 10px;
    }

    .contractIcon,
    .customerIcon,
    .salesPersonIcon {
        display: inline-block;
        width: 100px;
    }

    .blockText {
        margin-top: 15px;
        display: inline-block;
        width: 45%;
        padding-left: 0;
        text-align: left;
    }

    .buyListing .cols3,
    .buyListing .cols4,
    .buyListing .cols2 {
        width: 100%;
        margin-bottom: 10px;
    }

    .customerSection h2 {
        margin-bottom: 15px;
    }

    .customerSection .dateFilter {
        position: relative;
        top: 0;
        margin: 25px 0 10px;
        float: left;
        width: 100%;
    }

    .subTitleRow h2 {
        display: block;
        width: 100%;
    }

    .titleBtnCol.alignRight {
        float: none;
        display: block;
        text-align: center;
        margin: 10px auto 0;
    }

    .filter .midiumCol {
        width: 50%;
        margin-bottom: 15px
    }

    .formControls .exlargeCol {
        width: 100%;
        margin-bottom: 15px;
    }

    .formControls .smallCol {
        width: 100%;
        margin-bottom: 15px;
    }

    .formControls .largeCol {
        width: 100%;
        margin-bottom: 15px;
    }

    .formControls .midiumCol {
        width: 100%;
        margin-bottom: 15px;
    }

    .formControls .inputContols {
        margin-bottom: 10px;
    }

    .radioGroup label {
        margin-bottom: 15px;
    }

    .custLogo {
        left: calc(50% - 45px);
        top: 20px;
    }

    .customerListing ul li {
        padding: 125px 20px 20px 10px;
    }

    .customerListing ul li a,
    .customerListing ul li .custDtl {
        word-break: break-all;
        display: inline-block;
    }

    .regTitles h4 {
        font-size: 14px;
    }

    .otpInput {
        padding: 10px;
    }

    .rfpChart .tabbing {
        width: 100%;
    }

    .statisticBlock {
        margin-bottom: 15px;
    }

    #SalesPerformance .highcharts-legend {
        transform: translate(-10px, 10px) !important;
    }

    .borderBox .subTitleRow .listInd {
        margin-bottom: 20px;
        float: left;
        padding-left: 0;
    }

    .customerSection .dateFilter .datePicker {
        float: left;
        width: 46%;
        padding-left: 0;
    }

    .customerSection .dateFilter .datePicker:last-child {
        float: right;
    }

    .filterCols {
        padding-right: 0;
    }

    .filterCols .feildCol {
        min-height: 55px;
    }

    .filterCols .button {
        top: auto;
        bottom: auto;
        position: relative;
        float: right;
        margin-bottom: 15px;
        right: 15px;
        margin-top: 10px;
    }

    .addNewBtn {
        padding-right: 0;
    }

    .addNewBtn .addBtn {
        top: auto;
        bottom: auto;
        position: relative;
        float: right;
        margin-bottom: 15px;
        right: 15px;
    }

    .orderBox {
        padding-left: 0;
    }

    .custImg {
        position: relative;
        left: auto;
        margin: 0 0 25px;
        float: none;
    }

    .addCustomer h2 {
        width: auto;
        display: inline-block;
    }

    .contListing .custLogo {
        left: 5px;
        top: 15px;
    }

    .rrRow .cols6 {
        width: 100%;
    }

    .rrRow .cols2 {
        width: 100%;
    }


    .borderBox .btnCol {
        margin-top: 0;
        margin-bottom: 20px;
        text-align: right;
    }

    .accordion .accTrigger .accNm {
        line-height: 18px;
    }

    .accordion .accTrigger .proNo {
        line-height: 18px;
    }

    .accordion .accTrigger {
        height: 70px;
    }

    .ucTitle {
        font-size: 30px;
    }

    .ucBox p {
        margin-bottom: 10px;
    }

    .infoTitle {
        font-size: 25px;
        line-height: 21px;
    }

    .documentUpload {
        height: 130px;
    }

    .popBox .cols8 {
        width: 100%;
    }

    .popBox .cols4 {
        width: 100%;
    }

    .anCustomer .cols3 {
        width: 100%;
    }

    .anCustomer .cols5 {
        width: 100%;
    }

    .anCustomer .cols3:first-child {
        width: 40%;
    }

    .anCustomer .cols9 {
        width: 60%;
    }

    .salesPerformanceSection .chartDate {
        float: left !important;
        margin: 10px 20px 0 0;
    }

    .salesPerformanceSection .subTitleRow {
        width: 100%;
    }

    .agreementBox .subTitleRow {
        position: relative;
    }

    .agreementBox .viewAllBtn {
        margin-left: 0;
        position: absolute;
        right: -10px;
        top: 0;
    }

    .customerSection .customerTabbing {
        width: 100%;
    }

    .numberBlock strong {
        font-size: 31px;
        line-height: 28px;
    }

    .statisticBlock .cols3 {
        width: 100%;
        margin-bottom: 20px;
    }

    .statisticBlock .cols3 .blockText {
        margin: 13px 0 0;
    }

    .revReportBox .chartDate {
        margin: 0;
        position: absolute;
        right: 0;
    }

    .pbsLegend {
        padding-left: 0;
    }

    #territoryWiseRevenues {
        height: 170px !important;
        text-align: center;
    }

    .signupLogo {
        margin-bottom: 15px;
    }

    .signupLogo img {
        max-width: 180px;
    }

    .loginForm input[type="submit"],
    .loginForm input[type="button"],
    .signUpContainer input[type="submit"],
    .signUpContainer input[type="button"] {
        height: 44px;
    }

    .regTitles h3 {
        font-size: 20px;
    }

    .regNote {
        font-size: 14px;
    }

    .signUpForm {
        margin-top: 25px;
    }

    .perInfo .custLogo {
        position: relative;
        top: 0;
        left: 0;
    }

    .perInfo .contListing {
        padding-left: 0;
    }

    .leadPage .filter.filterCols .cols3 {
        width: 40%;
    }

    .leadPage .filter.filterCols .cols6 {
        width: 60%;
    }

    .leadPage .filter.filterCols .cols3:nth-child(3) {
        width: 70%;
    }

    .inBtn .button.filterSearch {
        margin: 10px 0 0;
        right: 0;
    }

    .notesFilter {
        padding-right: 120px;
    }

    .notesFilter .button.filterSearch {
        margin: 0;
        position: absolute;
        right: 0;
        bottom: 13px;
    }

    .proDtlSlider li {
        height: 240px;
        padding: 0 20px;
    }

    .filterCols .cols1,
    .filterCols .cols2,
    .filterCols .cols3,
    .filterCols .cols4,
    .filterCols .cols5,
    .filterCols .cols6,
    .filterCols .cols7,
    .filterCols .cols8,
    .filterCols .cols9,
    .filterCols .cols10,
    .filterCols .cols11,
    .filterCols .cols12 {
        padding-left: 10px;
        padding-right: 10px;
    }

    .filterCols .row {
        margin: 0 -10px;
    }

    .inBtn .feildCol {
        width: calc(100% - 62px) !important;
    }

    .inSearchCol>.feildCol {
        width: calc(100% - 110px);
    }

    .orderStatus,
    .orderPdetails .orderStatus {
        margin-top: 0px;
    }

    .editAgreeDetail .cols3 {
        width: 100%;
    }

    .editAgreeDetail .cols8 {
        width: 100%;
    }

    .editAgreeDetail .cols12 .cols5 .remarkBx {
        margin-top: 10px;
    }

    .editAgreeDetail .feildCol.radioGroup {
        margin-top: 0;
    }

    .EQDetails .orderDetail {
        padding-left: 0;
    }

    .filterCols.spCharCols {
        padding-right: 100px;
    }

    .filterCols .equalAfter {
        min-width: 85px;
        width: 85px;
    }

    .EQDetails .addressBox .feildCol {
        padding-right: 100px;
    }

    .borderBox .editQuotDetail .btnCol {
        margin: 5px 0 20px;
    }

    .editQuotDetail .cols9 {
        width: 100%;
    }

    .editQuotDetail .cols3 {
        width: 50%;
    }

    .editQuotDetail .cols2 {
        width: 50%;
    }

    .editQuotDetail .cols2:last-child {
        float: right;
    }

    .addNewSpd .cols6 {
        width: 100%;
    }

    .addNewSpd .cols2 {
        width: 100%;
    }

    .separator .feildCol {
        width: 100%;
        float: left;
        padding-right: 0;
        margin-right: 0;
        position: relative;
    }

    .separator .feildCol::after {
        display: none;
    }

    .bspFilter .searchFilter .cols5 {
        width: 100%;
    }

    .bspFilter .searchFilter .cols2 {
        width: 100%;
    }

    .bspFilter .searchFilter .cols3 {
        width: 100%;
    }

    .btnGroup {
        float: right;
        width: 100%;
        text-align: center;
    }

    .btnGroup .button {
        float: none;
        display: inline-block;
        vertical-align: top;
    }

    .summaryOut .btnGroup .button {
        margin: 0 7px;
    }

    .btnGroup .button.orangeBg:first-child {
        margin-left: 0;
    }

    .btnGroup .button:last-child {
        margin-right: 0;
    }

    .summaryTx {
        width: 100%;
    }

    .reportFilter .filterCols .cols3 {
        width: 100%;
    }

    .reportFilter .filterCols .cols3:first-child {
        width: 100%;
    }

    .reportFilter.YTDfilter .filterCols .cols4 {
        width: 100%;
    }

    .reportFilter.YTDfilter .filterCols .cols3:nth-child(3) {
        width: 100%;
    }

    .reportFilter.YTDfilter .filterCols .cols2 {
        width: 100%;
    }

    .reportFilter .filterCols .button.filterSearch {
        margin-top: 0;
    }

    .RIAfilter .filterCols .cols10 {
        width: 100% !important;
    }

    .RIAfilter .filterCols .cols2 {
        width: 100% !important;
        margin-top: 0;
    }

    .RIAfilter .filterCols .cols5.colsP0 .cols5 {
        width: 50%;
    }

    .RIAfilter .filterCols .cols7.inSearchCol {
        width: 50%;
    }

    .RIAfilter .filterCols .cols7.inSearchCol .feildCol {
        width: 100%;
    }

    .RIAfilter .filterCols .button.filterSearch {
        margin-bottom: 25px;
    }

    .reportFilter.PRfilter .filterCols .cols3 {
        width: 100%;
    }

    .reportFilter.PRfilter .filterCols .cols2 {
        width: 100%;
    }

    .reportFilter.PRfilter .filterCols .cols10 {
        width: auto;
    }

    .reportFilter.PRfilter .filterCols .reportBtn {
        width: auto !important;
        float: right;
        margin: 10px 0 0 !important;
    }

    .aspdFilter .filterCols .cols5 .cols6 {
        width: 50% !important;
    }

    .aspdFilter .filterCols .inSearchCol>.feildCol {
        width: 100%;
    }

    .aspdFilter .filterCols .inSearchCol .button.filterSearch {
        margin: 0 0 25px;
    }

    .resOD .erAmout {
        float: left;
        margin: 10px 0 15px;
    }

    .resOD .custDetail {
        width: 100%;
    }

    .bhTitleRow .cols2 {
        width: 100% !important;
    }

    .bhTitleRow .cols10 {
        width: 100% !important;
    }

    .addNBtn .feildCol {
        width: 100%;
    }

    .addNBtn .addBtn {
        margin: 0 0 15px;
    }

    .odStatus {
        margin: 10px 0 15px;
    }

    .ABPfilter .filterCols .cols2 {
        width: 100%;
    }

    .ABPfilter .filterCols .cols10 {
        width: 100%;
    }

    .ABPfilter .filterCols .cols2.reportBtn {
        width: 100% !important;
        margin-top: 0;
    }

    .ARfilter .filterCols .cols6 {
        width: 100%;
    }

    .ARfilter .filterCols .cols2 {
        width: 100%;
    }

    .reportFilter .filterCols .cols10 {
        width: 100%;
    }

    .ARfilter .filterCols .cols2.reportBtn {
        width: 100% !important;
    }

    .spFilter .filterCols .cols3 {
        width: 100%;
    }

    .spFilter .filterCols .cols3.inSearchCol {
        width: 100%;
    }

    .pvdBox .subTitleRow {
        position: relative;
    }

    .borderBox.pvdBox .subTitleRow .listInd {
        float: right;
        padding-left: 0;
        position: absolute;
        right: 0;
        top: 0;
    }

    .pvdFilter .cols4 {
        width: 100%;
    }

    .pvdFilter .cols3 {
        width: 100%;
    }

    .lconListing li {
        width: 100%;
        height: auto;
        padding: 20px;
    }

    .lagendBtn .btnOut a {
        height: 42px;
        line-height: 42px;
    }


}

@media only screen and (max-width:599px) {

    .cols4 {
        width: 100%;
    }

    .cols3 {
        width: 100%;
    }

    .cols9 {
        width: 100%;
    }

    .cols6 {
        width: 100%;
    }

    .cols7 {
        width: 100%;
    }

    .cols5 {
        width: 100%;
    }

    .res6 {
        width: 100% !important;
    }

    .cols8 {
        width: 100%;
    }

    .cols2 {
        width: 100%;
    }

    .res6I {
        width: 50% !important;
    }

    .res-4 {
        width: 100% !important;
    }

    .contentRow .row .cols4:nth-child(2) .custCntBx {
        margin-top: 30px;
    }

    .custCntBx {
        min-height: inherit;
        padding-bottom: 20px;
    }

    .signUpContainer {
        padding: 25px 25px 15px;
    }

    .signUpForm .cols6,
    .signUpForm .cols6.colsP0 {
        width: 100%;
    }

    .button.payBtn {
        font-size: 18px;
        padding: 12px 20px;
    }

    .cDate {
        font-size: 16px;
        line-height: 21px;
    }

    .cMonth {
        font-size: 12px;
    }

    .calB0x {
        padding-left: 20px !important;
        padding-right: 20px !important;
        width: 90px;
    }

    .timelineOrder table.colorList {
        min-width: 480px !important;
    }


}

@media only screen and (max-width: 479px) {

    .datePicker input[type="text"] {
        font-size: 12px;
        padding: 18px 12px;
    }

    .customerSection .dateFilter .datePicker:first-child {
        padding-left: 0;
    }

    .signUpForm .formControls>.row .cols5 {
        width: 100%;
        margin-bottom: 30px;
    }

    .signUpForm .formControls>.row .cols7 {
        width: 100%;
    }

    .otpInput input {
        width: 28px;
        font-size: 16px;
        letter-spacing: 0;
        margin-left: 0;
    }

    .optTime {
        right: 10px;
        font-size: 12px;
        top: 20px;
    }

    .loginContainer,
    .signUpContainer {
        padding: 20px 20px 10px;
    }


    .loginForm .formControls {
        margin: 0;
    }

    .tabbing ul li a {
        padding: 0 0 5px;
    }

    .tabbing ul li {
        margin-top: 10px;
        font-size: 14px;
    }


    .salesPerformanceSection .chartDate {
        margin-left: 0;
    }

    .tableEntries .totalShow {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }

    .tableEntries .pagination {
        float: none;
        margin: 0 auto;
        display: inline-block;
    }

    .tableEntries {
        text-align: center;
    }

    .titleRow h1 {
        font-size: 21px;
    }

    .titleRow .titleBtnCol .button {
        width: 100%;
        text-align: center;
    }

    .titleRow .titleBtnCol .button .icon {
        float: none;
        display: inline-block;
        vertical-align: top;
        margin-right: 5px;
    }

    .proName {
        font-size: 26px;
        line-height: 28px;
    }

    .finalPrice span {
        font-size: 26px;
    }

    .productDtl .contTx {
        margin-bottom: 15px;
        font-size: 15px;
    }

    .owl-carousel .owl-dots {
        margin: 20px 0 10px;
    }

    .alertBox {
        width: 280px;
        padding: 20px 15px 20px 80px;
    }

    .alertIcon {
        left: 10px;
    }

    .summaryTx .contTx .lbl {
        width: 100px;
    }

    .summaryOut .btnGroup .button {
        margin: 5px 0;
        width: 100%;
    }

    .summaryOut .btnGroup {
        margin: 10px 0 15px;
    }

    .addCustomer .subTitleRow .alignRight {
        width: auto;
        position: absolute;
        right: 0;
        top: 0;
    }

    .addCustomer .subTitleRow {
        position: relative;
    }

    .addCustomer .subTitleRow .alignRight .button {
        width: 100%;
    }

    .addCustomer .subTitleRow .button .icon {
        float: none;
        display: inline-block;
        vertical-align: top;
        margin-right: 5px;
    }

    .addCustomer h2 {
        width: 100%;
    }

    .cols12.separator.mrgT10 {
        margin-top: 0 !important;
    }

    .rrRow .button.filterSearch {
        margin-bottom: 0;
    }

    .btnCol2 {
        margin-bottom: 0;
    }

    .abutton.filterILbtn {
        line-height: 23px;
    }

    .btnCol2 .button {
        width: 100% !important;
        margin: 10px 0 !important;
    }

    .spProduct .cols3 {
        width: 100%;
    }

    .spProduct .cols2 {
        width: 100%;
    }

    .accordion .accTrigger .accNm {
        padding: 0 0 5px 10px;
        display: block;
        width: 100%;
        height: auto;
        font-size: 15px;
    }

    .accordion .accTrigger .proNo {
        padding-left: 10px;
        display: block;
        width: 100%;
        height: auto;
        font-size: 14px;
    }

    .accordion .accTrigger .lconImg {
        width: 30px;
    }

    .accordion .accTrigger .lconImg .iconImg {
        width: 30px;
        height: 30px;
        line-height: 30px;
        font-size: 15px;
    }

    .accordion .accTrigger {
        background-size: 20px;
        padding: 10px 30px 10px 0;
        min-height: 65px;
        height: auto;
    }

    .spDetail .cols5 {
        width: 100%;
    }

    .spDetail .cols3 {
        width: 100%;
    }

    .spDetail .cols2 {
        width: 100%;
    }

    .ucTitle {
        font-size: 24px;
    }

    .imgUc {
        margin: 70px 0 30px;
    }

    .infoBox p {
        font-size: 16px;
        line-height: 21px;
        margin-bottom: 25px;
    }

    .popBox {
        padding: 0 15px 30px;
    }

    .popHeader {
        padding: 20px 15px 0;
        margin: 0 -15px 20px;
    }

    .closePopup {
        right: 15px;
    }

    .upProcess {
        padding-left: 40px;
    }

    .upFileName {
        font-size: 15px;
    }

    .rangeOut.uploadRange {
        margin: 3px 0 2px;
    }

    .upProcess .rangeSize,
    .rangeProcess {
        font-size: 14px;
    }

    .upSec .fileIcon {
        width: 30px;
        height: 30px;
        top: 15px;
    }

    .upSec {
        margin-bottom: 25px;
    }

    .anCustomer .cols3:first-child {
        width: 100%;
        margin-bottom: 15px;
    }

    .anCustomer .cols9 {
        width: 100%;
    }

    .popTitle {
        font-size: 16px;
    }

    .ambToAdd .cols2 {
        width: 100%;
    }

    .popBox.ambToAdd .cols4 {
        width: 100%;
    }

    .popupAddress {
        padding: 30px 15px;
    }

    .subTitleRow h2 {
        font-size: 18px;
    }

    .button,
    input[type="submit"],
    input[type="button"],
    input[type="reset"],
    button,
    .button {
        font-size: 14px;
    }

    .tableEntries .totalShow {
        font-size: 14px;
    }

    #planBasedSubscription {
        min-width: 300px !important;
    }

    .twrCustRight .twrDate {
        position: relative;
        top: auto;
        right: auto;
        float: left;
    }

    .twrCustRight .tabbing {
        float: left;
        width: 100%;
        overflow-x: auto;
        margin: -15px 0 30px;
        height: 40px;
    }

    .borderBox.rfpChart {
        padding: 30px 25px 10px !important;
    }

    .borderBox {
        padding: 30px 25px;
    }

    .twrChart {
        padding: 30px 25px 10px;
    }

    .trpCustTbl .tooltiptext {
        width: 250px;
    }

    .leadPage .titleBtnCol {
        width: auto;
    }

    .perInfo .contListing .icoOut {
        width: 100%;
        padding: 0;
    }

    .perInfo .contListing .icoOut {
        word-wrap: anywhere;
    }

    .tabbingNew li a {
        padding: 12px 0 12px 25px;
        font-size: 14px;
    }

    .tabbingNew li a::before {
        border-top: 40px solid transparent;
        border-bottom: 40px solid transparent;
        border-left: 11px solid white;
        margin-top: -40px;
    }

    .tabbingNew li a::after {
        border-top: 40px solid transparent;
        border-bottom: 40px solid transparent;
        border-left: 10px solid #969696;
        margin-top: -40px;
    }

    .tabbingNew li:first-child a {
        padding-left: 15px;
    }

    .contDtl strong {
        font-size: 16px;
    }

    .notesFilter .button.filterSearch {
        min-width: 60px;
    }

    .notesFilter {
        padding-right: 80px;
    }

    .timelineDeals table tr td:first-child {
        padding-left: 25px;
        width: 85px;
    }


    .timelineDeals .tableOut {
        width: calc(100% + 25px);
        margin-left: -25px;
    }

    .finalPrice {
        font-size: 15px;
        margin: 0 0 15px;
    }

    .custCntBx {
        padding: 25px 25px 10px;
    }

    .bilToAddCont .custCntBx,
    .shipToAddCont .custCntBx {
        padding: 25px 25px 20px;
    }

    .contListing {
        padding: 15px 0 10px 95px;
    }

    .customerDetail h4 {
        font-size: 14px;
    }

    .customerDetail h2 {
        font-size: 18px;
    }

    .contListing .customerDetail .icoOut {
        width: 100%;
        padding-right: 0;
    }

    .locationTx,
    .icoOut {
        font-size: 15px;
    }

    .filterToggleOut.topBtn .filterTogle {
        top: -50px;
    }

    .filterToggleOut.topBtn2 .filterTogle {
        top: -57px;
    }

    .editAgreeDetail .cols2 {
        width: 100%;
    }

    .reportFilter .filterCols .cols10 {
        width: 100%;
    }

    .filterCols .reportBtn {
        width: 100% !important;
        margin-top: 0;
    }

    .RIAfilter .filterCols .cols10 {
        margin-bottom: 10px;
    }

    .bulletPoint li {
        width: 100%;
    }

    .inSearchCol>.feildCol {
        width: 100%;
    }

    .filterCols .inSearchCol .button.filterSearch {
        margin: 0 0 25px;
    }

    .titleRow.umTitleRow {
        width: 100%;
    }

    .titleRow.umTitleRow h1 {
        width: 100%;
        margin-bottom: 10px;
    }

    .titleRow.umTitleRow .titleBtnCol {
        margin-right: 55px;
    }

    .ABPfilter .radioGroup label {
        padding-right: 15px;
    }

    .radioGroup label {
        padding-right: 15px;
    }

}


@media only screen and (max-width: 410px) {

    #logo.logoOpen {
        width: 80px;
    }

    #logo.logoOpen a {
        width: 30px;
    }

    input[type="text"].searchField:focus {
        width: 255px;
    }

    .dropPopup {
        top: 56px;
        right: -75px;
        width: 270px;
        max-height: 300px;
    }

    #content {
        padding: 20px 15px;
    }

    .chartAreaBox {
        padding: 20px 15px 15px 15px;
    }

    .quarterlyReportBox .subTitleRow,
    .salesPerformanceSection .subTitleRow {
        width: 100%;
    }

    .chartTopRow .chartDate {
        top: 0;
        float: left;
        width: 118px;
        margin-top: 0;
    }

    #quarterlyReport .highcharts-legend {
        transform: translate(-10px, 15px) !important;
    }

    #SalesPerformance .highcharts-legend {
        transform: translate(-10px, 15px) !important;
    }

    .salesPerformanceSection .chartDate:last-child {
        margin-right: 0;
    }

    .borderBox.agreementBox {
        padding: 25px 15px;
    }

    .customerSection,
    .latestNews {
        padding: 25px 15px 5px 15px;
    }

    .blockText {
        font-size: 14px;
    }

    .statisticBlock .cols3 .numberBlock {
        min-height: 150px;
    }

    .statisticBlock .cols3 .growthUpDown {
        top: -15px;
    }

    .revReportBox .chartDate {
        position: relative;
    }

    #revenueReport .highcharts-legend {
        transform: translate(-10px, 20px) !important;
    }

    .adCustRight .tabbing {
        width: 100%;
        overflow-x: auto;
        height: 51px;
        margin: 0;
    }

    .custSection .viewAllBtn {
        top: -35px;
    }

    .tableOut.trpCustTbl {
        overflow-x: auto;
    }

    .tableOut.trpCustTbl table {
        min-width: 350px;
    }

    .pbsLegend {
        min-width: 300px;
    }

    .borderBox {
        padding: 25px 15px;
    }

    #territoryWiseRevenues {
        height: 140px !important;
        min-width: 100% !important;
    }

    .twrChart {
        padding: 25px 15px 10px;
    }

    .leadPage .filter.filterCols .cols5 {
        width: 100%;
    }

    .leadPage .filter.filterCols .cols3 {
        width: 100%;
    }

    .timelineDeals table tr td:first-child {
        padding-left: 15px;
        width: 75px;
    }

    .timelineDeals .tableOut {
        width: calc(100% + 15px);
        margin-left: -15px;
    }

    .proName {
        font-size: 24px;
        line-height: 26px;
    }

    .finalPrice span {
        font-size: 24px;
    }

    .productDtl {
        margin: 0 0 10px;
    }

    .customerDetail .cols12 {
        padding: 0;
    }

    .contListingBox .contListing {
        padding: 0;
    }

    .contListing .custLogo {
        left: auto;
        top: auto;
        position: relative;
        margin: 0 0 10px;
    }

    .custCntBx {
        padding: 20px 15px 10px;
    }

    .bilToAddCont .custCntBx,
    .shipToAddCont .custCntBx {
        padding: 20px 15px 15px;
    }

    .spdFilterCols .cols2 {
        width: 50% !important;
    }

    .inSearchCol>.feildCol {
        width: 100%;
    }

    .spdFilterCols .button.filterSearch {
        top: 10px !important;
        margin-bottom: 25px !important;
    }

    .EQDetails .addressBox .feildCol {
        padding-right: 0;
    }

    .filterCols.spCharCols {
        padding-right: 20px;
    }

    .filterCols .equalAfter {
        width: 100%;
        position: relative;
        float: right;
        top: 0;
        right: 0;
        margin-top: 15px;
        padding: 0 20px;
    }

    .filterCols .equalAfter::after {
        left: 10px;
    }

    .editQuotDetail .cols3 {
        width: 100%;
    }

    .editQuotDetail .cols2 {
        width: 100%;
    }

    .btnGroup .button {
        width: 100%;
        margin: 20px 0 0;
    }

    .barcodeCols {
        padding-right: 15px;
        min-height: inherit;
    }

    .barcodeCols .barcode {
        position: relative;
        width: 100%;
        padding: 0 15px;
        margin: 10px 0;
    }

    .reportFilter .filterCols .button.filterSearch {
        margin-top: 10px;
    }

    .RIAfilter .filterCols .cols5.colsP0 .cols5 {
        width: 100%;
    }

    .RIAfilter .filterCols .cols7.inSearchCol {
        width: 100%;
    }

    .RIAfilter .filterCols .button.filterSearch {
        margin-top: 0 !important;
    }

    .reportFilter.PRfilter .filterCols .cols10 {
        width: 100%;
    }

    .reportFilter.PRfilter .filterCols .reportBtn {
        width: 100% !important;
        margin: 0 0 0 !important;
    }

    .titleRow h1 {
        line-height: 23px;
    }

    .titleRow .titleBtnCol {
        margin-bottom: 25px;
        margin-top: -8px;
    }

    #yearlyPipeline .highcharts-legend {
        transform: translate(-10px, 20px);
    }

    .lagendBtn .btnOut {
        padding: 0 5px;
    }

    .lagendBtn {
        padding: 15px 10px;
    }

}





/*Updated Responsive*/

@media only screen and (max-width: 1024px){
#logo {width:18%;border:none;}
#logo img {width: 150px;height: 50px;top: -11px;}
#logo a {width:100%;height:100%;overflow: visible;}
 .topLinksAndSearch{margin-right: 3%;}
}




@media only screen and (max-width: 983px){
	#logo {width: 21%;}
	.proName{font-size:25px;}
}
@media only screen and (max-width: 851px){
   #logo {width: 25%;}
}
@media only screen and (max-width: 707px){
   #logo {width: 30%;}
}
@media only screen and (max-width: 653px){
#logo {/*width: 64%;*/}
.proName{font-size:20px;}
.topLinksAndSearch{/*margin-right: 12%;*/}
}
@media only screen and (max-width: 529px){
.topLinksAndSearch{margin-right: 7%;}
}
@media only screen and (max-width: 491px){
.topLinksAndSearch{margin-right: 0;}
}
@media only screen and (max-width: 447px){
#logo {width: 72%;}
.userTopLinks > ul > li {border:none;}
.userInformation{padding-right: 26px;}
.topLinksAndSearch{margin: 10px 0;float:none;}
.proName{font-size:15px;}
.userImg {width: 50px;height: 50px;}
}
@media only screen and (max-width: 405px){
.topLinksAndSearch .userTopLinks {	margin-right: 0px;}
}
@media only screen and (max-width: 385px){
#logo {width: 75%;}
.userTopLinks > ul > li {padding: 8px 15px;}
}


@media only screen and (max-width:580px){
#logo {width: 35%;}
    .topLinksAndSearch {
    margin-right: 5%;}
}
@media only screen and (max-width: 498px){
#logo {
    width: 40%;
}
}
@media only screen and (max-width: 437px){
#logo {
    width: 45%;
}
}
@media only screen and (max-width: 397px){
#logo {
    width: 49%;
}
}

@media only screen and (max-width: 389px){
#logo {width: 52%;}
.topLinksAndSearch {margin-right: 0%;}
}

@media only screen and (max-width: 373px){
    #logo {width: 81%;}
.topLinksAndSearch {margin-right: 17%;}
}

