/* site-wide search */
#main-search {
    font-size: min(24px, 2rem);
}

/* 
#fb_search:focus-within .icon--search {
    display: none;
}
*/

#fb_search:focus-within #main-search::placeholder {
    font-size: 1px;
}

@media(max-width:767px) {
    #main-search {
        font-size: min(20px, 2rem);
    }

    .autocomplete-suggestion {
        font-size: min(20px, 1.2rem)
    }

}

/* profiles */
@media(max-width:767px) {
    .about-module .to-edit {
        right: 8px;
    }

    .bio-module__first-name {
        font-size: 1.625rem;
    }

    .section-row .tiles-module h2.type-30-32,
    .section-row .popularity-module h2.type-30-32 {
        font-size: 1.375rem;
    }

    .bio-module__person-attributes {
        font-size: 1.25rem;
    }

    .profile-pictures-carousel {
        justify-content: center;
        display: flex;
        aspect-ratio: initial;
    }

    .profile-pictures-carousel__viewport>.profile-pictures-carousel__slide {
        flex: 0 0 100%;
    }

    .profile-pictures-carousel__viewport {
        max-width: 320px;
        min-height: 320px;
    }

}

@media(min-width:767px) {
    .about-container .banners {
        margin-left: 4rem;
    }

}

.section-no-bottom {
    margin-bottom: 0;
}

.profile-pictures-carousel__randomizer .random-person-mobile,
.profile-pictures-carousel__arrow--right,
.profile-pictures-carousel__arrow--left {
    background-color: rgba(241, 239, 239, 0.4);
}

/* odd bug and info mark */
.bio-module .column {
    width: 100%;
    position: relative;
}

.icon--trivia.img-src {
    position: absolute;
    width: 12px;
    height: 12px;
    bottom: 2rem;
    left: 8px;
    top: initial;
    background: rgba(255, 255, 255, .6);
}

.img-src-overlay {
    bottom: 2rem;
    position: absolute;
    font-size: 8px;
    width: fit-content;
    height: fit-content;
    border: none;
    background-color: rgba(255, 255, 255, .6);
}

@media(max-width:767px) {
    .icon--trivia.img-src {
        left: calc((100vw - 320px)/2 + 0.5rem);
        bottom: 0.5rem;
    }

    .img-src-overlay {
        left: calc((100vw - 320px)/2 + 0.5rem);
        bottom: 0.5rem;
    }

}

/*group stuff*/
.group-info-module__heading {
    margin-bottom: 1rem;
    font-size: 1.575rem;
}

@media(min-width:767px) {
    .group-info-module__description-heading {
        margin-bottom: 0.25rem;
    }

    .group-info-module__boost-block {
        margin-top: 1.5rem;
    }

    .group-info-module__structured-data p {
        font-size: 1.25rem;
    }

}

.section-row h2.type-30-32 {
    font-size: 1.15rem;
}

.cast-heading {
    font-size: 1.55rem;
    margin-left: 10px;
    padding-bottom: 2px;
}

.ranking-item__profile.type-24-26 {
    font-size: 1.55rem;
}

#btn-boost,
.btn-group-boost {
    padding: .625rem 3rem;
    font-size: 1.5rem;
}

@media(max-width:767px) {
    .group-info-module__description-container {
        margin-top: 2rem;
    }

}

.section-half-bottom {
    margin-bottom: 2rem;
}

@media(min-width:767px) {
    .section-half-bottom-desktop {
        margin-bottom: 2rem;
    }

}

.section-long-bottom {
    margin-bottom: 3rem;
}

.layout--is-narrow .list-title {
    margin-left: 1rem;
}

/* ad */
@media(min-width:767px) {
    .banners {
        width: calc(100% + 2 * 8.875rem);
        margin-left: -8.875rem;
        display: flex;
        justify-content: center;
    }

}

.layout--is-narrow {
    overflow-x: clip;
}

/* edits */
#contactform:focus-within #comment::placeholder {
    font-size: 1px;
}

