* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    text-rendering: optimizeLegibility;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
    font-family: 'Arial-Regular', 'Francisco-Regular';
    background-color: #F3F8FC !important;
    width: 100%;
}

/*font face*/
@font-face {
    font-family: poppins_medium;
    src: url(../libs/fonts/Poppins-Medium.ttf);
}

@font-face {
    font-family: poppins_semi_bold;
    src: url(../libs/fonts/Poppins-SemiBold.ttf);
}

@font-face {
    font-family: Poppins-bold;
    src: url(../libs/fonts/Poppins-Bold.ttf);
}

@font-face {
    font-family: Poppins-regular;
    src: url(../libs/fonts/Poppins-Regular.ttf);
}

@font-face {
    font-family: Poppins-light;
    src: url(../libs/fonts/Poppins-Light.ttf);
}
/*font face end*/

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

button {
    cursor: pointer;
}

input, select, option {
    font-family: 'Poppins-regular' !important;
}

.poppins-bold {
    font-family: Poppins-bold;
}

.poppins-light {
    font-family: Poppins-light;
}

.poppins-semibold {
    font-family: Poppins_semi_bold;
}

.poppins-regular {
    font-family: Poppins-regular;
}

.poppins-medium {
    font-family: Poppins_medium;
}

/*font-color*/
.color-black {
    color: #000000;
}

.color-white {
    color: #ffffff;
}

.color-2b {
    color: #2B2B2B;
}

.color-87 {
    color: #878787;
}

.color-7b {
    color: #7b7b7b;
}

.color-rgb48 {
    color: rgba(72, 121, 165, 0.7);
}

.color-41 {
    color: #415F7A;
}

.color-41rgb {
    color: rgba(65, 95, 122, 0.9);
}

.color-4646 {
    color: #464646;
}

.color-34 {
    color: #34546F;
}

.color-48 {
    color: #4879A5;
}

.color-63 {
    color: #636363;
}

.color-0f {
    color: #0F8FFF;
}

.color-13 {
    color: #1370B5;
}

.color-4343 {
    color: #434343;
}

.color-35 {
    color: #35638C;
}

.color-67 {
    color: #678199;
}

.color-237c {
    color: #237CC1;
}

.color-28 {
    color: #2895EA;
}

/* font color end*/
.opacity-75 {
    opacity: 0.75;
}

.h-100vh {
    height: 100vh;
    overflow: hidden;
}

.h-50vh {
    height: 40vh;
    overflow: hidden;
}

.h-50 {
    height: 50%;
}

/* font size */
.fontsize-42 {
    font-size: 42px;
}

.fontsize-24 {
    font-size: 24px;
}

.fontsize-20 {
    font-size: 18px;
    line-height: 24px;
}

.fontsize-28 {
    font-size: 28px;
    line-height: 42px;
}

.fontsize-14 {
    font-size: 14px;
}

.fontsize-15 {
    font-size: 14px;
    line-height: 22px
}

.fontsize-16 {
    font-size: 14px;
    line-height: 22px;
}

.fontsize-12 {
    font-size: 12px;
}

.fontsize-18 {
    font-size: 16px;
}

.letterspace-0025em {
    letter-spacing: 0.025em;
}
/* font size */

.cursor-pointer {
    cursor: pointer;
}

.pb_30 {
    padding-bottom: 30px;
}

.pt_30 {
    padding-top: 30px;
}

.pb_20 {
    padding-bottom: 20px;
}

.pt_20 {
    padding-top: 10px;
}

.pb_12 {
    padding-bottom: 12px;
}

.pt_12 {
    padding-top: 12px;
}

.sidebar-scroll::-webkit-scrollbar,
.projectpage #content::-webkit-scrollbar,
.ipad-db::-webkit-scrollbar,
.project-mblscroll::-webkit-scrollbar {
    visibility: hidden;
}

.sidebar-scroll, .projectpage #content,
.ipad-db {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: thin;
    /* scrollbar-color: #F3F8FC !important;*/
    scrollbar-color: #F3F8FC rgba(243,248,252,0.8) !important;
    scrollbar-background-color: #efeded;
    border-radius: 10px;
    /* Firefox */
}
/* Hide scrollbar for IE and Edge */

.sidebar-scroll, .projectpage #content,
.ipad-db {
    -ms-overflow-style: none;
    -moz-overflow-style: none;
}

/*login carousel*/
.carousel-indicators li {
    width: 8px;
    height: 8px;
    margin: 0 8px;
    border-radius: 100%;
}

.carousel .slide_image {
    width: 100vw;
    height: 100vh;
    object-fit: cover;
}

.carousel-fade .carousel-item {
    opacity: 0;
    transition-duration: .6s;
    transition-property: opacity;
}

    .carousel-fade .carousel-item.active,
    .carousel-fade .carousel-item-next.carousel-item-left,
    .carousel-fade .carousel-item-prev.carousel-item-right {
        opacity: 1;
    }

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
    opacity: 0;
}

.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
    transform: translateX(0);
    transform: translate3d(0, 0, 0);
}


.carousel-caption {
    display: flex;
    text-align: left;
    justify-content: left;
    margin: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 10%;
    font-family: 'poppins_medium' !important;
    font-size: 38px;
    line-height: 70px;
    color: white;
}

/*login carousel end*/





.login_section {
    margin: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding: 0 50px;
    z-index: 9999;
}

    .login_section p {
        font-family: 'poppins_medium';
        font-size: 16px;
        line-height: 30px;
        letter-spacing: 0.025em;
        margin-top: 20px;
        margin-bottom: 20px;
        color: #2B2B2B;
    }


.form_title {
    font-family: 'poppins_medium';
    font-size: 16px;
    line-height: 150%;
    color: #878787;
}

/*overwrite bootstrap*/

a:hover {
    text-decoration: none !important;    
}

.btn:hover {
    color: #ffffff;   
}

.input_field {
    border: 1px solid rgba(0, 0, 0, 0.39);
    border-collapse: collapse;
}

    .input_field input {
        border: 0;
        font-family: 'poppins_medium';
        font-size: 14px;
        line-height: 21px;
        color: rgba(0, 0, 0, 0.39);
    }

    .input_field label {
        font-family: 'poppins_medium';
        font-size: 16px;
        line-height: 24px;
        color: #2B2B2B;
    }

/*overwrite bootstrap end*/

.border_b_0 {
    border-bottom: 0 !important;
}

.border_l_0 {
    border-left: 0 !important;
}

.border_r_0 {
    border-right: 0 !important;
}

.border_t_0 {
    border-top: 0 !important;
}

.input_field:focus-within {
    border-left: 7px solid #0F8FFF;
}

.forgot_pwd {
    font-family: poppins_medium;
    font-size: 14px;
    line-height: 4;
    color: #828282 !important;
}

.login_btn {
    background-color: #0F8FFF;
    color: white;
    font-family: 'poppins_semi_bold';
    border-radius: 5px;
    font-size: 18px;
    line-height: 27px;
    float: right;
    padding: 12px 30px;
}

.clientlogo_img {
    position: absolute;
    right: 5%;
    bottom: 5%;
    z-index: 999999;
}

