@media only screen and (max-width: 319px) {
    .ctl-pad-top-res {
        padding: 25px 15px !important;
    }

    .cmp-log-hei-vh {
        -webkit-flex-direction: column-reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }

    .cmp-log-hei-vh,
    .ctl-pic-hei-vh img {
        height: auto !important;
    }

    .ctl-pic-hei-vh img {
        border-radius: 5px;
    }

    .ctl-pic-hei-vh {
        padding-right: 15px;
        padding-left: 15px;
        margin-top: 30px;
    }

    .cmp-lft-blo-pad {
        height: auto !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        position: static !important;
        left: auto !important;
    }

    .cmp-log-blo-bck {

        padding-right: 0 !important;
    }

    .cmp-tit-blo h1 {
        font-size: 28px !important;
    }

    .cmp-par-blo {
        padding-bottom: 0;
        margin: 20px auto !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 15px !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 18px !important;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .cmp-hom-bod footer {
        font-size: 14px !important;
        padding: 15px 15px;
    }

    .ctl-log-btn a span {
        margin-right: 0px;
    }

    .cmp-res-log-mab {
        margin-bottom: 0 !important;
    }
}

/*end of 319 resolution screen*/

@media only screen and (min-width: 320px) and (max-width: 575px) {
    .ctl-pad-top-res {
        padding: 25px 15px !important;
    }

    .cmp-log-hei-vh {
        -webkit-flex-direction: column-reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }

    .cmp-log-hei-vh,
    .ctl-pic-hei-vh img {
        height: auto !important;
    }

    .ctl-pic-hei-vh img {
        border-radius: 5px;
    }

    .ctl-pic-hei-vh {
        padding-right: 15px;
        padding-left: 15px;
        margin-top: 30px;
    }

    .cmp-lft-blo-pad {
        height: auto !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        position: static !important;
        left: auto !important;
    }

    .cmp-log-blo-bck {

        padding-right: 0 !important;
    }

    .cmp-tit-blo h1 {
        font-size: 28px !important;
    }

    .cmp-par-blo {
        padding-bottom: 0;
        margin: 20px auto !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 15px !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 18px !important;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .cmp-hom-bod footer {
        font-size: 14px !important;
        padding: 15px 15px;
    }

    .ctl-log-btn a span {
        margin-right: 0px;
    }

    .cmp-res-log-mab {
        margin-bottom: 0 !important;
    }


}

/*end of 320 X 575 resolution screen*/

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .ctl-pad-top-res {
        padding: 40px 30px !important;
    }

    .cmp-log-hei-vh {
        -webkit-flex-direction: column-reverse !important;
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }

    .cmp-log-hei-vh,
    .ctl-pic-hei-vh img {
        height: auto !important;
    }

    .ctl-pic-hei-vh img {
        border-radius: 5px;
    }

    .ctl-pic-hei-vh {
        padding-right: 15px;
        padding-left: 15px;
        margin-top: 40px;
    }

    .cmp-lft-blo-pad {
        height: auto !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        position: static !important;
        left: auto !important;
    }

    .cmp-log-blo-bck {

        padding-right: 0 !important;
    }

    .cmp-tit-blo h1 {
        font-size: 36px !important;
    }

    .cmp-par-blo {
        padding-bottom: 0;
        margin: 20px auto !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 15px !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 18px !important;
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .cmp-hom-bod footer {
        font-size: 14px !important;
        padding: 15px 15px;
    }

    .ctl-log-btn a span {
        margin-right: 0px;
    }

    .cmp-res-log-mab {
        margin-bottom: 0 !important;
    }
}

/*end of 576 X 767 resolution screen*/

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .ctl-pad-top-res {
        padding: 40px 30px !important;
    }


    .cmp-log-hei-vh,
    .ctl-pic-hei-vh img {
        height: auto !important;
    }

    .ctl-pic-hei-vh img {
        border-radius: 5px;
    }

    .ctl-pic-hei-vh {
        padding-right: 15px;
        padding-left: 15px;
        margin-top: 40px;
    }

    .cmp-lft-blo-pad {
        height: auto !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
        position: static !important;
        left: auto !important;
    }

    .cmp-log-blo-bck {

        padding-right: 0 !important;
    }

    .cmp-tit-blo h1 {
        font-size: 48px !important;
    }

    .cmp-par-blo {
        padding-bottom: 0;
        margin: 20px auto !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        /* font-size: 15px !important; */

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        /* font-size: 18px !important; */
        /* padding-top: 12px; */
        /* padding-bottom: 12px; */
    }

    .cmp-hom-bod footer {
        /* font-size: 14px !important; */
        padding: 15px 15px;
    }

    .ctl-log-btn a span {
        margin-right: 0px;
    }

    .cmp-res-log-mab {
        margin-bottom: 0 !important;
    }
}

/*end of 768 X 991 resolution screen*/

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .cmp-tit-blo h1 {
        font-size: 41px !important;
    }
}

