/* types: 				*/
/* - box 				*/
/* - basic-box, 		*/
/* - shadow-box, 		*/
/* - shaded-box, 		*/
/* - video-box 			*/
/* - callout-box 		*/
/* - line-top-bottom-box*/
/* - contact-card-mini 	*/
/* - light-box 			*/
/* - dark-box 			*/
/* - diagram-box 		*/
/* - counter-box 		*/
/* - topline-box 		*/
/* - floating-bar-box 	*/
/* - quiet-card		 	*/
/* - video-card 		*/
/* - insight-card 		*/
/* - insight-card		*/


/* features: 			*/
/* - border-top-xxx 	*/
/* - even-buttons		*/
/* - identifier 		*/




.basic-box,
.shadow-box,
.shaded-box,
.video-box {
	width: 100%;
	background-color: white;
}

/*	Coloring	*/

section.atmosphere .shadow-box h1, section.atmosphere .shadow-box h2, section.atmosphere .shadow-box h3, section.atmosphere .shadow-box h4 section.atmosphere .shadow-box h5, 
section .atmosphere .shadow-box h1, section .atmosphere .shadow-box h2, section .atmosphere .shadow-box h3, section .atmosphere .shadow-box h4 section .atmosphere .shadow-box h5, 
section.ocean .shadow-box h1, section.ocean .shadow-box h2, section.ocean .shadow-box h3, section.ocean .shadow-box h4 section.ocean .shadow-box h5, 
section .ocean .shadow-box h1, section .ocean .shadow-box h2, section .ocean .shadow-box h3, section .ocean .shadow-box h4 section .ocean .shadow-box h5, 
section.mountain .shadow-box h1, section.mountain .shadow-box h2, section.mountain .shadow-box h3, section.mountain .shadow-box h4 section.mountain .shadow-box h5, 
section .mountain .shadow-box h1, section .mountain .shadow-box h2, section .mountain .shadow-box h3, section .mountain .shadow-box h4 section .mountain .shadow-box h5, 
section.ocean-to-mountain .shadow-box h1, section.ocean-to-mountain .shadow-box h2, section.ocean-to-mountain .shadow-box h3, section.ocean-to-mountain .shadow-box h4 section.ocean-to-mountain .shadow-box h5, 
section.pine-to-mountain .shadow-box h1, section.pine-to-mountain .shadow-box h2, section.pine-to-mountain .shadow-box h3, section.pine-to-mountain .shadow-box h4 section.pine-to-mountain .shadow-box h5, 
section.juniper-to-pine .shadow-box h1, section.juniper-to-pine .shadow-box h2, section.juniper-to-pine .shadow-box h3, section.juniper-to-pine .shadow-box h4 section.juniper-to-pine .shadow-box h5 {
	color: var(--lake);
}

section.atmosphere .shaded-box h1, section.atmosphere .shaded-box h2, section.atmosphere .shaded-box h3, section.atmosphere .shaded-box h4 section.atmosphere .shaded-box h5, 
section .atmosphere .shaded-box h1, section .atmosphere .shaded-box h2, section .atmosphere .shaded-box h3, section .atmosphere .shaded-box h4 section .atmosphere .shaded-box h5, 
section.ocean .shaded-box h1, section.ocean .shaded-box h2, section.ocean .shaded-box h3, section.ocean .shaded-box h4 section.ocean .shaded-box h5, 
section .ocean .shaded-box h1, section .ocean .shaded-box h2, section .ocean .shaded-box h3, section .ocean .shaded-box h4 section .ocean .shaded-box h5, 
section.mountain .shaded-box h1, section.mountain .shaded-box h2, section.mountain .shaded-box h3, section.mountain .shaded-box h4 section.mountain .shaded-box h5, 
section .mountain .shaded-box h1, section .mountain .shaded-box h2, section .mountain .shaded-box h3, section .mountain .shaded-box h4 section .mountain .shaded-box h5, 
section.ocean-to-mountain .shaded-box h1, section.ocean-to-mountain .shaded-box h2, section.ocean-to-mountain .shaded-box h3, section.ocean-to-mountain .shaded-box h4 section.ocean-to-mountain .shaded-box h5, 
section.pine-to-mountain .shaded-box h1, section.pine-to-mountain .shaded-box h2, section.pine-to-mountain .shaded-box h3, section.pine-to-mountain .shaded-box h4 section.pine-to-mountain .shaded-box h5, 
section.juniper-to-pine .shaded-box h1, section.juniper-to-pine .shaded-box h2, section.juniper-to-pine .shaded-box h3, section.juniper-to-pine .shaded-box h4 section.juniper-to-pine .shaded-box h5 {
	color: black;
}

