/*
Theme: RAAK
Theme_URI: https://www.lemon.nl
Version: 2.0
Date: 21-3-2024
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/

/*************** COLORS ***************/

:root {
	/* Siropen */
	--yellow:		#ffefae;
	--green:		#d3e19d;
	--orange:		#f9bb6d;
	--salmon:		#f4c4b9;
	--purple:		#dcbfdc;
	/* Kindercola */
	--aqua:			#1c9dad;
	--red:			#ff0000;
	/* Gazeuse */
	--gazeusepurple:#e3277e;
	--gazeusegreen:	#5eb130;
	--gazeuseyellow:#ffd000;
	--gazeuseorange:#e9530d;
	--gazeusebrown:	#937c48;
	--gazeuseblue:	#009fe3;
	--bubblegum:	#f29fc5;
	/* Extra */
	--darkgreen:	#5bb12f;
	--blue:			#069bd8;
	--alt:			#ff7e7e;
	/* Basis */
	--grey:			#8b8b8b;
	--white:		#ffffff;
	--black:		#1d1d1b;
}

.yellow							{ color: var(--yellow); }
.green							{	color: var(--green); }
.orange							{ color: var(--orange); }
.salmon							{ color: var(--salmon); }
.purple							{ color: var(--purple); }
.aqua							{ color: var(--aqua); }
.red							{ color: var(--red); }
.gazeusepurple					{ color: var(--gazeusepurple); }
.gazeusegreen					{ color: var(--gazeusegreen); }
.gazeuseyellow					{ color: var(--gazeuseyellow); }
.gazeuseorange					{ color: var(--gazeuseorange); }
.gazeusebrown					{ color: var(--gazeusebrown); }
.gazeuseblue					{ color: var(--gazeuseblue); }
.bubblegum						{ color: var(--bubblegum); }
.darkgreen						{ color: var(--darkgreen); }
.blue							{ color: var(--blue); }
.alt							{ color: var(--alt); }
.grey							{ color: var(--grey); }
.white 							{ color: var(--white); }
.black 							{ color: var(--black); }

.bubblegum-zero-sugar			{ color: var(--bubblegum); }
.campagne-pils-zero-sugar		{ color: var(--gazeuseorange); }
.framboos-zero-sugar			{ color: var(--gazeusegreen); }
.tropical-zero-sugar			{ color: var(--gazeuseorange); }

.border-yellow					{ border-color: var(--yellow); }
.border-green					{	border-color: var(--green); }
.border-orange					{ border-color: var(--orange); }
.border-salmon					{ border-color: var(--salmon); }
.border-purple					{ border-color: var(--purple); }
.border-aqua					{ border-color: var(--aqua); }
.border-red						{ border-color: var(--red); }
.border-gazeusepurple			{ border-color: var(--gazeusepurple); }
.border-gazeusegreen			{ border-color: var(--gazeusegreen); }
.border-gazeuseyellow			{ border-color: var(--gazeuseyellow); }
.border-gazeuseorange			{ border-color: var(--gazeuseorange); }
.border-gazeusebrown			{ border-color: var(--gazeusebrown); }
.border-gazeuseblue				{ border-color: var(--gazeuseblue); }
.border-bubblegum				{ border-color: var(--bubblegum); }
.border-darkgreen				{ border-color: var(--darkgreen); }
.border-blue					{ border-color: var(--blue); }
.border-alt						{ border-color: var(--alt); }
.border-grey					{ border-color: var(--grey); }
.border-white 					{ border-color: var(--white); }
.border-black 					{ border-color: var(--black); }

.card-header 					{ background-color: unset; }
.border-yellow .card-header		{ background-color: var(--yellow); }
.border-green .card-header		{ background-color: var(--green); }
.border-orange .card-header		{ background-color: var(--orange); }
.border-salmon .card-header		{ background-color: var(--salmon); }
.border-purple .card-header		{ background-color: var(--purple); }
.border-aqua .card-header		{ background-color: var(--aqua); }
.border-red .card-header		{ background-color: var(--red); }
.border-gazeusepurple .card-header	{ background-color: var(--gazeusepurple); }
.border-gazeusegreen .card-header	{ background-color: var(--gazeusegreen); }
.border-gazeuseyellow .card-header	{ background-color: var(--gazeuseyellow); }
.border-gazeuseorange .card-header	{ background-color: var(--gazeuseorange); }
.border-gazeusebrown .card-header	{ background-color: var(--gazeusebrown); }
.border-gazeuseblue .card-header	{ background-color: var(--gazeuseblue); }
.border-bubblegum .card-header	{ background-color: var(--bubblegum); }
.border-darkgreen .card-header	{ background-color: var(--darkgreen); }
.border-blue .card-header		{ background-color: var(--blue); }
.border-alt .card-header		{ background-color: var(--alt); }
.border-grey .card-header		{ background-color: var(--grey); }
.border-white .card-header		{ background-color: var(--white); }
.border-black .card-header		{ background-color: var(--black); }

