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

    .c-post-now{
        display: none !important;
    }
    /* Styles for all smartphones */
    h1.display-4.fw-bold.mb-4 {
        font-size: 2rem;
    }

    .container.pt-5.mt-5 {
        padding-top: 0px !important;
    }

    a.get-started {
        width: 100%;
        margin-bottom: 5px;
    }

    .display-4 {
        font-size: 2rem !important;
    }

    .display-5 {
        font-size: 2rem !important;
    }

    /* private styles*/

    .navbar.private {
        bottom: 0px !important;
        top: auto !important;
        width: 100% !important;
        height: 75px !important;
        z-index: 99999;
    }

    .navbar.private .navbar-right {
        left: 0px !important;
        height: 75px;
        bottom: 0px;
        top: auto;
        flex-direction: row;
        width: 103%;
        z-index: 99999;
    }

    .navbar.private .navbar-right a {
        color: #333 !important;
    }

    .navbar.private .navbar-right a.active {
        border-radius: 0px !important;
        color: #fff !important;
    }

    .navbar.private .navbar-right a svg {
        stroke: #333 !important;
    }

    .navbar.private .navbar-right a.active svg {
        color: #fff !important;
        stroke: #fff !important;
    }

    .navbar.private .navbar-right a span {
        display: none;
    }

    .page-header {
        flex-direction: column;
    }

    .content {
        padding-left: 0px !important;
    }

    .container-fluid {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .main-content {
        padding-left: 15px !important;
    }

    .header {
        width: 100%;
    }

    span.appname {
        font-size: 2rem !important;
    }

    .appname-small {
        display: none;
    }

    .appname.desktop {
        display: none;
    }

    .appname.mobile {
        display: block !important;
    }

    #ideaStickyNotes {
        padding-left: 0px;
        /* flex-direction: row; */
        margin: 0px;
    }

    .sticky-notes-wrap {
        max-height: 60vh;
        min-height: auto;
        margin-top: 5px;
    }

    .sticky-notes-wrap ul li div.editable {
        height: 150px;
        width: 100%;
        border-radius: 0px;
    }

    .sticky-notes-wrap ul li {
        margin: 2px;
        position: relative;
        border-radius: 0px;
        width: 48%;
    }

    .modal-dialog {
        max-width: 100% !important;
    }

    #confirmation-container .confirmation {
        width: 90% !important;
    }

    .c-content-calendar {
        height: calc(var(--vh, 1vh) * 72);
        overflow: auto;
    }

    .c-content-calendar .navbar--range {
        font-size: 12px;
    }

    .c-content-calendar .navigation button {
        font-size: 12px;
    }

    .modal-footer .btn {
        font-size: 12px;
        padding: 3px 6px;
    }

    .modal-dialog .modal-content label {
        font-size: 12px;
    }

    #platforms {
        display: flex;
        flex-wrap: wrap;
    }

    #platforms .form-check-inline {
                flex: 0 0 50%;
        box-sizing: border-box;
        /* width: 50% !important; */
        margin-right: 0px;
        padding-bottom: 5px;
    }
    .modal-header h5{
            width: 80% !important;
    font-size: 1.1rem !important;
    }
    .modal-footer .delete-content{
        display: none !important;
    }
    .user-settings-form form{
        width: 100% !important;
    }
    .user-settings-form label{
        font-size: 12px;
    }
    .user-settings-form .form-control{
        font-size: 12px;
    }
    .user-settings-form ul li{
        font-size: 12px !important;
    }
    .text-light.mobile{
        font-size: 11px !important;
    }
    .user-image img{
        width: 60px !important;
        height: 60px !important;
    }
    table.dataTable>tbody>tr>th, table.dataTable>tbody>tr>td{
        font-size: 12px !important;
    }
    .table-container table thead th{
        font-size: 13px !important;
    }
    .history-list{
        height: 80vh;
        overflow: auto;
    }
}