section.atmosphere .video-box h1, section.atmosphere .video-box h2, section.atmosphere .video-box h3, section.atmosphere .video-box h4 section.atmosphere .video-box h5, 
section .atmosphere .video-box h1, section .atmosphere .video-box h2, section .atmosphere .video-box h3, section .atmosphere .video-box h4 section .atmosphere .video-box h5, 
section.ocean .video-box h1, section.ocean .video-box h2, section.ocean .video-box h3, section.ocean .video-box h4 section.ocean .video-box h5, 
section .ocean .video-box h1, section .ocean .video-box h2, section .ocean .video-box h3, section .ocean .video-box h4 section .ocean .video-box h5, 
section.mountain .video-box h1, section.mountain .video-box h2, section.mountain .video-box h3, section.mountain .video-box h4 section.mountain .video-box h5, 
section .mountain .video-box h1, section .mountain .video-box h2, section .mountain .video-box h3, section .mountain .video-box h4 section .mountain .video-box h5, 
section.ocean-to-mountain .video-box h1, section.ocean-to-mountain .video-box h2, section.ocean-to-mountain .video-box h3, section.ocean-to-mountain .video-box h4 section.ocean-to-mountain .video-box h5, 
section.pine-to-mountain .video-box h1, section.pine-to-mountain .video-box h2, section.pine-to-mountain .video-box h3, section.pine-to-mountain .video-box h4 section.pine-to-mountain .video-box h5, 
section.juniper-to-pine .video-box h1, section.juniper-to-pine .video-box h2, section.juniper-to-pine .video-box h3, section.juniper-to-pine .video-box h4 section.juniper-to-pine .video-box h5 {
	color: black;
}



section.atmosphere .light-box h1, section.atmosphere .light-box h2, section.atmosphere .light-box h3, section.atmosphere .light-box h4 section.atmosphere .light-box h5, 
section .atmosphere .light-box h1, section .atmosphere .light-box h2, section .atmosphere .light-box h3, section .atmosphere .light-box h4 section .atmosphere .light-box h5, 
section.ocean .light-box h1, section.ocean .light-box h2, section.ocean .light-box h3, section.ocean .light-box h4 section.ocean .light-box h5, 
section .ocean .light-box h1, section .ocean .light-box h2, section .ocean .light-box h3, section .ocean .light-box h4 section .ocean .light-box h5, 
section.mountain .light-box h1, section.mountain .light-box h2, section.mountain .light-box h3, section.mountain .light-box h4 section.mountain .light-box h5, 
section .mountain .light-box h1, section .mountain .light-box h2, section .mountain .light-box h3, section .mountain .light-box h4 section .mountain .light-box h5, 
section.ocean-to-mountain .light-box h1, section.ocean-to-mountain .light-box h2, section.ocean-to-mountain .light-box h3, section.ocean-to-mountain .light-box h4 section.ocean-to-mountain .light-box h5, 
section.pine-to-mountain .light-box h1, section.pine-to-mountain .light-box h2, section.pine-to-mountain .light-box h3, section.pine-to-mountain .light-box h4 section.pine-to-mountain .light-box h5, 
section.juniper-to-pine .light-box h1, section.juniper-to-pine .light-box h2, section.juniper-to-pine .light-box h3, section.juniper-to-pine .light-box h4 section.juniper-to-pine .light-box h5 {
	color: var(--ocean);
}


section.atmosphere .shadow-box p, 
section .atmosphere .shadow-box li,
section.atmosphere .shaded-box p, 
section .atmosphere .shaded-box li,
section.atmosphere .video-box p, 
section .atmosphere .video-box li {
	color: black;
}


/* Layout			*/

.basic-box .box-content,
.shadow-box .box-content,
.shaded-box .box-content {
	padding: 0 20px;
}

.basic-box p,
.shaded-box p,
.video-box p,
.basic-box h1,
.shaded-box h1,
.video-box h1,
.basic-box h2,
.shaded-box h2,
.video-box h2,
.basic-box h3,
.shaded-box h3,
.video-box h3,
.basic-box h4,
.shaded-box h4,
.video-box h4 {
	margin-left: 10px;
	margin-right: 10px;
}