.bg-yellow						{ background-color: var(--yellow); }
.bg-green						{ background-color: var(--green); }
.bg-orange						{ background-color: var(--orange); }
.bg-salmon						{ background-color: var(--salmon); }
.bg-purple						{ background-color: var(--purple); }
.bg-aqua						{ background-color: var(--aqua); }
.bg-red							{ background-color: var(--red); }
.bg-gazeusepurple				{ background-color: var(--gazeusepurple); }
.bg-gazeusegreen				{ background-color: var(--gazeusegreen); }
.bg-gazeuseyellow				{ background-color: var(--gazeuseyellow); }
.bg-gazeuseorange				{ background-color: var(--gazeuseorange); }
.bg-gazeusebrown				{ background-color: var(--gazeusebrown); }
.bg-gazeuseblue					{ background-color: var(--gazeuseblue); }
.bg-bubblegum					{ background-color: var(--bubblegum); }
.bg-darkgreen					{ background-color: var(--darkgreen); }
.bg-blue						{ background-color: var(--blue); }
.bg-alt							{ background-color: var(--alt); }
.bg-grey						{ background-color: var(--grey); }
.bg-white 						{ background-color: var(--white); }
.bg-black 						{ background-color: var(--black); }

.bg-bubblegum-zero-sugar		{ background-color: var(--bubblegum); }
.bg-campagne-pils-zero-sugar	{ background-color: var(--gazeuseorange); }
.bg-framboos-zero-sugar			{ background-color: var(--gazeusegreen); }
.bg-tropical-zero-sugar			{ background-color: var(--gazeuseorange); }

.content { background-color: rgba(255,255,255,0.6); }

.bg-yellow .content,
.bg-green .content,
.bg-orange .content,
.bg-salmon .content,
.bg-purple .content,
.bg-aqua .content,
.bg-red .content,
.bg-gazeusepurple .content,
.bg-gazeusegreen .content,
.bg-gazeuseyellow .content,
.bg-gazeuseorange .content,
.bg-gazeusebrown .content,
.bg-gazeuseblue .content,
.bg-bubblegum .content,
.bg-darkgreen .content,
.bg-blue .content,
.bg-alt .content,
.bg-grey .content,
.bg-white .content,
.bg-black .content,
.bg-bubblegum-zero-sugar .content,
.bg-campagne-pils-zero-sugar .content,
.bg-framboos-zero-sugar .content,
.bg-tropical-zero-sugar .content { background-color: unset; }

.svg-yellow > svg			{ fill: var(--yellow); }
.svg-green > svg			{ fill: var(--green); }
.svg-orange > svg			{ fill: var(--orange); }
.svg-salmon > svg			{ fill: var(--salmon); }
.svg-purple > svg			{ fill: var(--purple); }
.svg-aqua > svg				{ fill: var(--aqua); }
.svg-red > svg				{ fill: var(--red); }
.svg-gazeusepurple > svg	{ fill: var(--gazeusepurple); }
.svg-gazeusegreen > svg		{ fill: var(--gazeusegreen); }
.svg-gazeuseyellow > svg	{ fill: var(--gazeuseyellow); }
.svg-gazeuseorange > svg	{ fill: var(--gazeuseorange); }
.svg-gazeusebrown > svg		{ fill: var(--gazeusebrown); }
.svg-gazeuseblue > svg		{ fill: var(--gazeuseblue); }
.svg-bubblegum > svg		{ fill: var(--bubblegum); }
.svg-darkgreen > svg		{ fill: var(--darkgreen); }
.svg-blue > svg				{ fill: var(--blue); }
.svg-alt > svg				{ fill: var(--alt); }
.svg-grey > svg				{ fill: var(--grey); }
.svg-white > svg			{ fill: var(--white); }
.svg-black > svg			{ fill: var(--black); }

.bg-aqua > h1, .bg-aqua > h2, .bg-aqua > h3, .bg-aqua > h4, .bg-aqua > h5, .bg-aqua > h6, .bg-aqua > p, .bg-aqua td,
.bg-bubblegum > h1, .bg-bubblegum > h2, .bg-bubblegum > h3, .bg-bubblegum > h4, .bg-bubblegum > h5, .bg-bubblegum > h6, .bg-bubblegum > p, .bg-bubblegum td,
.bg-darkgreen > h1, .bg-darkgreen > h2, .bg-darkgreen > h3, .bg-darkgreen > h4, .bg-darkgreen > h5, .bg-darkgreen > h6, .bg-darkgreen > p, .bg-darkgreen td,
.bg-gazeusepurple > h1, .bg-gazeusepurple > h2, .bg-gazeusepurple > h3, .bg-gazeusepurple > h4, .bg-gazeusepurple > h5, .bg-gazeusepurple > h6, .bg-gazeusepurple > p, .bg-gazeusepurple td,
.bg-gazeusegreen > h1, .bg-gazeusegreen > h2, .bg-gazeusegreen > h3, .bg-gazeusegreen > h4, .bg-gazeusegreen > h5, .bg-gazeusegreen > h6, .bg-gazeusegreen > p, .bg-gazeusegreen td,

