#simplesteps-main h1 {
	font-size: clamp(1.5rem, 1.2857rem + 1.0714vw, 3rem);
	text-transform: none;
}

#simplesteps-main .background.footprint h1 {
	font-size: clamp(2rem, 1.6418rem + 1.791vw, 5rem);
	text-transform: none;
}

#simplesteps-main h2 {
	font-size: clamp(1.5rem, 1.7857rem + 1.0714vw, 3rem);
	font-family: 'pfdintextcondpro-medium', Arial, sans-serif;
	text-transform: none;
}

#simplesteps-main h2.h5 {
	font-size: clamp(1.2rem, 1.1045rem + 0.4776vw, 2rem);
	font-family: 'pfdintextpro-bold', Arial, sans-serif;
}

#simplesteps-main .sm-p {
	font-size: clamp(0.8rem, 0.7048rem + 0.4762vw, 1.3rem);
}

#simplesteps-main p,
#simplesteps-main h3,
.bg-pastel-green h3 {
	font-size: clamp(1rem, 0.9286rem + 0.3571vw, 1.5rem);
}

#simplesteps-main .h3 {
	font-size: clamp(1.6rem, 1.4rem + 1vw, 3rem);
	font-family: 'pfdintextpro-bold', Arial, sans-serif;
}

#simplesteps-main .h4 {
	font-size: clamp(1.5rem, 1.3571rem + 0.7143vw, 2.5rem);
	font-family: 'pfdintextpro-bold', Arial, sans-serif;
}

#simplesteps-main .background.footprint p.yellow {
	font-size: clamp(1rem, 0.619rem + 1.9048vw, 3rem);
}

#simplesteps-main a {
	font-size: clamp(0.8rem, 0.6667rem + 0.6667vw, 1.5rem);
}

#simplesteps-main .fw-bold {
	font-family: 'pfdintextcondpro-bold', Arial, sans-serif;
}

#simplesteps-main .image-box {
	border: 3px solid #00692f;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	cursor: pointer;
	background-color: #00692f;
}

#simplesteps-main .image-box img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

#simplesteps-main a:visited {
	color: var(--green);
}

header#simplesteps-header .container-fluid {
	width: 100%;
}

#simplesteps-main .wrapper nav {
	position: relative;
	display: flex;
	justify-content: space-between;
	margin: 0;
	height: 60px;
	align-items: center;
	max-width: 100%;
}

#simplesteps-main .btn-rounded .bi.bi-chevron-left.yellow {
	display: flex;
	align-items: center;
}

#simplesteps-main .bg-green {
	background-color: #00692f;
}

#simplesteps-main .bg-lightgreen {
	background-color: var(--lightgreen);
}

#simplesteps-main .bg-darkgreen {
	background-color: var(--darkgreen);
}

#simplesteps-main .bg-footprintgreen {
	background-color: var(--lightgreen);
	padding: 6rem 2rem;
	margin-bottom: 6rem;
	border-top-right-radius: 100px;
}

#simplesteps-main .btn-lightgreen {
	text-transform: none;
	font-size: clamp(1rem, 0.8095rem + 0.9524vw, 2rem);
	border-radius: 0;
}
#simplesteps-main .background.footprint {
	background-image: url('../img/hangon_leba_240225-778ljus-lowres.png');
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
}

#simplesteps-main .footprint .bg-lightgreen.box {
	border-radius: 20px;
	cursor: pointer;
	max-width: 95%;
	max-height: 22rem;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px 0;
}

#simplesteps-main .footprint .bg-lightgreen.source.box {
	border-radius: 20px;
	cursor: pointer;
	min-width: 20rem;
	max-width: 25rem;
	max-height: 22rem;
	min-height: 7rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

#simplesteps-main .btn-rounded .bi.bi-chevron-left.yellow {
	display: flex;
	align-items: center;
}

#simplesteps-main .savings-guide .image-box {
	border: 3px solid #00692f;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	cursor: pointer;
	background-color: #00692f;
	max-width: 100%;
}

#simplesteps-main .savings-guide .image-box img {
	height: auto;
	object-fit: cover;
}

#simplesteps-main .savings-guide .image-box h3.yellow {
	font-size: clamp(1rem, 0.8571rem + 0.7143vw, 2rem);
}
#simplesteps-main .savings-guide .bg-green.box {
	border-radius: 20px;
	cursor: pointer;
	max-width: 100%;
	max-height: 22rem;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 10px 0;
}

#simplesteps-main .savings-guide .bg-green.box h3.yellow {
	font-size: clamp(1rem, 0.8571rem + 0.7143vw, 2rem);
}
#simplesteps-main .savings-guide .bg-green.box .sm-p {
	font-size: clamp(0.8rem, 0.7048rem + 0.4762vw, 1.2rem);
}

#simplesteps-main .savings-guide .image-box-horizontal {
	display: flex;
	text-align: start;
	border: 5px solid var(--pastel-green);
	border-top-right-radius: 15px;
	border-bottom-right-radius: 15px;
	cursor: pointer;
	background-color: var(--pastel-green);
	height: 100%;
	width: 100%;
}

#simplesteps-main .savings-guide .btn-lightgreen {
	text-transform: none;
	font-size: clamp(1rem, 0.8095rem + 0.9524vw, 2rem);
}

#simplesteps-main .savings-guide .bg-green {
	background-color: #00692f;
}

#simplesteps-main .savings-guide .compare {
	display: grid;
	grid-template-columns: auto 1fr auto;
}
@media (min-width: 1900px) {
.compare-box{
    width: 1100px;
}
}
#simplesteps-main .savings-guide .compare .image-box {
	border: 5px solid #00692f;
	border-bottom-right-radius: 15px;
	border-bottom-left-radius: 15px;
	cursor: pointer;
	background-color: #00692f;
	max-height: 22rem;
	width:100%
}

