﻿@font-face {
    font-family: OpenSans;
    src: url('../fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf');
}

@font-face {
    font-family: SyntaxLight;
    src: url('../fonts/Syntax LT Std Roman.otf');
    
    /*    unicode-range: U+0000-024F, U+1E00-1EFF, U+2C60-2C7F, U+A720-A7FF;
*/
}

/*--------------------------------------------------------------*/



*, p {
    font-family: OpenSans;
}

h5 {
    font-family: SyntaxLight;
}

:root {
    --primaryBackground: #A07D2D;
    --primaryText: #000000;
    --secondaryBackground: #F8F8F8;
    --secondaryText: #413E4B;
    /*--------------------------*/
    --green-color1: #00B02C;
    --blue-color1: #2D46A0;
    --purble-color1: #932DA0;
    --light-blue1: #3E00FF;
    --grey-color1: #6D6F71;
    --red-color1: #FF634F;
    /*----------------------------*/
    --semon-color: #FFE7C5;
    --green-color: #B3FFC7;
    --blue-color: #C7DDFF;
    --purble-color: #FCE0FF;
    --light-blue: #D4C7FF;
    --grey-color: #A7A9AC;
    --yellow-color: #FFFCAF;
    --red-color: #FFBEB5;
    --offwhite-color: #FFF9EB;
    /*-----------------buttons color---------------*/
    --next-btn-color: #A07D2D;
    --next-btn--hover: #875E00;
    --active-btn-color: #EDEDEE;
    --active-btn-border: #A7A9AC;
    --active-tab-color: #2D89A0;
    --active-tab-hover: #D5E7EC;
    --active-tab-border: #81B8C6;
    --export-btn-color: #2D46A0;
    --export-btn-hover: #002199;
    --search-btn-color: #A07D2D;
    --search-btn-hover: #875E00;
}
body {
    background-color: #f7f7f7;
    font-family: OpenSans;
}
.sl-nav {
    display: inline;
}

    .sl-nav ul {
        margin: 0;
        padding: 0;
        list-style: none;
        position: relative;
        display: inline-block;
    }

    .sl-nav li {
        cursor: pointer;
        color: #FFFFFF;
        margin-top: 17px;
        padding: 7px 7px 2px 7px;
    }

        .sl-nav li ul {
            display: none;
        }

        .sl-nav li:hover ul {
            position: absolute;
            top: 55px;
            display: block;
            background: #fff;
            width: 75px;
            padding-top: 0px;
            z-index: 1;
            border-radius: 5px;
            box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
        }

        .sl-nav li:hover .triangle {
            position: absolute;
            top: 42px;
            z-index: 10;
            height: 14px;
            overflow: hidden;
            width: 30px;
            background: transparent;
        }

            .sl-nav li:hover .triangle:after {
                content: '';
                display: block;
                z-index: 20;
                width: 15px;
                transform: rotate(45deg) translateY(10px) translateX(0px);
                height: 15px;
                background: #fff;
                border-radius: 2px 0px 0px 0px;
                box-shadow: 0px 0px 20px rgba(0,0,0,0.2);
            }

        .sl-nav li ul li {
            position: relative;
            text-align: left;
            background: transparent;
            padding: 0px 15px;
            padding-bottom: 0;
            z-index: 2;
            font-size: 15px;
            color: #3c3c3c;
        }

            .sl-nav li ul li:last-of-type {
                padding-bottom: 15px;
            }

            .sl-nav li ul li span {
                padding-left: 5px;
            }

                .sl-nav li ul li span:hover, .sl-nav li ul li span.active {
                    color: #146c78;
                }

.sl-flag {
    display: inline-block;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
    width: 15px;
    height: 15px;
    background: #aaa;
    border-radius: 50%;
    position: relative;
    top: 2px;
    overflow: hidden;
}