.bg-campagne-pils-zero-sugar > h1, .bg-campagne-pils-zero-sugar > h2, .bg-campagne-pils-zero-sugar > h3, .bg-campagne-pils-zero-sugar > h4, .bg-campagne-pils-zero-sugar > h5, .bg-campagne-pils-zero-sugar > h6, .bg-campagne-pils-zero-sugar > p, .bg-campagne-pils-zero-sugar td,
.bg-framboos-zero-sugar > h1, .bg-framboos-zero-sugar > h2, .bg-framboos-zero-sugar > h3, .bg-framboos-zero-sugar > h4, .bg-framboos-zero-sugar > h5, .bg-framboos-zero-sugar > h6, .bg-framboos-zero-sugar > p, .bg-framboos-zero-sugar td,
.bg-tropical-zero-sugar > h1, .bg-tropical-zero-sugar > h2, .bg-tropical-zero-sugar > h3, .bg-tropical-zero-sugar > h4, .bg-tropical-zero-sugar > h5, .bg-tropical-zero-sugar > h6, .bg-tropical-zero-sugar > p, .bg-tropical-zero-sugar td,

.bg-blue > h1, .bg-blue > h2, .bg-blue > h3, .bg-blue > h4, .bg-blue > h5, .bg-blue > h6, .bg-blue > p, .bg-blue td,
.bg-red > h1, .bg-red > h2, .bg-red > h3, .bg-red > h4, .bg-red > h5, .bg-red > h6, .bg-red > p, .bg-red td,
.bg-black > h1, .bg-black > h2, .bg-black > h3, .bg-black > h4, .bg-black > h5, .bg-black > h6, .bg-black > p, .bg-black td
{ color: var(--white); }

.item.card .bg-aqua > div > h1, .item.card .bg-aqua > div > h2, .item.card .bg-aqua > div > h3, .item.card .bg-aqua > div > h4, .item.card .bg-aqua > div > h5, .item.card .bg-aqua > div > h6, .item.card .bg-aqua > div > p,
.item.card .bg-bubblegum > div > h1, .item.card .bg-bubblegum > div > h2, .item.card .bg-bubblegum > div > h3, .item.card .bg-bubblegum > div > h4, .item.card .bg-bubblegum > div > h5, .item.card .bg-bubblegum > div > h6, .item.card .bg-bubblegum > div > p,
.item.card .bg-darkgreen > div > h1, .item.card .bg-darkgreen > div > h2, .item.card .bg-darkgreen > div > h3, .item.card .bg-darkgreen > div > h4, .item.card .bg-darkgreen > div > h5, .item.card .bg-darkgreen > div > h6, .item.card .bg-darkgreen > div > p,
.item.card .bg-gazeusepurple > div > h1, .item.card .bg-gazeusepurple > div > h2, .item.card .bg-gazeusepurple > div > h3, .item.card .bg-gazeusepurple > div > h4, .item.card .bg-gazeusepurple > div > h5, .item.card .bg-gazeusepurple > div > h6, .item.card .bg-gazeusepurple > div > p,
.item.card .bg-gazeusegreen > div > h1, .item.card .bg-gazeusegreen > div > h2, .item.card .bg-gazeusegreen > div > h3, .item.card .bg-gazeusegreen > div > h4, .item.card .bg-gazeusegreen > div > h5, .item.card .bg-gazeusegreen > div > h6, .item.card .bg-gazeusegreen > div > p,
.item.card .bg-blue > div > h1, .item.card .bg-blue > div > h2, .item.card .bg-blue > div > h3, .item.card .bg-blue > div > h4, .item.card .bg-blue > div > h5, .item.card .bg-blue > div > h6, .item.card .bg-blue > div > p,
.item.card .bg-red > div > h1, .item.card .bg-red > div > h2, .item.card .bg-red > div > h3, .item.card .bg-red > div > h4, .item.card .bg-red > div > h5, .item.card .bg-red > div > h6, .item.card .bg-red > div > p,
.item.card .bg-black > div > h1, .item.card .bg-black > div > h2, .item.card .bg-black > div > h3, .item.card .bg-black > div > h4, .item.card .bg-black > div > h5, .item.card .bg-black > div > h6, .item.card .bg-black > div > p
{ color: var(--white); }


.btn-pijl.white span,
.btn-pijl span 						{ color: var(--black); }
.btn-pijl.white svg,
.btn-pijl svg 						{ fill: var(--white); }

.btn-pijl.red span,
.has-border .btn-pijl span			{ color: var(--white); }
.btn-pijl.red svg,
.has-border .btn-pijl svg 			{ fill: var(--red); }

.btn-pijl.bubblegum span,
.gazeuse-blue-body .btn-pijl span	{ color: var(--white); }
.btn-pijl.bubblegum svg,
.gazeuse-blue-body .btn-pijl svg 	{ fill: var(--bubblegum); }


.colorswatch.bg-gazeuse-blue-body 	{ background: linear-gradient(45deg, #009fe3 50%, #f29fc5 50%); }
.colorswatch.bg-gazeuse-green-body 	{ background: linear-gradient(45deg, #5bb12f 50%, #e2217e 50%); }