@font-face {
    font-family: "Avenir LT";
    src: url('../fonts/AvenirLTStd-Medium.otf') format('opentype');
}

@font-face {
    font-family: "Avenir LT Light";
    src: url('../fonts/AvenirLTStd-Light.otf') format('opentype');
}

body {
    font-family: "Avenir LT", "Helvetica", "Arial", sans-serif;
    box-sizing: border-box;
}

h1, h2, h3, h4, h5, h6 {
    color: #303030;
}

p {
    font-family: 'Avenir LT Light','Avenir LT', "Helvetica", "Arial", sans-serif;
}

.header {
    background-color: #f1f2f3;
    padding: 1em;
}




#map {
    border-top: 1px solid #303030;
    height: 600px;
    width: 100%;
}

.result-list {
    max-height: 50vh;
    height: 600px;
    overflow-y: auto;
}


.result-item {
    border-top: 1px solid #303030;
    cursor: pointer;
    padding: 0.5em;
    font-size: 0.8em;
}

    .result-item:hover .title {
        text-decoration: underline;
    }


    .result-item p {
        margin: 0.25em;
    }

    .result-item .title {
        color: #ba102c;
        font-weight: bold;
        font-size: 1.2em;
    }

    .result-item .dist {
        color: #303030;
        float: right;
        font-size: 0.75em;
    }

.result-list .event-date {
    color: #303030;
}

.result-item.active {
    background-color: #ba102c;
    color: white;
}

    .result-item.active .title,
    .result-item.active .dist,
    .result-item.active .event-date {
        color: white;
    }


 

/*sm+*/
@media (min-width: 576px) {
    .result-list {
        max-height: unset;
    }
}

/*md+*/
@media (min-width: 768px) {
}

/*lg+*/
@media (min-width: 992px) {
    .topnav a {
        border-right: 1px solid white;
        display: inline-block;
        padding: 0em 1em 0em 1em;
    }
}

/*xl+*/
@media (min-width: 1200px) {
}




.heatrae-btn {
    cursor: pointer;
    background-position: bottom right;
    background-size: auto;
    background-repeat: no-repeat;
    display: inline-block;    
    font-size: 1.125em;
    padding-top: 0.4em;
    padding-right: 1.3em;
    padding-bottom: 0;
    padding-left: 1.3em;
    text-align: center;
    transition: color 0.4s ease;
    min-height: 46px;
    line-height: 27px;
    animation-name: fadeBack;
    animation-duration: .3s;
    animation-iteration-count: 0;
    animation-play-state: running;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='550' height='200' viewBox='0 0 550 200'%3E%3Cpath stroke='%23ba102c' stroke-width='2px' fill-opacity='0' d='M-1,-1 L549,-1 L549,185.5 L535.5,199 L-1,199 L-1,-1 Z'/%3E%3C/svg%3E");
    border-top: 2px solid #ba102c;
    border-left: 2px solid #ba102c;
    color: #ba102c !important;
    white-space: nowrap;
    width: 100%;
}

    .heatrae-btn:hover { 
        background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='550' height='200' viewBox='0 0 550 200'%3E%3Cpath stroke='%23ba102c' stroke-width='2px' fill='%23ba102c' fill-opacity='1' d='M-1,-1 L549,-1 L549,185.5 L535.5,199 L-1,199 L-1,-1 Z'/%3E%3C/svg%3E");
        color: white !important; 
    }

.heatrae-btn-input {
    padding-bottom: 0;
    padding-left: 1.3em;
    padding-right: 1.3em;
    border: none;
    height: 42px;
    color: #ba102c !important;
}

.heatrae-btn .fa-chevron-right {
    margin-left: 1.3em;
}
.heatrae-btn-input,
.heatrae-btn-text {
    width: calc(100% - 2.6rem);
    display: inline-block;
}