
.search-group {
    margin: auto;
    max-width: 50vw;
    border: 1px solid #e9ecef !important;
}

.search-group:hover {
    border-radius: 0.35rem;
    border-color: rgb(140, 188, 249) !important;
}

.drop-border:focus {
    border-color: rgb(207, 212, 217) !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;;
}

.reaction-group {

}

.help-tips-group {
    display: inline-block;
    position: absolute;
    bottom: 6vh;
    margin-left: -50vw;
    width: 100vw;
}

.help-big-tips {
    display: block;
    font-size: 2rem !important;
    font-weight: 800 !important;
}

.down-arrow-app {
    /*-webkit-user-select: none;*/
    /*-webkit-user-drag: none;*/
    width: 5vw;
    height: 5vw;
}

.big-title {
    font-size: 3.5rem;
}

.search-bar {
    border-right: none !important;
    color: #1f4f6f !important;
}

.search-bar::placeholder {
    color: rgb(180, 188, 196) !important;
}

.search-btn {
    border: 1px solid #ced4da !important;
    border-left: none !important;
    border-bottom-left-radius: unset !important;
    border-top-left-radius: unset !important;
    background: white !important;
}

.search-icon {
    width: 1vw;
    min-width: 2vh;
}

.faq-group {
    color: #1f4f6f;
}

.faq-big-title {
    display: block;
    font-weight: 600;
    font-size: 2rem;
    margin-bottom: 0.5rem;
}

.faq-q {
    display: block;
    font-weight: 500;
    font-size: 1.6rem;
    margin: 0 0 0.5rem;
}

.faq-a {
    font-size: 1rem;
    margin: 0rem 0 1.5rem;
}

.media-group {
    display: inline-block;
    padding: 1rem;
    margin: auto;
    max-width: 50vw !important;
    border: 1px solid #e9ecef !important;
    background: pink;
    border-radius: 0.5rem !important;
}


@media (min-width: 1200px) {
    .search-group {
        margin: auto;
        max-width: 50vw;
    }

    .media-group {
        max-width: 50vw !important;
    }

    .help-tips-group {
        bottom: 1vh;
    }
}

@media (max-width: 1200px) {
    .search-group {
        margin: auto;
        max-width: 50vw;
    }
    .media-group {
        max-width: 50vw !important;
    }
}

@media (max-width: 1200px) and (min-height: 1366px) {
    .search-group {
        margin: auto;
        max-width: 66vw;
    }
    .media-group {
        max-width: 66vw !important;
    }
}

@media (max-width: 992px) {
    .search-group {
        margin: auto;
        max-width: 60vw;
    }
    .media-group {
        max-width: 60vw !important;
    }

    .big-title {
        font-size: 3.5rem;
    }

    .help-big-tips {
        font-size: 1.5rem !important;
    }

        .faq-big-title {
        font-size: 1.85rem;
        margin-bottom: 0.45rem;
    }

    .faq-q {
        font-size: 1.55rem;
        margin: 0 0 0.45rem;
    }
}

@media (max-width: 768px) {
    .search-group {
        margin: auto;
        max-width: 80vw;
    }
    .media-group {
        max-width: 80vw !important;
    }

    .help-big-tips {
        font-size: 1.2rem !important;
    }

    .help-big-tips {
        font-size: 1rem !important;
    }

     .faq-big-title {
        font-size: 1.75rem;
        margin-bottom: 0.42rem;
    }

    .faq-q {
        font-size: 1.55rem;
        margin: 0 0 0.42rem;
    }
}

@media (max-width: 576px) {
    .search-group {
        margin: auto;
        max-width: 90vw;
    }
    .media-group {
        max-width: 90vw !important;
    }

    .big-title {
        font-size: 2.5rem;
        font-weight: 500 !important;
    }

    .help-big-tips {
        font-size: 1rem !important;
    }

     .faq-big-title {
        font-size: 1.7rem;
        margin-bottom: 0.4rem;
    }

    .faq-q {
        font-size: 1.5rem;
        margin: 0 0 0.4rem;
    }
}

@media (max-width: 375px) {
    .search-group {
        margin: auto;
        max-width: 100vw;
    }
    .media-group {
        max-width: 100vw !important;
    }

    .big-title {
        font-size: 1.8rem;
        font-weight: 500 !important;
    }

    .help-big-tips {
        font-size: 0.8rem !important;
    }

     .faq-big-title {
        font-size: 1.6rem;
        margin-bottom: 0.3rem;
    }

    .faq-q {
        font-size: 1.4rem;
        margin: 0 0 0.3rem;
    }
}

@media (max-width: 375px) and (max-height: 600px) {
    .big-title {
        font-size: 1.8rem;
        font-weight: 500 !important;
    }

    .help-tips-group {
        display: none;
    }

    .faq-big-title {
        font-size: 1.6rem;
        margin-bottom: 0.3rem;
    }

    .faq-q {
        font-size: 1.4rem;
        margin: 0 0 0.3rem;
    }
}

@media (min-aspect-ratio: 16 / 9){
    .help-tips-group {
        display: none;
    }
}

@media (min-aspect-ratio: 1 / 1) and (max-aspect-ratio: 3 / 2){
    .help-tips-group {
        display: none;
    }
}
