@media (min-width: 768px) { 
	.pt-resource {
	width: 45% !important;
	max-width: 450px;
    }

    .wrapper-edu h1 { font-size: 36px !important; }

}
@media (min-width: 992px) { 

	.subheader { display: flex; }
	.sub-text {
		text-align: left;
		
	}

	.pad {
		padding: 6% 5% 0 6% !important; width: 50%;
	}

	.section-steps  {

		padding: 40px 40px 40px 0 !important;
    	width: 50% !important;
	}

	.step-number {
		min-width: 100px !important;
	}


	.subheader h3 {
	    font-size: 24px !important;
	    margin-bottom: 16px !important;
	}

	.wrapper-edu { font-size: 16px !important; }
	.wrapper-edu p { font-size: 16px !important; }

	.flex-box { display: flex !important; }
	.section-container { padding: 100px 0 !important; }

	.section-systems { padding-left: 5%; width: 80% !important; }

	.wrapper-edu h2 { font-size: 32px !important; }

	.btn-blue { font-size: 15px !important; }

	.pt-resource p { font-size: 15px !important; }

	.step-desc span { font-size: 12px !important; }

	.wrapper-edu h1 { font-size: 40px !important; }

}

@media (min-width: 1200px) { 
	.step-number { padding-top: 38px; }
	.subheader h3 {
	    margin-top: 0 !important;
	}
	.form-training { padding: 50px !important;  }

}



@font-face {
    font-family: "formata-bold";
    src: url("https://www.tremcosealants.com/media/2615/formata-bold.ttf");
}

@font-face {
	font-family: "open sans";
 	src: url('https://www.tremcosealants.com/media/2616/opensans.ttf') format("truetype-variations");
    font-weight: 1 999;
}



.wrapper-edu h1 {
	color: #fff;
	font-weight: normal;
	font-family: 'formata-bold', sans-serif;
	font-size: 32px;
	line-height: 46px;
}

.wrapper-edu h2 {
	color: #2a323d;
	font-weight: normal;
	font-family: 'formata-bold', sans-serif;
	font-size: 28px;
	line-height: 28px;
	margin-bottom: 20px;
}

.wrapper-edu h3 {
	color:#2a323d;
	font-weight: normal;
	font-family: 'signika-reg', sans-serif ;
	font-size: 24px;
	line-height: 28px;
	padding-bottom: 0px;
}


.btn-orange {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    letter-spacing: 1px;
    color: #ffffff;
    background-color: #fe3002;
    border-radius: 2px;
    padding: 12px 30px;
    display: inline-block;
}

.btn-orange:hover {
	text-decoration: none;
    color: #fff;
    background-color: #fc5300;
    transition: 0.2s;
}

.btn-blue { 
	background-color: #008BDA;
    color: #fff;
    padding: 18px 30px;
    border-radius: 4px;
    font-size: 14px;
    max-width: 310px; margin: 30px auto 0 auto;
    text-align: left;
    position: relative;
     }
.btn-blue:hover { background-color: #00CDB1; transition: 0.2s; }
.btn-blue-a { text-decoration: none; font-weight: 600; }
.btn-blue-a:hover { text-decoration: none; }
.btn-blue span { font-size: 13px; font-weight: 400; }
.btn-teal {width: 90%; margin-top: 20px;}
.dark-blue-bg p {color: #fff;}
.dark-blue-bg h2 {color: #fff;}

.btn-icon { 
	position: absolute;
    right: 20px;
    bottom: 36%; 
	width: 20px;
	height: 20px;}

.section-header { padding: 20px 0; }

.wrapper-edu {
	height:     auto;  
    min-height: 100%;
    background-color: #ffffff;
	margin:     -38px auto 0px auto;
    padding:    0px auto;
    overflow: hidden;
    font-size: 15px;
    color: #455260;
    text-align: center;
    font-family: "open sans";

}

.wrapper-edu p { font-size: 15px; line-height: 160%; color: #455260; font-family: "open sans";}

.header-edu {
	text-align: center;
	background-image: url('http://www.tremcosealants.com/media/2682/edu_banner.jpg');
	background-color: #2a323d;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top;
	padding-bottom: 0px;
	min-height: 420px;
	padding-top: 1px;
}


.title { color: #fff !important; width: 88%;  margin: auto; margin-bottom: 40px; max-width: 800px;}
.subheader {
	background: #fff;
	width: 88%;
	margin: -120px auto 20px auto;
	border-radius: 4px;
	color: #5d7085;
	z-index: 5;
	text-align: center;
	max-width: 1200px;

}

.subheader h3 { font-family: "formata-bold"; font-size: 20px; line-height: 22px;}

.img-right { width: 100% ;  margin-bottom: 20px; }

.pad { padding: 6%; }

.section-wrapper {width: 88%; max-width: 1200px; margin: auto;}

.section-container { padding: 50px 0; }
.section-systems { width: 88%; margin: 0px auto 0 auto; text-align: center; }

.section-dark {
	background-color: #2A323D;
	color: #fff;
}

.section-dark h2 { color: #fff; }

.panel-wrapper {
	text-align: center;
	background-color: #F8F8FA;
	padding: 30px 0 70px 0;
}

.section-gray { background: #E8EDF3; padding-top:; }


.step-number {
	color: #00CDB1;
	background-color: #2A323D;
	min-width: 70px;
	min-height: 100px;
	font-size: 64px;
	text-align:center;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}

.step { width: 88%; margin: 22px auto;  background-color: #E8EDF3; border-radius: 4px; display: flex; flex-wrap: nowrap; align-items: center; text-align: left;}

.step-desc {
	text-transform: uppercase;
	font-weight: 700;
	line-height: 140%;
	color: #404B5A;
	padding: 0 20px 0 30px;
}

.step-desc span { text-transform: none; font-weight: 500; display:block; font-size: 11px; }

.section-steps { padding-bottom: 40px; }

.section-vid {
	width: 88%; margin: 0 auto;
}

.responsive-vid {
	aspect-ratio: 16 / 9;
    width: 100%;
}

.form-training {
	width: 88%;
	max-width: 800px;
	background-color: #fff;
	border-radius: 10px;
	margin: 20px auto;
	padding: 6%;
}

.resources-container {
	display:flex;
	gap: 24px;
	flex-wrap:wrap;
	justify-content: center;
	max-width: 1100px;
    margin: 0 auto;
}

.resources-container a {
	
	color: #2A323D;
	text-decoration-line: underline;
	text-decoration-color: #00CDB1;
	font-weight: 700;
	
}

.resources-container a:hover { color: #536E93; transition: 0.2s; }


.pt-resource {
	width: 80%;
	border: solid #E8EDF3 1px; 
	box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1)  ; 
	-webkit-box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1)  ; 
	-moz-box-shadow: 2px 4px 8px rgba(0, 0, 0, 0.1)  ; 
	padding: 28px;
	font-size: 20px;
	line-height: 30px;
	color: #2A323D;
}

.pt-resource img {
	width:100%;
	border-radius: 4px;
	margin-bottom: 20px;
}

.pt-resource p {
	margin-top: 10px;
	text-decoration: none;
}