/* Form Fields
-------------------------------------------------------------------*/
.form-control {
    border: 1px solid var(--pale-grey);
    font-weight: 400;
    background-color: var(--white);
    color: var(--black);
    font-size: 1.6rem;
    border-radius: 1px;
    padding: 1em;
}

.form-select {
    border: 1px solid var(--pale-grey);
    font-weight: 400;
    font-size: 1.6rem;
    padding: 1em;
}

.form-adjust {
    width: 100%;
    max-width: 500px;
}

.form-adjust-mobile .form-control {
    padding: .5em;
}


/* Buttons: Custom
-------------------------------------------------------------------*/
.btn-custom,
a.btn-custom:link,
a.btn-custom:active,
a.btn-custom:visited,
a.btn-custom:focus {
    background: var(--med-grey);
    border-color: var(--med-grey);
    color: var(--white);
    font-size: 1.8rem;
    padding: .5em 1em;
    border-radius: 0;
    text-decoration: none;
}

.btn-custom:hover,
a.btn-custom:hover {
    color: var(--white);
    background: var(--dark-grey);
    border-color: var(--dark-grey);
}


/* Buttons: Learn More
-------------------------------------------------------------------*/
.learn-more,
a.learn-more:link,
a.learn-more:visited,
a.learn-more:active {
    font-family: var(--ff-default);
    background: var(--brand-dark);
    color: var(--white);
    cursor: pointer;
    font-size: 1.5rem;
    padding: .5em .5em .4em .5em;
    border: 0;
    transition: all 0.5s;
    border-radius: 0;
    width: auto;
    position: relative;
    text-decoration: none;
}

.learn-more:hover,
a.learn-more:hover {
    background: var(--brand-dark);
    color: var(--white);
    transition: all 0.5s;
    border-radius: 0;
    padding: .5em 2em .4em .5em;
}

.learn-more::after,
.btn-clear::after {
    color: var(--white);
    font: var(--fa-font-solid);
    content: "\f105";
    font-weight: 900;
    position: absolute;
    left: auto;
    top: 31%;
    right: 5%;
    bottom: 0;
    opacity: 0;
}

.learn-more:hover::after,
.btn-clear:hover::after {
    opacity: 1;
    transition: all 0.5s;
}


/* Buttons: Clear
-------------------------------------------------------------------*/
.btn-clear,
a.btn-clear:link,
a.btn-clear:active,
a.btn-clear:visited,
a.btn-clear:focus {
    font-family: var(--ff-default);
    background: transparent;
    color: var(--white);
    cursor: pointer;
    font-size: 1.5rem;
    padding: .75em 1em .65em 1em;
    border: 1px solid var(--white);
    transition: all 0.5s;
    border-radius: 0;
    width: auto;
    position: relative;
    text-decoration: none;
}

.btn-clear:hover,
a.btn-clear:hover {
    background: rgba(255, 255, 255, .35);
    color: var(--white);
    transition: all 0.5s;
    border-radius: 0;
    padding: .75em 3em .65em 1em;
}


/* Buttons: Search
-------------------------------------------------------------------*/
.btn-search,
.btn-search:hover,
a.btn-search:link,
a.btn-search:visited,
a.btn-search:active {
    padding: 1em;
    font-size: 2rem;
    background: var(--brand-dark);
    color: #FFF;
}

.form-adjust-mobile .btn-search,
.form-adjust-mobile .btn-search:hover {
    padding: 1em;
    font-size: 1.5rem;
    background: var(--brand-dark);
    color: #FFF;
}