.ar-SA {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB0AAAAUCAIAAAD+/qGQAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAQuSURBVDhPlVXLbttGFJ3h8CHqYT0tqVLtwk4Ux0aTFl543X1/Lt/S7gt0U6DopmgKBC2QwHYcy3qYFsU3OSR77lAqsuim5GB0eWfmzLnn3hlx9j37j6dgrFR9rno0uTeyvROezxucaBhVNuGOesN+Z9CsNxVkCcCyKPFbFp8ZOXrVJL5L4BZ5QbbyMBqiOcHSd+/cYBUS7sXpxezo+aB3SAsUblEABogwsEIBwlAvwSlfrl7YOQ2RC9DrD6vFu+X87Zxwr76+ejV7NeoPZTUR0AXiJKIyl2oRYahomMzzCg99hZ7lmcwRPxeacG/c298+vv/5vVbNBrU0zxKZxDLGQs6EhsY10AAdYGGCxjTBdUPTNain+OFT13SYXux58TZMw5z0QsBMsBmbDqfD/tC0THgxtWk1u3a3abVsw0Zo8GhcdOvdltVq1Q5aVlPXDEMz0B82DxtmAzBu6KYyJSX8Yjv3NjcbwZ6zyXAy7AHXwD6WYZ30T58NZtP2l71GX3CjbjZquv3yi5eT9nRyMEHfsoDegv98fH7cPQblhbcAriwkcD3g3roaMot9IBPElchKnkspw9RPZCy4aNsHXbvTq/dqohYl0f3T/fX6Zr6Zr/01AnejTZAGggnILUssl0p00kHhKrHUd8m5pgvdwkvCgYCEODCgXZanMPzYD9IwyiLwCJLAjdx1sI7SWGV49+xw6QioIqBvzgEKZS3drHDTPE3zZBtvY5kwXoIgQJMsReXFWbwJN3N37ideKhMqox0sMvsdu3x9ef7ivNluYE9dGCf9EwSO0W2ESF2UEbQDCiIQXLt35ygPrEZYIIE9Pjq30IRzbuomW7HV76u7Xz4J9hUbj8eD/gB5Q6lhW5Qa6sYJHCd0gAsuQeKj+YmP9SCOcqSWxW688ZItKCMgzlA3OgtY8BB4d55GIuBQ0kmgU4DQENdj8PgUOMDKIAMJB4YS+gIORa1rwhSGpnHEq2SB9BkVQ5UokoHpuClK1AEdIymLDJRhXJ5dTjtTQzNxFjAJk3drVOUoQYQhDKT078Vfb356A1DwBbooRZUnzq7YN9++np3N6t0G8ovosPK4d2wbdUi2Tym2xuZ0oGGMWqO23e7X+9Dq2rn+8e0PmcywjW3aYi2cP5yHXxeCjdhoNOwNepZt5SoWAEGNbexCOEhMLXCgjBM8okflokJADTNRyIvtAw4FyEIfQEPfaBkHn1DUh2w4JtxGsw76lXw5XSh0p0Bx6guJmyUrSEQgInyUAYylt9xEG+gOREM3cbILvwyXIXA5u2CnZ6dHJ0edXociVZceYNDvvkhZHCNlqv1UwTOoRDsXBehjSOnFo2W4/eA5fzqcvWAg2+l27BpuGUoQ3daZMugiRH6rhFUGlc3OQT/KrDoFLAOZPCWK77P9X8i/DXdpuv9rodz+/4exfwD3ovIkADsLqgAAAABJRU5ErkJggg==');
    background-size: cover;
    background-position: center center;
}

