/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

 .mission-grid {
     display: flex;
     flex-wrap: wrap;
     justify-content: flex-start;
     align-content: center;
 }
 .mission-card {
    width: 32%;
    background-color: rgba(255,255,255,0.3);
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #7f6a50;
    transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
    padding: 15px 15px 63px 15px;
    position: relative;
    margin: .5%;
 }
 h3.mission-title {
     text-align: center;
     line-height: 1;
     color: #141e1b !important;
 }
 .mission-card-image {
     margin-bottom: 20px;
 }
 .mission-excerpt p {
     color: #141e1b;
 }
 .mission-cta {
    font-weight: 500;
    text-transform: uppercase;
    font-style: normal;
    text-align: center;
    color: #e3cfb5;
    background-color: #7f6a50;
    border-radius: 0px 0px 0px 0px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
    font-size: 15px;
    padding: 6px 24px;
    position: absolute;
    bottom: 15px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
 }
 .mission-cta:hover {
    color: #ffffff;
    background-color: #614828 !important;
    border-color: #ffffff;
 }
 .mission-cta a {
     color: #e3cfb5;
 }
 .mission-cta:hover a {
     color: #fff;
 }
 .mission-filter {
     text-align: center;
     margin-bottom: 30px;
 }
 .mission-filter select {
     background: #614828;
     color: #e3cfb5;
     border-radius: 0;
     border: 1px solid #e3cfb5;
     -webkit-appearance: none;
-moz-appearance: none;
appearance: none;
padding-right: 30px;
margin: 0 5px;
 }
 .child-term {
     font-size: 14px;
     opacity: 0.8;
     padding-left: 15px;
 }
 .mission-dropdown {
     width: 100%;
     position: relative;
 }
 .mission-dropdown::before {
     position: absolute;
     right: 10px;
     top: 50%;
     transform: translateY(-50%);
     color: #e3cfb5;
     font-family: "Font Awesome 5 Free";
     content: "\f107";
     font-size: 14px;
     font-weight: 900;
     width: 22px;
     pointer-events: none;
 }
@media only screen and (max-width: 768px) {
    .mission-card {
        width: 100%;
    }
    .mission-filter select { 
        width: 100%;
        margin: 5px 1px;
    }
    .missions-main-content {
        padding: 30px 0 0 0 !important;
    }
}