/*
Style Colors
Version: 2.1
Theme_URI: https://www.lemon.nl
Date: 01/2026
Author: Roeland ten Holder | Lemon
Author URI: roeland@lemon.nl
*/

/** ******************************** **/
/**      _____                       **/
/**    _(  _  )__________________    **/
/**   ( | (___)     | ____ |  _  |   **/
/**   |_|_______|_|_|______|_| |_|   **/
/**                                  **/
/**            www.lemon.nl          **/
/**                                  **/
/** ******************************** **/

/*************** COLORS ***************/

:root {
	--turquoise: 				#32a3a6;
	--turquoise-hover: 			#208689;
	--lightturquoise: 			#8eccd0;
	--lightturquoise-hover: 	#6acad0;
	--red: 						#e41813;
	--red-hover: 				#bf0d09;
	
	--pink: 					#fdeded;
	--pink-hover: 				#fdd7d7;
	--white: 					#ffffff;
	--grey-light: 				#efefef;
	--grey: 					#d1d1d1;
	--grey-dark:				#858585;
	--black: 					#08090b;

	--submenu: 					#ffffff;

	--mainheading: 				var(--black);
	--mainheading-hover: 		var(--black);
	--mainheading-alt: 			var(--red);
	--mainheading-alt-hover: 	var(--red-hover);

	--mainbody: 				var(--black);
	--mainbody-hover: 			var(--black);
	--mainbody-alt: 			var(--black);
	--mainbody-alt-hover: 		var(--black);

	--mainnav: 					var(--black);
	--mainnav-hover: 			var(--turquoise-hover);
	--mainlink: 				var(--red);
	--mainlink-hover: 			var(--red-hover);

}

.turquoise { color: var(--turquoise); }
.turquoise-hover { color: var(--turquoise-hover); }
.lightturquoise { color: var(--lightturquoise); }
.lightturquoise-hover { color: var(--lightturquoise-hover); }
.red { color: var(--red); }
.red-hover { color: var(--red-hover); }
.pink { color: var(--pink); }
.pink-hover { color: var(--pink-hover); }
.white { color: var(--white); }
.grey-light { color: var(--grey-light); }
.grey { color: var(--grey); }
.grey-dark { color: var(--grey-dark); }
.black { color: var(--black); }


.border-turquoise { border-color: var(--turquoise); }
.border-turquoise-hover { border-color: var(--turquoise-hover); }
.border-lightturquoise { border-color: var(--lightturquoise); }
.border-lightturquoise-hover { border-color: var(--lightturquoise-hover); }
.border-red { border-color: var(--red); }
.border-red-hover { border-color: var(--red-hover); }
.border-pink { border-color: var(--pink); }
.border-pink-hover { border-color: var(--pink-hover); }
.border-white { border-color: var(--white); }
.border-grey-light { border-color: var(--grey-light); }
.border-grey { border-color: var(--grey); }
.border-grey-dark { border-color: var(--grey-dark); }
.border-black { border-color: var(--black); }


.card-header .card-header { background-color: unset; }
.border-turquoise .card-header { background-color: var(--turquoise); }
.border-turquoise-hover .card-header { background-color: var(--turquoise-hover); }
.border-lightturquoise .card-header { background-color: var(--lightturquoise); }
.border-lightturquoise-hover .card-header { background-color: var(--lightturquoise-hover); }
.border-red .card-header { background-color: var(--red); }
.border-red-hover .card-header { background-color: var(--red-hover); }
.border-pink .card-header { background-color: var(--pink); }
.border-pink-hover .card-header { background-color: var(--pink-hover); }
.border-white .card-header { background-color: var(--white); }
.border-grey-light .card-header { background-color: var(--grey-light); }
.border-grey .card-header { background-color: var(--grey); }
.border-grey-dark .card-header { background-color: var(--grey-dark); }
.border-black .card-header { background-color: var(--black); }