#comment {
    border: 1px solid black;
}

.pencil-form__bottom-wrapper {
    display: block;
}

.pencil-form__bottom-wrapper__right {
    margin-top: 16px;
}

/* video */
@media(min-width:767px) {
    .video-module {
        padding-inline: 2.5rem;
    }

    .video-module__info-container {
        padding-inline: 2.5rem;
    }

}

.column-list-wrapper .column-list__item {
    margin: 1rem;
}

.column-list-wrapper .column-list__item:first-child {
    margin-top: 0;
}

@media(max-width:767px) {
    #video-title {
        font-size: 1.75rem;
    }

    h2.column-list__heading.type-30-32 {
        font-size: 1.375rem;
    }

    h2.video-grid__heading.type-30-32 {
        font-size: 1.375rem;
    }

}

@media(max-width:480px) {
    .display-content-mobile {
        display: contents;
    }

    .video-module {
        position: sticky;
        top: 80px;
        z-index: 1;
    }

}

@media(min-width:480px) {
    .video-module {
        margin-top: 1rem;
    }

}

.column-list__heading {
    margin-top: 2rem;
}

/* arrow */
.ranking-item__rank svg {
    color: limegreen;
}

/* trending, home page */
.ranking-item__profile.type-24-26 .ranking-item__label {
    font-size: 1.375rem;
}

.ranking-item__label .line {
    white-space: pre-wrap;
}

/* number in star */
.tile__star-ranking {
    font-size: 0.95rem;
}

/* utils */
.no-x-scroll {
    overflow-x: hidden;
}

/* video thumbnail*/
.video-thumbnail {
    display: block;
    max-width: 480px;
}

@media(min-width:1200px) {
    .bio-module .column:nth-child(1) {
        max-width: 480px;
    }

}

.bio-module {
    justify-content: flex-start;
}

@media (min-width:768px) {
    .group-info-module__structured-data {
        justify-content: flex-start;
    }

}

@media(min-width:1600px) {
    .bio-module .column:nth-child(2) {
        margin-left: 3.5rem;
        flex: 0 0 38rem;
    }

}

.profile-pictures-carousel__swipe-indicator {
    bottom: 0.5rem;
}

@media(max-width:768px) {
    .profile-pictures-carousel__swipe-indicator {
        right: calc((100vw - 320px)/2 + 16px);
        top: 320px;
    }

    .profile-pictures-carousel__randomizer {
        top: 0.5rem;
        right: calc((100vw - 320px)/2 + 0.5rem);
    }

    .profile-pictures-carousel__randomizer_group {
        right: 1rem;
    }

    .profile-pictures-carousel__randomizer svg {
        max-width: 24px;
    }

    .profile-pictures-carousel__controls {
        right: calc((100vw - 320px)/2 + 0.5rem);
        width: 300px;
        left: initial;
        bottom: 0.5rem;
    }

    .profile-pictures-carousel__arrow {
        max-width: 36px;
        max-height: 36px;
    }

    .profile-pictures-carousel__arrow svg {
        max-width: 24px;
    }

}

@media (pointer:none) and (max-width:768px),
(pointer:coarse) and (max-width:768px) {
    .profile-pictures-carousel__controls {
        display: none;
    }

    .profile-pictures-carousel__swipe-indicator {
        display: flex;
    }

}

@media (pointer:fine) and (max-width:768px) {
    .profile-pictures-carousel__swipe-indicator {
        display: none;
    }

    .profile-pictures-carousel__controls {
        display: block;
    }

}

.profile-pictures-carousel__swipe-indicator {
    display: none;
}

.profile-pictures-carousel__controls {
    display: block;
}

.profile-pictures-carousel__randomizer a {
    max-width: 36px;
    max-height: 36px;
}

.profile-pictures-carousel__swipe-indicator {
    max-width: 36px;
    max-height: 45px;
}

@media (max-width:768px) {
    .bio-module__no-image {
        width: 0;
    }

}