#simplesteps-main .savings-guide h2.object span {
	text-transform: capitalize;
}

#simplesteps-main .savings-guide .image-box-horizontal .compare-first-img {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 50%;
	height: 100%;
	max-height:auto;
}

.hanger-name {
	max-width: 200px;
}

#simplesteps-main .savings-guide .image-box .compare-second-img {
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	width: 100%;
	height: 220px;
}
#simplesteps-main .vs-compare:last-child > hr {
	display: none;
}

#simplesteps-main .vs-compare hr {
	margin: 2rem 0;
}
#back-bar {
	margin-left: 145px;
}

#back-bar .back-to-start {
	margin: 0 0 0 40px;
}
/*	#back-bar .button-box {
		margin: 0 0 0 40px;
	}*/
	#back-bar .back-to-start-mobile {
		display: none;
	}

@media (min-width: 3000px) {
	#simplesteps-main .image-box img {
		width: 100%;
		height: auto;
		object-fit: cover;
	}

}

@media (max-width: 1300px) {
	.hanger-name {
		max-width: unset;
	}
	#simplesteps-main .savings-guide .image-box-horizontal .compare-first-img {
		background-repeat: no-repeat;
		background-position: center;
		background-size: cover;
		width: 200px;
		height: 100%;
		max-height: 100%;
	}
}

@media (min-width: 1025px) {
	#simplesteps-main .container {
		height: 100%;
		flex-grow: 8;
	}

	#simplesteps-main .container-fluid {
		height: 100%;
		max-width: 100%;
	}

	#simplesteps-main .sidemenu {
		display: flex;
		flex-direction: column;
		height: 100vh;
	}

	#simplesteps-main .grid-container {
		display: grid;
		grid-template-columns: 1fr 3fr;
	}

	#simplesteps-main .sidemenu img {
		height: 65%;
		object-fit: cover;
	}

	#simplesteps-main .sidemenu div {
		height: 35%;
		align-items: start;
	}
	#simplesteps-main .sidemenu.bg-lightgreen {
		background-color: var(--lightgreen);
	}
}

@media (max-width: 1024px) {
	#simplesteps-main h1 {
		font-size: clamp(1rem, 0.5455rem + 2.2727vw, 2rem);
	}

	#simplesteps-main p {
		font-size: clamp(1rem, 0.9091rem + 0.4545vw, 1.2rem);
		margin-bottom: 0;
	}

	#simplesteps-main .container-fluid {
		flex-direction: column;
	}

	#simplesteps-main #top-nav {
		flex-direction: row;
	}

	#simplesteps-main .sidemenu {
		width: 100%;
		display: grid;
		grid-template-columns: 60% 40%;
		height: 100%;
		margin-bottom: 50px;
	}

	#simplesteps-main .sidemenu img {
		max-height: 120px;
		max-width: 100%;
		object-fit: cover;
	}

	#simplesteps-main .grid-container {
		display: grid;
		grid-template-rows: 120px 1fr;
	}

	#simplesteps-main .btn-round.bg-green {
		top: 190px;
	}
}

@media (max-width: 914px) {
	#simplesteps-main .sidemenu {
		width: 100%;
		display: grid;
		grid-template-columns: 1fr 1fr;
		margin-bottom: 0px;
	}

	#simplesteps-main .grid-container {
		display: grid;
		grid-template-rows: 120px 1fr;
	}

	#simplesteps-main .sidemenu img {
		height: 120px;
		max-height: 120px;
		min-height: 120px;
		max-width: 100%;
		object-fit: cover;
	}

	#simplesteps-main .sidemenu {
		height: 120px;
	}

	#simplesteps-main .image-box img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	#simplesteps-main h2 {
		font-size: clamp(1.5rem, 1.2857rem + 1.0714vw, 3rem);
		margin:auto
	}

	#simplesteps-main .savings-guide .compare .image-box-horizontal,
	#simplesteps-main .savings-guide .compare .image-box {
		height: 220px;
		margin:auto
	}

	#simplesteps-main .savings-guide .image-box-horizontal .compare-first-img {
		height: 100%;
	}

	#simplesteps-main .savings-guide .compare .image-box .compare-second-img {
		height: 140px;
	}
}

@media (max-width: 793px) {
	#simplesteps-main .savings-guide .image-box-horizontal .compare-first-img {
		width: 200px;
	}
	#simplesteps-main .savings-guide .compare {
		display: block;
		grid-template-columns: auto 1fr auto;
	}
    #simplesteps-main .savings-guide .bg-green.box {
        max-width: 100%;
        margin: auto;
    }
	#simplesteps-main .btn-round {
		height: 35px;
		width: 35px;
		font-size: 20px;
	}
}

@media (max-width: 576px) {
	#simplesteps-main .savings-guide .image-box-horizontal {
		 max-width: 100%; 
	}
	#simplesteps-main .sidemenu {
		grid-template-columns: 1fr 2fr;
	}
	#simplesteps-main .savings-guide .bg-green.box {
		max-width: 100%;
		margin: auto;
	}
	#back-bar .back-to-start-mobile {
		display: block;
		margin: 0 40px;
	}
	#back-bar .back-to-start {
		display: none;
	}
	#back-bar {
	 margin-left: auto; 
	}
	#back-bar .button-box{
		margin-top: 25px;
	}

}
@media (max-width: 400px) {
	#simplesteps-main .container-fluid {
		overflow: unset
	}
	#simplesteps-main .custom-width{
		width:100vw
	}

}
