/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Apr 27 2026 | 17:54:57 */
/* ELA aplats automatic (v2) :: */
/* - DO : use colors vars : running...80% */

/* NB : if an aplat is DARK, then we must INVERT texts (...) color to be readable => so it DEPENS on choosen BACKGROUND colors vars */

/* DO : to apply invert approach, maybe #1 aplat style must be simplier : only apply on .aplat is the same => to do */
/* => so REPLACE all .aplat:nth-child(2n) WITH .aplat.invert AND .aplat:nth-child(2n+1) with .aplat !!! */

/* do not repeat here the invert styles, already defined 
=> so maybe clean all .aplats .aplat:nth-child(2n) styles ???
*/ 

.aplats {}

.logged-in .aplats {
	zzborder: 5px dotted cyan;
}

.aplats .aplat {
	padding: 4em 1em;
	background: var(--bkg-aplat-1);
	box-shadow: var(--sha-box-5);
}

@media only screen and (max-width: 480px) {
	.aplats .aplat {
		padding: 1em 1em;
	}
}

@media only screen and (max-width: 960px) {
	.aplat.spacing-8-3
	, .aplats.spacing-8-3 .aplat
	, .aplats.spacing-A .aplat
	{
		padding: 8em 1em 3em;
	}
}

/* aplat #1/2 */
.aplats .aplat:nth-child(2n+1) {
}

/* aplat #2/2 */
.aplats .aplat:nth-child(2n) {
	zzbackground: var(--bkg-aplat-2);
}

.aplats .aplat.invert {
	background: var(--bkg-aplat-2);
}

/* : aplat #2 - : is DARK, so inverts with vars :*/
.zzaplats .aplat:nth-child(2n) {
	--text : var(--text-inv);
	color: var(--text); /* patch for text color - sad */
	--title : var(--text-inv);
	--link : var(--link-inv);
	--link-hover : var(--link-inv-hover);
}

/* aplat #2 - titles */
.aplats .aplat:nth-child(2n) h2 
, .aplats .aplat:nth-child(2n) h3 
, .aplats .aplat:nth-child(2n) h4 {
	zzzzcolor: var(--text-inv);
}

/* aplat #2 - links */
.aplats .aplat:nth-child(2n) a {
	zzcolor: var(--link-inv);
}
.aplats .aplat:nth-child(2n) a:hover {
	zzcolor: var(--link-inv-hover);
}

/* aplat #2 - blockquotes */
.aplats .aplat:nth-child(2n) blockquote {
	color: inherit;
	border-color: inherit;
}
.aplats .aplat:nth-child(2n) blockquote:before {
	zzzzcolor: var(--text-inv);
}

.zzaplats .aplat:nth-child(2n) {
	--bullet: var(--text-inv); /* test change var values on context - GOOD practice */
}

/* aplat #2 - fa */
.aplats .aplat:nth-child(2n) .fa {
}

zz.aplats .aplat:nth-child(2n) .button.invert a {
	zzcolor: var(--text-inv);
	--text: var(--text-inv);
}

/* : aplats - CTAs : */
.aplats .aplat.CTA {
	background: none;
	background-color: var(--bkg-CTA);
	zzcolor: var(--text-inv);
	--text: var(--text-inv);
}

.aplats .aplat.CTA h2
, .aplats .aplat.CTA h3
, .aplats .aplat.CTA h4 {
	zzcolor: var(--text-inv);
	--text : var(--text-inv);
}

/* aplats - buttons */
/* #1 */
.aplats .aplat:nth-child(2n+1) .button a {
		zzbackground-color: var(--link-inv);
		zzcolor: var(--link);
}
.aplats .aplat:nth-child(2n+1) .button a:hover {
		zzcolor: var(--link-hover);
}

.aplats .aplat:nth-child(2n+1) .button a:hover .fa {
		color: var(--link-hover);
}

/* #2 */
zz.aplats .aplat:nth-child(2n) .button a .fa {
	color: var(--link);
}
.aplats .aplat.invert .button a .fa {
	color: var(--link);
}
.zzaplats .aplat:nth-child(2n) .button a:hover .fa {
	color: var(--link-inv);
}
.aplats .aplat.invert .button a:hover .fa {
	color: var(--link-inv);
}
zz.aplats .aplat:nth-child(2n) .button a {
		color: var(--link);
}
.aplats .aplat.invert .button a {
	color: var(--link);
}
zz.aplats .aplat:nth-child(2n) .button a:hover {
	color: var(--link-hover);
	zzborder-color: var(--link-inv);
}
.aplats .aplat.invert .button a:hover {
	color: var(--link-hover);
	zzborder-color: var(--link-inv);
}

