.btn-outline-success {
    color: #293445;
    border-color: #293445;
}

section.content .card {
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 0px 10px 30px #00000029;
    border-radius: 22px;
    opacity: 1;
    padding: 30px;
}

.announce {
    box-shadow: 0px 10px 20px #00000029;
    border-radius: 18px;
    opacity: 1;
    padding: 25px;
    margin-top: 20px;
    margin-bottom: 30px;
}

@media (min-width: 769px) and (max-width: 1024px) {
    header.top-header button.btn.btn-primary {
        z-index: 99 !important;
        position: fixed;
        top: 28px;
        left: 30px;
    }

    header.top-header div#offcanvasWithBothOptions .offcanvas-body ul#menu li a {
        color: #fff;
        text-decoration: none;
        background: #ffffff;
        border-left: 4px solid #ffffff;
        background-color: #8E7B56;
        border-radius: 50px;
    }

    header.top-header div#offcanvasWithBothOptionsv .offcanvas-body ul#menu li {
        display: block;
        padding: 10px;
    }

    header.top-header div#offcanvasWithBothOptions .offcanvas-body ul#menu li a {
        display: ruby;
        color: #8e98af;
        padding: 10px;
    }

    .page-content {
        padding-top: 25px;
    }

    .offcanvas-body ul#menu li {
        display: grid;
        padding: 5px;
    }

    .offcanvas-body ul#menu li .menu-title {
        filter: brightness(0) invert(1);
    }

    .offcanvas-body ul#menu li .parent-icon {
        filter: brightness(0) invert(1);
    }

    .sign-up header {
        margin-bottom: -50px;
    }

    ul.list-nav a {
        color: #ffffff !important;
        text-decoration: none;
    }

    ul.list-nav a:hover {
        color: #ffffff !important;
    }

    ul.list-nav a li {
        color: #fff;
    }

    .contently h1 {
        text-align: left;
        font: normal normal 800 60px / 70px Montserrat !important;
        letter-spacing: -0.92px;
        color: #FFFFFF;
        text-transform: capitalize;
        opacity: 1;
    }

    /*/////////////////////////////*/
    .btn-outline-success {
        color: #293445;
        border-color: #293445;
    }

    /*/////////////////////////////*/
    table#example {
        padding: 20px 10px;
        margin: 0 auto;
        height: 200px !important;
        overflow: overlay;
        padding-top: 40px !important;
        position: relative;
        top: 30px;
    }

    .community .post-content p {
        overflow-wrap: anywhere;
    }

    .community .commment .comt-time {
        width: 80%;
        float: right;
        text-align: right;
    }

    /*////////////////////*/
    .announce h3 {
        text-align: left;
        font: normal normal 800 28px / 33px Montserrat;
        letter-spacing: -0.82px;
        color: #432D00;
        text-transform: uppercase;
        opacity: 1;
    }

    .dataTables_wrapper .dataTables_filter {
        float: left;
        text-align: left;
    }

    .dataTables_wrapper {
        position: relative;
        clear: both;
        overflow: scroll;
    }

    table.dataTable.no-footer {
        border-bottom: 1px solid rgba(0, 0, 0, 0.3);
        padding-top: 20px;
    }

    table#myTable .btn-primary {
        padding: inherit;
    }

    table#myTable .btn-info {
        padding: inherit;
    }

    nav.flex.items-center.justify-between {
        padding: 19px;
        margin-top: 18px;
        display: none;
    }

    /*////////////////////*/
    body.sign-up {
        overflow: visible !important;
        overflow-x: hidden !important;
    }

    .container-fluid.sgin-bg .col.col-lg-6.col-sm-12 .row {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 0;
        display: flex;
        flex-wrap: wrap;
        margin-top: calc(var(--bs-gutter-y)* -1);
        margin-right: calc(var(--bs-gutter-x) / -2);
        margin-left: calc(var(--bs-gutter-x) / -2);
        flex-direction: column;
        width: 100%;
    }

    .formss .nav {
        display: flex;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        gap: 20px;
        margin-bottom: 30px;
    }

    .nav-pills .nav-link.active,
    .nav-pills .show>.nav-link {
        padding: 15px 40px;
    }

    .nav-pills .nav-link {
        padding: 15px 40px;
    }

    .sgin-bg .row .col {
        display: flex;
        align-items: flex-start;
        padding: 0px;
        flex-direction: column;
        justify-content: center;
        padding: 50px 20px;
    }

    .container-fluid.sgin-bg .profile-info {
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .landlorder {
        display: grid;
        grid-template-columns: auto !important;
        gap: 10px;
        /* margin-bottom: 18px; */
        justify-items: center;
        align-content: center;
        justify-content: center;
        align-items: start;
    }

    .form-label {
        margin-bottom: 0.5rem;
        width: 270px !important;
        font-size: 15px;
    }

    .container-fluid.sgin-bg .createheading {
        text-align: center;
    }
}

