/* ======================================================== */
/* Elements in the Home (index) page */
/* ======================================================== */
 .main-index-box {
     width: 100%;
     max-width: 1200px;
     margin: 30px 0 40px 0;
}
.naturotherapy {
    width:90%;
    margin:0 auto;
    background-color:#FFFEF8;
    border:4px solid #C8DBCC;
    padding:10px;
    margin-bottom:20px;
    border-radius:10px;
}
.naturotherapy p {
    color: #113f11;
    padding:10px;
    line-height:1.4rem;
    font-size:1rem;
}
/*Card Flex Code*/
/* card-wrap-outer and card-wrap-inner together don't interfere with formatting on small screens, as a column */
 .card-wrap-outer {
     display: flex;
     flex-direction: row;
     flex-wrap: wrap;
     justify-content: space-around;
     align-content: center;
     width: 100%;
     gap:10px;
}
 .card-wrap-inner {
     display: flex;
     flex-direction: row;
     width: 32%;
}
 .card {
     display: flex;
     flex-direction: column;
     width: 100%;
}
 .card-title h2 {
     padding: 8px 18px;
     text-align: center;
     color:#225F32;
     font-size:1.3rem;
}
 .card-image {
     background-color: #2B7139;
     border-top-left-radius:15px;
     border-top-right-radius: 15px;
}
 .card-image img {
     width: 100%;
     border-top-left-radius: 15px;
     border-top-right-radius: 15px;
}
 .card-text {
     background-color: #2B7139;
     padding: 12px 18px 4px 18px;
     color:#fff;
     line-height:1.3rem;
     font-size:1rem;
}
    /* flex-grow:1 causes the text to fill up to the level of the others in that row */
 .flexible {
     flex-grow: 1;
}
 small {
     font-size:0.9rem;
     color:#fff3a5;
}
 .card-footer {
     padding: 0 18px 20px 18px;
     background-color: #2B7139;
     border-bottom-left-radius: 15px;
     border-bottom-right-radius: 15px;
}
 .card-footer a {
     color:#fff;
}

 @media screen and (max-width: 800px) {
     .card-wrap-outer {
         gap:6px;
    }
     .card-wrap-inner {
         width: 48%;
    }
}
 @media screen and (max-width: 550px) {
     .card-wrap-outer {
         gap: 8px;
         padding:0 6px;
    }
     .card-wrap-inner {
         width: 100%;
    }
}