.en-US {
    background-size: cover;
    background-position: center center;
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAIAAAAC64paAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTM0A1t6AAABhUlEQVQ4T2Ows82PjGixsc4LD2tysC/09Kjw8622tyuICG8u0w/cpGSCBzF4e1VmZkzw9anOzOj38a4KCW4IC22ECHYk1l9tn4gHMeTlTnZxLikvm+XiUpKW2hvgX+vnV5OVOQEoOGfOtv94AYOzU3Fd7XxHh6Lq6rlurqUx0W0J8Z1AnbW18yotonaYuOJBDBXls4A+bGpaBCTz86YEBtQCvVBSPAPIbY0oP1/aiAcxABU1Ny+2tclvbFjo5FgUF9uenNwNDLnmpkWEnV1TPRcY1O1tS4H6i4umA/0MDK2K8tlAwRqHpP1uoXgQKKraWpcClTY3LQZaCLQ5NaUX5OaWJY3++SeTC/AgBmA4AXUClUJs9ver8fKsAAYEUJCws4G21dXNB1oFdD/Qz8DQTk4C+bm2dn6DZ9bRiDQ8iAEYt8CoBpK5YBIYw0AEEZwSXX4oMB4PYoC6gCzAcDqrjGzEsMfen2xEmbMv1rSTjRi26dqRjShz9o2+6WQjBrSShQSkZAIADvW/HLrLY6cAAAAASUVORK5CYII=');
}
    .theme-brown .navbar {
    background-color: var(--primaryBackground);
     box-shadow: none;
}
.theme-brown .sidebar .menu .list li.active > :first-child i, .theme-brown .sidebar .menu .list li.active > :first-child span {
    color: var(--primaryBackground);
}

.theme-brown .sidebar .legal .copyright a {
    color: var(--primaryBackground) !important;
}

.sidebar2 .user-info {
    background: url('') no-repeat no-repeat;

    display: flex;
    align-items: center;
    justify-content: start;
    height: auto;
}

    .sidebar2 .user-info .info-container {
        cursor: default;
        display: flex;
        position: relative;
        top: 0;
        align-items: center;
      
    }

        .sidebar2 .user-info .info-container .user-helper-dropdown {
             position: relative; 
             right: 0; 
             bottom: 0; 
         
           
        }
        .sidebar2 .user-info .info-container .user-helper-dropdown a {
          
            color: #fff;
        }
         .sidebar2 .user-info .info-container .user-helper-dropdown a:hover {
          
            color: #fff;
        }
.info-box > .content > .h3 {
    color: #fff;
}

.info-box .icon {
    background-color: transparent;
}

.info-box {
    box-shadow: none;
    border-radius: 8px;
    background-color: #fff;
}

    .info-box .icon i {
        color: #fff;
        font-size: 34px;
        line-height: 80px;
    }

.card {
    background: #fff;
    box-shadow: none;
    border-radius: 8px;
}

.btn:not(.btn-link):not(.btn-circle) {
    box-shadow: none;
    border-radius: 4px;
  /*  padding:0 4px;*/
}

.form-group .form-line {
  
    border-bottom: none;
}

.Submit-Btn  {
    display: flex;
    align-items: center;
}
.switch label input[type=checkbox]:checked + .lever:after {
    background-color: var(--primaryBackground);
    box-shadow:none;
}
.switch label input[type=checkbox]:checked + .lever {
    background-color: var(--secondaryBackground);
}



    .sidebar2 .user-info .image {
        margin-right: 12px;
        display: inline-block;
    }

        .sidebar2 .user-info .image img {
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            -ms-border-radius: 50%;
            border-radius: 50%;
            vertical-align: bottom !important;
        }

  

        .sidebar2 .user-info .info-container .name {
            white-space: nowrap;
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: 14px;
            max-width: 200px;
            color: #fff;
        }

        .sidebar2 .user-info .info-container .email {
            white-space: nowrap;
            -ms-text-overflow: ellipsis;
            -o-text-overflow: ellipsis;
            text-overflow: ellipsis;
            overflow: hidden;
            font-size: 12px;
            max-width: 200px;
            color: #fff;
        }

.login-page .login-box .logo {
  
    height: 500px;
    width: 500px;
    border-radius: 8px;
    object-fit: cover;
}
.login-page .login-box .logo {
    height: 100%;
    width: 100%;
  
    object-fit: cover;
}
.login-page {
 
    background-color: transparent;
}