/*end of 992 X 1199 resolution screen*/
@media (min-width: 1517px) {
    .cmp-tit-blo h1 {
        font-size: 3rem !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 1.2rem !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 1.3rem !important;
    }
}


@media (min-width: 1707px) {
    .cmp-tit-blo h1 {
        font-size: 3.5rem !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 1.6rem !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 1.8rem !important;
    }
}

@media (min-width: 1820px) {
    .cmp-tit-blo h1 {
        font-size: 4rem !important;
    }
}

@media (min-width: 2049px) {
    .cmp-tit-blo h1 {
        font-size: 5rem !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 1.8rem !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 2rem !important;
    }
}

@media (min-width: 2732px) {
    .cmp-tit-blo h1 {
        font-size: 5.8rem !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 2.2rem !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 2.2rem !important;
    }
}

@media (min-width: 4098px) {
    .cmp-tit-blo h1 {
        font-size: 7.5rem !important;
    }

    .cmp-par-blo,
    .ctl-txt-psw-bot,
    .ctl-frm-inp-fie input {
        font-size: 3rem !important;

    }

    .ctl-log-btn a,
    .cmp-log-btn button {
        font-size: 3rem !important;
    }
}

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

    /* dashboard */
    .cmp-das-par-blo {
        padding: 15px 5px !important;
    }



    .ctl-tab-hdr-col {
        -webkit-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }

    .cmp-hdr-mar-bot,
    .ctl-pen-txt-par {
        text-align: center;
    }

    .cmp-hdr-mar-bot {
        margin-bottom: 15px;
    }

    .ctl-cus-btn-blo {
        -webkit-justify-content: center !important;
        justify-content: center !important;
    }

    .cmp-tab-ico-lft {
        margin-right: 0 !important;
        margin-bottom: 10px;
    }

    .ctl-tab-hdr-col {
        padding: 30px !important;
    }

    .ctl-nav-lis-cus li a {
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        padding: 10px 15px;
    }

    .ctl-nav-lis-cus .nav-item {
        margin-left: 0 !important;
    }

    .cmp-com-mar-bot {
        margin-bottom: 25px !important;
        margin-top: 0 !important;
    }

    .cmp-res-das-grd {
        grid-template-columns: repeat(auto-fit, minmax(100%, 1fr)) !important;
    }
}

/*end of 319 resolution screen*/

@media only screen and (min-width: 320px) and (max-width: 575px) {

    /* dashboard */
    .cmp-das-par-blo {
        padding: 15px 5px !important;
    }



    .ctl-tab-hdr-col {
        -webkit-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }

    .cmp-hdr-mar-bot,
    .ctl-pen-txt-par {
        text-align: center;
    }

    .cmp-hdr-mar-bot {
        margin-bottom: 15px;
    }

    .ctl-cus-btn-blo {
        -webkit-justify-content: center !important;
        justify-content: center !important;
    }

    .cmp-tab-ico-lft {
        margin-right: 0 !important;
        margin-bottom: 10px;
    }

    .ctl-tab-hdr-col {
        padding: 30px !important;
    }

    .ctl-nav-lis-cus li a {
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        padding: 10px 15px;
    }

    .ctl-nav-lis-cus .nav-item {
        margin-left: 0 !important;
    }

    .cmp-com-mar-bot {
        margin-bottom: 25px !important;
        margin-top: 0 !important;
    }

    .cmp-res-das-grd {
        grid-template-columns: repeat(auto-fit, minmax(100%, 1fr)) !important;
    }




}