.border_t_0 {
    border-top: 0 !important;
}

.input_field:focus-within {
    border-left: 7px solid #0F8FFF;
}

.forgot_pwd {
    font-family: poppins_medium;
    font-size: 14px;
    line-height: 4;
    color: #828282 !important;
}

.login_btn {
    background-color: #0F8FFF;
    color: white;
    font-family: 'poppins_semi_bold';
    border-radius: 5px;
    font-size: 18px;
    line-height: 27px;
    float: right;
    padding: 12px 30px;
}

.clientlogo_img {
    position: absolute;
    right: 5%;
    bottom: 5%;
    z-index: 999999;
}


.eye-hide, .eye-show {
    width: 24px;
    height: 25px;
}

.eye-show {
    display: none;
}


.eye_icon {
    position: absolute;
    top: 40%;
    right: 5%;
}



/*landing page*/

button:focus {
    outline: none !important;
    box-shadow: none !important;
}

.konnect-headerlogo {
    width: 116.19px;
    height: 44.26px;
    object-fit: cover;
}

.header {
    background: #F3F8FC;
    padding: 18px 30px;
}

.round-profile {
    width: 41.1px;
    height: 41.1px;
}

.alert-icon {
    width: 20px;
    height: 20px;
    margin-right: 8px;
}

.btn-controller {
    border: 1px solid rgba(72, 121, 165, 1) !important;
    padding: 10px 20px;
    background-color: transparent !important;
    margin-right: 30px;
    border-radius: 10px;
    font-family: 'poppins-regular';
}

.fontweight-600 {
    font-weight: 600;
}

.btn-controller img {
    width: 20px;
    height: 20px;
    margin-bottom: 5px;
}

.header .mr-20 {
    margin-right: 20px;
}

/*landing page end*/


.wrapper {
    display: flex;
    text-decoration: none;
    transition: all 0.4s;
}

#sidebar {
    min-width: 280px;
    max-width: 280px;
    background: #F3F8FC;
    transition: all 0.6s;
    height: 100vh;
    padding: 44px 15px 0px 25px;
}

    #sidebar.active {
        margin-left: -280px;
    }

        #sidebar.active .side-toggle {
            position: absolute;
            left: -9px;
            top: 134px;
            z-index: 999999999;
            margin-right: 0px;
            margin-top: 0px;
        }

            #sidebar.active .side-toggle img {
                transform: rotate(180deg);
                display: none;
            }

.side-toggle img {
    width: 35px;
    height: 35px;
}

#sidebar .side-toggle {
    margin-right: -20px;
    margin-top: 10px;
    z-index: 999999999;
}

.projectpage #sidebar.active #sidebarCollapse {
    margin-right: -4px !important;
    margin-top: 0px !important;
}

.projectpage #sidebar .side-toggle {
    margin-right: -4px;
    margin-top: 24px;
}

.projectpage #sidebar.active .side-toggle {
    top: 112px;
    left: -8px;
    position: absolute;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #1b1d24;
}

#sidebar ul.components {
    padding: 63px 0;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    display: block;
}

#sidebar.landing ul li {
    list-style: none;
}

#sidebar ul li a:hover {
    text-decoration: none;
}

.lisst-unstyled.pl-20 {
    padding-left: 30px;
}

.landing a.active,
.landing a.active:hover {
    color: #4879A5;
    font-family: 'poppins_medium';
    padding-left: 0;
}


#sidebarCollapse1 {
    display: none;
}

#content.active #sidebarCollapse1 {
    display: block;
}

#content.active .side-toggle img {
    width: 35px;
    height: 35px;
    transform: rotate( 180deg) !important;
}

#content.active .side-toggle {
    position: absolute;
    left: -9px;
    top: 48px;
    z-index: 999999999;
    margin-right: 0px;
    margin-top: 0px;
}

.projectpage #content.active .side-toggle {
    position: absolute;
    left: -9px;
    top: 19px;
    z-index: 999999999;
    margin-right: 0px;
    margin-top: 0px;
}

    .projectpage #content.active .side-toggle img {
        transform: rotate(180deg) !important;
        object-fit: cover;
    }



.sidebar li .submenu {
    list-style: none;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: 44px !important;
}


#sidebar ul li a.bullet.first-link.active {
    padding-bottom: 16px !important;
}

#sidebar ul li a.bullet {
    padding-bottom: 0px !important;
}

.bullet.active, .bullet:hover {
    color: #415F7A !important;
    font-family: 'poppins_medium' !important;
}



#sidebar a.bullet.active .link-icon-ol.dn {
    display: none !important;
}

#sidebar a.bullet.active .link-icon-ol.db {
    display: block !important;
}

#sidebar a.bullet:hover .link-icon-ol.db {
    display: block !important;
}

#sidebar a.bullet:hover .link-icon-ol.dn {
    display: none !important;
}

#sidebar a.bullet .link-icon-ol.db {
    display: none !important;
}

#sidebar a.bullet .link-icon-ol.dn {
    display: block !important;
}


a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: none;
    position: absolute;
    top: 50%;
    right: 20%;
    transform: translateY(-50%);
}

ul ul a {
    padding-left: 30px !important;
}

.link-icon {
    width: 20px;
    height: 20px;
    margin-right: 10px;
}

.link-icon-ol {
    width: 12px;
    height: 12px;
    margin-right: 20px;
}

.tabs-icon {
    margin-right: 16px;
    width: 16px;
    height: 17px;
    object-fit: cover;
}


select::-ms-expand {
    display: none;
}

.dropdown-container select {
    /* for Firefox */
    -moz-appearance: none;
    /* for Safari, Chrome, Opera */
    -webkit-appearance: none;
}

    /* for IE10 */
    .dropdown-container select::-ms-expand {
        display: none;
    }

#content {
    background: rgba(255, 255, 255, 0.5);
    border-radius: 20px 0px 0px 0px;
    padding: 20px 40px 0 40px;
    height: 100%;
}


.logouts {
    position: absolute;
    bottom: 5%;
    left: 30px;
}


/*project page*/
.projectpage #sidebar,
.projectpage #sidebar ul.components {
    padding: 0px !important;
}

.uncollapse {
    padding: 30px 0px 0px 25px !important;
}

.collapse a, .collapsing a {
    padding: 16px 0px 0px 25px !important;
    display: block !important;
}

a.collapse, a.collapsing {
    display: block !important;
}

a.collapsing {
    height: auto !important;
}

.projectpage #sidebar ul li::marker {
    border: rgba(65, 95, 122, 1);
    background-color: transparent !important;
    width: 13px;
    height: 13px;
    font-size: 1.5em;
}

.projectpage #sidebar.active {
    margin-left: -280px !important;
}

.opacity-09 {
    opacity: 0.9;
}

.sidebar-scroll {
    min-height: 85vh !important;
    overflow-y: scroll;
    overflow-x: hidden;
    max-height: 85vh;
}

.project-headerlogo {
    margin-right: 15px;
}