input::-webkit-search-cancel-button {
    -webkit-appearance: none;
    /* hide the default "X" button */
    z-index: 2;
    display: block;
    -webkit-appearance: none;
    height: 24px;
    width: 24px;
    margin-top: 8px;
    margin-right: 1rem;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23777'><path d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'/></svg>");
    cursor: pointer;
}

/*.search input:not(:placeholder-shown) ~ .search-suggestions{
    min-height: 160px;
    display: block!important;
}*/

@media (max-width:767px) {
    .tiles-module .tile__picture img {
        min-width: calc((100vw - 3rem) / 2);
        min-height: calc((100vw - 3rem) / 2);
    }
}

/*disable carousel swiping*/
.profile-pictures-carousel__viewport {
    overflow-x: hidden;
    touch-action: none;
}

.profile-pictures-carousel__viewport img {
    touch-action: none;
}

/*fix 2023-04-23*/


.video-module #video-player {
    /*	min-width: calc((100vw - 2 * 8.875rem - 2 * 2.5rem) / 2);*/
    aspect-ratio: 16 / 9;
    /*	min-height: calc((100vw - 2 * 8.875rem - 2 * 2.5rem) / 2 * 9 / 16);*/
}

.grid-item-aspect-9-16 .video-grid__item .thumbnail__image-wrapper {
    aspect-ratio: 16 / 9;
}

.grid-item-aspect-3-2 .video-grid__item .thumbnail__image-wrapper {
    aspect-ratio: 3 / 2;
}

.grid-item-aspect-1-1 .tile__item .tile__picture {
    aspect-ratio: 1 / 1;
    /*	min-width: calc((100vw - 2 * 8.875rem - 2 * 1.5rem) / 4);*/
}

/* .autocomplete-suggestion span{
    margin-left: 40px;
}

@media(max-width: 768px){
    .autocomplete-suggestion span{
        margin-left: 24px;
    }
}

.autocomplete-suggestion span{
    margin-left: 2rem;
}

@media(max-width: 768px){
    .autocomplete-suggestion span{
        margin-left: 0;
    }
}
 */
.search-button {
    left: 1.13rem;
    width: 36px;
    z-index: 1000;
    cursor: default;
}

.search fieldset input {
    padding-left: 2.35rem;
}

@media (min-width: 768px) {
    .search fieldset input {
        padding-left: 3.5rem;
    }
}

.search input:not(:focus)~.search-suggestions:not(:focus-within):not(:hover):not(:active) {
    visibility: hidden;
}

.search input:not(:focus) {
    border-radius: 1.875rem;
}

.icon--trivia.img-src {
    bottom: calc(2rem - 4px);
    left: 4px;
    padding-top: 0;
}

.img-src-overlay {
    bottom: calc(2rem - 4px);
    left: 4px;
}

@media (max-width: 767px) {
    .icon--trivia.img-src {
        left: calc((100vw - 320px)/2 + 0.15rem);
        bottom: 0.15rem;
    }

    .img-src-overlay {
        left: calc((100vw - 320px)/2 + 0.15rem);
        bottom: 0.15rem;
    }
}

.group-info-module__image-wrapper .icon--trivia.img-src {
    left: 4px;
    bottom: 4px;
}

.group-info-module__image-wrapper .img-src-overlay {
    left: 4px;
    bottom: 4px;
}

.icon-trivia-touch-region {
    background: transparent;
    z-index: 1;
    position: absolute;
    width: 40px;
    height: 40px;
    bottom: 0.15rem;
    left: calc((100vw - 320px)/2 + 0.15rem);
}

.group-info-module__image-wrapper .icon-trivia-touch-region {
    bottom: 0;
}

.icon-trivia-touch-region:focus~.img-src-overlay,
.icon-trivia-touch-region:hover~.img-src-overlay,
.icon-trivia-touch-region:active~.img-src-overlay,
.icon-trivia-touch-region:focus-visible~.img-src-overlay {
    display: block;
}