@font-face {
    font-family: "Sinkin Sans 300";
    src: url("../fonts/SinkinSans-300Light.eot");
    src: url("../fonts/SinkinSans-300Light.eot?#iefix") format("embedded-opentype"), url("../fonts/SinkinSans-300Light.woff2") format("woff2"), url("../fonts/SinkinSans-300Light.woff") format("woff"),
        url("../fonts/SinkinSans-300Light.ttf") format("truetype"), url("../fonts/SinkinSans-300Light.svg#SinkinSans-300Light") format("svg");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Sinkin Sans 500";
    src: url("../fonts/SinkinSans-500Medium.eot");
    src: url("../fonts/SinkinSans-500Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/SinkinSans-500Medium.woff2") format("woff2"), url("../fonts/SinkinSans-500Medium.woff") format("woff"),
        url("../fonts/SinkinSans-500Medium.ttf") format("truetype"), url("../fonts/SinkinSans-500Medium.svg#SinkinSans-500Medium") format("svg");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Sinkin Sans 400";
    src: url("../fonts/SinkinSans-400Regular.eot");
    src: url("../fonts/SinkinSans-400Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/SinkinSans-400Regular.woff2") format("woff2"), url("../fonts/SinkinSans-400Regular.woff") format("woff"),
        url("../fonts/SinkinSans-400Regular.ttf") format("truetype"), url("../fonts/SinkinSans-400Regular.svg#SinkinSans-400Regular") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body {
    margin: 0;
    color: #181716;
}
*,
::after,
::before {
    box-sizing: border-box;
    margin: 0;
}
img {
    max-width: 100%;
}
.flip-card {
    background-color: transparent;
    max-width: 570px;
    perspective: 1000px;
    margin: 35px auto;
    padding: 35px;
    border: 1.5px solid #4d8d30;
    height: 350px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

/* .flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
} */

/* .flip-card-front,
.flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
} */

/* .flip-card-back {
    transform: rotateY(180deg);
    position: relative;
} */
a {
    color: #181716;
    text-decoration: none;
}
.cardHolder {
    margin-top: 20px;
}
.cardHolder h2 {
    font-family: "Sinkin Sans 400";
    font-size: 24px;
    margin-bottom: -6px;
}
.cardHolder p {
    color: #4f9032;
    font-family: "Sinkin Sans 500";
    font-size: 13px;
    line-height: 18px;
}
.cardDes p {
    font-family: "Sinkin Sans 400";
    font-size: 14px;
    line-height: 20px;
    margin: 20px 0;
}
.cardContactDetail {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.cardContactDetail p {
    font-family: "Sinkin Sans 400";
    font-size: 14px;
    line-height: 20px;
}
.text-right {
    text-align: right;
}
.cardBackInner p span {
    color: #4f9032;
}
.cardBackInner p {
    font-size: 20px;
    line-height: 26px;
}
.cardBackInner {
    position: absolute;
    left: 0;
    bottom: 0px;
}
.cardBackInner p {
    font-family: "Sinkin Sans 400";
    font-size: 24px;
    line-height: 30px;
}
@media screen and (max-width: 590px) {
  .flip-card {
    max-width: 430px;
    height: 328px;
}
.cardContactDetail p {
    font-family: "Sinkin Sans 400";
    font-size: 12px;
    line-height: 18px;
}
}
@media screen and (max-width: 440px) {
  .flip-card {
      max-width: 340px;
      height: 300px;
      padding: 20px;
  }
  .cardContactDetail p {
    font-size: 10px;
}
}