.projectpage .nav-pills .nav-link.active,
.projectpage .nav-pills .show > .nav-link {
    background-color: transparent !important;
    color: #0F8FFF !important;
    border-bottom: 4px solid #0F8FFF;
    border-radius: 2.79261px;
    font-family: 'Poppins-regular' !important;
    font-weight: 600;
}

.projectpage .nav-pills a svg {
    margin-right: 7px;
}

.projectpage .nav-pills .nav-link.active path {
    stroke: #0F8FFF;
}

.projectpage .nav-pills a {
    margin-right: 10px;
    font-family: 'poppins-regular';
    cursor: pointer;
    border-bottom: 4px solid transparent;
}

.search img {
    position: absolute;
    top: 24%;
    left: 10%;
    opacity: 0.5;
    width: 20px;
    height: 20px;
    cursor: pointer;
    margin-right: 7px;
}

.search input {
    padding-left: 16%;
    border: 1px solid #B7C9D9;
}

    .search input::placeholder {
        font-family: Poppins-regular;
        font-size: 16px;
        color: #879EB4;
    }

.form-control:focus {
    border-color: #B7C9D9 !important;
    outline: none !important;
    box-shadow: none !important;
}

.btn-search {
    background: #2895EA;
    border-radius: 10px;
    border: none;
    padding: 6px 20px;
}

.filter-toggle img {
    width: 24px;
    height: 24px;
}

.filter-toggle {
    border: 1px solid #4879A5;
    border-radius: 10px;
    padding: 0px 10px;
    height: 100%;
    background-color: transparent;
}

.mb-23 {
    margin-bottom: 23px;
}

.current-projects .mb-20 {
    margin-bottom: 20px;
}

img.selectarrow-down {
    position: absolute;
    top: 15px;
    right: 10px;
    width: 15.1px;
    height: 8px;
    object-fit: cover;
}

.dropdown input {
    padding: .375rem 30px .375rem 10px !important;
    box-sizing: border-box;
    border-radius: 10px !important;
}

.select-toggle select {
    padding: .375rem 30px .375rem 10px !important;
    box-sizing: border-box;
    border-radius: 10px !important;
    appearance: none;
    background: url(../images/select-down.svg) right 6px center/16px no-repeat;
}

.select-toggle .select-arrow {
    bottom: 13px;
    right: 9px;
    width: 15.1px;
    height: 8px;
    object-fit: cover;
}

.select-toggle.mb-10 {
    margin-bottom: 10px;
}

.select-toggle.active {
    display: none;
    transition: all 0.4s;
}

.mb-25 {
    margin-bottom: 25px;
}

.mb-30 {
    margin-bottom: 30px;
}

.select-toggle {
    display: block;
    transition: all 0.4s;
}

.current-projects .card img {
    height: auto;
    object-fit: cover;
}

.current-projects .card {
    background: #FFFFFF;
    box-shadow: 0px 9px 32px rgba(15, 143, 255, 0.05) !important;
    border-radius: 10px;
    transition: 0.8s;
    border: none !important;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

    .current-projects .card:hover {
        box-shadow: 0px 5px 20px rgba(68,124,166, 50%) !important;
        -webkit-transition: box-shadow .6s ease-in !important;
        transform: scale(1.05);
        transition: transform .5s ease-in-out !important;
        cursor: pointer;
    }

    .current-projects .card .arrow-right {
        width: 20px;
        height: 20px;
    }

.projectpage #content {
    height: 100vh;
}

.projectpage #content {
    padding: 20px 30px 150px;
    min-height: 0;
    max-height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
    background: rgba(255,255,255, 0.3) !important;
    ;
}

.current-projects .card .card-body {
    padding: 16px;
}

#filterCollapse.active {
    background-color: #415F7A;
}

#filterCollapse {
    background-color: transparent;
}

    #filterCollapse svg {
        width: 20px;
        height: 20px;
    }

        #filterCollapse svg path {
            stroke: #4879A5;
        }

    #filterCollapse.active svg path {
        stroke: #ffffff;
    }
/*project page*/



.block {
    border: 1px solid #d8dbde;
    border-collapse: collapse;
}

    .block svg {
        position: absolute;
        top: 10%;
        right: 5%;
        width: 30px;
        height: 30px;
    }

    .block p {
        font-size: 18px;
        line-height: 20px;
        color: #636363;
        font-family: 'poppins-regular';
        font-weight: 500;
        position: absolute;
        bottom: 0;
        left: 5%;
    }

.block {
    cursor: pointer;
}

    .block:hover {
        border-radius: 10px;
    }

        .block:hover svg path {
            stroke: #fff;
        }

        .block:hover p {
            color: #fff;
        }

.b-1 {
    background-color: transparent;   
}

.b-1:hover {
    background-color: #F87D13;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
    cursor: pointer;
}

.b-2 {
    background-color: transparent;
}

