/* Override for Rnwl logo and header */
.app-header {
    padding: 2rem 0 2rem;
}
.app-header .header-icon img {
    max-width: 6.6rem;
}

/* Alignment containers for main content and button */
/* Both must have a two level nested HTML structure:
    <any class="x-container">
        <div>
            {content goes here}
        </div>
    </any>
*/
.main-container {
    min-height: calc(100vh - 14rem);
    display: flex;
}
@media (min-width: 576px) and (min-height: 600px) {
    /* width = bootstrap: sm */
    .main-container {
        min-height: calc(85vh - 14rem);
    }
}
.main-container > div {
    margin: 1.5rem 0;
    width: 100%;
}
.vehicle-lookup-form.main-container > div {
    margin: auto 0;
}
@media (min-width: 576px) and (min-height: 600px) {
    /* width = bootstrap: sm */
    .main-container > div {
        margin: auto 0;
    }
}
.button-container {
    min-height: 100px;
    display: flex;
}
.button-container > div {
    margin: 1rem auto 0 auto;
    width: 100%;
    text-align: center;
}

/* Added weighting and padding to question titles */
.content-title {
    margin-top: 1rem;
    margin-bottom: 2rem;
    font-weight: 600;
}
@media (max-width: 576px) and (min-height: 600px) {
    /* width = bootstrap: sm */
    .thank-you-page .content-title {
        margin-top: 0;
        margin-bottom: 1.5rem;
    }
}

/* Add a min-width to continue buttons */
.button-container .btn.btn-primary {
    width: 95%;
}

/* Vehicle lookup form - wrap the horizontal input/button on small screens */
.vehicle-lookup-form .col button,
.vehicle-lookup-form .col input[type='text'] {
    min-width: 155px;
}
@media (max-width: 381px) {
    .vehicle-lookup-form .col button {
        width: 95%;
        margin-top: 2rem;
    }
}

/* Your details form - wrap the first/last name fields pm small screens */
.your-details-form .col {
    margin-bottom: 0.5rem;
    min-width: 130px;
}

/* Terms and conditions - format list of links */
.terms-list {
    padding-left: 0;
    margin-top: 2rem;
}
.terms-list li {
    list-style-type: none;
    background: url(../images/file-earmark-text.svg) no-repeat 0 0.35rem;
    background-size: 1.2rem;
    padding: 0.2rem 0 0.2rem 2rem;
    margin-bottom: 0.5rem;
}
.terms-list li a,
.terms-list li a:active {
    text-decoration: underline;
    color: #0fa792;
}
.terms-list li a:hover,
.terms-list li a:focus,
.terms-list li a:visited {
    color: #0c8473;
}

input.registration {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 1.1rem;
    letter-spacing: 0.05rem;
}