/*
Lucid Modular CSS Style
Version: 1
Date: 2019-04-09
*/
:root{	
	/* Colors */
	--color__wp-blue: #0073aa;
	--color__base-gray: #32373c;
	--blockquote-color: #797979;
	--color_bg_note: #d1f4ee;
	--color_bg_alert: #ffe97c;
	--color_pre_bg: #eeeeee;
	--color_bg_box: #f2c5ea;

	--base-color: var(--color__wp-blue);
	--type__base: 18px;
	
	--ratio: 1.618034; /*golden*/
	--type__lineheight: calc(var(--type__base) * var(--ratio));

	/*golden half step ratios
	phi = 1.618
	ANS = phi^(x)
	x = { 3,2.5,2,1.5,1,0.5,0,-0.5,-1,-2,-3,-4 }
	*/
	--g11: 4.235801032;
	--g10: 3.33001579289;
	--g1: 2.617924;
	--g2: 2.05810617608;
	--g3: 1.618;
	--g4: 1.27201965394;
	--g5: 1;
	--g6: 0.78615137502;
	--g7: 0.61803398445;
	--g9: 0.38196600593;
	--g11: 0.23606797257;
	--g13: 0.14589802969;

	--fontsize_0: calc(var(--g0) * var(--type__base));
	--fontsize_1: calc(var(--g1) * var(--type__base));
	--fontsize_2: calc(var(--g2) * var(--type__base));
	--fontsize_3: calc(var(--g3) * var(--type__base));
	--fontsize_4: calc(var(--g4) * var(--type__base));
	--fontsize_5: calc(var(--g5) * var(--type__base));
	--fontsize_6: calc(var(--g6) * var(--type__base));

	--lineheight_1: calc(var(--ratio) * var(--fontsize_1));
	--lineheight_2: calc(var(--ratio) * var(--fontsize_2));
	--lineheight_3: calc(var(--ratio) * var(--fontsize_3));
	--lineheight_4: calc(var(--ratio) * var(--fontsize_4));
	--lineheight_5: calc(var(--ratio) * var(--fontsize_5));
	--lineheight_6: calc(var(--ratio) * var(--fontsize_6));
		  
	--spacing_0: calc(var(--type__lineheight) * var(--g3));
	--spacing_1: calc(var(--type__lineheight) * var(--g5));
	--spacing_2: calc(var(--type__lineheight) * var(--g7));
	--spacing_3: calc(var(--type__lineheight) * var(--g9));
	--spacing_4: calc(var(--type__lineheight) * var(--g11));
	--spacing_5: calc(var(--type__lineheight) * var(--g13));
	--spacing_6: var(--spacing_5);
	
	/*Divi*/
	--common_divi_spacing_1: var(--spacing_1,30px);
	--common_divi_spacing_0: var(--spacing_0,50px);
}
@media screen and (max-width: 600px) {
	:root{
		--type__base: 16px;
		--ratio: 1.333333333 ; /*fourth*/
		/*fourth steps*/
		--f0: 3.160493824;
		--f1: 2.37037036859;
		--f2: 1.77777777689;
		--f3: 1.333333333;
		--f4: 1;
		--f5: 0.75000000018;
		--f6: 0.56250000028;
		--f7: 0.42187500031;
		--f8: 0.31640625031;
		
		--fontsize_0: calc(var(--f0) * var(--type__base));
		--fontsize_1: calc(var(--f1) * var(--type__base));
		--fontsize_2: calc(var(--f2) * var(--type__base));
		--fontsize_3: calc(var(--f3) * var(--type__base));
		--fontsize_4: calc(var(--f4) * var(--type__base));
		--fontsize_5: calc(var(--f5) * var(--type__base));
		--fontsize_6: calc(var(--f6) * var(--type__base));

		--spacing_0: calc(var(--type__lineheight) * var(--f3));
		--spacing_1: calc(var(--type__lineheight) * var(--f4));
		--spacing_2: calc(var(--type__lineheight) * var(--f5));
		--spacing_3: calc(var(--type__lineheight) * var(--f6));
		--spacing_4: calc(var(--type__lineheight) * var(--f7));
		--spacing_5: calc(var(--type__lineheight) * var(--f8));
		--spacing_6: var(--spacing_5);
	}
}
.lucidgrt header > *:last-child,
.lucidgrt section > *:last-child{
	margin-bottom: 0;
}
	html, body.lucidgrt  {
	  font-size: var(--type__base) !important;
	}
	.lucidgrt a {
		color: var(--color__wp-blue);
	}
	/*header {
		margin: 0;
		border-top:none !important;
	}*/
	body {
	 /* font-family: 'Open Sans', sans-serif;*/
	  /*color: var(--color__base-gray);*/
	  /*line-height: var(--type__lineheight);
	  font-weight: 400;*/
	  /*padding: var(--spacing_1); */
	}
	
	.lucidgrt section > :last-child{
		margin-bottom: 0;
	}
	.lucidgrt #et-main-area ul, 
	.lucidgrt #et-main-area ol{
		padding-left: 0;
		margin-top:0;
		margin-left: var(--type__lineheight);
		margin-bottom: var(--type__lineheight);
	}
	.lucidgrt #et-main-area ul li, 
	.lucidgrt #et-main-area ol li{
		margin-bottom: var(--spacing_4);
	}
	.lucidgrt #et-main-area ul ul,
	.lucidgrt #et-main-area  ul ol, 
	.lucidgrt #et-main-area ol ul, 
	.lucidgrt #et-main-area ol ol {
		margin-top: var(--spacing_4);
		margin-bottom: 0;
	}
	.lucidgrt blockquote {
	    color: var(--blockquote-color);
		border-left: var(--spacing_5) solid rgba(0, 0, 0, 0.1);
		padding-left: var(--spacing_3);
		border-width: 0 0 0 var(--spacing_5);
		margin-left: 0;
	}
	.lucidgrt .alert :last-child, 
	.lucidgrt .note :last-child, 
	.lucidgrt .box :last-child, 
	.lucidgrt .right :last-child, 
	.lucidgrt .left :last-child, 
	.lucidgrt .footnotes :last-child{
		    margin-bottom: 0;
	}

	.lucidgrt code {
		background-color: rgba(0, 0, 0, 0.08);
		padding: 4px;
		border-radius: 7px;
		margin: 0 1px;
		padding: 3px 4px;
		border-radius: 7px;
	}
	.lucidgrt .alert,  
	.lucidgrt .note, 
	.lucidgrt .box {
		padding: var(--spacing_3);
	}
	.lucidgrt .note {
		background-color: var(--color_bg_note);
	}

	.lucidgrt .alert {
		background-color: var(--color_bg_alert);
	}
	.lucidgrt pre {
		background-color: var(--color_pre_bg);
		padding: 12px;
	}
	.lucidgrt pre {
		border-left: 7px solid rgba(0, 0, 0, 0.1);
		padding: 12px;
		border-width: 0 0 0 7px;
	}
	.lucidgrt .box {
		background-color: var(--color_bg_box);
	}
	.lucidgrt .footnotes {
		font-size: 14px;
		line-height: 26px;
		padding-top: var(--spacing_3);
	}
	.lucidgrt .footnotes p {
		margin-bottom: var(--spacing_6);
	}
	.lucidgrt kbd {
		font-size: 14px;
		color: #111111;
		text-shadow: 0 1px 0 white;
		background-color: #f7f7f7;
		padding: 5px;
		border: 1px solid #cccccc;
		border-radius: 7px;
		box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2), 0 0 0 2px white inset;
		margin: 0 1px;
		padding: 3px 4px;
		border-radius: 4px;
		box-shadow: 0 0 4px 0 rgba(0,0,0,0.45);
	}
	.lucidgrt .h1:last-child,
	.lucidgrt .h2:last-child,
	.lucidgrt .h3:last-child,
	.lucidgrt .h4:last-child,
	.lucidgrt .h5:last-child,
	.lucidgrt .h6:last-child,
	.lucidgrt h1:last-child,
	.lucidgrt h2:last-child,
	.lucidgrt h3:last-child,
	.lucidgrt h4:last-child,
	.lucidgrt h5:last-child,
	.lucidgrt h6:last-child{
		margin-bottom: 0;
	}
	
	.lucidgrt .h1,
	.lucidgrt .h2, 
	.lucidgrt .h3, 
	.lucidgrt .h4, 
	.lucidgrt .h5,
	.lucidgrt .h6,
	.lucidgrt h1,
	.lucidgrt h2, 
	.lucidgrt h3, 
	.lucidgrt h4, 
	.lucidgrt h5,
	.lucidgrt h6 {
		line-height: 1;
		margin: 0;
	}
	.lucidgrt .h1,
	.lucidgrt h1 {
	  color: var(--base-color);
	  font-size: var(--fontsize_1);
	  line-height: var(--lineheight_1); 
	  margin-bottom: var(--spacing_1);
	}
	.lucidgrt .h2,
	.lucidgrt h2 {
	/*  color: lighten( var(--base-color), 10% );*/
	  font-size: var(--fontsize_2);
	  line-height: var(--lineheight_2); 
	  margin-bottom: var(--spacing_2);
	}

	.lucidgrt .h3,
	.lucidgrt h3 {
	  font-size: var(--fontsize_3);
	  line-height: var(--lineheight_3);
	  margin-bottom: var(--spacing_3);
	}

	.lucidgrt .h4,
	.lucidgrt h4 {
	  font-size: var(--fontsize_4);
	  line-height: var(--lineheight_4); 
	  margin-bottom: var(--spacing_4);
	  font-weight: 600;
	}

	.lucidgrt .h5,
	.lucidgrt h5 {
	  font-size: var(--fontsize_5);
	  line-height: var(--lineheight_5); 
	  margin-bottom: var(--spacing_5);
	  text-transform: uppercase;
	  letter-spacing: 0.01rem;
	  font-weight: 600;
	}

	.lucidgrt .h6,
	.lucidgrt h6 {
	  font-size: var(--fontsize_6);
	  line-height: var(--lineheight_6); 
	  margin-bottom: var(--spacing_6);
	  font-weight: 600;
	  text-transform: uppercase;
	  letter-spacing: 0.05rem;
	}
	.lucidgrt blockquote, 
	.lucidgrt pre, 
	.lucidgrt .alert, 
	.lucidgrt .note, 
	.lucidgrt .box, 
	.lucidgrt .footnotes {
		margin-bottom: var(--type__lineheight);
	}
	.lucidgrt .byline, 
	.lucidgrt .post_cats, 
	.lucidgrt .post_tags, 
	.lucidgrt .footnotes {
		color: #797979;
	}
	.lucidgrt .footnotes {
	    border-top: 1px dotted rgba(0, 0, 0, 0.15);
	}
	.lucidgrt p {
		margin-top:0;
		padding-bottom: 0;
		margin-bottom: var(--type__lineheight);	
		line-height: var(--type__lineheight);
		font-size: var(--type__base);
	}
	  .lucidgrt p.intro {
		font-size:  var(--fontsize_4);
		line-height: var(--lineheight_4); 
	  }
	  .lucidgrt p.aside {
		font-size: var(--fontsize_5);
	  line-height: var(--lineheight_5); 
		letter-spacing: 0.005rem;
	  }
	  .lucidgrt p.note {
		font-size: var(--fontsize_6);
		line-height: var(--lineheight_6); 
		letter-spacing: 0.01rem;
	  }
	
/*	.lucidgrt header h1 {
	  font-size: var(--fontsize_6);
	  line-height: var(--lineheight_6); 
	  font-weight: 600;
	  text-transform: uppercase;
	  letter-spacing: 0.05rem;
	  color: var(--color__wp-blue);
	}
*/