.b-2:hover {
    background-color: #BC3603;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}

.b-3 {
    background-color: transparent;
}

.b-3:hover {
    background-color: #2895EA;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}

.b-4 {
    background-color: transparent;
}

.b-4:hover {
    background-color: #FF4B6E;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}

.b-5 {
    background-color: transparent;
}

.b-5:hover {
    background-color: #91437D;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}

.b-6 {
    background-color: transparent;
}

.b-6:hover {
    background-color: #A7CF38;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}

.b-7 {
    background-color: transparent;
}

.b-7:hover {
    background-color: #23B5D3;
    box-shadow: 0px 5px 20px rgb(68 124 166 / 50%) !important;
}


.h-15vh {
    height: 10vh;
}

.h-20vh {
    height: 20vh
}

.small_cards {
    font-family: 'poppins_medium';
    font-size: 18px;
    line-height: 27px;
}

.block_small svg {
    top: 35%;
    position: absolute;
    right: 5%;
    height: 22px;
    width: 22px;
}

.block_small p {
    top: 35%;
    position: absolute;
    left: 5%;
    color: #2895EA;
}

.block6_small {
    padding-bottom: 10px;
}

    .block6_small p {
        position: absolute;
        bottom: 0%;
        left: 10%;
    }

    .block6_small svg {
        top: 10%;
        position: absolute;
        right: 10%;
        height: 22px;
        width: 22px;
    }

.bs-1 {
    background-color: rgba(40,149,234,15%);
}

    .bs-1 svg path {
        stroke: #2895EA;
    }

.bs-2 {
    background-color: #FFEFE1;
}

    .bs-2 p {
        color: #FF851B;
    }

    .bs-2 svg path {
        stroke: #FF851B;
    }

.bs-3 {
    background-color: rgba(255,75,110,15%);
}

    .bs-3 p {
        color: #FF4B6E;
    }

    .bs-3 svg path {
        stroke: #FF4B6E;
    }

.bs-4 {
    background-color: rgba(35,181,211,11%);
}

    .bs-4 p {
        color: #23B5D3;
    }

    .bs-4 svg path {
        stroke: #23B5D3;
    }

.bs-5 {
    background-color: rgba(229,98,94,10%);
}

    .bs-5 p {
        color: #BC3603;
    }

    .bs-5 svg path {
        stroke: #BC3603;
    }

.bs-6 {
    background-color: rgba(167,207,56,15%);
}

    .bs-6 p {
        color: #84B00A;
    }

    .bs-6 svg path {
        stroke: #84B00A;
    }

.bs-7 {
    background-color: rgba(145,67,125,15%);
}

    .bs-7 p {
        color: #832B6C;
    }

    .bs-7 svg path {
        stroke: #832B6C;
    }

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

.pt-10 {
    padding-top: 10px !important;
}


.carousel-caption {
    opacity: 0;
    transition-duration: 2.5s;
    transition-property: opacity;
}

.carousel-fade .carousel-item, {
    opacity: 0;
    transition-duration: 2.5s;
    transition-property: opacity;
}

    .carousel-fade .carousel-item.active .carousel-caption,
    .carousel-fade .carousel-item-next.carousel-item-left .carousel-caption,
    .carousel-fade .carousel-item-prev.carousel-item-right .carousel-caption {
        opacity: 1;
    }

    .carousel-fade .carousel-item.active,
    .carousel-fade .carousel-item-next.carousel-item-left,
    .carousel-fade .carousel-item-prev.carousel-item-right {
        opacity: 1;
    }

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
    opacity: 0;
}

    .carousel-fade .active.carousel-item-left .carousel-caption,
    .carousel-fade .active.carousel-item-right .carousel-caption {
        opacity: 0;
    }

.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
    transform: translateX(0);
    transform: translate3d(0, 0, 0);
}


.pl-0 {
    padding-left: 0;
}

.pr-0 {
    padding-right: 0;
}

.pl-7 {
    padding-left: 7px !important;
}

.pr-7 {
    padding-right: 7px !important;
}

button {
    font-family: 'Poppins_semi_bold';
}

.err_msg {
    font-family: 'poppins-regular';
    font-size: 12px;
    text-align: left;
}

.ipad-db {
    display: none;
}

.viewmore-modal.card {
    border-radius: 0 !important;
    left: 20%;
    right: 20%;
    top: 70px;
    z-index: 999;
    display: none;
    opacity: 1;
    transition: all 0.4s;
    background-color: #ffffff;
    position: fixed;
}

.lightbox-bg {
    z-index: 999;
    display: none;
    opacity: 0.5;
    position: fixed;
    top: 0px;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000000 !important;
}

.viewmore-modal .right {
    padding: 25px 35px 50px !important;
}

.viewmore-modal .head {
    padding: 0px 0px 30px !important;
}

.color-7b {
    color: #7b7b7b;
}

#border_ol .active .vl {
    border-left: 4px solid #2B9CFF;
    height: 100%;
    border-radius: 99px;
}

#border_ol .vt {
    margin-left: 15px;
}

.projectpage .header {
    padding: 0 !important;
}

.projectLogo {
    padding: 18px 24px;
}

.topbar {
    margin-top: 24px;
    padding: 24px 24px;
}

.btn-controller.mainpage-btn {
    margin-left: 50px;
}

.round-profile {
    margin-right: 30px;
}


/*modal*/
.modal-content .br-5 {
    border-radius: 10px;
}

.modal_data {
    padding: 20px 30px;
}

.x-icon {
    position: absolute;
    top: 10px;
    right: 20px;
}

.header_modal {
    padding-bottom: 40px;
}

.modal_data .detail {
    padding-left: 20px;
}

    .modal_data .detail .title {
        font-size: 14px;
        color: #878787;
        font-family: 'poppins-regular';
        font-weight: 400px;
    }

    .modal_data .detail .content {
        font-size: 16px;
        color: #424242;
        font-family: 'poppins-regular';
        font-weight: 400px;
    }

.mb-40 {
    margin-bottom: 20px;
}

.modal_img {
    object-fit: cover;
}

.view_detail {
    background-color: #0F8FFF;
    color: white;
    font-family: 'poppins_semi_bold';
    border-radius: 5px;
    font-size: 16px;
    line-height: 27px;
    float: right;
}

.select-toggle select option {
    font-family: Poppins-regular;
}

#sidebar .sidebar-submenu.pl-50 {
    padding-left: 58px;
}

#sidebar .submenu a.active {
    color: #2895EA !important;
    font-family: poppins_semi_bold !important;
    text-decoration: none;
    background-color: transparent !important;
    border-left: 4px solid #2B9CFF !important;
    padding: 8px 13px 8px 20px !important;
}

#sidebar .submenu a:active {
    color: #2895EA !important;
    font-family: poppins_semi_bold !important;
    text-decoration: none;
    background-color: transparent !important;
}

#sidebar .submenu a:hover {
    color: #2895EA !important;
    text-decoration: none;
    background-color: transparent !important;
}

#sidebar .uncollapse.pb-sm-12 {
    padding: 30px 0px 0px 25px;
}


.project-mblscroll {
    height: 100%;
    overflow-y: scroll;
    -ms-overflow-style: none;
    / IE and Edge / scrollbar-width: none;
    / Firefox /
}



/* Media queries */

/* large screen media */
@media screen and (min-width: 1600px) and (max-width: 1680px) {
    .projectpage .nav-pills a {
        margin-right: 50px;
        margin-left: 40px !important;
    }
}

@media screen and (min-width: 1681px) {

    .projectpage #sidebar.active .side-toggle {
        top: 123px !important;
    }

    .projectLogo {
        padding: 24px 24px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 50px;
        margin-left: 136px !important;
    }

    .projectpage #sidebar .side-toggle {
        position: absolute;
        left: 248px;
        top: 130px !important;
    }

    .btn-controller.mainpage-btn {
        margin-left: 128px !important;
    }

    .round-profile {
        margin-right: 44px !important;
    }

    .search input {
        padding-left: 10% !important;
        border: 1px solid #B7C9D9;
    }

    .search img {
        position: absolute;
        top: 24%;
        left: 6% !important;
    }

    .carousel-caption {
        font-size: 42px !important;
        letter-spacing: 0.055em !important;
        line-height: 84px !important;
        color: white;
        top: 60%;
    }

    .login_section p {
        font-family: 'poppins_medium';
        font-size: 24px !important;
        line-height: 47px !important;
        letter-spacing: 0.025em;
        margin-top: 50px;
        margin-bottom: 50px;
        color: #2B2B2B;
    }

    .input_field input {
        border: 0;
        font-family: 'poppins_medium';
        font-size: 14px;
        line-height: 21px;
        color: rgba(0, 0, 0, 0.39);
    }

    .input_field label {
        font-family: 'poppins_medium';
        font-size: 16px;
        line-height: 24px;
        color: #2B2B2B;
    }

    .form_title {
        font-family: 'poppins_medium';
        font-style: normal;
        font-weight: 500;
        font-size: 18px;
        line-height: 196%;
        color: #878787;
    }

    .login_section .pb_20 {
        padding-bottom: 10px;
    }

    .login_section .pt_20 {
        padding-top: 30px;
    }

    .login_btn {
        background-color: #0F8FFF;
        color: white;
        font-family: 'poppins_semi_bold';
        border-radius: 5px;
        font-size: 18px;
        line-height: 27px;
        float: right;
        padding: 14px 40px;
    }

    /* landing page */
    .block svg {
        position: absolute;
        top: 5% !important;
        right: 5% !important;
        width: 45px !important;
        height: 45px !important;
    }

    .block p {
        font-size: 28px !important;
        line-height: 42px !important;
        color: #636363;
        font-family: 'poppins_medium';
        position: absolute;
        bottom: 0% !important;
        left: 5% !important;
    }

    .h-50vh {
        height: 42vh;
        overflow: hidden;
    }

    .btn-controller {
        border: 1px solid rgba(72, 121, 165, 1) !important;
        padding: 12px 20px;
        background-color: transparent !important;
        margin-right: 30px;
        border-radius: 10px;
        font-family: 'poppins-regular';
    }

        .btn-controller.mainpage-btn {
            margin-left: 50px !important;
        }

    .round-profile {
        margin-right: 50px !important;
    }

    .fontsize-18 {
        font-size: 18px !important;
    }
}

