@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Palanquin:wght@100;200;300;400;500;600;700&display=swap');
/* CSS Document */

* {
  box-sizing: border-box;
}

html {
font-family: 'Palanquin', sans-serif;	
}

html, body {
margin: 0 auto;	
height: 100%;
}

.logo {
padding: 2%;	
	
}

.social {
width: 50px;	
text-align: right;
}

.facebook {
	width: 10px!important;
}

.twitter {
	width: 20px;
	
}

.highlight {
	color: #00a0df;
}

h1 {
	font-size: 41px;
	text-align: center;
	color: #1e345d;
	font-weight: bold;
	max-width: 25ch;
	line-height: 1;
	margin: 0 auto;
	padding-top: 2%;
	
}

h2 {
	font-size: 36px;
	text-align: center;
	color: #1e345d;
	font-weight: bold;
	line-height: 1;
	margin: 0 auto;
	padding-bottom: 2%;
	padding-top: 2%;
}

.b1 h2 {
	padding-top: 4%;
}

h3 {
	font-size: 26px;
	text-align: center;
	color: #1e345d;
	font-weight: bold;
	line-height: 1;
	margin: 0 auto;
	padding-top: 4%;
	padding-right: 3%;
	padding-left: 3%;

}

.linkedin {
	width: 20px;	
}

.facebook, .twitter, .linkedin {
	margin: 0 1%;
}

header {
	background: #1e345d;

}

.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] {
  float: left;
  padding: 15px;
}


.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 25%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 50%;}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}


.b1 {
	background: #e6e6e6;
	height: 250px;
	text-align: center;
	width: 100%;

	
}

.vertical {
	text-align: center;
	height: 100%;
	width: 100%!important;
}

p {
	font-size: 21px;
}

.b1 p {
	color: #1e345d;
	padding-top: 0;
	margin-top: 0;
	font-weight: 600;
}

.b2 {
	display: flex;
	direction: ltr;
	width: 60%;
	margin: 0 auto;

}

.btn-container {
	text-align: center;
	widht: 100%;
}


.btn {
	background: #00a0df;
	border: 2px solid #00a0df;
	border-radius: 3px;
	font-size: 17px;
	color: #fff;
	padding: 0.5% 2%;
	transition: 0.2s ease-in;
	text-decoration: none;
	font-weight: 600;
}


.btn:hover {
	background: none;
	color: #00a0df;
	transition: 0.2s ease-in;
}

.cs {
	border-top: 8px solid #fdb913;
	box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 20%);
    transition: box-shadow 300ms ease 0ms;
	border-radius: 2px 2px 2px 2px;
	margin: 0 2%;
	padding: 0;

}

.bb {
	border-top: 8px solid #c1d42f;
	box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 20%);
    transition: box-shadow 300ms ease 0ms;
	border-radius: 2px 2px 2px 2px;
	margin: 0 2%;
	padding: 0;

}

.blog {
	border-top: 8px solid #1e345d;
	box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 20%);
    transition: box-shadow 300ms ease 0ms;
	border-radius: 2px 2px 2px 2px;
	margin: 0 2%;
	padding: 0;

}

.b2 h3 {
	text-align: left;
}

.b2 p {
	font-size: 17px; color: #666;
	padding-right: 3%;
	padding-left: 3%;
	font-weight: 400;
}

.resources h2 {
	padding-bottom: 2%;
}

.b2 .cta {
	text-align: right;
	padding-right: 3%;
	padding-left: 3%;
}

.b2 a {
	color: #00a0df;
	text-decoration: none;
	font-weight: 800;

}

hr {
	padding-right: 3%;
	padding-left: 3%;
	width: 95%;
	margin: 0 auto;
	border: none;
	border-bottom: 1px solid #e6e6e6;
}

@media screen and (max-width: 1025px) {
	h1 {
		font-size: 27px;
		padding-top: 5%; 
		line-height: 1.3;
	}
	
	h2 {
		font-size: 25px;
		line-height: 1.3;
	}
	
	h3 {
		font-size: 21px;
	}
	
	.resources {
		padding-top: 2%;
	}
	
	p {
		font-size: 17px;
		line-height: 1.6;
	}
	
	.b2{
		width: 80%;
		display: block;
		padding: 2%;
		margin: 0 auto;
	}
	
	.col-4 {
		width: 100%;
		display: block;
		margin: 2%;
	}
	
}