﻿@media screen and (max-width: 567px) {
    .card-text {
        margin-bottom: 0.5em;
    }
}

.card {
    margin: 5%;
    flex-direction: row;
}

.card-body {
    padding: 0.5em 1em;
}

.card1.card img {
    max-width: 12em;
    height: 100%;
    border-bottom-left-radius: calc(0.25rem - 1px);
    border-top-left-radius: calc(0.25rem - 1px);
}

.cardimage1 {
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    justify-items: center;
}
@media only screen and (min-width: 1100px) {
    .rowdiv {
        display: flex;
        flex-direction: row !important;
    }
}

.rowdiv img{
   object-fit:cover;
}
.cardbodyback {
    background: #0f0f0f !important;
    display: flex;
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
    justify-content: center;
}
.cardbodyback p {
    color:white!important;
}
    .cardbodyback .card-title {
        color: #ffc804!important;
    }
.cardbodyback li {
    list-style:none!important;
}
    .cardbodyback li i {
        color: #ffc804 !important;
    }
    .cardbodyback li  {
        color: white !important;
    }

.cardbodyback2 {
    background: #ffc804 !important;
    display: flex;
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
    justify-content: center;
}

.cardbodyback2 p {
    color: #0f0f0f !important;
}

.cardbodyback2 .card-title {
    color: #0f0f0f !important;
}

    .cardbodyback2 li {
        list-style: none !important;
    }

        .cardbodyback2 li i {
            color: #0f0f0f !important;
        }

.cardbodyback2 li {
    color: #0f0f0f !important;
}
ul{
    padding-left:0!important;
}
.carforMobile{
    display:none;
}
@media only screen and (min-width: 501px) and (max-width:1000px) {
    .carforMobile {
        display: block !important;
    }

    .carforDesktop {
        display: none !important;
    }
}
@media only screen and (max-width: 500px){
    .carforMobile {
        display: block !important;
    }
    .carforDesktop{
        display:none!important;
    }
}
/* Fade animation base */
.fade-scroll {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s ease, transform 0.8s ease;
    will-change: opacity, transform;
}

    /* When visible */
    .fade-scroll.show {
        opacity: 1;
        transform: translateY(0);
    }