@media screen and (min-width: 1440px) {
    /*modal*/
    .view_detail {
        font-size: 18px !important;
    }

    .modal-content .br-5 {
        border-radius: 10px !important;
    }

    .modal_data {
        padding: 20px 30px !important;
    }

    .x-icon {
        position: absolute;
        top: 10px !important;
        right: 20px !important;
    }

    .header_modal {
        padding-bottom: 50px !important;
    }

    .modal_data .detail {
        padding-left: 25px !important;
    }

        .modal_data .detail .title {
            font-size: 15px;
            color: #878787;
            font-family: 'poppins-regular';
            font-weight: 400px;
        }

        .modal_data .detail .content {
            font-size: 18px !important;
            color: #424242;
            font-family: 'poppins-regular';
            font-weight: 400px;
        }

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

    .modal_img {
        object-fit: cover;
    }
}

@media screen and (min-width: 1439px) and (max-width: 1445px) {
    .projectpage #sidebar.active .side-toggle {
        top: 125px !important;
    }

    .projectLogo {
        padding: 24px 24px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 50px;
        margin-left: 0px !important;
    }

    .btn-controller.mainpage-btn {
        margin-left: 128px !important;
    }

    .round-profile {
        margin-right: 44px !important;
    }

    .search input {
        padding-left: 10% !important;
        border: 1px solid #B7C9D9;
    }

    .search img {
        position: absolute;
        top: 24%;
        left: 6% !important;
    }

    .carousel-caption {
        font-size: 42px;
        letter-spacing: 0.055em;
        line-height: 84px;
        color: white;
        top: 60%;
    }

    .login_section p {
        font-family: 'poppins_medium';
        font-size: 24px;
        line-height: 47px;
        letter-spacing: 0.025em;
        margin-top: 50px;
        margin-bottom: 50px;
        color: #2B2B2B;
    }

    .input_field input {
        border: 0;
        font-family: 'poppins_medium';
        font-size: 14px;
        line-height: 21px;
        color: rgba(0, 0, 0, 0.39);
    }

    .input_field label {
        font-family: 'poppins_medium';
        font-size: 16px;
        line-height: 24px;
        color: #2B2B2B;
    }

    .form_title {
        font-family: 'poppins_medium';
        font-style: normal;
        font-weight: 500;
        font-size: 18px;
        line-height: 196%;
        color: #878787;
    }

    .login_section .pb_20 {
        padding-bottom: 10px;
    }

    .login_section .pt_20 {
        padding-top: 30px;
    }

    .login_btn {
        background-color: #0F8FFF;
        color: white;
        font-family: 'poppins_semi_bold';
        border-radius: 5px;
        font-size: 18px;
        line-height: 27px;
        float: right;
        padding: 14px 40px;
    }

    .block svg {
        position: absolute;
        top: 5% !important;
        right: 5% !important;
        width: 45px !important;
        height: 45px !important;
    }

    .block p {
        font-size: 28px !important;
        line-height: 42px !important;
        color: #636363;
        font-family: 'poppins_medium';
        position: absolute;
        bottom: 0% !important;
        left: 5% !important;
    }

    .h-50vh {
        height: 42vh;
        overflow: hidden;
    }

    .btn-controller {
        border: 1px solid rgba(72, 121, 165, 1) !important;
        padding: 12px 20px;
        background-color: transparent !important;
        margin-right: 30px;
        border-radius: 10px;
        font-family: 'poppins-regular';
    }

        .btn-controller.mainpage-btn {
            margin-left: 50px !important;
        }

    .round-profile {
        margin-right: 50px !important;
    }

    .fontsize-18 {
        font-size: 18px !important;
    }

    .projectpage #sidebar .side-toggle {
        position: absolute;
        left: 248px;
        top: 132px !important;
    }
}
/* large screen media end */

/* extra small screen */
@media screen and (min-width: 200px) and (max-width: 374px) {

    .err_msg {
        text-align: center !important;
    }

    .fontsize-28 {
        font-size: 15px;
    }

    .fontsize-42 {
        font-size: 31px;
    }

    .fontsize-24 {
        font-size: 19px;
    }

    .fontsize-20 {
        font-size: 15px;
    }


    .fontsize-14 {
        font-size: 13px;
    }

    .fontsize-18 {
        font-size: 14px;
    }

    .header {
        background: #FFFFFF !important;
        padding: 18px 30px;
    }

    .btn-controller,
    .help {
        display: none;
    }

    #content {
        background: #F3F8FC !important;
        border-radius: 0px !important;
        padding: 20px 30px 30px 30px !important;
    }

    .login_section {
        position: relative;
        text-align: center;
        height: 60vh !important;
    }

    .carousel .slide_image {
        height: 40vh !important;
    }

    .input_field label {
        margin: 0 !important;
    }

    .login_btn {
        float: inherit;
        font-size: 16px;
        line-height: 27px;
        padding: 10px 30px;
    }

    .form_title {
        padding-top: 15px !important;
    }

    .btn-logoutxs .mr-70 {
        margin-right: 41px !important;
    }
}

@media (max-width: 322px) {
    .projectLogo {
        padding: 18px 19px !important;
    }

        .projectLogo .fontsize-24 {
            font-size: 16px !important;
        }

    .project-headerlogo {
        width: 36px !important;
        height: 36px !important;
    }

    .round-profile {
        margin-right: 14px !important;
    }
}

/* extra small screen end */


