﻿/************************************************************************************************
 * File Name: package-slider
 * File Type: css
 * Author: Sam Neel
 * Created on: 8/1/2011
 * Last Modified On: 06/17/2024
 * Copyright: ©2024 Brandt Information Services, Inc.
 * Description: Code
 ************************************************************************************************/

.activities {
    text-align: left;
}

    .activities.filterRow {
        margin-top: 20px;
    }

    .activities .filter .filterHeader,
    .activities .filter .filterHeaderMobile {
        margin: 0 auto;
        background-color: #f6f6f6;
        border-radius: 4px 4px 0px 0px;
        text-transform: uppercase;
        font-weight: 400;
        color: #717171;
    }

    .activities .filter .filterHeaderMobile {
        font-size: 13.89525235px;
        width: 134.32077268px;
        height: 30px;
        line-height: 30px;
    }

    .activities .filter .filterHeader {
        display: none;
    }

    .activities .filter .filterButtons {
        width: 285px;
        margin-left: auto;
        margin-right: auto;
        background-color: white;
        border: 1.1579377px solid #d5d5d5;
        border-radius: 42px;
        box-shadow: 0 1.73690654px 1.1579377px rgba(0, 0, 0, 0.1);
    }

        .activities .filter .filterButtons .filterButton {
            font-size: 13px;
            font-weight: 400;
            line-height: 21px;
            padding: 0 16px;
            padding-top: 10px;
            padding-bottom: 8px;
            height: initial;
            text-transform: uppercase;
            margin: 8px 2px;
        }

            .activities .filter .filterButtons .filterButton.residentButton {
                margin-left: 0;
            }

            .activities .filter .filterButtons .filterButton.nonResidentButton {
                margin-right: 0;
            }

            .activities .filter .filterButtons .filterButton.filterButtonActive,
            .activities .filter .filterButtons .filterButton:hover {
                color: #ffffff;
                border-radius: 33px;
                box-shadow: 0 1.1579377px 0.57896885px rgba(0, 0, 0, 0.25), inset 0 -1.1579377px 0 #3c8c3f;
            }

    .activities .filter small {
        margin-top: 15px;
    }

.activityCardWrapper {
    margin-top: 10px;
}

.activities.cards .activityCardWrapper .activityCard {
    border-width: 1px;
    border-style: solid;
    border-color: #d5d5d5;
    border-radius: 4.63175078px;
    box-shadow: 0 1.1579377px 0.57896885px rgba(0, 0, 0, 0.1);
    position: relative;
    padding: 0 20px 40px;
    margin-left: 15px;
    margin-right: 15px;
}

    .activities.cards .activityCardWrapper .activityCard .priceContainer {
        position: absolute;
        top: -1px;
        right: -1px
    }

        .activities.cards .activityCardWrapper .activityCard .priceContainer .priceBox {
            min-width: 81.28722623px;
            height: 53.49672153px;
            padding: 0 14px;
            border-radius: 0px 5.55810094px;
        }

            .activities.cards .activityCardWrapper .activityCard .priceContainer .priceBox p {
                color: white;
                line-height: 53.49672153px;
                font-size: 20px;
                position: relative;
                left: -4px;
            }

            .activities.cards .activityCardWrapper .activityCard .priceContainer .priceBox span.dollarSymbol {
                /* Text style for "$" */
                font-size: 15px;
                position: relative;
                top: -3px;
                left: 4px;
            }

            .activities.cards .activityCardWrapper .activityCard .priceContainer .priceBox span.nonResPrice {
                display: none;
            }

    .activities.cards .activityCardWrapper .activityCard .cardIcon {
        margin-top: 3.49672153px;
    }

        .activities.cards .activityCardWrapper .activityCard .cardIcon img {
            margin-top: 16px;
            width: 90px;
        }

    .activities.cards .activityCardWrapper .activityCard .cardTitle h3 {
        font-size: 24px;
        font-weight: 400;
    }

    .activities.cards .activityCardWrapper .activityCard .cardContent p {
        color: #212121;
        font-size: 13px;
        font-weight: 300;
        overflow: hidden;
        max-height: 55px;
    }

    .activities.cards .activityCardWrapper .activityCard .cardLink p {
        font-weight: 400;
        font-size: 20px;
    }

        .activities.cards .activityCardWrapper .activityCard .cardLink p:hover,
        .activities.cards .activityCardWrapper .activityCard .cardLink p:focus {
            color: #469449;
            cursor: pointer;
            text-decoration: none;
        }

.activities .horizontalLine {
    display: none;
}
/* custom */
@media only screen and (min-width: 375px) {
    .activities .filter .filterButtons {
        /*width: 266px;*/
    }

    .activities.cards .activityCardWrapper .activityCard:hover {
    }
}
/* Extra Small Devices, Phones */
@media only screen and (min-width: 480px) {
    .activities.cards {
        display: block;
    }

        .activities.cards.withSwiper {
            /* display: none;*/
            display: block;
        }
}
/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
    .activities .filter {
        padding: 0;
    }

        .activities .filter .filterHeader {
            display: block;
            font-size: 16px;
            width: 207px;
            height: 41px;
            line-height: 41px;
        }

        .activities .filter .filterHeaderMobile {
            display: none;
        }

    .activities .horizontalLine {
        display: block;
        margin-top: 58px;
    }
}
/* Medium Devices, Desktops */
/*@media only screen and (min-width: 992px) {*/
.activities .activityCardWrapper .activityCard {
    height: 240px;
}
/*}*/