/* aplats CTA buttons*/
.aplats .aplat.CTA .button a {
		zzbackground-color: var(--link-inv);
		zzcolor: #1e90ff;
}
.aplats .aplat.CTA .button a:hover {
		zzbackground-color:#1e90ff;
		zzcolor:  white;
}
.aplats .aplat.CTA .button a:hover .fa {
		zzcolor:  #1e90ff;
}

.aplats .aplat.CTA .button.CTA a {
		zzbackground-color: white;
		zzcolor: #ff2157;
		zzborder: 1px solid white;
}
.aplats .aplat.CTA .button.CTA a .fa {
		zzcolor:  #ff2157;
}

.aplats .aplat.CTA .button.CTA a:hover  {
		zzbackground-color: #ff2157;
		zzcolor:  white;
}
.aplats .aplat.CTA .button.CTA a:hover .fa {
		zbackground-color:#1e90ff;
		zzcolor:  white;
}

/* aplats - standards inner spacings */
/* only applied on wide */
@media only screen and (min-width: 960px) {
	.aplat.spacing-8-3
	, .aplats.spacing-8-3 .aplat
	, .aplats.spacing-A .aplat
	{
		padding: 8em 1em 3em;
	}
}
@media only screen and (min-width: 960px) {
	.aplat.spacing-4-3
	, .aplats.spacing-4-3 .aplat
	{
		padding: 4em 1em 3em;
	}
}

/* : no space styles : */
/* WRN : inconsistent names */
.aplats .aplat.no-space {
	padding: 0;
}
/* does not remove top bottom space : */
.aplats .aplat.no-spacing {
	padding-left: inherit;
	padding-right: inherit;
}

/* disabled - testing - patch : titles margin on aplat too big and not overlapping with internal padding... */
@media only screen and (max-width: 960px) {
	.aplat > h2
	, .aplat > div > h2
	, .aplat > h3
	, .aplat > div > h3 {
		zzmargin-top: 0;
	}
}

/* test 27 04 26 */
@media only screen and (max-width: 960px) {
	.aplat h2
	, .aplat h3 {
		margin-top: 0;
	}
}

/* : aplats + WC posts : */
/* #2 : dark mode : */
zz.aplats .aplat:nth-child(2n) .wc-shortcodes-posts-wrapper {
	zz--text : var(--text-inv);
	--link: var(--link-inv);
	color: var(--text);
}
.aplats .aplat.invert .wc-shortcodes-posts-wrapper {
	zz--text : var(--text-inv);
	--link: var(--link-inv);
	color: var(--text);
}
zz.aplats .aplat:nth-child(2n) .wc-shortcodes-entry-title a:not(:hover) {
	color: var(--link-inv);
}
.aplats .aplat.invert .wc-shortcodes-entry-title a:not(:hover) {
	color: var(--link-inv);
}
zz.aplats .aplat:nth-child(2n) .wc-shortcodes-entry-summary {
	color: var(--text-inv);
}
.aplats .aplat.invert .wc-shortcodes-entry-summary {
	color: var(--text-inv);
}

/* [EXP] aplat - reduce WC posts bottom margin */
.aplat .wc-shortcodes-posts.wc-shortcodes-posts-layout-grid .wc-shortcodes-post-box {
	margin-bottom: 1em;
}

/* aplats + WP post carousel */
/* # 2 */
.aplats .aplat:nth-child(2n) .light-theme.wp-posts-carousel .wp-posts-carousel-desc {
	zzzzcolor: var(--gris-clair);
}

/* aplats + highlight */
/* # 2 */
zz.aplats .aplat:nth-child(2n) .highlight {
	zzborder: 1px solid var(--border);
}
.aplats .aplat.invert .highlight {
	zzborder: 1px solid var(--border);
	--border: white;
}

/* test - style with aura effect - like rivery.io */
/* aplat #2/2 */
zz.aplats .aplat:nth-child(2n) {
	--bkg-aplat-2 : url('/wp-content/uploads/2015/09/WebExpress-maks-violin-273.webp'), var(--violet-600);
	zzbackground: var(--bkg-aplat-2);
	background-size: cover;
}
.aplats .aplat.invert {
	--bkg-aplat-2 : url('/wp-content/uploads/2015/09/WebExpress-maks-violin-273.webp'), var(--violet-600);
	zzbackground: var(--bkg-aplat-2);
	background-size: cover;
}

/* test oblique : */

/* : requires inner div (for balance) ! like block content, or manual insertd div */
.aplats.oblique {
	margin-top: 8em;
}
.aplats.oblique .aplat {
	transform: scale(1.1) rotate(-3.13deg);
	padding: 5em 2em 5em;	/* warning : keep 2em for horizontal padding */
	
}
/* : restore horizontal for content : */
.aplats.oblique .aplat > div {
	transform: scale(0.9) rotate(3.13deg);
}

.zzaplats.oblique .aplat h2:first-of-type {
	transform: skew(-3deg, -3deg);
}