.bg-turquoise { background-color: var(--turquoise); }
.bg-turquoise-hover { background-color: var(--turquoise-hover); }
.bg-lightturquoise { background-color: var(--lightturquoise); }
.bg-lightturquoise-hover { background-color: var(--lightturquoise-hover); }
.bg-red { background-color: var(--red); }
.bg-red-hover { background-color: var(--red-hover); }
.bg-pink { background-color: var(--pink); }
.bg-pink-hover { background-color: var(--pink-hover); }
.bg-white { background-color: var(--white); }
.bg-grey-light { background-color: var(--grey-light); }
.bg-grey { background-color: var(--grey); }
.bg-grey-dark { background-color: var(--grey-dark); }
.bg-black { background-color: var(--black); }


.btn, a.col:hover .btn,
.btn:focus, .btn:active, .btn:hover { color: var(--white); }
.btn, a.col:hover .btn,
.btn:focus, .btn:active, .btn:hover { background-color: var(--black); }

.btn-turquoise { background-color: var(--turquoise); }
.btn-turquoise-hover { background-color: var(--turquoise-hover); }
.btn-turquoise:hover { background-color: var(--turquoise-hover); }
.btn-lightturquoise { background-color: var(--lightturquoise); }
.btn-lightturquoise-hover { background-color: var(--lightturquoise-hover); }
.btn-lightturquoise:hover { background-color: var(--lightturquoise-hover); }
.btn-red { background-color: var(--red); }
.btn-red-hover { background-color: var(--red-hover); }
.btn-red:hover { background-color: var(--red-hover); }
.btn-pink { background-color: var(--pink); }
.btn-pink-hover { background-color: var(--pink-hover); }
.btn-pink:hover { background-color: var(--pink-hover); }
.btn-white { background-color: var(--white); }
.btn-grey-light { background-color: var(--grey-light); }
.btn-grey { background-color: var(--grey); }
.btn-grey-dark { background-color: var(--grey-dark); }
.btn-black { background-color: var(--black); }


.content { color: unset; }
.content a:not(.btn) { color: var(--black); }
.link, .content a:not(.btn):hover { color: var(--black); }

.btn-turquoise, .bg-turquoise h1, .bg-turquoise h2, .bg-turquoise h3, .bg-turquoise h4, .bg-turquoise h5, .bg-turquoise h6, .bg-turquoise p, .bg-turquoise td, .bg-turquoise, .bg-turquoise a, .bg-turquoise a:hover,
.btn-turquoise:hover, .btn-turquoise-hover, .bg-turquoise-hover h1, .bg-turquoise-hover h2, .bg-turquoise-hover h3, .bg-turquoise-hover h4, .bg-turquoise-hover h5, .bg-turquoise-hover h6, .bg-turquoise-hover p, .bg-turquoise-hover td, .bg-turquoise-hover, .bg-turquoise-hover a, .bg-turquoise-hover a:hover,
.btn-lightturquoise, .bg-lightturquoise h1, .bg-lightturquoise h2, .bg-lightturquoise h3, .bg-lightturquoise h4, .bg-lightturquoise h5, .bg-lightturquoise h6, .bg-lightturquoise p, .bg-lightturquoise td, .bg-lightturquoise, .bg-lightturquoise a, .bg-lightturquoise a:hover,
.btn-lightturquoise:hover, .btn-lightturquoise-hover, .bg-lightturquoise-hover h1, .bg-lightturquoise-hover h2, .bg-lightturquoise-hover h3, .bg-lightturquoise-hover h4, .bg-lightturquoise-hover h5, .bg-lightturquoise-hover h6, .bg-lightturquoise-hover p, .bg-lightturquoise-hover td, .bg-lightturquoise-hover, .bg-lightturquoise-hover a, .bg-lightturquoise-hover a:hover,
.btn-red, .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-red, .bg-red a, .bg-red a:hover,
.btn-red:hover, .btn-red-hover, .bg-red-hover h1, .bg-red-hover h2, .bg-red-hover h3, .bg-red-hover h4, .bg-red-hover h5, .bg-red-hover h6, .bg-red-hover p, .bg-red-hover td, .bg-red-hover, .bg-red-hover a, .bg-red-hover a:hover,
/* 
.btn-pink, .bg-pink h1, .bg-pink h2, .bg-pink h3, .bg-pink h4, .bg-pink h5, .bg-pink h6, .bg-pink p, .bg-pink td, .bg-pink, .bg-pink a, .bg-pink a:hover,
.btn-pink:hover, .btn-pink-hover, .bg-pink-hover h1, .bg-pink-hover h2, .bg-pink-hover h3, .bg-pink-hover h4, .bg-pink-hover h5, .bg-pink-hover h6, .bg-pink-hover p, .bg-pink-hover td, .bg-pink-hover, .bg-pink-hover a, .bg-pink-hover a:hover,
.btn-white, .bg-white h1, .bg-white h2, .bg-white h3, .bg-white h4, .bg-white h5, .bg-white h6, .bg-white p, .bg-white td, .bg-white, .bg-white a, .bg-white a:hover,
.btn-grey-light, .bg-grey-light h1, .bg-grey-light h2, .bg-grey-light h3, .bg-grey-light h4, .bg-grey-light h5, .bg-grey-light h6, .bg-grey-light p, .bg-grey-light td, .bg-grey-light, .bg-grey-light a, .bg-grey-light a:hover,
.btn-grey, .bg-grey h1, .bg-grey h2, .bg-grey h3, .bg-grey h4, .bg-grey h5, .bg-grey h6, .bg-grey p, .bg-grey td, .bg-grey, .bg-grey a, .bg-grey a:hover,
.btn-grey-dark, .bg-grey-dark h1, .bg-grey-dark h2, .bg-grey-dark h3, .bg-grey-dark h4, .bg-grey-dark h5, .bg-grey-dark h6, .bg-grey-dark p, .bg-grey-dark td, .bg-grey-dark, .bg-grey-dark a, .bg-grey-dark a:hover,
  */