/* mobile screen (less then ipad)*/
@media screen and (max-width: 767px) {

    .forgot_pwd {
        font-size: 12px !important;
        line-height: 4;
        text-align: left !important;
        color: rgba(0, 0, 0, 0.5) !important;
    }

    .modal-open {
        overflow: hidden;
        height: 100vh !important;
    }

    .view_detail {
        font-size: 12px !important
    }

    .modal_data .detail .content {
        font-size: 12px !important;
    }

    .modal_data .detail .title {
        font-size: 14px !important;
    }

    .header_modal {
        padding-bottom: 20px !important;
    }

    .modal_data {
        padding: 10px 16px !important;
    }

    .modal_img {
        object-fit: cover;
        height: 350px !important;
    }

    .height_scroll {
        height: 100% !important;
        /* overflow-y: scroll;*/
        overflow: auto;
    }

        .height_scroll.active {
            height: 100vh !important;
            overflow: hidden !important;
        }

    .navvitems .fontsize-14 {
        font-size: 14px !important;
    }

    .projectLogo .fontsize-24 {
        font-size: 18px !important;
    }

    .btn-controller.mainpage-btn {
        margin-left: 0px !important;
        border-radius: 10px !important;
        padding: 8px 6px 6px !important;
    }

    .project-headerlogo {
        width: 40px !important;
        height: 40px !important;
    }

    .ps_0 {
        padding: 0px;
    }

    .psm_12 {
        padding-left: 12% !important;
    }

    .err_msg {
        text-align: center !important;
    }

    /* .toggle-icon1,
  .toggle-icon2{
    display: block !important;
  }*/
    /*
  .components {
    opacity: 0;
  }*/

    .lightbox-bg {
        z-index: 999;
        display: none;
        opacity: 0.5;
        position: fixed;
        top: 76px !important;
        right: 0;
        bottom: 0;
        left: 0;
        background-color: #000000 !important;
    }

    .btn-logoutxs .mr-70 {
        margin-right: 70px;
    }

    .btn-logoutxs button {
        background: transparent;
        border: none !important;
    }

        .btn-logoutxs button img {
            width: 20px;
            height: 19.53px;
            margin-right: 8px;
        }

    .btn-logoutxs {
        bottom: 85px;
        left: 12px;
        right: 12px;
        position: absolute;
    }




    .sidebar-submenu.pl-50 {
        padding-left: 58px;
    }


    .fontsize-28 {
        font-size: 15px;
    }

    .fontsize-42 {
        font-size: 31px;
    }

    .fontsize-24 {
        font-size: 20px;
    }

    .fontsize-20 {
        font-size: 15px;
    }

    .fontsize-14 {
        font-size: 13px;
    }

    .fontsize-18 {
        font-size: 14px;
    }

    .header {
        background: #FFFFFF !important;
        padding: 13px 30px !important;
    }

    .btn-controller,
    .help {
        display: none;
    }

    #content {
        background: #F3F8FC !important;
        border-radius: 0px !important;
        padding: 20px 15px 15px 15px !important;
    }

    .login_section {
        position: relative;
        padding: 0px 15px;
        text-align: center;
        height: 55vh;
        top: 60% !important;
    }

    .form_title {
        padding-top: 15px;
    }

    .input_field {
        text-align: left;
    }

    .carousel .slide_image {
        height: 45vh;
    }

    .slider {
        padding-left: 0;
    }

    .carousel-caption {
        font-size: 16px;
        line-height: 34px;
        text-align: center;
    }

    .clientlogo_img {
        position: absolute;
        top: 5%;
        right: 2%;
        z-index: 999999;
    }

        .clientlogo_img img {
            height: 40px;
            width: 40px;
        }

    .eye_icon {
        position: absolute;
        top: 40%;
        right: 5%;
    }

    .round-profile {
        width: 37px !important;
        height: 37px !important;
    }

    .help1 {
        display: none;
    }

    .ipad-hide {
        display: none;
    }

    .navvitems {
        padding: 0 26px 15px 15px;
    }

    .ipad-db {
        display: block !important;
        background: #FAFCFE;
        padding: 15px 15px 0px;
        flex-wrap: nowrap !important;
        overflow-x: scroll;
        overflow-y: hidden;
        width: 100%;
    }

    .sidebar-scroll {
        min-height: 85vh !important;
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 85vh;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px;
    }

    .project-headerlogo {
        margin-right: 10px !important;
    }

    .row.mbl-view {
        padding: 15px 29px 15px 12px;
        margin-bottom: 0px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 21px !important;
        padding-right: 0px !important;
        padding-left: 0px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    .fontsize-15 {
        font-size: 13px !important;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px !important;
        height: 27px !important;
        width: 20px !important;
    }

    .projectpage ul.nav.nav-pills.tab-row {
        flex-wrap: nowrap !important;
    }

    .search img {
        top: 24%;
        left: 10%;
        width: 16px;
        height: 16px;
        margin-right: 7px;
    }

    .search input {
        padding-left: 16%;
        border: 1px solid #B7C9D9;
    }

    .mr-4.d-flex {
        margin-right: 0rem !important;
    }

    .search input::placeholder {
        font-size: 12px !important;
    }

    .mt-25 {
        margin-top: 20px;
    }

    .btn-search {
        padding: 6px 16px !important;
        margin-right: 1rem !important;
        height: 100%;
    }

    .filter-toggle img {
        width: 24px;
        height: 24px;
    }

    .filter-toggle {
        padding: 0px 10px;
    }

    .mb-23 {
        margin-bottom: 23px;
    }

    .current-projects .mb-20 {
        margin-bottom: 16px !important;
    }

    .select-toggle select {
        background-color: #E7F0F8 !important;
    }

    .select-toggle .pr-10 {
        padding-right: 10px !impor%;
        right: 5%;
    }

    .round-profile {
        width: 37px !important;
        height: 37px !important;
    }

    .help1 {
        display: none;
    }

    .ipad-hide {
        display: none;
    }

    .navvitems {
        padding: 0 26px 15px 15px;
    }

    .ipad-db {
        display: block !important;
        background: #FAFCFE;
        padding: 15px 15px 0px;
        flex-wrap: nowrap !important;
        overflow-x: scroll;
        overflow-y: hidden;
        width: 100%;
    }

    .sidebar-scroll {
        min-height: 85vh !important;
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 85vh;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px;
    }

    .project-headerlogo {
        margin-right: 10px !important;
    }

    .row.mbl-view {
        padding: 15px 29px 15px 12px;
        margin-bottom: 0px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 21px !important;
        padding-right: 0px !important;
        padding-left: 0px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
    }

    .fontsize-15 {
        font-size: 13px !important;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px !important;
        height: 27px !important;
        width: 20px !important;
    }

    .projectpage ul.nav.nav-pills.tab-row {
        flex-wrap: nowrap !important;
    }

    .search img {
        top: 24%;
        left: 10%;
        width: 16px;
        height: 16px;
        margin-right: 7px;
    }

    .search input {
        padding-left: 16%;
        border: 1px solid #B7C9D9;
    }

    .mr-4.d-flex {
        margin-right: 0rem !important;
    }

    .search input::placeholder {
        font-size: 12px !important;
    }

    .mt-25 {
        margin-top: 20px;
    }

    .btn-search {
        padding: 6px 16px !important;
        margin-right: 1rem !important;
        height: 100%;
    }

    .filter-toggle img {
        width: 24px;
        height: 24px;
    }

    .filter-toggle {
        padding: 0px 10px;
    }

    .mb-23 {
        margin-bottom: 23px;
    }

    .current-projects .mb-20 {
        margin-bottom: 16px !important;
    }

    .select-toggle select {
        background-color: #E7F0F8 !important;
    }

    .select-toggle .pr-10 {
        padding-right: 10px !important;
    }

    .current-projects {
        padding: 15px;
    }

    .mb-sm-25 {
        margin-bottom: 25px;
    }

    .select-toggle .select-arrow {
        bottom: 13px;
        right: 9px;
        width: 15.1px;
        height: 8px;
        object-fit: cover;
    }

    .select-toggle.mb-10 {
        margin-bottom: 0px !important;
        background: #E7F0F8 !important;
        padding: 15px 15px 0 15px;
    }

    .mb-25 {
        margin-bottom: 25px;
    }

    .current-projects .card img {
        height: auto;
    }

    .current-projects .card .arrow-right {
        width: 20px !important;
        height: 20px !important;
    }

    .current-projects .card .card-body {
        padding: 13px !important;
    }

    #filterCollapse svg {
        width: 20px;
        height: 20px;
    }

    .btn-controller {
        font-size: 12px;
        padding: 8px 6px !important;
        margin-right: 20px !important;
        border-radius: 4px !important;
    }


    .projectpage #content {
        padding: 0px 0px 0px !important;
        overflow: hidden !important;
        /*margin-right: -200px;*/
    }

    .fontsize-16 {
        font-size: 13px;
    }

    #sidebar.active {
        min-width: 280px;
        max-width: 280px;
        margin-left: 0px !important;
        border-radius: 0 !important;
        left: 0;
        top: 70px;
        z-index: 99999;
        opacity: 1;
        /*transition: all 0.4s;*/
        transition: margin 0.4s;
        height: 100vh;
        background-color: #ffffff;
        position: fixed;
        padding-top: 18px;
        padding-bottom: 20px;
    }

    #sidebar {
        margin-left: -280px !important;
        padding-top: 18px;
        padding-bottom: 20px;
        width: 280px;
        border-radius: 0 !important;
        left: 0;
        top: 70px;
        z-index: 99999;
        opacity: 1;
        /* transition: all 0.4s;*/
        transition: margin 0.4s;
        height: 100vh;
        background-color: #ffffff;
        position: fixed;
    }

    #sidebarCollapse1 {
        display: block !important;
    }

    #content.active #sidebarCollapse1 {
        display: none !important;
    }



    .projectpage #sidebar.active {
        margin-left: 0px !important;
    }

    .bullet.active, .bullet:hover {
        color: #4879A5 !important;
        font-family: 'poppins_medium' !important;
    }

    .bullet {
        color: #4879A5 !important;
    }

    #sidebar .dropdown-item.active {
        color: #2895EA !important;
        font-family: 'poppins_medium' !important;
        text-decoration: none;
        background-color: transparent !important;
        border-left: 4px solid #2B9CFF !important;
        padding: 8px 13px 8px 20px !important;
    }

    #sidebar .dropdown-item:active {
        color: #2895EA !important;
        font-family: 'poppins_medium' !important;
        text-decoration: none;
        background-color: transparent !important;
        /*   padding: 8px 13px 8px 20px !important;*/
    }

    .projectpage #content .side-toggle {
        position: absolute;
        left: -4px;
        top: 3px;
        z-index: 99999;
    }

    body.modal-open .projectpage #content .side-toggle {
        z-index: 0 !important;
    }

    .projectpage .side-toggle img {
        transform: rotate(180deg) !important;
        object-fit: cover;
    }

    .projectpage #sidebar.active .side-toggle img {
        transform: rotate(0deg) !important;
        object-fit: cover;
    }

    .projectpage #sidebar.active .side-toggle {
        /* top: 96px !important;*/
        top: 11.4% !important;
        left: 243px !important;
    }

    .side-toggle img {
        width: 43px;
        height: 41px;
    }

    #sidebar #sidebarCollapse {
        display: none !important;
    }

    #sidebar.active #sidebarCollapse {
        display: block !important;
    }

    #sidebar .side-toggle {
        margin-right: 0px !important;
        margin-top: 0px !important;
    }

    #sidebar.active .side-toggle {
        left: 243px !important;
        top: 27px !important;
    }

    .landing-page .side-toggle {
        left: -6px;
        top: 17px;
        position: absolute;
        z-index: 999999;
    }

        .landing-page .side-toggle img {
            transform: rotate( 180deg) !important;
            object-fit: cover;
        }

    #sidebar.active .side-toggle img {
        display: block !important;
    }

    #sidebar.active .side-toggle img {
        transform: rotate(0deg) !important;
        object-fit: cover;
    }

    #sidebar .side-toggle img {
        transform: rotate(180deg) !important;
        object-fit: cover;
    }

    .lightbox-bg.dn.active {
        display: block;
    }

    .lightbox-bg.dn {
        display: none;
    }
}
/* mobile screen end */