.basic-box.left h2 {
  letter-spacing: .5px;
}

.basic-box.left h2,
.basic-box.left h3
.basic-box.left h4 {
  text-align: left;
}

.basic-box.left .button {
  text-align: left;
  margin-left: 8px;
}


/* 		VIDEO BOX 	*/

.video-box {
	border: 1px solid var(--dove);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.video-box img {
	width: 100%;
}

.video-box h3 {
	font-size: 14pt;
	margin-right: 20px;
	margin-left: 20px;
}

.video-box a h3 {
	color: unset;
}


.video-box p {
	padding: 0 20px;
	margin: 12px 5px
}


/*		INSIGHT CARD	*/

.insight-card {
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.04);
	border: 1px solid #eaeaea;
	background-color: #fff;
	margin-bottom: 30px;
	width: 100%;
}

.insight-card h3 {
	padding: 30px 34px 0 34px
}

.insight-card .card-top-row {
	margin-bottom: 0;
	padding: 0;
	display: flex;
	flex-direction: row;
}

.insight-card .more-footer {
	background-color: #1a497c;
	text-align: right;
	padding: 20px;
}

.insight-card .side-footer {
	font-weight: bold;
	text-transform: uppercase;
  	background-color: #fff;
	padding-top: 0;
	padding-bottom: 10px;
}

.insight-card .main-card {
	margin-bottom: 0;
	padding: 0;
	display: flex;
	flex-direction: row;
}

.insight-card .img-side {
	width: 420px;
}

.insight-card .img-side img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	overflow: hidden;
	min-width: 420px;
}

