/*
Theme Name: LP Theme Sign Up Styles
Theme URI: https://literacyplanet.com
Author: Literacy Planet
*/


/* SCHOOL / HOME PAGE
################################################################################### */

.page-header {
	padding: calc(var(--layout-unit)*2);
}

.school-home-options .option {
	display: block;
	box-shadow: 0.5rem 0.5rem 0 rgba(0,0,0,0.1);
	border-radius: 2rem;
	text-decoration: none;
	color: #fff;
}

.school-home-options .option .info {
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	text-align: center;
	padding: 2rem;
}

.school-home-options .option .info .btn {
	border: none;
	box-shadow: 0.3rem 0.5rem 0 rgba(0,0,0,0.2);
}

.school-home-options .option h2 {
	color: #fff;
}

@media (max-width: 699px) {

	.school-home-options {
		max-width: 30rem;
		margin: auto;
	}

	.school-home-options .option {
		padding-bottom: 133.33%;
		margin-bottom: calc(var(--layout-unit)*2);
	}

	.school-home-options .option img {
		object-position: center top;
	}

	.school-home-options .option .sub-heading {
		font-size: 1.5rem;
		line-height: 1.4em;
	}

}

@media (min-width: 700px) {

	.school-home-options {
		display: flex;
	}

	.school-home-options > div {
		width: 50%;
		padding: inherit;
	}

	.school-home-options .option {
		padding-bottom: 133.33%;
	}

	.school-home-options .option img {
		object-position: center top;
	}

	.school-home-options .option .sub-heading {
		font-size: 1.2rem;
		line-height: 1.4em;
	}

}

@media (min-width: 700px) and (max-width: 799px) {

	.school-home-options {
		padding: calc(var(--layout-unit)*1);
		margin: calc(var(--layout-unit)*-2);
	}

}

@media (min-width: 800px) {

	.school-home-options {
		padding: calc(var(--layout-unit)*1.5);
		margin: calc(var(--layout-unit)*-3);
	}

}

/* SCHOOL SIGN UP
################################################################################### */

.help-panel .container {
	padding-top: 0;
	padding-bottom: 0;
}

@media (max-width: 1023px) {

	.school-sign-up-layout .container .info {
		margin-bottom: 3rem;
	}


}

@media (min-width: 1024px) {

	.school-sign-up-layout .container {
		display: flex;
	}

	.school-sign-up-layout .container .info {
		width: 50%;
		padding-right: calc(var(--layout-unit)*1.5);
	}

	.school-sign-up-layout .container .form {
		width: 50%;
		padding-left: calc(var(--layout-unit)*1.5);
	}

	.help-panel .blob-desktop {
		top: 0;
		right: 80%;
		width: 25rem;
		min-width: 20%;
		transform: translate(0%, -30%);
		margin-top: 0;
	}

}

/* E-COMM
################################################################################### */

@media (max-width: 1023px) {

	.home-sign-up-checkout > div {
		margin-top: 2rem;
	}

}

@media (min-width: 1024px) {

	.home-sign-up-checkout {
		display: flex;
		justify-content: space-between;
		margin-top: 3rem;
	}

	.home-sign-up-checkout > div {
		width: calc(50% - var(--layout-unit));
	}

}

/* SECTION STATS
################################################################################### */

.section-stats .container {
	padding-top: calc(var(--layout-unit)*2);
	padding-bottom: calc(var(--layout-unit)*2);
}

/* HELP PANEL
################################################################################### */
 
.help-panel hr {
	margin: calc(var(--layout-unit)*3) 0;
}

.help .jellypus {
	position: relative;
	z-index: 10;
	max-width: 40rem;
	display: block;
	left: 50%;
	transform: translateX(-47%);
	margin-bottom: -2rem;
}

@media (min-width: 1024px) {


}