/* CSS specific to the bs4/main template */
body {
	background-color: #f5f9fb;
	color: #000000;
}

.main-layout {
	position: relative;
	max-width: 2200px;
	margin-left: auto;
	margin-right: auto;
}
.msb-top-navbar {
	max-width: 2200px;
}

.msb-top-navbar .navbar-nav .nav-link {
	color: #005DE9;
	color: var(--bs-primary);
	font-weight: 600;
}
@media (min-width: 768px) {
	.msb-top-navbar .navbar-nav li > a {
		font-size: 0.85rem !important;
	}
}

.msb-footer {
	background-color: #f5f9fb;
}


/* Custom Text */
.sm-header {
	color: #005DE9;
	font-size: 0.85rem;
	font-weight: 500;
	letter-spacing: 0.75px;
}
@media (min-width: 768px) {
	.sm-header { font-size: 0.9rem; letter-spacing: 0.94px;}
}
.md-header {
	/* This barely passes WCAG!!! */
	color: rgba(255, 255, 255, 0.75);
	font-size: 1.15rem;
	font-weight: 500;
	letter-spacing: 1px;
}
.bg-lightblue {
	background-color: #dfe7f2;
}
.hover-bg-lightblue:hover, .hover-bg-lightblue:focus {
	background-color: #dfe7f2 !important;
}
.p-2-5 { padding: 0.75rem !important; }


.swish-area {
	background-color: #f5f9fb;
	background-image: url('../../shared/images/bg/bg-992-white-swish.png');
	background-position: left top;
	background-size: 100% 100%;
	background-repeat: no-repeat;
}
@media (min-width: 992px) {
	.swish-area {
		background-image: url('../../shared/images/bg/bg-1440-white-swish.png');
	}
}

/* Style for smallest device first!
   section-1 - top hero section */
.section-1 {
	background-color: #ffffff;
	background-repeat: no-repeat;
	min-height: 500px;
}
.section-1-content { padding-top: 2rem; }
.section-1 h1 { font-size: 2.25rem; font-weight: 600; }
.section-1-text { font-size: 1rem; max-width: 90%; }
.section-1-options .btn, .section-1-options { font-size: 0.8rem; }
.section-1-email {
	background-color: #F2F7FE !important;
	border: 1px solid #EBF3FE !important;
	padding: 0.75rem 2.5rem 0.75rem 0.75rem !important;
	border-radius: 50rem !important;
	width: 100%;
}

.gl-content { margin-top: 3rem; }
.gl-content a { font-weight: 500; }
.gl-header {
	color: var(--bs-gray-600);
	font-size: 0.85rem;
	font-weight: 500;
	margin-bottom: 7px;
}
.gl-text { font-size: 0.8rem; }
.gl-image { margin-bottom: 0.55rem; }

@media (min-width: 375px) {
	.section-1 { min-height: 500px; padding-bottom: 3rem; }
	.section-1-content { padding-top: 3rem; }
	.section-1-text { font-size: 1.15rem; }
	.section-1-options .btn, .section-1-options { font-size: 1rem; }
}
@media (min-width: 576px) {
	.section-1 { min-height: 500px; }
	.section-1 h1 { font-size: 2.75rem; }
	.section-1-text { font-size: 1rem; max-width: 75%; }
	.section-1-options .btn, .section-1-options { font-size: 0.9rem; }
	.section-1-content { padding-left: 3.5rem; }
	.gl-content { margin-top: 2rem; padding-left: 3.5rem; }
}
@media (min-width: 768px) {
	.section-1 { min-height: 660px; }
	.section-1-content { padding: 4rem 3rem 0; }
	.section-1 h1 { font-size: 2.25rem; }
	.section-1-text { max-width: 85%; }
	.gl-content { padding: 0 0 5rem 3rem; }
	.section-1-hero img {
		height: 600px;
		object-position: left bottom;
		object-fit: cover;
	}
}
@media (min-width: 992px) {
	.section-1 { min-height: 620px; }
	.section-1-content { padding-top: 5rem; }
	.section-1-text { max-width: 80%; }
	.section-1-options .btn, .section-1-options { font-size: 1rem; }

	.gl-content { padding: 0 0 0 3rem; }
	.gl-text { font-size: 0.85rem; }

	.section-1-hero img {
		height: 650px;
	}
}
@media (min-width: 1200px) {
	.section-1-content { padding-top: 4rem; }
	.section-1-text { font-size: 1.15rem; }
}
@media (min-width: 1440px) {
	.section-1-hero img {
	}
}