.insight-card .text-side {
	padding: 0;
	background-color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.insight-card .text-side p {
	font-size: 16px;
	font-weight: 300;
	padding: 0 34px 0;
	text-align: left;
}

.insight-card .side-by-side-more {
	text-align: right;
	text-transform: uppercase;
	background-color: #fff;
	padding: 0 20px 10px;
	display: block;
}

.insight-card .top-bottom-more {
	text-transform: uppercase;
	text-align: right;
	background-color: #1a497c;
	padding: 20px;
	display: none;
}

.insight-card .top-bottom-more a {
	color: white;
}


@media only screen and (max-width: 1100px) {
	.insight-card h3,
	.insight-card .text-side p {
		padding: 0 10px 0 20px;
	}
}

@media only screen and (max-width: 985px) {
	.insight-card .main-card {
		flex-direction: column;
	}
	
	.insight-card .img-side {
		width: unset;
	}
	
	.insight-card .img-side img {
		min-width: unset;
	}

	.insight-card h3,
	.insight-card .text-side p {
		padding: 0 10px 0 20px;
	}
	
	.insight-card .top-bottom-more {
    	display: block;
  	}
	
	.insight-card .side-by-side-more {
    	display: none;
  	}
}


@media only screen and (max-width: 850px) {
  	.insight-card .text-side p {
		margin: 0 0 24px;
	}
}


/*		VERTICAL CARD				*/



.basic-box {
	margin-bottom: 50px;
	background: transparent;
}

.basic-box h2,
.basic-box h3,
.basic-box h4 {
	padding: 10px;
	margin: 0;
	color: var(--ocean);
	border-bottom: 1px solid var(--ocean);
	text-align: center;
	font-size: 17pt;
	font-weight: normal
}

.atmosphere .basic-box h2,
.atmosphere .basic-box h3,
.atmosphere .basic-box h4,
.ocean .basic-box h2,
.ocean .basic-box h3,
.ocean .basic-box h4,
.ocean-to-mountain .basic-box h2,
.ocean-to-mountain .basic-box h3,
.ocean-to-mountain .basic-box h4 {
	color: var(--sage);
	border-bottom: 1px solid var(--sage);
}


.mountain .basic-box h2,
.mountain .basic-box h3,
.mountain .basic-box h4 {
	color: white;
	border-bottom: 1px solid var(--sage);
}


.atmosphere .basic-box p,
.atmosphere .basic-box li,
.ocean .basic-box p,
.ocean .basic-box li,
.mountain .basic-box p,
.mountain .basic-box li,
.ocean-to-mountain .basic-box p,
.ocean-to-mountain .basic-box li {
	color: white;
}

.basic-box ul,
.shaded-box ul {
  padding-left: 10px;
  margin-left: 0;
}

.basic-box li,
.shaded-box li {
  padding-top: 10px;
  padding-bottom: 10px;
  list-style: none;
  color: black;
}

.basic-box li a,
.shaded-box li a {
  padding: 0;
}



/* Make banded version of the basic box */

.basic-box.banded {
	background-color: white;
}

.basic-box.banded h3 {
	color: white;
	font-family: Lato;
	font-size: 18pt;
	font-weight: bold;
	background-color: var(--atmosphere);
	border: none;
	padding: 10px 0 0;
}

.basic-box.banded.banded-1 h3 {
	background-color: var(--mountain);
}

.basic-box.banded.banded-2 h3 {
	background-color: var(--forest);
}

.basic-box.banded.banded-3 h3 {
	background-color: var(--lake);
}

.basic-box.banded.banded-4 h3 {
	background-color: var(--mountain);
}

.basic-box.banded .post-header {
	background: white;
	padding: 20px 0;
	height: 56px;
}


/* Make compact version of the basic box */

.basic-box.compact li {
	padding: 0 0 4px 0;
}

.basic-box.compact ul {
	padding: 0;
}

.basic-box.compact h1,
.basic-box.compact h2,
.basic-box.compact h3 {
	text-align: left;
	padding: 0;
}


.download-widget h3 {
	background-color: var(--ocean);
}

.shadow-box {
    box-shadow: 0 4px 6px rgb(0 0 0 / 10%), 0 5px 15px rgb(0 0 0 / 4%);
    border: 1px solid #eaeaea;
    background-color: #fff;
    margin-bottom: 20px;
    color: black;
}

.shadow-box p,
.shadow-box h1,
.shadow-box h2,
.shadow-box h3,
.shadow-box h4,
.shadow-box ul,
.shadow-box .button {
	margin-left: 20px;
	margin-right: 20px;
}

.shadow-box h2,
.shadow-box h4 {
	color: black;
}


.shadow-box h3 {
	color: var(--lake);
}

.shadow-box ul,
.shaded-box ul {
	padding-left: 18px;
}

.shadow-box li {
	padding: 5px 5px 5px 0;
	list-style: none;
}

.shadow-box.portfolio-management-box {
	min-width: 300px;
}

.shadow-box.portfolio-management-box ul {
	margin-left: 0;
}

.shaded-box {
	background-color: #fafafa;
	padding-top: 1px; /* need this or we get 0, this gives us 10 or so */
	padding-bottom: 1px; /* need this or we get 0, this gives us 10 or so */
	margin-bottom: 20px;
}

.shaded-box h2 {
	font-family: Wremena;
}

.shaded-box li {
	padding: 5px 5px 5px 0;
	list-style: none;
	font-size: 12pt;
	font-weight: normal;
}

.shaded-box .button {
	margin-left: 20px;
}

.shaded-box hr {
	height: 2px;
	background-color: #f5f5f5;
}

.even-buttons .basic-box,
.even-buttons .shadow-box,
.even-buttons .shaded-box,
.even-buttons .video-box {
	position: relative;
	padding-bottom: 72px;
}

.even-buttons .basic-box .button,
.even-buttons .shadow-box .button,
.even-buttons .shaded-box .button,
.even-buttons .video-box .button {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
}

/* End four basic boxes */




/* CALLOUT BOX (From PPT) and used in IP Insurance Solutions */

.card-set.double .card, 
.card-set.double .callout-box {
	max-width: 550px;
	margin-bottom: 30px;
	margin-right: 0;
}

.card-set.triple .card,
.card-set.triple .callout-box {
	max-width: 400px;
	margin-bottom: 30px;
	width: 30%;
	min-width: 380px;
}

.card,
.callout-box {
	box-shadow: 0 8px 19px 2px rgba(0,0,0,.08);
	border-radius: 12px;
	padding: 30px;
	background-color: white;
	color: black;
}

.callout-box p,
.callout-box h1,
.callout-box h2,
.callout-box h3,
.callout-box h4,
.callout-box h5  {
	color: black !important;
}

.card > h2,
.card > h3,
.card > h4,
.card > h5 {
	font-family: Wremena;
	text-align: left;
	font-size: 18pt;
	font-weight: 600; 
	margin-top: 0;
	color: var(--lake) !important;
}

.card-set {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	justify-content: space-evenly;
}

.card-row,
.callout-box-row {
  display: flex;
  width: 100%;
  background-color: #eff2f6;
  flex-wrap: wrap;
}

.card-row {
	justify-content: space-evenly;
}


.card .button,
.contact-card .button {
  background-color: var(--ocean) !important;
  color: white !important;
}

.card .button:hover,
.contact-card .button:hover {
  background-color: var(--sky) !important;
  outline: 3px solid var(--sky) !important;
  color: black !important;
}


.card .button.hollow {
	background-color: transparent !important;
	color: var(--sea) !important;
	border: 2px solid var(--sea);
}

/* Match new ui */
.callout-box > h2,
.callout-box > h3,
.callout-box > h4,
.callout-box-title {
	font-family: Wremena;
	text-align: left;
	font-size: 18pt;
	font-weight: 600; 
	margin-top: 0;
}


@media (max-width: 700px) {
	.card-set.triple .card, .card-set.triple .callout-box {min-width: 90%;}
}

.callout-box {
	margin-right: 10px;
}

.callout-box-row .callout-box:last-of-type {
	margin-right: 0;
}


/* Match new ui */
.callout-box .box-content {
    margin-top: 0;
    border: none;
}

.callout-box .box-content p {
  margin-left: 20px;
  margin-right: 20px;
}

.box-content ul {
  padding: 10px 30px;
  margin: 0;
}

.callout-box .box-content li {
  margin-bottom: 9px;
}

.title-color-1 {
	color: white;
  	background-color: var(--sea);
}


h2.title-color-2,
h3.title-color-2
{
  	color: white;
  	background-color: var(--pine);
}

h2.title-color-3,
h3.title-color-3
{
	color: white;
 	background-color: var(--mountain);
}


/* END CALLOUT BOX */



/* VIDEO CARD */
.video-card {
	position: relative;
	max-width: 360px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.04);
	border: 1px solid #eaeaea;
	background-color: #fff;
}

