Cropped, excerpts & cards 2. Header built manually
View SC header version
Edit SC name=header1
Cropped, excerpts & cards  1. Header, built w. sc:header1

Edit SC name=cropped

1 Edit SC name=excerpts
Excerpts shortcode wide
This enables the automatic generation of cards ...

[ sc name=”card_05n” c_w_vw=”18vw” c_h_vw=”18vw”] • 50% version: cropped-excerpts-cards • 80728 … SC name=card_05n
Excerpts shortcode
This 2 enables the automatic generation of cards ...

• 50% version: cropped-excerpts-cards • 80728 … SC name=card_05n

Edit SC name=excerpts
This enables ...

View HTML Code
[ lgc_column grid="33" tablet_grid="50" mobile_grid="100" last="true" ] < section class="post_wrap4" style="margin-bottom:0.67vw; margin-right:1vw;" > < section class="crop_01" >< img src="/wp-content/uploads/IMG.jpg"/ > < div class="caption_01" >< f700>Excerpt< /f700 >< /div >< /section > < section class="container_01" >< div class="title_01">< f700 >Title_01< /f700 >< /div > < div class="body_01" >Body_01< /div> $$enclosed_content$$< /section >< /section >[ /lgc_column ] [ sc name="excerpts" pc="33" tab="50" mob="100" last="false" frame_01="post_wrap4" crop_01_pc_W="30%" crop_01_pc_H="30%" crop_01_tab_W="33%" crop_01_mob_W="33%" crop_float_01="left" crop_01_mrg="0 1% 0 0" imgname_01="LAKE.jpg" caption_01="1" op_pct="0.9" title_01="Excerpts shortcode" body_01="This enables the automatic generation of cards ... " container_01_pc_W="69%" container_01_pad_W="66%" container_01_mob_W="66%" container_01_pc_pdg="8px 4px 4px 4px" container_01_bkg="rgba(250,250,250,0.8)" ]< hr/>< hr class="_5">• MORE: [ wpbb post:slug] • [ wpbb post:id] ... [ /sc]

View CSS file
.caption_01 {position:absolute; top:0; left:0; bottom:0; right:0; text-align:center; color:rgba(255,255,255,1); text-shadow:1px 1px #000000; z-index:53;} @media (min-width:1025px) {.caption_01 {padding:0.5vw 0.5vw; font-size:2.2vw; line-height:110%;}} @media (min-width:768px) and (max-width:1025px) {.caption_01 {padding:0.5vw 0.5vw; font-size:3.0vw; line-height:120%;}} @media only screen and (max-width:767px) {.caption_01 {padding:0.5vw 0.5vw; font-size:4.4vw; line-height:120%;}} .title_01 {position:relative; padding:0 0.5vw; text-align:left; line-height:120%; z-index:53;} @media (min-width:1025px) {.title_01 {font-size:1.5vw; margin-bottom:0.2vw; color:black;}} @media (min-width:768px) and (max-width:1025px) {.title_01 {font-size:2.7vw; margin-bottom:0.4vw; color:black;}} @media only screen and (max-width:767px) {.title_01 {font-size:4.4vw; margin-bottom:0.5vw; color:black;}} .body_01 {position:relative; padding:0 0.5vw; text-align:left; line-height:135%; z-index:53;} @media (min-width:1025px) {.body_01 {font-size:1.2vw; color:black;}} @media (min-width:768px) and (max-width: 1025px) {.body_01 {font-size:1.9vw; color:black;}} @media only screen and (max-width:767px) {.body_01 {font-size:3.4vw; color:black;}} .container_01 {position:relative; overflow:hidden; background-color:%%container_01_bkg:rgba(250,250,250,0.4)%%;} @media (min-width:1025px) {.container_01 {width:%%container_01_pc_W:69% %%; min-height:22.5%; padding:%%container_01_pc_pdg:1px 1px 1px 8px%%;}} @media (min-width:768px) and (max-width:1025px) {.container_01 {width:%%container_01_pad_W:66% %%; min-height:22.5%;}} @media only screen and (max-width:767px) {.container_01 {width:%%container_01_mob_W:66% %%; min-height:25%;}} .crop_01 img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; z-index:51; opacity:%%op_pct:0.85%%;} .crop_01 {position:relative; overflow:hidden; background-color:black; float:%%crop_float_01:left%%; margin:%%crop_01_mrg:0 1% 4px 0%%;} @media (min-width:1025px) {.crop_01 {width:%%crop_01_pc_W:30% %%; padding-top:%%crop_01_pc_H:30% %%;}} @media (min-width:768px) and (max-width:1025px) {.crop_01 {width:%%crop_01_tab_W:33% %%; padding-top:22.5%;}} @media only screen and (max-width:767px) {.crop_01 {width:%%crop_01_mob_W:33% %%; padding-top:23%;}} .wrapper_01 {border:1px solid rgba(100,120,130,0.3); margin: 0 0 4px 0;} @media (min-width:1025px) {.wrapper_01 {padding:1vw 5vw 1.5vw; background:#e0e0e0; height:100%; overflow:hidden;}} @media (min-width:768px) and (max-width:1025px) {.wrapper_01 {padding:1vw 3vw; background:e0e0e0; height:100%; overflow:hidden;}} @media only screen and (max-width:767px) {.wrapper_01 {padding:1vw 1vw; background:e0e0e0; height:100%; overflow:hidden;}}