body {
    overflow-x: hidden;
   padding-bottom: 6rem;
}

.container {
    width:100%;    
    margin-left: 1rem;
}
.stats-container {
    width: 73%;
    margin-left: auto;
    margin-right: auto;
    padding: 4rem;
}
.container.index {
    width:100%;    
    margin: auto;
}
.dash-logo{
    width: 95px;
  height: auto;
}

#sidebar-wrapper {
    min-height: 100vh;
    min-width: 250px;
}

.navbar-toggler {
    
    font-size: 2.25rem;
    
}
.container-fluid{

    width: 80%;
        margin: auto;
}
/*.container.mt-5 {
    margin-bottom: 5rem;
}*/
.table-striped tbody tr:nth-of-type(odd) {
    background-color: #ed0fa138;
}
.table td,
.table th {
    border-top: 1px solid #80bdff;
}
label {  font-weight: bold; }
.forgotPassword {
    background-color: aliceblue;
    padding: 3rem;
}
.over90days {
    background-color: red !important;
}
   .center-image {
      display: block;
      margin: auto;
    }

.alert-success.custom-message {
    padding: 1rem;
}

.btn {
    background-color: #0ad5e7;
    color: #010c16;
    margin-top: 1rem;
}
.emptyResults {
    color: #bd5057;
    font-size: 2rem;
    text-align: center;
    display: inline-block; 
    width: 100%;
}

.dash-item{
        background-color: #ebd33b;
    padding: 1rem;
    margin: 1rem 1rem;
}
.site-heading {
    text-align: center;
    color: #07b5b7;
/*    margin-bottom: 2rem;*/
}

.site-headingh2{
    text-align: center;
    margin-bottom: 2rem;
    font-size: 1.5rem;
    font-style: italic;
}

.index-logo{
    width: 227px;
  height: auto;
   display: block;
  margin: auto;
}
.email-highlight {
    color: #207fe5;
}

#filter-select
    .masonry-grid {
        margin-left: -15px; /* counteract the -15px margin from rows */
    }
    .masonry-grid > .col-md-4 {
        padding-bottom: 30px;
    }
    .masonry-grid .event-img {
        border-radius: 5px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        transition: transform .2s ease-in-out;
    }

#filter-select {
    margin-bottom: 2.5rem;
}

.event-img {
    width: 100%;
    transition: transform 0.3s ease-in-out; /* For smooth scaling effect */
}

.event-img:hover {
    transform: scale(1.1); /* 10% larger */
}

/* Centering the box in the middle of the viewport */
.center-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80%; /* or whatever width you desire */
    max-width: 400px; /* setting a max width for larger screens */
}

/* Styling for larger buttons */
.btn-large {
    padding: 20px 40px;  /* Adjust padding for larger size */
    font-size: 24px;    /* Adjust font size */
    border-radius: 10px; /* Optional: Rounded corners */
    width: 100%;        /* Button takes the full width of its container */
}


#page-content-wrapper {
    min-width: 100%;
/*     background-color: #1b80d929;*/
}

#wrapper.toggled #sidebar-wrapper {
    margin-left: 0;
}

.dashboard-form {
        width: 70%;
        margin: auto;
    }

.list-group-item-light.list-group-item-action.active {
    color: #fff;
    background-color: #207fe5;
    border-color: #0d63b9;
}

footer {
    text-align: center;
}

footer .container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

footer .container a {
    margin: 0 10px;
    white-space: nowrap;
}
.card-header {
    background-color: rgb(5 236 239 / 29%);
}
@media (max-width: 768px) {
    footer .container {
        flex-direction: column;
    }
    
    footer .container a {
        margin: 5px 0;
    }
}

/* Responsive Breakpoints */
@media (max-width: 768px) { /* Small devices (tablets, 768px and down) */
    .col-md-4 {
        flex: 0 0 100%; /* flex-grow | flex-shrink | flex-basis */
        max-width: 100%; /* max-width for 100% of container */
    }


     #sidebar-wrapper {
        margin-left: 0;
    }

    #page-content-wrapper {
        min-width: auto;
        width: 100%;
        overflow: auto;
    }

    #wrapper.toggled #sidebar-wrapper {
        margin-left: -250px;
    }
}

@media (min-width: 769px) and (max-width: 992px) { /* Medium devices (desktops, 769px to 992px) */
    .col-md-4 {
        flex: 0 0 50%;
        max-width: 50%;
    }

    #sidebar-wrapper {
    min-height: 100vh;
    min-width: 100px;
    }

    h1 {
    font-size: 1.5rem;
    }

}

@media (max-width: 768px) {
    .site-heading {
        font-size: 1.5rem;
    }

    .btn {
        margin: 0.2rem;
    }

    footer.fixed-bottom {
        position: static !important;
        padding: 10px 0;
    }

    footer .container {
        padding: 0;
        flex-direction: column;
    }

    footer .container a {
        display: inline-block;
        margin: 5px 0;
        font-size: 14px;
    }

    body {
        padding-bottom: 0 !important;
    }
     .container {
        width: 95%;
        padding: 0 10px;
    }

    .container p-3 {
        padding: 0.5rem !important;
    }

    .container-fluid {
        width: 99%;         
    }

    
}