.video-card .webcast-overlay {
	top: 80px;
	left: calc(50% - 20px); /* overriding default of same */
}

.video-card h3 {
	padding: 9px 30px;
}



.video-card p {
	padding: 10px 30px;
	letter-spacing: 1.0px;
	line-height: 17pt;
}


.video-card-bottom {
	padding: 20px;
}

.video-card img {
	width: 100%;
}

.video-card.mini {
	width: 230px;
	margin-bottom: 20px;
}

.video-card.mini .webcast-overlay {
	left: calc(50% - 20px);
	top: calc(50% - 20px);
}

/* TOODO: may not be used anymoore */
.video-top img {
	width: 100%;
}



/*		BOX SET	(Plain title over sky blue box)		*/
.box-set,
.box-set-flex,
.box-set-flex-wrap {
	padding: 0 20px;
}

/* CCR New UI */
.box-set-flex,
.box-set-flex-wrap {
	display: flex;
	justify-content: space-between;
	padding: 20px;
	margin-bottom: 20px;
}

.box-set-flex-wrap {
	flex-wrap: wrap;
}

.box-set-header-two-lines h2,
.box-set-header-two-lines h3,
.box-set-header-two-lines h4 {
	height: 52px;
/* 	font-size: 14pt; */
}



/*		CAMPAIGN CONTACT right side box with person 		*/
.campaign-contact img{
  height: 100%;
  width: 100%;
  max-height: revert;
  margin-left: 0;
}

.campaign-contact p:first-of-type {
    margin-top: 12px;
}


/* RESPONSIVE  */

@media screen and (max-width:760px) {
	.basic-box,
	.shaded-box,
	.shadow-box,
	.video-box {
  		margin: 42px auto;
  		border-color: var(--cloud);
	}
	
/* 	TODO - should I really have this? */
	.shaded-box,
	.shadow-box,
	.video-box {
  		background-color: white;
	}
		
	.basic-box,
	.shaded-box,
	.shadow-box,
	.video-box {
  		width: 350px;
	}
	.LSEmpBox {
		margin-left: 10px;
	}
}

@media screen and (max-width: 500px) {
  .shadow-box {
    max-width: 350px;
    width: 100%;
  }
}



/* 		MINI CARDS 		*/

.miniCards {
    display: flex;
    flex-wrap: wrap;
    margin-left: 50px;
    justify-content: space-evenly;
}

/* .miniCardContent { */
/* 	padding: 0 5px; */
/* } */

/* .miniCardContent { */
/* 	padding: 0 5px; */
/* } */