/*end of 320 X 575 resolution screen*/

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

    /* dashboard */
    .cmp-das-par-blo {
        padding: 15px 5px !important;
    }



    .ctl-tab-hdr-col {
        -webkit-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }

    .cmp-hdr-mar-bot,
    .ctl-pen-txt-par {
        text-align: center;
    }

    .cmp-hdr-mar-bot {
        margin-bottom: 15px;
    }

    .ctl-cus-btn-blo {
        -webkit-justify-content: center !important;
        justify-content: center !important;
    }

    .cmp-tab-ico-lft {
        margin-right: 0 !important;
        margin-bottom: 10px;
    }

    .ctl-tab-hdr-col {
        padding: 30px !important;
    }

    .ctl-nav-lis-cus li a {
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        padding: 10px 15px;
    }

    .ctl-nav-lis-cus .nav-item {
        margin-left: 0 !important;
    }

    .cmp-com-mar-bot {
        margin-bottom: 25px !important;
        margin-top: 0 !important;
    }

    .cmp-res-das-grd {
        grid-template-columns: repeat(auto-fit, minmax(50%, 1fr)) !important;
    }
}

/*end of 576 X 767 resolution screen*/

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

    /* dashboard */
    .cmp-das-par-blo {
        padding: 15px 5px !important;
    }



    .ctl-tab-hdr-col {
        -webkit-flex-direction: column !important;
        -ms-flex-direction: column !important;
        flex-direction: column !important;
    }

    .cmp-hdr-mar-bot,
    .ctl-pen-txt-par {
        text-align: center;
    }

    .cmp-hdr-mar-bot {
        margin-bottom: 15px;
    }

    .ctl-cus-btn-blo {
        -webkit-justify-content: center !important;
        justify-content: center !important;
    }

    .cmp-tab-ico-lft {
        margin-right: 0 !important;
        margin-bottom: 10px;
    }

    .ctl-tab-hdr-col {
        padding: 30px !important;
    }

    .ctl-nav-lis-cus li a {
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
        padding: 10px 15px;
    }

    .ctl-nav-lis-cus .nav-item {
        margin-left: 0 !important;
    }

    .cmp-com-mar-bot {
        margin-bottom: 25px !important;
        margin-top: 0 !important;
    }

    .cmp-res-das-grd {
        grid-template-columns: repeat(auto-fit, minmax(50%, 1fr)) !important;
    }

}

/*end of 768 X 991 resolution screen*/

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




    .cmp-res-wig-hun {
        width: 100%;
    }

    .ctl-nav-lis-cus .nav-item {
        margin-left: 10px !important;
    }

    .cmp-grd-das-tab {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-row-gap: 25px;
    }

    .cmp-grd-das-tab .cmp-res-das-blo {
        margin-top: 0 !important;
        width: 100%;
    }

    .cmp-com-mar-bot {
        margin-bottom: 25px !important;
        margin-top: 0 !important;
    }

    .cmp-res-das-grd {
        grid-template-columns: repeat(auto-fit, minmax(50%, 1fr)) !important;
    }

}

