/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.0.2
*/



/* Root Stylings */
:root {
	/* Font Pairings */
	--font-primary: "Lets Coffee";
	--font-secondary: "Arial";
	/* Font Sizes */ /* @link https://utopia.fyi/type/calculator?c=300,16,1.15,1240,21,1.333,5,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l&g=s,l,xl,12 */
  --step--2: clamp(0.64rem, 0.8474rem + -0.2676vw, 0.7972rem);
  --step--1: clamp(0.8rem, 0.9225rem + -0.1581vw, 0.8929rem);
  --step-0: clamp(1rem, 1rem + 0vw, 1rem);
  --step-1: clamp(1.12rem, 1.0785rem + 0.2213vw, 1.25rem);
  --step-2: clamp(1.2544rem, 1.1561rem + 0.5244vw, 1.5625rem);
  --step-3: clamp(1.4049rem, 1.23rem + 0.9331vw, 1.9531rem);
  --step-4: clamp(1.5735rem, 1.2965rem + 1.4773vw, 2.4414rem);
  --step-5: clamp(1.7623rem, 1.3508rem + 2.1948vw, 3.0518rem);
	/* Colors */
	--basic-blue: #155190;
	--lime-green: #61d900;
	--bright-yellow: #eaff00;
	--truck-red: #ff0000;
	--off-black: #202020;
	--mid-grey: #323232;
	--font-grey: #4e4e4e;
	--paper-tan: #f4f3ec;
	--snow-white: #fff;	
}

/* Font Color Classes*/
.basic-blue	{color: var(--basic-blue);}
.lime-green	{color: var(--lime-green);}
.bright-yellow	{color: var(--bright-yellow);}
.truck-red	{color: var(--truck-red);}
.off-black	{color: var(--off-black);}
.mid-grey	{color: var(--mid-grey);}
.font-grey	{color: var(--font-grey);}
.paper-tan	{color: var(--paper-tan);}
.snow-white	{color: var(--snow-white);}

	/* Custom Font Family Classes */
.font-family-primary, .font-family-primary .title {font-family: var(--font-primary), sans-serif;}
.font-family-secondary, .font-family-secondary .title {font-family: var(--font-secondary), sans-serif;}

	/* Custom Font Size Classes */
.font-size-step--2, .font-size-step--2 .title {font-size: var(--step--2) !important; line-height: 150%  !important;}
.font-size-step--1, .font-size-step--1 .title {font-size: var(--step--1) !important; line-height: 150%  !important;}
.font-size-step-0, .font-size-step-0 .title {font-size: var(--step-0) !important; line-height: 150%  !important;}
.font-size-step-1, .font-size-step-1 .title {font-size: var(--step-1) !important; line-height: 130%  !important;}
.font-size-step-2, .font-size-step-2 .title {font-size: var(--step-2) !important; line-height: 130% !important;}
.font-size-step-3, .font-size-step-3 .title {font-size: var(--step-3) !important; line-height: 120%  !important;}
.font-size-step-4, .font-size-step-4 .title {font-size: var(--step-4) !important; line-height: 110%  !important;}
.font-size-step-5, .font-size-step-5 .title {font-size: var(--step-5) !important; line-height: 110% !important;}

	/* Custom Font Weights */
.thin-text-weight, .thin-text-weight .title {font-weight: 300;}
.medium-text-weight, .medium-text-weight .title  {font-weight: 400;}
.heavy-text-weight, .heavy-text-weight .title  {font-weight: 700;}

	/* Custom Letter Spacing */
.thin-letter-spacing, .thin-letter-spacing .title {letter-spacing: -2px;}
.medium-letter-spacing, .medium-letter-spacing .title {letter-spacing: 0;}
.heavy-letter-spacing, .heavy-letter-spacing .title {letter-spacing: 2px;}


	/* Default UTOPIA Styles, Sizes, and everything-in-between */
h1 {
	font-size: var(--step-5); line-height: 110%;
	font-family: var(--font-primary), sans-serif;
	color: var(--mid-grey);
	letter-spacing: 0px;
	font-weight: 400;
}
h2 {
	font-size: var(--step-4); line-height: 110%;
	font-family: var(--font-primary), sans-serif;
	color: var(--mid-grey);
	letter-spacing: 0px;
	font-weight: 400;
}
h3 {
	font-size: var(--step-3); line-height: 120%;
	font-family: var(--font-primary), sans-serif;
	color: var(--mid-grey);
	letter-spacing: 0px;
	font-weight: 400;
}
h4 {
	font-size: var(--step-2); line-height: 130%;
	font-family: var(--font-secondary), sans-serif;
	color: var(--mid-grey);
	letter-spacing: 0px;
	font-weight: 700;
}
h5 {
	font-size: var(--step-1); line-height: 130% ;
	font-family: var(--font-secondary), sans-serif;
	color: var(--font-grey);
	letter-spacing: 0px;
	font-weight: 700;
}
h6 {
	font-size: var(--step-0); line-height: 150%;
	font-family: var(--font-secondary), sans-serif;
	color: var(--font-grey);
	letter-spacing: 0px;
	font-weight: 700;
}

p.lead, p.big {
	font-size: var(--step-1) !important; line-height: 150%  !important;
	font-family: var(--font-secondary), sans-serif;
	letter-spacing: 0px;
	font-weight: 500;
	
}

body, p, span, ul li, .button_label, div.desc {
	font-size: var(--step-0); line-height: 150%  !important;
	font-family: var(--font-secondary), sans-serif;
	letter-spacing: 0px;
	font-weight: 500;
}

/* END Root Stylings */