.line-top-bottom-box {
	width: 200px;
	border: 2px solid var(--jungle);
	border-width: 4px 0;	/* only top and bottom, not sides */
	color: var(--ocean);
	font-weight: 700;
	margin: 12px 8px;
	display: flex; 			/* need this for the vertical center alignment */
	align-items: center;	/* need this foor the vertical center alignment */
	font-size: 14pt;
	padding: 24px 0;
}

.line-top-bottom-box p {
	margin: 10px;
}

.atmosphere .line-top-bottom-box,
.ocean .line-top-bottom-box,
.mountain .line-top-bottom-box,
.ocean-to-mountain .line-top-bottom-box,
.pine-to-mountain .line-top-bottom-box,
.juniper-to-pine .line-top-bottom-box {
	color: white;
}

.line-top-bottom-box.line-top-bottom-box-1 {
	border-color: var(--slate);
}

.line-top-bottom-box.line-top-bottom-box-2 {
	border-color: var(--sage);
}

.line-top-bottom-box.line-top-bottom-box-3 {
	border-color: var(--bamboo);
}

.line-top-bottom-box.line-top-bottom-box-4 {
	border-color: var(--willow);
}

.line-top-bottom-box.line-top-bottom-box-5 {
	border-color: var(--riverrock);
}

.line-top-bottom-box.line-top-bottom-box-6 {
	border-color: var(--dove);
}


@media (max-width: 920px) {
  .line-top-bottom-box {
    width: 47%;
    }
 }
@media (max-width: 768px) {
	.line-top-bottom-box {
		width: 95%; margin-bottom: 42px;
	}
 }

/* Contact cards for new theme  */
/* contact-card-mini used on IP Private Credit only so far */
.contact-card,
.contact-card-mini {
	width: 300px;
	margin: 36px 0 20px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.04);
	background-color: white;
	padding: 20px;
	border-radius: 5px;
	color: black;
}

.contact-card p,
.contact-card h1,
.contact-card h2,
.contact-card h3,
.contact-card h4,
.contact-card h5,
.contact-card-mini p,
.contact-card-mini h1,
.contact-card-mini h2,
.contact-card-mini h3,
.contact-card-mini h4,
.contact-card-mini h5 {
	color: black !important;
}

.contact-card .button {
	background-color: var(--sea) !important;
}

.contact-card .button:hover,
.contact-card-mini .button:hover {
	background-color: var(--mountain) !important;
	text-decoration: none !important;
	outline: 3px solid var(--mountain) !important;
	outline-offset: 3px !important;
}

.contact-card-mini {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 80%;
}

.contact-card-mini .contact-info {
	min-height: 76px;
}

.contact-card-mini .contact-info h3 {
	margin-top: 29px;	
}


@media screen and (max-width: 800px) {
	.contact-card-mini {
		margin: 40px auto;
		justify-content: space-evenly;
	}
}

.contact-card-mini .contact-info {
  min-height: 76px;

}