@media only screen and (max-width: 768px) {
    body {
        overflow-x: hidden !important;
    }

    .inputted {
        justify-content: flex-start !important;
    }

    header.top-header button.btn.btn-primary {
        z-index: 99 !important;
        position: fixed;
        top: 28px;
        left: 30px;
    }

    header.top-header div#offcanvasWithBothOptions .offcanvas-body ul#menu li a {
        color: #fff;
        text-decoration: none;
        background: #ffffff;
        border-left: 4px solid #ffffff;
        background-color: #8E7B56;
        border-radius: 50px;
    }

    header.top-header div#offcanvasWithBothOptionsv .offcanvas-body ul#menu li {
        display: block;
        padding: 10px;
    }

    header.top-header div#offcanvasWithBothOptions .offcanvas-body ul#menu li a {
        display: ruby;
        color: #8e98af;
        padding: 10px;
    }

    .page-content {
        padding-top: 25px;
    }

    .offcanvas-body ul#menu li {
        display: grid;
        padding: 5px;
    }

    .offcanvas-body ul#menu li .menu-title {
        filter: brightness(0) invert(1);
    }

    .offcanvas-body ul#menu li .parent-icon {
        filter: brightness(0) invert(1);
    }

    .sign-up header {
        margin-bottom: -50px;
    }

    ul.list-nav a {
        color: #ffffff !important;
        text-decoration: none;
    }

    ul.list-nav a:hover {
        color: #ffffff !important;
    }

    ul.list-nav a li {
        color: #fff;
    }

    .contently h1 {
        text-align: left;
        font: normal normal 800 30px / 40px Montserrat !important;
        letter-spacing: -0.92px;
        color: #FFFFFF;
        text-transform: capitalize;
        opacity: 1;
    }

    .btn-outline-success {
        color: #293445;
        border-color: #293445;
    }

    /*/////////////////////////////*/
    table#example {
        padding: 20px 10px;
        margin: 0 auto;
        height: 200px !important;
        overflow: overlay;
        padding-top: 40px !important;
        position: relative;
        top: 30px;
    }

    .community .post-content p {
        overflow-wrap: anywhere;
    }

    .commment {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        border-top: 1px solid #858586;
        padding-top: 15px;
        flex-direction: column;
    }

    .community .commment .comt-time {
        width: 100%;
        float: right;
        text-align: right;
    }

    .password {
        width: 100%;
    }

    .email {
        width: 100%;
    }

    /*////////////////////*/
    .announce h3 {
        text-align: left;
        font: normal normal 800 28px / 33px Montserrat;
        letter-spacing: -0.82px;
        color: #432D00;
        text-transform: uppercase;
        opacity: 1;
    }

    .dataTables_wrapper .dataTables_filter {
        float: left;
        text-align: left;
    }

    .dataTables_wrapper {
        position: relative;
        clear: both;
        overflow: scroll;
    }

    table.dataTable.no-footer {
        border-bottom: 1px solid rgba(0, 0, 0, 0.3);
        padding-top: 20px;
    }

    table#myTable .btn-primary {
        padding: inherit;
    }

    table#myTable .btn-info {
        padding: inherit;
    }

    nav.flex.items-center.justify-between {
        padding: 19px;
        margin-top: 18px;
        display: none;
    }

    /*////////////////////*/
    body.sign-up {
        overflow: visible !important;
        overflow-x: hidden !important;
    }

    .container-fluid.sgin-bg .col.col-lg-6.col-sm-12 .row {
        --bs-gutter-x: 1.5rem;
        --bs-gutter-y: 0;
        display: flex;
        flex-wrap: wrap;
        margin-top: calc(var(--bs-gutter-y)* -1);
        margin-right: calc(var(--bs-gutter-x) / -2);
        margin-left: calc(var(--bs-gutter-x) / -2);
        flex-direction: column;
        width: 100%;
    }

    .formss .nav {
        display: flex;
        flex-wrap: wrap;
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        gap: 20px;
        margin-bottom: 30px;
    }

    .nav-pills .nav-link.active,
    .nav-pills .show>.nav-link {
        padding: 15px 40px !important;
    }

    .nav-pills .nav-link {
        padding: 15px 40px !important;
    }

    .sgin-bg .row .col {
        display: flex;
        align-items: flex-start;
        padding: 0px;
        flex-direction: column;
        justify-content: center;
        padding: 50px;
    }

    .container-fluid.sgin-bg .profile-info {
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
        justify-content: center;
        align-items: center;
        gap: 20px;
    }

    .landlorder {
        display: grid;
        grid-template-columns: auto !important;
        gap: 10px;
        /* margin-bottom: 18px; */
        justify-items: center;
        align-content: center;
        justify-content: center;
        align-items: start;
    }

    .form-label {
        margin-bottom: 0.5rem;
        width: 270px !important;
        font-size: 15px;
    }

    .container-fluid.sgin-bg .createheading {
        text-align: center;
    }

    main.page-content .col-12.text-center p {
        width: 100% !important;
    }
}