Card designer ∫Designer2: card & excerpt combined•
Card designer
Excerpt structure: p1/contain card/layer_h1/title/body: 
sc name="card4" N="·c4a"
contain·c4a · title·c4a · body·c4a
ACF_quote
HEIGHT BY CARD | The card4 shortcode has no wrapper. width:%W:90% %; padding-top:max-content; MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT…
Card designer
Excerpt structure: contain pw5/title/body: 
sc name="card4" N="·c4a"
contain·c4a · title·c4a · body·c4a
ACF_quote
HEIGHT BY CONTENT | The card4 shortcode has no wrapper. width:%W:90% %; padding-top:max-content; MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT… MUCH MORE CONTENT… MORE CONTENT… MORE CONTENT… MUCH MORE CONTENT…
Layer ·c4a_h1:
Card designer
Excerpt structure: p1/contain card/layer_h1/title/body: 
sc name="card4" N="·c4b"
contain·c4b · title·c4b · body·c4b
ACF_quote
HEIGHT BY CARD | The card4 shortcode has no wrapper. width:%W:90% %; padding-top:max-content; It maintains the ability to have animated layers based on “contain” or “contain2_”. It will NOT expand vertically with height:max-content
Card designer
Excerpt structure: contain pw5/title/body: 
sc name="card4" N="·c4b"
contain·c4b · title·c4b · body·c4b
ACF_quote
HEIGHT BY CONTENT | The card4 shortcode has no wrapper. width:%W:90% %; padding-top:max-content; It maintains the ability to have animated layers based on “contain” or “contain2_”. It will NOT expand vertically with height:max-content
Layer ·c4b_h1:
V2a
V2b
Card designer
Layer ·c3a_h1: EMPTY.png
Card designer
Excerpt shortcode structure: contain-card/layer_h1/contain2_/title/body: 
sc name="card3" N="·c3a"
contain2_·c3a · title·c3a · body·c3a
ACF_quote
The card3 shortcode uses the animated h1 card hover layer as the wrapper.
Card designer
Excerpt shortcode structure: contain_2/title/body: 
sc name="card2" N="·c2a"
contain2_·c2a · title·c2a · body·c2a
ACF_quote
The card2 shortcode has no wrapper.
Layer ·c3b_h1: EMPTY.png
Card designer
Excerpt shortcode structure: contain-card/layer_h1/contain2_/title/body: 
sc name="card3" N="·c3b"
contain2_·c3b · title·c3b · body·c3b
ACF_quote
The card3 shortcode uses the animated h1 card hover layer as the wrapper.
 
[ sc name="card1" N="·c1a" W="25%" H="25%" mgnR="1.5%" img1="LAKE.jpg" img2="HYTTE.jpg" h1_Yshift="0%" h1_transit="1s" rad="3px" b_="2px" b_st="dashed" b_col="dodgerblue" shadow="0px 0px 0px rgba(0,0,0,0)"][ /sc]
[ sc name="card2" N="·c2a"][ /sc]
Card designer
Excerpt shortcode structure: contain_2/title/body: 
sc name="card2" N="·c2b"
contain2_·c2b · title·c2b · body·c2b
ACF_quote
The card2 shortcode has no wrapper.
V2a
V2b
Card designer
Card designer
SC for the crop/hover img: 
sc name="card1" N="·c1c" W="30%" H="30%" mgnR="1.5%" img1="HYTTE.jpg" img2="LAKE.jpg" h1_Yshift="0%" h1_transit="1s" rad="3px" b_="2px" b_st="dashed" b_col="dodgerblue" shadow="0px 0px 0px rgba(0,0,0,0)"
contain2_ · title · body
ACF_quote
Version to update.
Edit SC
The card1 shortcode shown in column 1 makes it easy to insert a hover/crop card image. The card height finally controlled by % thru padding-top in the card container. Card2 is excerpt text only. Card3 is animated with the h1 hover wrapper.
.contain {width:x%; padding-top:y%}
Card height is defined in the contain class:width:49%; padding-top:49%; margin-right:1%;
class=”contain_06n5 card_06n5″ | 49%+1% mgn | !!The two classes must be set in the SAME div!!
Layer _06n5_h1: LAKE
Layer _06n5_h1: EYE