/*

* Prefixed by https://autoprefixer.github.io

* PostCSS: v8.4.14,

* Autoprefixer: v10.4.7

* Browsers: last 4 version

*/



.cards__top-content {

    padding-bottom: 24px;

}



.card-flex {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-align: stretch;

        -ms-flex-align: stretch;

            align-items: stretch;

    -ms-flex-wrap: wrap;

        flex-wrap: wrap;

}



.card {

    display: -webkit-box;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

        -ms-flex-direction: column;

            flex-direction: column;

    -webkit-box-pack: justify;

        -ms-flex-pack: justify;

            justify-content: space-between;

    text-decoration: none;

    height: 100%;

    -webkit-transition: -webkit-transform .2s linear;

    transition: -webkit-transform .2s linear;

    -o-transition: transform .2s linear;

    transition: transform .2s linear;

    transition: transform .2s linear, -webkit-transform .2s linear;

    background: var(--color-white);

    border-radius: 4px;

    -webkit-box-shadow: 0 0 16px rgba(29, 66, 138, 0.16);

            box-shadow: 0 0 16px rgba(29, 66, 138, 0.16);

    -webkit-transition: -webkit-box-shadow 0.3s ease-in-out;

    transition: -webkit-box-shadow 0.3s ease-in-out;

    -o-transition: box-shadow 0.3s ease-in-out;

    transition: box-shadow 0.3s ease-in-out;

    transition: box-shadow 0.3s ease-in-out, -webkit-box-shadow 0.3s ease-in-out;

}



.card--link {

    position: relative;

    transform: scale(0.8) translate(0, 50px);

    opacity: 0;

}



.card__img-wrap {

    position: relative;

    width: 100%;

    height: 193px;

    padding: 9px;

}



.card__img {

    border-radius: 4px 4px 0 0;

    display: block;

}



.card__details {

    padding: 20px 25px 15px;

}



.card__details h4 {

    padding: 0 0 10px;

    font-size: 19px;

    color: #161E43;

}



.card__description p {

    color: var(--color-charcoal);

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;  

    overflow: hidden;

}



.card__bottom {

    padding: 0 25px 25px 30px;

}



.card__bottom .btn {

    font-size: 16px;

}



.cards__all-btn {

    margin-top: 55px;

}



.card-flex {

    justify-content: center;

}



.card-item:not(:last-child) {

    margin-bottom: 32px;

}



@media (min-width: 1200px) {

    .card-item:not(:last-child) {

        margin-bottom: 0;

    }

}



@media (min-width: 1200px) {

    .card:hover {

        -webkit-box-shadow: 0 0 16px rgba(29, 66, 138, 0.50);

                box-shadow: 0 0 16px rgba(29, 66, 138, 0.50);

    }



    .card:hover .btn-tertiary:after {

        -webkit-animation: shake 5s ease infinite;

                animation: shake 5s ease infinite;

    }



    .card-item {

        -webkit-filter: blur(0px);

                filter: blur(0px);

        -webkit-transform: scale(1);

            -ms-transform: scale(1);

                transform: scale(1);

        opacity: 1;

        -webkit-transition: opacity 0.3s ease-in-out,

                    -webkit-filter 0.3s ease-in-out,

                    -webkit-transform 0.25s ease-in-out;

        transition: opacity 0.3s ease-in-out,

                    -webkit-filter 0.3s ease-in-out,

                    -webkit-transform 0.25s ease-in-out;

        -o-transition: filter 0.3s ease-in-out,

                    opacity 0.3s ease-in-out,

                    transform 0.25s ease-in-out;

        transition: filter 0.3s ease-in-out,

                    opacity 0.3s ease-in-out,

                    transform 0.25s ease-in-out;

        transition: filter 0.3s ease-in-out,

                    opacity 0.3s ease-in-out,

                    transform 0.25s ease-in-out,

                    -webkit-filter 0.3s ease-in-out,

                    -webkit-transform 0.25s ease-in-out;

    }



    

    .card-item.is-not-focused {

        -webkit-transform: scale(0.95);

            -ms-transform: scale(0.95);

                transform: scale(0.95);

        opacity: 0.65;

    }

}

@media (min-width: 1366px) {



    .cards__top-content {

        padding-bottom: 15px;

    }

    

}