/* ipad  
  KC - Medium devices (tablets, 768px and up) and maxwidth 992px 

*/

@media screen and (min-width: 768px) and (max-width: 1023px) {
    .btn-search {
        padding: 6px 36px !important;
        margin-right: 1rem !important;
    }

    .fontsize-16 {
        font-size: 16px;
        line-height: 24px;
    }

    .fontsize-20 {
        font-size: 20px;
        line-height: 30px;
    }

    .fontsize-15 {
        font-size: 15px;
        line-height: 22px;
    }

    .mb-sm-25 {
        margin-bottom: 25px;
    }

    .fontsize-28 {
        font-size: 18px;
    }

    .fontsize-42 {
        font-size: 34px;
    }

    .fontsize-24 {
        font-size: 18px;
    }

    .fontsize-20 {
        font-size: 14px;
    }

    .fontsize-16 {
        font-size: 14px;
    }

    .fontsize-14 {
        font-size: 14px;
    }

    .fontsize-18 {
        font-size: 15px;
    }

    .login_section {
        position: relative;
        padding: 0px 100px;
        text-align: center;
        height: 50vh;
        top: 55%;
        z-index: 9999;
    }

    .form_title {
        font-size: 20px;
    }

    .input_field {
        text-align: left;
    }

    .forgot_pwd {
        text-align: left;
        font-size: 16px;
    }

    .login_btn {
        padding: 12px 40px;
    }

    .carousel .slide_image {
        height: 50vh;
    }

    .slider {
        padding-left: 0;
    }

    .carousel-caption {
        font-size: 24px;
        line-height: 48px;
        text-align: center;
    }

    .clientlogo_img {
        position: absolute;
        top: 5%;
        right: 2%;
        z-index: 999999;
    }

    .block p {
        font-size: 20px !important;
        line-height: 25px !important;
    }

    .block svg {
        width: 35px !important;
        height: 35px !important;
    }

    .round-profile {
        width: 37px !important;
        height: 37px !important;
    }

    .help1 {
        display: none;
    }

    .ipad-hide {
        display: none;
    }

    .ipad-db {
        display: block !important;
        margin-bottom: 10px;
        margin-top: 10px;
    }

    .projectpage #sidebar.active .side-toggle {
        position: absolute;
        left: -9px;
        top: 180px !important;
        z-index: 999999999;
    }

    .projectpage #sidebar .side-toggle {
        left: 248px;
        top: 186px !important;
    }
    /*
  .projectpage #sidebar.active {
    margin-left: -260px !important;
  }*/

    .sidebar-scroll {
        min-height: 85vh !important;
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 85vh;
    }

    .project-headerlogo {
        margin-right: 15px;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px;
    }

    .project-headerlogo {
        margin-right: 15px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 31px !important;
        padding-right: 0px !important;
        padding-left: 0px !important;
        font-size: 12px !important;
    }

    .fontsize-15 {
        font-size: 13px !important;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px !important;
        height: 27px !important;
        width: 20px !important;
    }

    .projectpage ul.nav.nav-pills.tab-row {
        flex-wrap: nowrap !important;
        justify-content: center;
    }

    .search img {
        top: 24%;
        left: 10%;
        width: 16px;
        height: 16px;
        margin-right: 7px;
    }

    .search input {
        padding-left: 16%;
        border: 1px solid #B7C9D9;
    }

        .search input::placeholder {
            font-size: 14px !important;
        }

    .mt-25 {
        margin-top: 20px;
    }

    .btn-search {
        padding: 6px 20px;
        height: 100%;
    }

    .filter-toggle img {
        width: 24px;
        height: 24px;
    }

    .filter-toggle {
        padding: 0px 10px;
    }

    .mb-23 {
        margin-bottom: 23px;
    }

    .current-projects .mb-20 {
        margin-bottom: 16px !important;
    }

    .select-toggle select {
        box-sizing: border-box;
        border-radius: 10px !important;
        appearance: none;
    }

    .select-toggle .select-arrow {
        bottom: 13px;
        right: 9px;
        width: 15.1px;
        height: 8px;
        object-fit: cover;
    }

    .select-toggle.mb-10 {
        margin-bottom: 10px;
    }

    .mb-25 {
        margin-bottom: 25px;
    }

    .current-projects .card img {
        height: auto;
    }


    .current-projects .card .arrow-right {
        width: 20px !important;
        height: 20px !important;
    }

    .current-projects .card .card-body {
        padding: 13px !important;
    }

    #filterCollapse svg {
        width: 20px;
        height: 20px;
    }

    .projectpage #content {
        padding: 29px 30px 180px !important;
    }
}
/* ipad end */