/*end of 992 X 1199 resolution screen*/




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


    .cmp-sec-nav-wid button.navbar-toggler:focus {
        box-shadow: none;
    }

    .cmp-bac-sec-whi {
        padding: 10px 15px !important;
    }

    .cmp-sec-nav-wid .navbar.subnav.navbar-expand-lg .nav-item .nav-link.active {
        padding: 10px 20px;
    }

    .cmp-sec-nav-wid .navbar.subnav .nav-item .nav-link {
        padding: 10px 20px;
    }

    .cmp-nav-res-bac {
        background-color: #ffffff;
        padding: 15px;
        box-shadow: 0 0px 3px rgba(56, 65, 74, .15);
    }

    .cmp-sec-nav-wid li:not(:last-child) {
        margin-right: 0;
    }

    .cmp-pge-hdr-div {

        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .cmp-sub-hdr-div {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .cmp-whi-sal-blo {
        padding: 0 15px 15px 15px;
    }

    .ctl-tab-row-col.sortable-main {
        margin-bottom: 40px;
    }

    .cmp-whi-sal-blo .pagination-container {
        bottom: 36px;
    }

    .cmp-sal-res-pad {
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-bottom: 112px !important;
    }

    .cmp-whi-dem-blo {
        padding: 15px 15px 15px 15px;
    }

    .ctl-cre-grn-btn {
        margin-left: 0 !important;
    }
}

/*end of 319 resolution screen*/
@media only screen and (min-width: 320px) and (max-width: 575px) {


    .cmp-sec-nav-wid button.navbar-toggler:focus {
        box-shadow: none;
    }

    .cmp-bac-sec-whi {
        padding: 10px 15px !important;
    }

    .cmp-sec-nav-wid .navbar.subnav.navbar-expand-lg .nav-item .nav-link.active {
        padding: 10px 20px;
    }

    .cmp-sec-nav-wid .navbar.subnav .nav-item .nav-link {
        padding: 10px 20px;
    }

    .cmp-nav-res-bac {
        background-color: #ffffff;
        padding: 15px;
        box-shadow: 0 0px 3px rgba(56, 65, 74, .15);
    }

    .cmp-sec-nav-wid li:not(:last-child) {
        margin-right: 0;
    }

    .cmp-pge-hdr-div {

        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .cmp-sub-hdr-div {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .cmp-whi-sal-blo {
        padding: 0 15px 15px 15px;
    }

    .ctl-tab-row-col.sortable-main {
        margin-bottom: 40px;
    }

    .cmp-whi-sal-blo .pagination-container {
        bottom: 36px;
    }

    .cmp-sal-res-pad {
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-bottom: 112px !important;
    }

    .cmp-whi-dem-blo {
        padding: 15px 15px 15px 15px;
    }

    .ctl-cre-grn-btn {
        margin-left: 0 !important;
    }
}

/*end of 320 X 575 resolution screen*/

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


    .cmp-sec-nav-wid button.navbar-toggler:focus {
        box-shadow: none;
    }

    .cmp-bac-sec-whi {
        padding: 10px 15px !important;
    }

    .cmp-sec-nav-wid .navbar.subnav.navbar-expand-lg .nav-item .nav-link.active {
        padding: 10px 20px;
    }

    .cmp-sec-nav-wid .navbar.subnav .nav-item .nav-link {
        padding: 10px 20px;
    }

    .cmp-nav-res-bac {
        background-color: #ffffff;
        padding: 15px;
        box-shadow: 0 0px 3px rgba(56, 65, 74, .15);


    }

    .cmp-sec-nav-wid li:not(:last-child) {
        margin-right: 0;
    }

    .cmp-pge-hdr-div {

        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .cmp-sub-hdr-div {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .cmp-whi-sal-blo {
        padding: 0 15px 15px 15px;
    }

    .ctl-tab-row-col.sortable-main {
        margin-bottom: 40px;
    }

    .cmp-whi-sal-blo .pagination-container {
        bottom: 36px;
    }

    .cmp-sal-res-pad {
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-bottom: 112px !important;
    }
}

/*end of 576 X 767 resolution screen*/

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


    .cmp-sec-nav-wid button.navbar-toggler:focus {
        box-shadow: none;
    }

    .cmp-bac-sec-whi {
        padding: 10px 15px !important;
    }

    .cmp-sec-nav-wid .navbar.subnav.navbar-expand-lg .nav-item .nav-link.active {
        padding: 10px 20px;
    }

    .cmp-sec-nav-wid .navbar.subnav .nav-item .nav-link {
        padding: 10px 20px;
    }

    .cmp-nav-res-bac {
        /* background-color: #ffffff; */
        /* padding: 15px; */
        /* box-shadow: 0 0px 3px rgba(56, 65, 74, .15); */


    }

    .cmp-sec-nav-wid li:not(:last-child) {
        margin-right: 0;
    }

    .cmp-pge-hdr-div {

        padding-right: 10px !important;
        padding-left: 10px !important;
    }

    .cmp-sub-hdr-div {
        padding-right: 15px !important;
        padding-left: 15px !important;
    }

    .cmp-whi-sal-blo {
        padding: 0 15px 15px 15px;
    }

    .ctl-tab-row-col.sortable-main {
        margin-bottom: 40px;
    }

    .cmp-whi-sal-blo .pagination-container {
        bottom: 36px;
    }

    .cmp-sal-res-pad {
        padding-right: 15px !important;
        padding-left: 15px !important;
        padding-bottom: 112px !important;
    }
}

/*end of 768 X 991 resolution screen*/

@media only screen and (max-width: 319px) {
    .ctl-hei-res-aut {
        height: auto !important;
    }

    .cmp-pge-con-pad {
        padding: 25px 5px !important;
    }

    .cmp-det-pag-hdr,
    .cmp-cus-po-blo {
        padding: 15px 15px !important;
    }

    .cmp-cus-po-blo .page-subheader-div {
        flex-direction: column;
        height: auto;
    }

    .cmp-sub-hdr-btn button {
        margin-left: 0 !important;
    }

    .cmp-sub-hdr-btn {
        padding-left: 0;
        margin-top: 8px;
    }

    .cmp-btn-can,
    .cmp-btn-sav {
        font-size: 14px;
    }

    .cmp-det-pag-con {
        margin-bottom: 25px;
    }

    /*  */
    .page-header-div h2 {
        font-size: 19px;
    }

    .cmp-pge-hdr-res {
        display: flex;
        flex-direction: column;
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .cmp-pge-hdr-res .header-start-div {
        margin-bottom: 10px;
    }

    .cmp-all-res-col {
        flex-direction: column;
    }

    .cmp-pop-blo-fou {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .cmp-mod-hdr-pag h5.modal-title {
        font-size: 18px;
    }

    .cmp-sub-hdr-btn button {
        font-size: 13px;
    }

    .cmp-res-mar-zer {
        margin-top: 0 !important;
    }
}

/*end of 319 resolution screen*/

@media only screen and (min-width: 320px) and (max-width: 575px) {
    .ctl-hei-res-aut {
        height: auto !important;
    }

    .cmp-pge-con-pad {
        padding: 25px 5px !important;
    }

    .cmp-det-pag-hdr,
    .cmp-cus-po-blo {
        padding: 15px 15px !important;
    }

    .cmp-cus-po-blo .page-subheader-div {
        flex-direction: column;
        height: auto;
    }

    .cmp-sub-hdr-btn button {
        margin-left: 0 !important;
    }

    .cmp-sub-hdr-btn {
        padding-left: 0;
        margin-top: 8px;
    }

    .cmp-btn-can,
    .cmp-btn-sav {
        font-size: 14px;
    }

    .cmp-det-pag-con {
        margin-bottom: 25px;
    }

    /*  */
    .page-header-div h2 {
        font-size: 19px;
    }

    .cmp-pge-hdr-res {
        display: flex;
        flex-direction: column;
        height: auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .cmp-pge-hdr-res .header-start-div {
        margin-bottom: 10px;
    }

    .cmp-all-res-col {
        flex-direction: column;
    }

    .cmp-pop-blo-fou {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .cmp-mod-hdr-pag h5.modal-title {
        font-size: 18px;
    }

    .cmp-sub-hdr-btn button {
        font-size: 13px;
    }

    .cmp-res-mar-zer {
        margin-top: 0 !important;
    }
}

/*end of 320 X 575 resolution screen*/

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .ctl-hei-res-aut {
        height: auto !important;
    }

    .cmp-pge-con-pad {
        padding: 25px 5px !important;
    }

    .cmp-det-pag-hdr,
    .cmp-cus-po-blo {
        padding: 15px 15px !important;
    }

    /* .cmp-cus-po-blo .page-subheader-div {
        flex-direction: column;
        height: auto;
    } */
    .cmp-sub-hdr-btn button {
        margin-left: 0 !important;
    }

    .cmp-sub-hdr-btn {
        padding-left: 0;
        /* margin-top: 8px; */
    }

    .cmp-btn-can,
    .cmp-btn-sav {
        font-size: 14px;
    }

    .cmp-det-pag-con {
        margin-bottom: 25px;
    }

    .cmp-all-res-col {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

/*end of 576 X 767 resolution screen*/

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .ctl-hei-res-aut {
        height: auto !important;
    }

    .cmp-pge-con-pad {
        /* padding: 25px 10px !important; */
    }

    .cmp-det-pag-hdr,
    .cmp-cus-po-blo {
        padding: 25px 25px !important;
    }

    /* .cmp-cus-po-blo .page-subheader-div {
        flex-direction: column;
        height: auto;
    } */

    .cmp-sub-hdr-btn {
        padding-left: 0;
        /* margin-top: 8px; */
    }

    .cmp-btn-can,
    .cmp-btn-sav {
        /* font-size: 14px; */
    }

    .cmp-det-pag-con {
        margin-bottom: 25px;
    }

    .cmp-all-res-col {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}

/*end of 768 X 991 resolution screen*/

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

/*end of 992 X 1199 resolution screen*/


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

/*end of 319 resolution screen*/
@media only screen and (min-width: 320px) and (max-width: 575px) {
    .ctl-txt-per-tit {
        font-size: 22px;
    }
}

/*end of 320 X 575 resolution screen*/

@media only screen and (min-width: 576px) and (max-width: 767px) {
    .ctl-txt-per-tit {
        font-size: 35px;
    }
}

/*end of 576 X 767 resolution screen*/

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

/*end of 768 X 991 resolution screen*/

@media only screen and (max-width: 991px) {
    .cmp-scr-ver-hor{
        height: 520px !important;
     }
}
@media only screen and (min-width: 992px) {
    .cmp-scr-ver-hor{
        height: 166px !important;
     }
}
@media only screen and (min-width: 1024px) {
    .cmp-scr-ver-hor{
        height: 760px !important;
     }
}
@media only screen and (min-width: 1200px) {
    .cmp-scr-ver-hor{
        height: 195px !important;
     }
}
@media only screen and (min-width: 1280px) {
    .cmp-scr-ver-hor{
        height: 230px !important;
     }
}
@media only screen and (min-width: 1517px) {
    .cmp-scr-ver-hor{
        height: 300px !important;
     }
}
@media only screen and (min-width: 1707px) {
    .cmp-scr-ver-hor{
        height: 400px !important;
     }
}
@media only screen and (min-width: 1821px) {
    .cmp-scr-ver-hor{
        height: 400px !important;
     }
}
@media only screen and (min-width: 1920px) {
    .cmp-scr-ver-hor{
        height: 500px !important;
     }
}
@media only screen and (min-width: 2048px) {
    .cmp-scr-ver-hor{
        height: 530px !important;
     }
}
@media only screen and (min-width: 2732px) {
    .cmp-scr-ver-hor{
        height: 735px !important;
     }
}
@media only screen and (min-width: 3840px) {
    .cmp-scr-ver-hor{
        height: 1380px !important;
     }
}
@media only screen and (min-width: 4098px) {
    .cmp-scr-ver-hor{
        height: 1300px !important;
     }
}
@media only screen and (min-width: 5464px) {
    .cmp-scr-ver-hor{
        height: 1800px !important;
     }
}