/*
style.css is for css which we add for our customization.
Theme original CSS are in theme.css or themes directory.
*/

@media (max-width: 767.98px) {
    #catch-text .ld-fh-txt {
        font-size:20px;
    }
}
@media screen and (max-width:480px) {
    .align-items-center {
        align-items: start !important;
        top: 50px;
    }
}
.js-assess-device {
    display: inline-block;
}
.js-assess-device > .btn.invalid {
    pointer-events: none;
}

.iphone-price {
    font-size: 20px;
    color: rgb(234, 53, 45);
}

.model-price {
    color: red;
    display: flex;
    align-items: center
}

.price-up {
    color: red;
    font-size: 0.75rem;
    white-space: nowrap;
    margin-left: 8px
}

@media screen and (max-width:480px) {
    .price-up {
        margin-left: 5px
    }
}

.qr-text {
    font-size: 13px;
}
.qr-wrapper {
    display: flex;
    align-items: center;
    width: 75%;
    background: #ffffffab;
    padding: 1.5em;
    border-radius: 5px;
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.07);
}
.qr-img {
    margin-right: 1em;
    width: 55%;
}

.ft-banner .qr-wrapper {
    width: 100%;
    justify-content: center;
}
.ft-banner .qr-img {
    min-width: 120px;
    width: 15%;
}

/* Footer */
@media (max-width: 767px) {
    .footer-content {
        display: flex;
        flex-direction: column-reverse;
    }
    .inquiry-button .btn {
        width: 100%;
    }
    .inquiry-button .btn .btn-content {
        margin: auto;
    }
}

@media (min-width: 768px) {
    .footer-content {
        display: flex;
        flex-direction: row;
    }
    .footer-content-item.item-right {
        margin: auto 0 auto auto;
    }
}