/* ipad pro
KC - // Large devices (desktops, 992px and up) and Maxwidth - 1200px

*/
@media screen and (min-width: 1024px) and (max-width: 1200px) {
    .mb-25-lg {
        margin-bottom: 25px;
    }

    .round-profile {
        margin-right: 37px !important;
    }

    .btn-search {
        padding: 6px 17px 6px 17px !important;
        margin-right: 1rem !important;
        height: 100%;
    }

    .fontsize-42 {
        font-size: 37px;
    }

    .fontsize-16 {
        font-size: 13px;
    }

    .fontsize-24 {
        font-size: 19px;
    }

    .fontsize-20 {
        font-size: 17px;
    }

    .fontsize-28 {
        font-size: 21px;
    }

    .fontsize-14 {
        font-size: 14px;
    }

    .fontsize-18 {
        font-size: 16px;
    }

    .login_section {
        position: relative;
    }

    .form_title {
        padding-top: 30px;
        font-size: 20px;
    }

    .forgot_pwd {
        font-size: 16px;
    }

    .carousel .slide_image {
        height: 100vh;
    }

    .slider {
        padding-left: 0;
    }

    .carousel-caption {
        font-size: 24px;
        line-height: 48px;
        text-align: center;
        top: 60%;
    }

    .login_btn {
        padding: 12px 40px;
    }

    .btn-controller.mainpage-btn {
        margin-left: 11px !important;
        margin-right: 11px !important;
        padding: 10px 11px !important;
        font-size: 15px !important;
    }

    .sidebar-scroll {
        min-height: 85vh !important;
        overflow-y: scroll;
        overflow-x: hidden;
        max-height: 85vh;
    }

    .project-headerlogo {
        margin-right: 15px;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px;
    }

    .project-headerlogo {
        margin-right: 15px !important;
    }

    .projectpage .nav-pills a {
        margin-right: 19px !important;
        padding-right: 0px !important;
        padding-left: 0px !important;
        font-size: 12px !important;
    }

    .fontsize-15 {
        font-size: 13px !important;
    }

    .projectpage .nav-pills a svg {
        margin-right: 7px !important;
        height: 27px !important;
        width: 20px !important;
    }

    .projectpage ul.nav.nav-pills.tab-row {
        flex-wrap: nowrap !important;
    }

    .search img {
        position: absolute;
        top: 24%;
        left: 10%;
        opacity: 0.5;
        width: 20px;
        height: 20px;
        cursor: pointer;
        margin-right: 7px;
    }

    .search input {
        padding-left: 16%;
        border: 1px solid #B7C9D9;
    }

        .search input::placeholder {
            font-size: 16px;
        }

    .btn-search {
        padding: 6px 20px;
        height: 100%;
    }

    .filter-toggle img {
        width: 24px;
        height: 24px;
    }

    .filter-toggle {
        padding: 0px 10px;
    }

    .mb-23 {
        margin-bottom: 23px;
    }

    .current-projects .mb-20 {
        margin-bottom: 20px;
    }

    .select-toggle select {
        box-sizing: border-box;
        border-radius: 10px !important;
        appearance: none;
    }

    .select-toggle .select-arrow {
        bottom: 13px;
        right: 9px;
        width: 15.1px;
        height: 8px;
        object-fit: cover;
    }

    .select-toggle.mb-10 {
        margin-bottom: 10px;
    }

    .mb-25 {
        margin-bottom: 25px;
    }

    .current-projects .card img {
        height: auto;
        object-fit: cover;
    }


    .current-projects .card .arrow-right {
        width: 20px;
        height: 20px;
    }

    .current-projects .card .card-body {
        padding: 13px !important;
    }

    #filterCollapse svg {
        width: 20px;
        height: 20px;
    }
}
/* ipad pro end */


@media screen and (min-width: 1270px) and (max-width: 1280px) {
    .pt_12 {
        padding-top: 10px !important;
    }

    .input_field label {
        font-size: 15px !important;
        line-height: 14px !important;
    }

    .pb_20 {
        padding-bottom: 10px !important;
    }

    .btn-controller.mainpage-btn {
        margin-left: 30px !important;
    }

    .projectLogo {
        padding: 18px 19px !important;
    }
}



/*@media (max-width: 767px) {
  #sidebar {
    margin-left: -250px;
  }

  #sidebar.active {
    margin-left: 0;
  }

  #sidebarCollapse span {
    display: none;
  }
}*/



/* iPad pro portrait mode*/

@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
    .col-lg-5, .col-lg-7 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .login_section {
        padding: 100px 200px 0px 200px !important;
        height: 50vh !important;
        text-align: center;
    }

    .carousel .slide_image {
        height: 50vh !important;
    }

    .carousel-caption {
        font-size: 36px !important;
        line-height: 70px;
        text-align: center;
        top: 52% !important;
    }

    .form_title .pt-20 {
        padding-top: 30px !important;
    }

    .form_title .pb-20 {
        padding-bottom: 30px !important;
    }

    .input_field, .forgot_pwd {
        text-align: left !important;
    }

    .forgot_pwd {
        line-height: 3.5 !important;
    }
}
/* iPad pro portrait mode*/