﻿.myselect, .bootstrap-select > .dropdown-toggle {
    border: none;
    background-color: #FFF !important;
    color: #293756;
    border-radius: 1rem;
    line-height: 4rem;
    font-size: 13pt;
    font-weight: 400;
    text-align:center;
}

    .myselect, .bootstrap-select > .dropdown-toggle:focus {
        background-color: #FFF;
    }

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    text-align: center
}

.myselect::placeholder {
    color: #8d8ba7;
}

.margin-5 {
    margin-left: 5%;
}

@media(max-width:1000px) {
    .margin-5 {
        margin-left: 0%;
    }
}

.listitem {
    height: 400px;
    max-width: 400pt;
    background-color: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    overflow: hidden;
    padding: 30px;
    position: relative;
    z-index: 1;
    padding-bottom: 5pt;
    padding-right: 13pt;
    padding-top: 5pt;
    border-radius: 10pt;
    transition: .5s all ease;
}

    .listitem:hover {
        box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
        transition: .5s all ease;
    }

    .listitem .thumb-left {
        position: relative;
        width: 250px;
        max-height: 250px;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        margin-left: 13pt;
        margin-top: 10pt;
        float: left;
    }

        .listitem .thumb-left img {
            backface-visibility: hidden;
            -webkit-border-radius: 50%;
            -moz-border-radius: 50%;
            border-radius: 50%;
            -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            -webkit-box-shadow: 0 0 10px rgb(0 0 0 / 10%);
            -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
            box-shadow: 0 0 10px rgb(0 0 0 / 10%);
            max-width: 100%;
            padding: 6px;
            vertical-align: top;
        }

    .listitem .thumb-right {
        position: relative;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        float: right;
    }

        .listitem .thumb-right img {
            max-width: 100pt;
        }

    .listitem::after {
        /* background: #bec6dd none repeat scroll 0 0;*/
        background: linear-gradient(94deg, rgba(245,247,249,1) 0%, rgba(198,208,218,1) 49%, rgba(45,64,121,1) 100%);
        content: "";
        height: 300px;
        left: 0;
        position: absolute;
        top: -150px;
        transform: skewY(20deg);
        -webkit-transform: skewY(20deg);
        -moz-transform: skewY(20deg);
        -ms-transform: skewY(20deg);
        -o-transform: skewY(20deg);
        width: 100%;
        z-index: -1;
    }

    .listitem .info h4 {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2; /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
        /*color: #0e1c60;*/
        color: black;
    }

    .listitem .info p {
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2; /* number of lines to show */
        line-clamp: 2;
        -webkit-box-orient: vertical;
        color: black;
        font-weight: 300;
        font-size: 12pt;
    }

@media(max-width:1815px) {
    .listitem .thumb-left {
        max-width: 225px;
    }
}

@media(max-width:1725px) {
    .listitem {
        height: 380px;
    }

        .listitem .thumb-left {
            max-width: 200px;
        }
}

@media(max-width:1635px) {
    .listitem .thumb-left {
        max-width: 180px;
    }
}

@media(max-width:1565px) {
    .listitem {
        height: 330px;
    }

        .listitem .thumb-left {
            max-width: 155px;
        }

        .listitem .thumb-right img {
            max-width: 70pt;
        }
}

@media(max-width:1330px) {
    .listitem .thumb-left {
        max-width: 120px;
    }
}

@media(max-width:1200px) {
    .listitem .thumb-left {
        max-width: 200px;
    }

    .listitem .thumb-right img {
        max-width: 95pt;
    }
}

@media(max-width:1070px) {
    .listitem .thumb-left {
        max-width: 165px;
    }
}

@media(max-width:990px) {
    .listitem {
        height: 400px;
    }

        .listitem .thumb-left {
            max-width: 250px;
        }

        .listitem .thumb-right img {
            max-width: 95pt;
        }

    .font30-mobile {
        font-size: 30pt !important;
    }
}

@media(max-width:590px) {
    .listitem .thumb-left {
        max-width: 200px;
    }
}

@media(max-width:530px) {
    .listitem {
        height: 300px;
    }

        .listitem .thumb-left {
            max-width: 160px;
            margin: unset;
        }

        .listitem .thumb-right img {
            max-width: 70pt;
        }
}

@media(max-width:400px) {
    .listitem .thumb-left {
        max-width: 140px;
        margin: unset;
    }

    .listitem .thumb-right img {
        max-width: 55pt;
    }
}

.filter-label {
    font-size: 14pt;
    color: #5a6c85;
    font-weight: 500;
}

.search-button {
    min-width: 45pt;
    margin-top: 25pt;
    background-color: #0e3060;
    border-color: #0e3060;
    padding: 10pt;
    border-radius: 20pt;
    color:white;
}

.cancel-button {
    min-width: 45pt;
    margin-top: 25pt;
    background-color: #acb3c9;
    border-color: #acb3c9;
    border-radius: 20pt;
    padding: 10pt;
    color:white;
}

.ui-widget-content {
    background-color: white !important;
}

.badges-list {
    list-style: none; /* Remove default bullet points */
    display: flex;
    flex-wrap: wrap; /* Allow wrapping to the next row */
    padding: 0; /* Remove default padding */
    margin: 0; /* Remove default margin */
    justify-content: space-evenly; /* Adjust spacing between items */
}

.badge-item {
    flex: 0 0 calc(33.333% - 100px); /* Three items per row with spacing */
    box-sizing: border-box;
    margin: 30px 10px; /* Add spacing between items */
    padding: 0;
}

.listitem {
    text-align: center;
    background: #f9f9f9; /* Example background */
    border-radius: 8px; /* Rounded corners */
    overflow: hidden;
}