.flip-cards-list {display: flex; flex-wrap: wrap; flex-direction: row;}
.flip-cards-list .flip-card {padding-bottom: 24px;width: 254px; max-width: 100%; min-height: 332px;box-sizing: content-box;-webkit-perspective: 1000px; -moz-perspective: 1000px;perspective: 1000px;display: flex;}
.flip-cards-list .flip-card {padding-left: 24px; padding-right: 24px;}
.flip-cards-list .flip-card .body {
    position: relative;
    width: 254px; 
    max-width: 100%; 
    min-height: 332px;
    -webkit-transition: transform 0.8s;
    -moz-transition: transform 0.8s;
    -ms-transition: transform 0.8s;
    -o-transition: transform 0.8s;
    transition: transform 0.8s;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d;
    display: flex;
    flex-wrap: wrap;
}
.flip-cards-list .flip-card.flip-effect .body {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.flip-cards-list .flip-card .front,
.flip-cards-list .flip-card .back {display: flex; flex-direction: column; width: 100%; height: auto; max-width: 100%; border-radius: 8px; top: 0px; left: 0px; overflow: hidden; background-position-y: 96%; background-position-x: 88%;cursor: pointer;padding: 0px; -webkit-backface-visibility: hidden;backface-visibility: hidden;}
.flip-cards-list .flip-card .back {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
    height: 100%;
    position: absolute;
}

.flip-cards-list .flip-card .bottom .circle-shape .download-icon {
    background-color: #FFDF6F;
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.purple .front,
.flip-cards-list .flip-card.purple .back {
    background-color: #92278F;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/purple-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.purple .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/purple-download-arrow.png');
}

.flip-cards-list .flip-card.blue .front,
.flip-cards-list .flip-card.blue .back {
    background-color: #0C57AD;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/blue-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.blue .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/blue-download-arrow.png');
}

.flip-cards-list .flip-card.green .front,
.flip-cards-list .flip-card.green .back {
    background-color: #0E9251;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/green-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.green .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/green-download-arrow.png');
}

.flip-cards-list .flip-card.light-blue .front,
.flip-cards-list .flip-card.light-blue .back {
    background-color: #37ACA4;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/light-blue-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.light-blue .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/light-blue-download-arrow.png');
}

.flip-cards-list .flip-card.light-green .front,
.flip-cards-list .flip-card.light-green .back {
    background-color: #80BB41;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/light-green-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.light-green .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/light-green-download-arrow.png');
}

.flip-cards-list .flip-card.orange .front,
.flip-cards-list .flip-card.orange .back {
    background-color: #D0760A;
    background-image: url(/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/orange-card-bg-dots.png);
    background-repeat: no-repeat;
}

.flip-cards-list .flip-card.orange .bottom .circle-shape .download-icon {
    background-image: url('/wp-content/themes/fx/assets/img/blocks/innerpage/flip-cards-list/orange-download-arrow.png');
}

.flip-cards-list .flip-card .back .content {
    height: 68%;
    text-decoration: none;
}

.flip-cards-list .flip-card .back .bottom:after {
    display: none;
}

.flip-cards-list .flip-card .front {
    position: relative;
    text-decoration: none;
}

.flip-cards-list .flip-card .bottom{
    width: 100%;
    height: auto;
    position: relative;
}
.flip-cards-list .flip-card .bottom .circle-shape {
    content: " ";
    width: 204.23px;
    height: 204.23px;
    background: #AF3FAC;
    border-radius: 50%;
    margin-bottom: -60px;
    margin-left: -26px;
    display: flex;
    justify-content: center;
    padding-top: 55px;
    text-decoration: none;
}

.flip-cards-list .flip-card.purple .bottom .circle-shape {
    background-color: #AF3FAC;
}

.flip-cards-list .flip-card.blue .bottom .circle-shape {
    background-color: #207DE9;
}

.flip-cards-list .flip-card.green .bottom .circle-shape {
    background-color: #26B16D;
}

.flip-cards-list .flip-card.light-blue .bottom .circle-shape {
    background-color: #4DC1B9;
}

.flip-cards-list .flip-card.light-green .bottom .circle-shape {
    background-color: #99CC63;
}

.flip-cards-list .flip-card.orange .bottom .circle-shape {
    background-color: #F7941D;
}

.flip-cards-list .flip-card .bottom .circle-shape span {
    font-family: var(--font-inter);
    font-style: normal;
    font-weight: 600;
    font-size: 18px;
    line-height: 28px;
    color: #fff !important;
}

.flip-cards-list .flip-card .bottom .circle-shape img {
    width: 18px;
    height: 24px;
    padding-top: 5px;
}

.flip-cards-list .flip-card .bottom .circle-shape .download-icon {
    position: absolute;
    content : " ";
    width: 53.31px;
    height: 53.31px;
    left: 55%;
    top: 8%;
    border-radius: 50%;
    background-position: center center;
    text-decoration: none;
}
.flip-cards-list .flip-card .tag {
    position: absolute;
    top: 16px;
    right: 0px;
    background: #FFFFFF;
    border-radius: 23px 0px 0px 23px;
    font-family: var(--font-inter);
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    display: flex;
    align-items: center;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #222222;
    padding: 8px 12px;
    line-height: 12px;
}

.flip-cards-list .flip-card .content {
    padding: 0px;
    padding-top: 48px;
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 24px;
    height: 100%;
    text-decoration: none;
}

.flip-cards-list .flip-card .content .inner {
    width: 100%;
    display: block;
    overflow-y: auto;
    height: 100%;
}

.flip-cards-list .flip-card .content .inner p {
    font-family: var(--font-inter);
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #FFFFFF !important;
}

.flip-cards-list .flip-card .content .inner::-webkit-scrollbar {width: 10px;}
  
/* Track */
.flip-cards-list .flip-card .content .inner::-webkit-scrollbar-track {background: #f1f1f1;}
  
/* Handle */
.flip-cards-list .flip-card .content .inner::-webkit-scrollbar-thumb {background: #888;}
  
/* Handle on hover */
.flip-cards-list .flip-card .content .inner::-webkit-scrollbar-thumb:hover {background: #555;}

.flip-cards-list .flip-card .content h5{
    font-family: var(--font-inter);
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 22px;
    display: flex;
    align-items: center;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #FFFFFF !important;
    margin-bottom: 4px;

}

.flip-cards-list .flip-card .content h3 {
    font-family: var(--font-inter);
    font-style: normal!important;
    font-weight: 900!important;
    font-size: 24px!important;
    line-height: 30px!important;
    display: flex!important;
    align-items: center!important;
    letter-spacing: -0.018em!important;
    color: #FFFFFF !important;
    margin-bottom: 0px!important;
}

@media (min-width: 1025px) {
    .flip-cards-list-section .main-intro p {font-size: 21px; line-height: 35px; letter-spacing: -0.0055em;}
}

@media (max-width: 1024px) {
    .flip-cards-list {margin-top: 48px;justify-content: normal;}
    .flip-cards-list-section {padding-bottom: 48px; padding-top: 48px;}
}

@media (max-width: 599px) {
    .flip-cards-list .flip-card {display: flex; flex: 50%; max-width: 100%; box-sizing: border-box;}
}

@media (max-width: 507px) {
    .flip-cards-list, .flip-cards-list .flip-card {justify-content: center;}
    .flip-cards-list .flip-card {flex: 100%!important;}
}