lgc_column grid="25"
sc name="card_06n
‹article class="wrap_06n"› ‹section class="card_06n"› ‹img src="/wp-content/EYE.jpg"/› ‹article class="info_06n_o"› ‹div class= "row_06n_t"› ‹card_06n_t›Title_06n_o‹/card_06n_t›‹/div›‹div class= "row_06n_p"› ‹card_06n_p›Description_06n_o‹/card_06n_p›(EYE.jpg)‹/div›‹/article› ‹article class="layer_06n_h"› ‹img src= "/wp-content/MOORE.jpg"/› ‹/article› ‹article class= "layer_06n_h_o"› ‹div class= "row_06n_t"› ‹card_06n_t›Title_06n_h_o‹/card_06n_t›‹/div›‹div class= "row_06n_p"› ‹card_06n_p›Description_06n_h_o‹/card_06n_p›(MOORE.jpg)‹/div›‹div class= "row_06n_b"› ‹a href='/'class='popup'.›‹button›Btn_06n_h_o‹/button›‹/a› ‹/div›‹/article› ‹/section› ‹/article›
/*HOVER/REVEAL_INFO_LAYER2_INFO > layer_06n_h_o z:11;*/.card_06n:hover .layer_06n_h_o {opacity:1; transform:translateY(0px); transition:0.5s ease-in; color:%%layer_06n_h_o_col:rgba(255, 255, 255, 1)%%;}.card_06n .layer_06n_h_o {opacity:0; position:absolute; top:%%info_06n_h_o_top%%; bottom:%%info_06n_h_o_bottom%%; width:100%; max-width:500px; padding:%%pad_06n:14px 28px 14px 34px%%; color:%%info_06n_col:rgba(255, 255, 255, 1)%%; transform:translateY(0px); transition:0.5s; z-index:11;} /*HOVER/REVEAL_LAYER_1_IMG > layer_06n_h z:10;*/.card_06n:hover .layer_06n_h {opacity:1; transform:translateY(0px); } /* Hover area opacity & shift */.layer_06n_h img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; border-radius:%%rad_06n:0px%%; z-index:51;}.card_06n .layer_06n_h {opacity:0; position:absolute; top:0; width:100%; height:100%; padding:40px; border-radius:%%rad_06n:0px%%; color:%%info_06n_col:rgba(255, 255, 255, 1)%%; transform:translateY(0px); transition:0.6s; z-index:10;} /*CARD BACKGROUND OVERLAY (PRE-HOVER) > info_06n_o */.card_06n:hover .info_06n_o {opacity:0; transform:translateY(0px);}.card_06n .info_06n_o {opacity:1; position:absolute; top:%%info_06n_o_top%%; bottom:%%info_06n_o_bottom%%; width:100%; padding:%%pad_06n:14px 28px 14px 34px%%; color:%%info_06n_o_col:rgba(255, 255, 255, 1)%%; } /*CARD BACKGROUND PRE-HOVER | HOVER LAYERS BEHAVIOUR*/.card_06n:hover {transform:translateY(0px);} /* hover > card shift x-y */.card_06n:hover:before {opacity:1;} /* hover > card overlay color, 2nd opacity control */.card_06n:before {opacity:0; content:""; position:absolute; top:0; left:0; width:100%; height:100%; display:block; border-radius:%%rad_06n:0px%%; background:%%overlay_06n_col:rgba(0, 15, 35, 0.6)%%; transition:0.5s; z-index:2;}.card_06n img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; border-radius:%%rad_06n:0px%%;}.card_06n {position:relative; width:100%; height:100%; border-radius:%%rad_06n:0px%%; box-shadow:0px 7px 10px rgba(0,0,0, 0.5); transition:0.5s ease-out;}.wrap_06n {width:%%wrap_06n_W:100% %%; border:none; margin:auto;} @media (min-width:1025px) {.wrap_06n {height:%%wrap_06n_H:24vw %%}} @media (min-width:768px) and (max-width: 1025px) {.wrap_06n {height:30vw; }} @media only screen and (max-width:767px) {.wrap_06n {height:62vw; }}