.contact-card-set {
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
.contact-info {
  min-height: 200px;
}


/* LIGHT BOX */

.light-box {
	background-color: white;
	width: 250px;
	padding: 20px;
	color: black;	
	margin: 10px;
	border: 1px solid var(--dove);
}

.light-box h1,
.light-box h2,
.light-box h3,
.light-box h4 {
	color: var(--ocean);
	font-family: Wremena;
	font-size: 16pt;
}

.light-box .button {
	margin: 20px auto;	
}




/* DARK BOX */
.dark-box {
	background-color: #082139;
	width: 250px;
	padding: 20px;
	color: white;	
	margin: 10px
}

.dark-box h1,
.dark-box h2,
.dark-box h3,
.dark-box h4 {
	color: white;
	font-family: Wremena;
	font-size: 16pt;
}

.dark-box .button {
	background-color: transparent;
	border: 1px solid white;
	margin-top: 42px;
}




/* DIAGRAM BOX */


.diagram-box {
	box-shadow: 0 8px 19px 2px rgba(0, 0, 0, .08);
	padding: 20px;
	background-color: white;
	color: black;
	width: 300px;
	border: 1px solid black;
	margin-bottom: 10px;
}


.diagram-box h3 {
	color: black;
	border-bottom: 2px solid black;
	margin: 0;
	padding: 0 0 12px 0;
}

.diagram-box h4 {
	font-size: 20pt;
	font-family: Wremena;
	text-transform: capitalize;
	margin-top: 0;
}

section.atmosphere .diagram-box h1, section.atmosphere .diagram-box h2, section.atmosphere .diagram-box h3, section.atmosphere .diagram-box h4 section.atmosphere .diagram-box h5, 
section .atmosphere .diagram-box h1, section .atmosphere .diagram-box h2, section .atmosphere .diagram-box h3, section .atmosphere .diagram-box h4 section .atmosphere .diagram-box h5, 
section.ocean .diagram-box h1, section.ocean .diagram-box h2, section.ocean .diagram-box h3, section.ocean .diagram-box h4 section.ocean .diagram-box h5, 
section .ocean .diagram-box h1, section .ocean .diagram-box h2, section .ocean .diagram-box h3, section .ocean .diagram-box h4 section .ocean .diagram-box h5, 
section.mountain .diagram-box h1, section.mountain .diagram-box h2, section.mountain .diagram-box h3, section.mountain .diagram-box h4 section.mountain .diagram-box h5, 
section .mountain .diagram-box h1, section .mountain .diagram-box h2, section .mountain .diagram-box h3, section .mountain .diagram-box h4 section .mountain .diagram-box h5, 
section.ocean-to-mountain .diagram-box h1, section.ocean-to-mountain .diagram-box h2, section.ocean-to-mountain .diagram-box h3, section.ocean-to-mountain .diagram-box h4 section.ocean-to-mountain .diagram-box h5, 
section.pine-to-mountain .diagram-box h1, section.pine-to-mountain .diagram-box h2, section.pine-to-mountain .diagram-box h3, section.pine-to-mountain .diagram-box h4 section.pine-to-mountain .diagram-box h5, 
section.juniper-to-pine .diagram-box h1, section.juniper-to-pine .diagram-box h2, section.juniper-to-pine .diagram-box h3, section.juniper-to-pine .diagram-box h4 section.juniper-to-pine .diagram-box h5 {
	color: black;
}

.diagram-box.color-1 {
	border-color: var(--sea);
}

.diagram-box.color-1 h3 {
	color: var(--sea);
	border-bottom: 2px solid var(--sea);
}

.diagram-box.color-2 {
	border-color: var(--mountain);
}

.diagram-box.color-2 h3 {
	color: var(--mountain);
	border-bottom: 2px solid var(--mountain);
}

.diagram-box.color-3 {
	border-color: var(--atmosphere);
}

.diagram-box.color-3 h3 {
	color: var(--atmosphere);
	border-bottom: 2px solid var(--atmosphere);
}

.diagram-box.color-4 {
	border-color: var(--forest);
}

.diagram-box.color-4 h3 {
	color: var(--forest);
	border-bottom: 2px solid var(--forest);
	margin: 0;
	padding: 0 0 12px 0;
}

.diagram-box.atmosphere p,
.diagram-box.ocean p,
.diagram-box.sea p,
.diagram-box.mountain p,
.diagram-box.forest p,
.diagram-box.atmosphere li,
.diagram-box.ocean li,
.diagram-box.sea li,
.diagram-box.mountain li,
.diagram-box.forest li
.diagram-box.atmosphere h3,
.diagram-box.ocean h3,
.diagram-box.sea h3,
.diagram-box.mountain h3,
.diagram-box.forest h3,
.diagram-box.atmosphere h4,
.diagram-box.ocean h4,
.diagram-box.sea h4,
.diagram-box.mountain h4,
.diagram-box.forest h4 {
	color: black;
}



/* FEATURED CARDS (CONTAINER) */

.featured-cards .card {
  padding: 10px 20px;
  width: 43%;
  margin: 10px;
  border-radius: 3px;
  position: relative;
  min-height: 64px;
  min-width: 300px;
}


.featured-cards .card h3 {
    max-width: calc(100% - 150px);
    font-size: 18pt;
    letter-spacing: 1.1px;
}

.featured-cards .card .button {
  height: 28px;
  position: absolute;
  bottom: 0;
  right: 20px;
}




/* 		COUNTER BOX 		*/


.counter-box {
	text-align: center;
}

.counter-box h3 {
	font-size: 42pt;
	color: var(--sea);
	margin: 12px 0 14px;
}

.counter-box p {
	font-size: 12pt;
}

.border-top-ocean {
	border-top: 6px solid var(--ocean);
}

.border-top-lake {
	border-top: 6px solid var(--lake);
}

.border-top-sea {
	border-top: 6px solid var(--sea);
}

.border-top-sky {
	border-top: 6px solid var(--sky);
}

.make-buttons-even {
	position: relative;
	padding-bottom: 76px;
}

.make-buttons-even .button {
	position: absolute;
	transform: translateX(25%);
	bottom: 0;
}





/* TOPLINE BOX */

/* EX: PRESS RELEASES */


.topline-box {
	width: 40%;
	background-color: #fafafa;
	color: black;
	text-align: left;
	padding: 20px;
	border-top: 4px solid var(--sky);
	margin-bottom: 20px;
	position: relative;
}

.topline-box h2,
.topline-box h3,
.topline-box h4 {
	color: black;
	text-align: left;
	font-size: 14pt;
	font-family: Lato;
	margin: 20px 0 76px 0;
}

.topline-box.mini h2,
.topline-box.mini h3,
.topline-box.mini h4 {
	text-align: left;
	font-size: 14pt;
	font-family: Lato;
	margin: 20px 0 64px 0;
}

.topline-box.mini p {
	margin-left: 0;
	margin-right: 0;
}

.topline-box.mini .button {
	padding: 0 10px;
}

.topline-box .button {
  position: absolute;
  bottom: 0;
}

section.atmosphere .topline-box h1, section.atmosphere .topline-box h2, section.atmosphere .topline-box h3, section.atmosphere .topline-box h4 section.atmosphere .topline-box h5, 
section .atmosphere .topline-box h1, section .atmosphere .topline-box h2, section .atmosphere .topline-box h3, section .atmosphere .topline-box h4 section .atmosphere .topline-box h5, 
section.ocean .topline-box h1, section.ocean .topline-box h2, section.ocean .topline-box h3, section.ocean .topline-box h4 section.ocean .topline-box h5, 
section .ocean .topline-box h1, section .ocean .topline-box h2, section .ocean .topline-box h3, section .ocean .topline-box h4 section .ocean .topline-box h5, 
section.mountain .topline-box h1, section.mountain .topline-box h2, section.mountain .topline-box h3, section.mountain .topline-box h4 section.mountain .topline-box h5, 
section .mountain .topline-box h1, section .mountain .topline-box h2, section .mountain .topline-box h3, section .mountain .topline-box h4 section .mountain .topline-box h5, 
section.ocean-to-mountain .topline-box h1, section.ocean-to-mountain .topline-box h2, section.ocean-to-mountain .topline-box h3, section.ocean-to-mountain .topline-box h4 section.ocean-to-mountain .topline-box h5, 
section.pine-to-mountain .topline-box h1, section.pine-to-mountain .topline-box h2, section.pine-to-mountain .topline-box h3, section.pine-to-mountain .topline-box h4 section.pine-to-mountain .topline-box h5, 
section.juniper-to-pine .topline-box h1, section.juniper-to-pine .topline-box h2, section.juniper-to-pine .topline-box h3, section.juniper-to-pine .topline-box h4 section.juniper-to-pine .topline-box h5 {
	color: black;
}


/* 		QUIET CARD 		*/
/* 		ex: ESG 9.0 	*/


.quiet-card {
	margin-top: 20px;
	font-size: 14pt;
	box-shadow: none;
	padding: 30px;
	padding-left: 0;
}

.quiet-card h2,
.quiet-card h3,
.quiet-card h4 {
	font-size: 22pt;
	font-family: Wremena;
	text-align: left;
	font-weight: 600; 
	margin-top: 0;
	color: var(--lake);
}







/* Used for any type of box, this is where the "strategy" or "viewpoint" is noted */
.identifier {
	font-size: 12pt;
	text-transform: uppercase;
	font-weight: bold;
	font-family: Lato;
	letter-spacing: 1.2px;
	display: block;
	margin-bottom: 12px;
	color: var(--lake);
}

@media (max-width: 925px) {
	.featured-cards .card {
		width: 90%;
		position: unset;
		text-align: center;
	}
	.featured-cards .card h3 {
		width: 100%;
		max-width: 100%;
		text-align: center;
	}
	.featured-cards .card .button {
		position: unset;
		margin: 42px auto 16px;
		max-width: 300px;
		width: 80%;
	}
	
}


/* TODO: MOVE TO ESERVICE */
#eservice-login .card {
	margin-bottom: 20px;
	padding: 12px 20px;
}

#body_background.eservice-home {
	padding-top: 0;
	background-color: #f4f6f9;
}

.eservice-home h1 {
	max-width: 1280px;
	margin: auto;
	text-align: center;
	font-size: 26pt;
	margin-top: 20px;
}

.container.login-container {
	max-width: 100%;
}