.card-how--vertical{width:25%;flex-direction:column;object-fit:cover;display:grid;grid-template-rows:1fr 4fr 2fr;align-items:center;position:relative;min-height:300px;justify-items:center;overflow:hidden;border:1px solid var(--color-secondary);:first-child{min-width:100%;grid-row:1/1;font-size:1.25rem;font-weight:600;background:var(--color-secondary);color:white;height:100%;display:flex;justify-content:center;align-items:center}img{z-index:0;object-position:0 10%;grid-row:2/2}.description{grid-row:3/3;text-align:left;max-width:100%;min-height:100%;display:flex;align-items:flex-start;padding:15px 30px}h4{font-size:1rem}}.card-how--horizontal{width:100%;object-fit:cover;display:grid;grid-template-rows:0 auto 60px;grid-template-columns:50% 15% 15% 20%;position:relative;justify-items:center;overflow:hidden;align-items:center;h3{background:var(--color-secondary);color:white;bottom:0;flex-direction:row;font-weight:600;grid-row:3/3;width:100%;grid-column:1/2;animation:slideToTop .5s ease-in}.index,h3{height:100%;position:absolute;display:flex;align-items:center;justify-content:center;z-index:1}.index{min-height:90px;max-height:90px;min-width:90px;max-width:90px;grid-row:1/2;grid-column:1/1;left:0;top:0;background:var(--color-primary)}p{font-size:3rem;font-weight:700;color:white;animation:fadeIn .5s ease-in}img{z-index:0;grid-row:2/4;grid-column:1/2;border-top:5px solid var(--color-primary);width:100%;position:relative}.bloc{grid-row:1/4;grid-column:2/6;display:flex;flex-direction:column;justify-content:center;z-index:1;padding:35px 70px;background:rgb(243,243,243);min-height:100%;min-width:100%;margin:15px 0;ul{display:none;display:flex;flex-direction:column;justify-content:flex-start;z-index:3;li{list-style:square;text-align:left;border-bottom:1px solid lightgrey;position:relative;padding:20px 0;letter-spacing:.25px;line-height:23px}li:last-child{border:none}li::marker{color:var(--color-primary);animation:fadeIn .5s ease-in}}}.card-how--horizontal:first-child{img{object-position:25% 0}}}@media (min-width:701px) and (max-width:1120px){.card-how--vertical{width:100%;min-height:300px;grid-template-rows:2fr 8fr auto;img{object-position:0 20%}}.card-how--horizontal:first-child{img{object-position:55% 0}}}@media (max-width:700px){.card-how--vertical{width:100%;min-height:120px;justify-items:center;overflow:hidden;border:1px solid var(--color-secondary);margin:5px 0;p{font-size:1rem;padding:5px 0}img{object-position:0 15%}.description{padding:10px 10px 0}}.card-how--horizontal{grid-template-rows:auto auto 250px auto;grid-template-columns:1fr;min-height:auto;.index{min-height:60px;max-height:60px;min-width:60px;max-width:60px;grid-row:2/3;animation:inherit;p{font-size:2rem;font-weight:600}}h3{background:transparent;color:black;position:relative;bottom:0;padding-bottom:15px;grid-row:1/1;animation:fadeIn .5s ease}img{z-index:0;grid-row:3/3;border-top:5px solid var(--color-primary);animation:inherit;animation-delay:.5s;object-position:50% 25%}.bloc{border-bottom:none;grid-row:4/4;grid-column:1/1;padding:20px 30px 20px 40px;min-height:auto;margin:0;ul{li{padding:15px 0;line-height:25px}li::marker{animation:inherit}}}}}