.login-page {
   
    background-color: #fff;
    padding-left: 0;
    max-width: 100%;
    height: 100vw;
    margin: 0 10%;
    overflow: hidden;
}

    .login-page .card {
        background-color: #f3f3f3;
        height: 100%;
        width: 100%;
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .login-page .card .material-icons {
            color: #369a8a;
        }

    .login-page [type="checkbox"].filled-in:checked.chk-col-pink + label:after {
        border: 2px solid #369a8a;
        background-color: #369a8a;
    }
    .login-page .input-group-text {
        
        border: none;
      
    }

.card .body {
    width: 100%;
   
}

.input-group input[type="text"], .input-group .form-control {
    padding-left: 10px;
}

.dropdown-menu[data-bs-popper] {
    top: 100%;
    right: 0;
    left:auto;
    margin-top: 1.125rem !important;
    border-radius: 8px;
}

.sidebar2 .user-info .info-container .user-helper-dropdown a.dropdown-item {
    color: #212529;
}
a.dropdown-toggle {
    cursor: pointer;
    text-decoration: none;
}
.user-info .dropdown-toggle .image {
    height: 40px;
    width: 40px;
    margin-left: 10px;
}
    .user-info  .dropdown-toggle .image img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
.user-info a.dropdown-toggle:after {
    color: #fff;
}

/*---------------------custom table------------------*/
.Custom-table-main{
    margin-top:20px;
}
.Custom-table-main .table th {
    border-bottom: 0;
    border-left: none;
    font-size: 13px;
    color: #fff;
    padding: 18px;
    vertical-align: middle;
}

.Custom-table-main .table tr td {
    border: 1px solid #ededee;
    border-right: 0;
    border-left: 0;
    font-size: 12px;
}

    .Custom-table-main .table tr td span {
        display: flex;
        justify-content: center;
        overflow-x: hidden;
        white-space: nowrap;
        width: 100%;
    }

    .Custom-table-main .table tr td a.btn span {
        overflow-x: visible;
        white-space: normal;
        width: auto;
    }

    .Custom-table-main .table th:first-child, .Custom-table-main .table tr td:first-child { /**/
        border-radius: 8px 0px 0px 8px;
        border-left: 1px solid #ededee;
        border-right: 0;
        text-align: center;
        padding: 18px;
    }
    .Custom-table-main .table th, .Custom-table-main .table tr td { /**/
       width:120px;
    }

    .Custom-table-main .table th:last-child, .Custom-table-main .table tr td:last-child { /**/

        border-radius: 0px 8px 8px 0px;
        border-right: 1px solid #ededee;
        border-left: 0;
        text-align: center;
        padding-right: 12px;
    }

.Custom-table-main .table td {
    border-bottom: 1px solid #ededee !important;
    border-left: none;
    vertical-align: middle;
    background: #fff0;
}

.Custom-table-main table {
    border-collapse: separate;
    border-spacing: 0 6px !important;
}

.Custom-table-main .table tr:last-child td:last-child {
    border-bottom-right-radius: 0px;
}

.Custom-table-main .table tr:last-child td:first-child {
    border-bottom-left-radius: 0px;
}

.Custom-table-main .table tr:first-child td {
    border-top: 1px solid var(--DefaultColor);
}

.Custom-table-main .table tr:last-child td {
    border-bottom: 1px solid var(--DefaultColor);
}

.Custom-table-main .table {
    border: 0;
}

/*.dataTables_filter {
    float: left;
    display: flex;
    align-items: center;
    position: absolute;
    top: 23px;
}*/

.table:not(.table-bordered) > :not(:last-child) > :last-child > * {
    padding: 12px;
}

table.dataTable tfoot td, table.dataTable tfoot th, table.dataTable thead td, table.dataTable thead th,
table.dataTable tbody td, table.dataTable tbody td, table.dataTable tbody td, table.dataTable tbody td {
    text-align: center;
}
table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting:after, table.dataTable thead > tr > td.sorting_asc:after, table.dataTable thead > tr > td.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc_disabled:after, table.dataTable thead > tr > td.sorting_desc_disabled:after {

    color: #fff !important;
    opacity: 1 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
 
    padding: 0.2em 0.7em !important;
}

.switch{
    margin-bottom:20px;
}
.ControlImg .switch {
    margin-bottom: 0;
}
.ImgBlockSett{
    justify-content:space-evenly;
}
.navbar-brand {
    color: #fff !important;
}

table tr td .btn:not(.btn-link):not(.btn-circle) i {
    font-size: 16px !important;
   
}
.login-page1 .body .btn:not(.btn-link):not(.btn-circle) {
    padding: 10px;
}
table {
    width: -webkit-fill-available !important;
}

.dataTables_scrollHeadInner{
    width:100% !important;
}

table.dataTable tbody tr {
    background-color: #92434300;
    box-shadow: 0px 1px 0 .7px #ebebeb;
    border-radius: 8px;
}

/*-------------------------------------------*/
@media(max-width:990px)  {
    .login-page1 {
        margin: 25% auto;
    }
    .login-box {
        display: none;
    }
    .login-page1 {
        height: 100%;
    }
}
@media(max-width:960px)  {
    .login-page1 {
        margin: 25% auto;
    }

    .login-page1 {
        height: 100%;
    }
}
@media(max-width:900px) {
    .login-page1 {
        height: 100%;
    }
        .login-page1 {
        margin: 30% auto;
    }
        .login-box {
        display: none;
    }
}

    @media(max-width:960px) and (max-width:767px) {
        .login-page1 {
            height: 100%;
        }
        .login-page1 {
            margin: 25% auto;
        }

        .login-page {
            overflow: auto;
        }

        .navbar-brand, .login-box {
            display: none;
        }
    }

@media(max-width:767px) {
    .login-page1 {
        height: 100%;
    }

    .login-page1 {
        margin: 40% auto;
    }
}
    .body #account {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .msg {
        font-size: 20px;
        font-weight: 600;
    }

    .body .row.actionsLogin {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .body .row.langLogin {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        position: absolute;
        bottom: 18px;
    }

    .bg-pink {
        background-color: #369a8a !important;
    }

    .card {
        border: none;
    }

    .form-horizontal {
        margin-top: 20px;
        border-bottom: 1px solid #ececec;
    }

    .Submit-Btn1 button {
        margin-top: 0;
        margin-left: 20px;
        margin-right: 20px;
        padding: 6px;
        width: 120px;
    }

    .form-horizontal .form-group {
        margin-bottom: 0;
        display: flex;
        align-items: baseline;
        column-gap: 10px
    }

    .Submit-Btn {
        display: flex;
        align-items: center;
        margin-top: 20px;
    }

        .Submit-Btn .switch, .form-group .switch {
            margin-bottom: 0;
        }

        .Submit-Btn .Submit-Btn, .col-sm-6.d-flex.align-items-center.gap-3 .Submit-Btn {
            margin-top: 0;
        }

    .col-sm-6.d-flex.align-items-center.gap-3 {
        margin-bottom: 0
    }

    .Submit-Btn1 {
        align-items: center;
        display: flex;
        justify-content: start;
        margin-bottom: 20px !important;
    }

    .form-group {
        margin-bottom: 15px;
    }

    .UserPhoto {
        height: 100px;
        width: 100px;
    }

        .UserPhoto img {
            height: 100%;
            width: 100%;
            object-fit: cover;
        }

    div.dataTables_wrapper div.dataTables_filter input {
        min-width: 283px;
        width: 100%;
    }

    .displayImg {
        justify-content: space-between;
    }

    .imgPreview {
        height: 100px;
        width: 100px;
        background: aliceblue;
        border-radius: 10px;
    }

        .imgPreview img {
            height: 100%;
            width: 100%;
            object-fit: cover;
        }

    div.dataTables_processing > div:last-child {
        position: relative;
        width: 80px !important;
        height: 80px !important;
        margin: 2em auto !important;
    }

    div.dataTables_wrapper div.dataTables_processing {
        top: 50%;
        height: 100px !important;
        max-height: 100px !important;
        width: 100px !important;
        margin-left: -100px;
        margin-top: 0;
        border-radius: 50px;
        z-index: 9999;
    }

    label {
        display: inline-block;
        color: #000000;
        margin-bottom: 12px;
        font-weight: 500;
    }

    table.dataTable thead > tr > th.sorting:before, table.dataTable thead > tr > th.sorting:after, table.dataTable thead > tr > th.sorting_asc:before, table.dataTable thead > tr > th.sorting_asc:after, table.dataTable thead > tr > th.sorting_desc:before, table.dataTable thead > tr > th.sorting_desc:after, table.dataTable thead > tr > th.sorting_asc_disabled:before, table.dataTable thead > tr > th.sorting_asc_disabled:after, table.dataTable thead > tr > th.sorting_desc_disabled:before, table.dataTable thead > tr > th.sorting_desc_disabled:after, table.dataTable thead > tr > td.sorting:before, table.dataTable thead > tr > td.sorting:after, table.dataTable thead > tr > td.sorting_asc:before, table.dataTable thead > tr > td.sorting_asc:after, table.dataTable thead > tr > td.sorting_desc:before, table.dataTable thead > tr > td.sorting_desc:after, table.dataTable thead > tr > td.sorting_asc_disabled:before, table.dataTable thead > tr > td.sorting_asc_disabled:after, table.dataTable thead > tr > td.sorting_desc_disabled:before, table.dataTable thead > tr > td.sorting_desc_disabled:after {
        right: 5px !important;
    }

    .custom-file {
        position: relative;
        display: inline-block;
    }

    #fileInput {
        opacity: 0;
        position: absolute;
        z-index: -1;
    }

    .custom-file-label {
        display: inline-block;
        padding: 10px 15px;
        background-color: #007bff;
        color: white;
        border-radius: 5px;
        cursor: pointer;
        text-align: center;
    }

    .file-name {
        margin-left: 10px;
        font-size: 14px;
        color: #555;
    }

    .ml-menu a {
        text-decoration: none;
    }


    .sidebar .menu .list a {
        padding: 5px 13px !important;
        text-decoration: none;
        color: #a09c9c;
    }

        .sidebar .menu .list a > span {
            color: #a09c9c;
        }

    .btn:not(.btn-link):not(.btn-circle) {
        border-radius: 8px !important;
    }

    .btn-warning {
        color: #fff !important;
    }

    .btn-default {
        background: #A7A9AC !important;
        color: #fff !important;
        border: 1px solid #A7A9AC;
    }

    .btn-link {
        text-decoration: none;
        color: #2a8ee2;
    }

    .sidebar .menu .list {
        margin-top: 20px;
    }

    @media(max-width:1200px) {
        .sidebar .menu {
            position: relative;
            height: 800px;
            overflow: auto;
        }

        .list {
            height: 800px !important;
        }
    }

    @media(max-width:900px) {
        .login-page .card {
            height: 100vw;
        }

        .sidebar .menu {
            position: relative;
            height: 800px;
            overflow: auto;
        }

        .list {
            height: 800px !important;
        }
    }

    .menu:hover .slimScrollDiv {
        overflow: auto !important;
        height: 1000px;
    }
    /*.toast.toast-success {
    background: #1bc261 !important;
    background-image: url() !important;
    background-repeat: no-repeat;
}

.toast.toast-error {
    background: #ff0000 !important;
    background-image: url() !important;
    background-repeat: no-repeat;
}*/

    .redirectLink .LinkImg {
        height: 500px;
        width: 500px;
        margin: auto;
    }

        .redirectLink .LinkImg img {
            height: 100%;
            width: 100%;
        }

    .imgSrc {
        height: 100px;
        width: 100px;
    }

        .imgSrc img {
            height: 100%;
            width: 100%;
            object-fit: cover;
            border-radius: 10px;
        }

    .login-page1 {
        height: 49vw;
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

        .login-page1 .row {
            width: 100%;
        }

        .login-page1 .card .body {
            width: 100%;
            padding: 0;
            margin: 0 10%;
            padding: 10%;
        }


    @media(max-width:400px) {
        .login-page1 {
            margin: 80% auto;
        }
    }