.btn-black, .bg-black h1, .bg-black h2, .bg-black h3, .bg-black h4, .bg-black h5, .bg-black h6, .bg-black p, .bg-black td, .bg-black, .bg-black a, .bg-black a:hover,
.bg-dark { color: var(--white); }


/*
	--mainheading: 				var(--black);
	--mainheading-hover: 		var(--black);
	--mainheading-alt: 			var(--red);
	--mainheading-alt-hover: 	var(--red-hover);

	--mainbody: 				var(--black);
	--mainbody-hover: 			var(--black);
	--mainbody-alt: 			var(--black);
	--mainbody-alt-hover: 		var(--black);

	--mainnav: 					var(--black);
	--mainnav-hover: 			var(--turquoise-hover);
	--mainlink: 				var(--red);
	--mainlink-hover: 			var(--red-hover);
*/

h1, h2, h3, 
h4, h5, h6, 
.h1, .h2, .h3, 
.h4, .h5, .h6, 
.quote h4, blockquote										{ color: var(--mainheading); }

a,
.content, .content p,
.article, .article a p,
.card-body.content, .card,
.has-author, body, .intro, 
.page-numbers,
.caption, .small,
.modal-body 												{ color: var(--mainbody); }

.navbar-nav li > a,
.navbar-nav > li.menu-item-has-children > a::after			{ color: var(--mainnav); }

.navbar-nav li.active > a,
.navbar-nav li:hover > a,
.navbar-nav > li.menu-item-has-children > a::after			{ color: var(--mainnav-hover); }

.bg-black.footer a:hover, .footer a:hover, 
.reading-time,
.has-header-nav .navbar-nav li.current_page_item > a,
.has-header-nav .navbar-nav li a:focus,
.has-header-nav .navbar-nav li a:hover,
.navbar-nav li.menu-item-has-children a:hover::after,
.navbar-nav li.current_page_item.menu-item-has-children a::after	{ color: var(--grey); }

.border,
.border-left,
.border-right,
.border-top,
.border-bottom 			{ border-color: var(--mainbody) !important; }




.footer a {
	color: var(--mainbody);
}