:root
{
  /* --accent_text: #0aacef; */
  --accent_text: #FC3E48;
}


.btnCTA[disabled]
{
	cursor: not-allowed;
}

#step1+footer
{
	max-width: none;
}


/* Values that can be changed */
body
{
	/* This is a the background color for the whole page. */
	/* background-color: #ffffff; */
	background-color: #ffffff;
}

main.wrapper
{
	border: 4px solid var(--accent_text);
}

html
{
        padding-top: 20px;
}

aside
{
	/* This is a the background color for the boxes with vehicle data. */
	/* background-color: #f3f3f3; */
	background-color: #f3f3f3;
}

.btnCTA, .btnDefault
{
	/* This is the background and text color for buttons in normal state. */
	/* background-color: #000000; */
	/* color: #ffffff; */

	/* change this button background color  */
	background-color: var(--accent_text);
	border: solid 2px var(--accent_text);

	color: #ffffff;
	font-size: 22px;
	font-family: "Poppins-Med";
}

.btnCTA:focus, .btnCTA:hover, .btnDefault:focus, .btnDefault:hover
{
	/* This is the background and text color for buttons when hovering. */
	/* background-color: #ffffff; */
	/* color: #000000; */
	background-color: #ffffff;
	color: #000000;
}


.steps li::before
{
	/* This is the background and text color for the numeral for the inactive steps. */
	/* Recommended that the text color should be the same as the page background color. */
	/* background-color: #c0c0c0; */
	/* color: #ffffff; */
	background-color: #c0c0c0;
	color: #ffffff;
    font-size:42px;
    height:51px;
    width:51px
}

.steps li span
{
	/* This is the text color for the inactive steps, should be the same as the background color just above. */
	/* color: #ffffff; */
	color: #c0c0c0;
}


.steps li.active::before
{
	/* This is the background and text color for the numeral for the active step. */
	/* Recommended that the text color should be the same as the page background color. */
	/* background-color: #68af19; */
	/* color: #ffffff; */
	background-color: var(--accent_text);
	color: #ffffff;
}

.steps li.active span
{
	/* This is the text color for the active step, should be the same as the background color just above. */
	/* color: #68af19; */
	color: var(--accent_text);
}

.steps li.complete::before
{
	/* This is the background and text color for the numeral for the completed steps. */
	/* Completed steps are automatically faded, so usually it will work best to just make this the same as the active steps. */
	/* The checkmark image will be the same as the background color. */
	/* background-color: #68af19; */
	background-color: var(--accent_text);
}

.steps li.complete span
{
	/* This is the text color for the completed steps, should be the same as the background color just above. */
	/* color: #68af19; */
	color: var(--accent_text);
}

.estimateList li
{
	background-color: var(--accent_text);
}

h1.heading
{
	font-size: 57px;
}

header .heading_accent
{
	color: var(--accent_text);
}

h2.subheading
{
	font-size: 35px;
}

h2.subheading::after
{
	content: "";
	display: block;
	margin: 15px auto 40px;
	height: 4px;
	width: 200px;
	background-color: var(--accent_text);
}

nav.steps
{
	max-width: 100%;
}

nav.steps li span
{
	font-size: 14.5px;
	font-family: "Poppins-Bold";
}