/* section-2 - stacked blue area */
.section-2 {
	font-size: 1rem;
	background-color: #1b6fe1;
	background-repeat: no-repeat;
	background-size: contain, contain;
	background-position: left top, left bottom;
	background-image:
		url('../main/images/section-2-top-sm.jpg'),
		url('../main/images/section-2-bottom-sm.jpg');
	padding-top: 4rem;
	padding-bottom: 2rem;
}
.section-2-top { display:none; }
.section-2 h1 { font-size: 1.85rem; font-weight: 300 !important; background-color: #1b6fe1 !important; }
.section-2 h2 { font-size: 1.25rem; font-weight: 500; }
.section-2 .card-text { font-size: 1rem; max-width: 85%; }
.section-2 a { font-size: 1rem; font-weight: 600; }
@media (min-width: 375px) {
	.section-2 h1 { font-size: 2rem; }
}
@media (min-width: 576px) {
	.section-2-top {
		display: block;
		position:absolute;
		top:-50px;
		left: 0;
		width: 100%;
		height:54px;

		background-color: transparent;
		background-size: cover;
		background-position: left top;
		background-repeat: no-repeat;
		background-image: url('../main/images/section-2-top-sm.jpg');
	}
	.section-2 {
		font-size: 1.25rem;
		background-size: contain;
		background-position: left bottom;
		background-image: url('../main/images/section-2-bottom-sm.jpg');
	}
	.section-2-content { padding-bottom: 4rem; }
	.section-2 h1 { font-size: 2.15rem; }
	.section-2 h2 { font-size: 1.75rem; }
}
@media (min-width: 768px) {
	.section-2-title {
		background-color: #1b6fe1;
		position: relative;
		top: -50px;
		left:0;
		width: 100%;
		height: 100px;
	}
	.section-2-top {
		top:-130px;
		height:130px;
		background-size: cover;
		background-position: left top;
		background-image: url('../main/images/section-2-top-md.png');
	}
	.section-2 {
		background-size: contain;
		background-position: left bottom;
		background-image: url('../main/images/section-2-bottom-md.jpg');
		padding-top: 0;
	}
	.section-2-content { padding-bottom: 5rem; }
	.section-2 h1 { font-size: 2.25rem; }
}
@media (min-width: 992px) {
	.section-2-title {
		position: relative;
		top: 0;
	}
	.section-2-top {
		top:-120px;
		height:120px;
		background-size: cover;
		background-position: left top;
		background-image: url('../main/images/section-2-top.png');
	}
	.section-2 {
		background-size: contain;
		background-position: left bottom;
		background-image: url('../main/images/section-2-bottom.jpg');
	}
	.section-2-content { padding-bottom: 7rem; }
}
@media (min-width: 1200px) {
	.section-2-top {
		top:-130px;
		height:130px;
		background-size: cover;
	}
	.section-2 .card-text { max-width: 75%; }
	.section-2-content { padding-bottom: 9rem; }
}
@media (min-width: 1700px) {
	.section-2-top {
		top:-140px;
		height:140px;
	}
}
@media (min-width: 1700px) {
	.section-2-top {
		top:-150px;
		height:150px;
	}
}


/* section-3 - Go mobile... area */
.section-3 h1 { font-size: 2.5rem; }
@media (min-width: 992px) {
	.section-3 { font-size: 1.15rem; }
	.section-3 h1 { font-size: 3rem; }
}
@media (min-width: 992px) {
	.section-3 h1 { max-width: 75%; }
}

/* section-4 - More To Love Area */
.section-4 {
	padding-top: 6rem;
	padding-bottom: 6rem;
	font-size: 1.15em;
}
.section-4 h1 { font-size: 2rem; font-weight: 300 !important; }
.section-4 h2 { font-size: 1.5rem; font-weight: 500 !important; }
@media (min-width: 768px) {
	.section-4 { padding-top: 15rem; }
	.section-4 h1 { font-size: 3rem; }
}
@media (min-width: 992px) {
	.section-4 h1 { max-width: 50%; }
}

/* section-5 - Quotes Area */
.section-5 {
	font-size: 1.15rem;
	background-color: #f5f9fb;
	background-image: url('../../shared/images/bg/bg-1200-top-white-curve.png');
	background-position: center bottom;
	background-size: 100%;
	background-repeat: no-repeat;
}
.quote-container {
	padding: 4rem 1rem 2rem 1rem;
	background-color: #ffffff;

	border-top: 5px solid #005DE9 !important;
	border-top: 5px solid var(--bs-primary) !important;
	border-radius: 0.2rem !important;
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}
/* Quotes Carousel */
.quote-carousel .carousel-item p {
	min-height: 215px;
	color: #777;
	padding-bottom: 3rem;
	font-size: 1rem;
	line-height: 1.5;
}
.quote-carousel {
	text-align: center;
}
.quote-carousel .carousel-indicators li {
	background-color: #BED8E4;
	width: 12px;
	height: 12px;
	margin-right: 10px;
	border-radius: 50%;
}
.quote-carousel .carousel-indicators li.active {
	background-color: #005DE9;
	background-color: var(--bs-primary);
}
@media (min-width: 576px) {
	quote-carousel .carousel-item p {
		min-height: 250px;
	}
}
@media (min-width: 768px) {
	.section-5 { font-size: 1.25rem; padding-bottom: 6rem; }
	.quote-carousel .carousel-item p {
		min-height: 250px;
		font-size: 1.5rem;
	}
}
@media (min-width: 992px) {
	.quote-container {
		max-width: 75%;
		padding: 4rem 5rem 2rem 5rem;
	}
}


/* section-6 - blog */
.section-6 {
	font-size: 1em;
	font-weight: 500;

	background-color: #ffffff;

	padding-top: 4rem;
	padding-bottom: 4rem;
}

/* section-7 - Get Started Area */
.section-7 {
	font-size: 1rem;

	background-color: #1b6fe1;
	background-repeat: no-repeat;
	background-size: contain, contain;
	background-position: left top, left bottom;
	background-image:
		url('../main/images/section-2-top-sm.jpg'),
		url('../main/images/section-2-bottom-sm.jpg');

	padding-top: 6rem;
	padding-bottom: 5rem;
}
.section-7 h1 { font-size: 2.25rem; font-weight: 300 !important; }
.section-7 h2 { font-size: 1.5rem; font-weight: 500; }
.section-7 .card-text { font-size: 1.15rem; font-weight: 300; }

@media (min-width: 768px) {
	.section-7 h1 { font-size: 2.5rem; }
	.section-7 h2 { font-size: 1.5rem; }
	.section-7 { padding-top: 10rem; padding-bottom: 7rem; }
	.section-7 .card-text { font-size: 1rem; font-weight: 400; max-width: 75%; }
	.section-7 .btn { background-color: transparent; }
}
@media (min-width: 992px) {
	.section-7 {
		background-image:
			url('../main/images/section-2-top.jpg'),
			url('../main/images/section-2-bottom.jpg');
		font-size: 1.25rem;
		padding-top: 10rem;
		padding-bottom: 12rem;
	}
}


/* Custom Cards */
.card.card-salmon {
	border-left: 5px solid #FFBDBD !important;
}
.card.card-purple {
	border-left: 5px solid #DEC4FB !important;
}
.card.card-yellow {
	border-left: 5px solid #FFD98F !important;
}
.card.card-blue {
	color: #ffffff;
	background-color: transparent;
	border: 7px solid rgba(175,208,234,0.11); }
	.card.card-blue:hover, .card.card-blue:focus {
		color: #005DE9;
		background-color: #ffffff;
		box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
	}
	.card.card-blue .card-icon {  padding: 0.75rem; }
	.card.card-blue:hover .card-icon, .card.card-blue:focus .card-icon {
		color: #ffffff;
		background-color: #005DE9;
		border-radius: 50%;
	}
	.card.card-blue a { color: #ffffff; }
	.card.card-blue:hover a, .card.card-blue:focus a { color: #005DE9; }
	.card.card-blue:hover a:hover, .card.card-blue:focus a:focus { color: #003e9d; }
	.card.card-blue .btn-outline-primary { color: #005DE9; background-color: #ffffff; }
	.card.card-blue:hover .btn-outline-primary:hover { color: #fff; background-color: #005DE9; }

/* Custom Badges */
.badge-light-blue {
	letter-spacing: -1px;
	color: #005DE9;
	background-color: #EBF7FE;
	border: 1px solid #EBF7FE;
	border-radius: 6px; }
	a.badge-light-blue:hover, a.badge-light-blue:focus {
		background-color: #277FC2; }
	a.badge-light-blue:focus, a.badge-light-blue.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #277FC2; }

.badge-steel-blue {
	background-color: #B7D6EE;
	border: 1px solid #B7D6EE;
	border-radius: 6px; }
	a.badge-steel-blue:hover, a.badge-steel-blue:focus {
		background-color: #B0C4DE; }
	a.badge-steel-blue:focus, a.badge-steel-blue.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #B0C4DE; }

.badge-light-green {
	background-color: #BCEBC2;
	border: 1px solid #BCEBC2;
	border-radius: 6px; }
	a.badge-light-green:hover, a.badge-light-green:focus {
		background-color: #89DC94; }
	a.badge-light-green:focus, a.badge-light-green.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #89DC94; }

.badge-salmon {
	background-color: #FFBDBD;
	border: 1px solid #FFBDBD;
	border-radius: 6px; }
	a.badge-salmon:hover, a.badge-salmon:focus {
		background-color: #FF7777; }
	a.badge-salmon:focus, a.badge-salmon.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #FF7777; }

.badge-purple {
	background-color: #E8CEFF;
	border: 1px solid #E8CEFF;
	border-radius: 6px; }
	a.badge-purple:hover, a.badge-purple:focus {
		background-color: #C482FF; }
	a.badge-purple:focus, a.badge-purple.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #C482FF; }

.badge-yellow {
	background-color: #FFD98F;
	border: 1px solid #FFD98F;
	border-radius: 6px; }
	a.badge-yellow:hover, a.badge-yellow:focus {
		background-color: #FFB62F; }
	a.badge-yellow:focus, a.badge-yellow.focus {
		outline: 0;
		box-shadow: 0 0 0 0.2rem #FFB62F; }


/* Particles */
.particle-canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}
/**/