* Leslie's Dark Blue: #00539f */
/* Leslie's Lighter Blue: #2470bb */
/* Leslie's Pink: #f05d7a */

@import url('https://fonts.googleapis.com/css?family=Gudea:400,400i,700&display=swap');

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800&display=swap');

#mainContainer {
	margin-bottom:30px !important;
	box-shadow:0px 3px 2px rgba(0,0,0,.2) !important;
	padding-bottom:10px !important;
	padding-top:30px !important;
}

#math-banner {
width:100%;
box-sizing:border-box;
padding:34px 52px;
border-radius:12px;
box-shadow:0px 3px 2px #bbb;
	color:#000;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
	text-align:center;
	margin:0px auto;
margin-bottom:24px;
background:#0f477e;
background:linear-gradient(105deg,
	#0f3f78 0%, #0f3f78 15%,
	#0f477e 15%, #0f477e 20%,
	#105488 20%, #105488 22%,
	#0f477e 22%, #0f477e 80%,
	#0f3f78 80%, #0f3f78 100%);
background-repeat:no-repeat;
background-position:center;
background-size:cover;
display:flex;
justify-content:center;
}

#math-banner h1 {
	text-align:center;
	font-family: 'Open Sans', sans-serif;
	font-size:260%;
	margin:0px auto;
	color:#fff;
	font-family: 'Gudea', sans-serif;
	font-weight:400;
	margin:0px;
	text-transform:uppercase;
	padding:20px;
	width:50%;
	border:3px solid #fff;
}

#math-lid {
	margin:0px auto;
	width:90%;
	border-radius:12px;
	margin-bottom:24px;
	color:#444;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
	text-align:center;
}

#math-div {
	margin:0px auto;
	width:100%;
	box-sizing:border-box;
	color:#fff;
	padding:34px 52px 40px 52px;
	border-radius:12px;
	box-shadow:0px 3px 2px #bbb;
	display:flex;
	justify-content: space-between;
	align-items: flex-end;
	flex-wrap:wrap;
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
}

#math-form {
	font-family: 'Open Sans', sans-serif;
	font-weight:600;
	font-size:110%;
}

#led-button {
	border:none;
	background:linear-gradient(to bottom, #B3DEEA 0%, #80BECF 100%);
	padding:16px 26px;
	border-radius:6px;
	box-shadow:0px 3px 2px rgba(0,0,0,.3);
	font-size:150%;
	color:#fff;
	font-weight:900;
	text-transform:uppercase;
	text-shadow:0px 1px 1px rgba(0,0,0,.3);
	margin:0px auto;
	margin-top:42px;
	margin-bottom:4px;
	transition:.3s;
	outline:none;
	font-family: 'Open Sans', sans-serif;
}

#led-button:hover {
	opacity:.8;
	cursor:pointer;
}

#answer-container {
	width:44%;
	text-align:center;
	font-family: 'Open Sans', sans-serif;
	font-weight:900;
	text-transform:uppercase;
	font-size:140%;
	text-shadow:0px 2px 1px rgba(0,0,0,.2);
	line-height:1.2em;
	border:2px solid rgba(0,0,0,.3);
	background:linear-gradient(to bottom right, #ccc 0%, #888 100%);
	box-sizing:border-box;
	border-radius:6px;
	padding:20px 0px;
	box-shadow:0px 3px 2px rgba(0,0,0,.3);
	margin-bottom:6px;
}

#savings {
	font-size:400%;
	padding-top:38px;
	padding-bottom:42px;
	color:#CBEBF4;
	text-shadow:0px 3px 2px rgba(0,0,0,.2);
}

#form-container {
	box-sizing:border-box;
	width:48%;
	text-transform:uppercase;
}

#math-form {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-start;
	align-content:space-between;
}

#math-form label {
	width:54%;
	margin-bottom:20px;
	font-weight:700;
}

#math-form select {
	width:24%;
	height: 49px;
	border:3px inset #91AAD5;
	text-align:center;
	font-weight:900;
	font-size:110%;
	color:#444;
	font-family: 'Open Sans', sans-serif;
	outline:none;
	padding-left:10px;
	box-sizing:border-box;
}

#math-form input {
	width:24%;
	height: 40px;
	padding-bottom:2px;
	border:3px inset #91AAD5;
	text-align:center;
	font-weight:900;
	font-size:110%;
	color:#444;
	font-family: 'Open Sans', sans-serif;
	outline:none;
	box-sizing:border-box;
}

#disclaimer {
	margin:28px auto 4px auto;
	width:90%;
	color:#888;
	font-size:80%;
}

#four-things {
background: #fff;
display: flex;
flex-wrap:wrap;
width:100%;
margin:0px auto 0px auto;
justify-content: space-around;
align-content:space-between;
align-items:center;
padding-top:24px;
padding-bottom:10px;

}
.one-thing {
width: 233px;
height: 102px;
margin-bottom:14px;
transition:.3s;
}
img.one-thing {
display:block;
object-fit:contain;
}
.one-thing:hover {
	opacity:.8;
}

#plugs-container {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	width:100%;
	margin:26px auto 0px auto;
}

.plugs {
	background:#0f477e;
background:linear-gradient(105deg,
	#0f3f78 0%, #0f3f78 15%,
	#0f477e 15%, #0f477e 20%,
	#105488 20%, #105488 32%,
	#0f477e 32%, #0f477e 90%,
	#0f3f78 90%, #0f3f78 100%);
	padding:10px 16px;
	border-radius:12px;
	box-shadow:0px 3px 2px #bbb;
	width:29%;
	margin-bottom:8px;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:flex-start;
}

.plugs-image {
	width:30%;
}

.plugs-image img {
	width:100%;
	border-radius:8px;
	box-shadow:0px 2px 1px rgba(0,0,0,.3);
	padding:10px;
	background:#fff;
	margin:10px 0px;
}

.plugs-title {
	color:#fff;
	font-family: 'Gudea', sans-serif;
	font-weight:700;
	text-align:center;
	width:58%;
	font-size:140%;
	margin:10px 0px;
	line-height:1.1;
}

.plugs-button {
	background:#aad8e5;
	background:linear-gradient(to bottom, #B3DEEA 0%, #80BECF 100%);
	font-family: 'Gudea', sans-serif;
	font-weight:700;
	color:#fff;
	border-radius:8px;
	margin:12px auto 0px auto;
	font-size:82%;
	padding:10px 16px;
	text-transform:uppercase;
	text-shadow:0px 1px 1px rgba(0,0,0,.3);
	display:inline-block;
	transition:.3s;
}

.plugs-button:hover {
	opacity:.8;
	cursor:pointer;
}

#four-things {
    background: none;
    display: flex;
    flex-wrap:wrap;
    width:100%;
    margin:0px auto 0px auto;
    justify-content: space-around;
    align-content:space-between;
    align-items:center;
    padding-top:24px;
    padding-bottom:10px;
}
.one-thing {
    width: 233px;
    height: 102px;
    margin-bottom:14px;
    transition:.3s;
}
img.one-thing {
    display:block;
    object-fit:contain;
}
.one-thing:hover {
    opacity:.8;
}

@media only screen and (max-width: 600px) {
	.plugs {width:100%;margin-bottom:20px;}
	#math-banner h1 {width:100%;}
	#math-lid {text-align:justify;font-size:88%;}
	#answer-container {width:100%;margin-top:16px;}
	#form-container {width:100%;}
	#led-button {margin-top:24px;}
	#math-div {padding:24px 20px;}
	#math-form input {width:35%;}
	#math-form select {width:35%;}
	#savings {font-size:300%;padding:26px 0px;}
}