#fields { margin-top: 115px; }

/*--------------------------------------------------------------------------------------------------------------*/

#fields > .content-wrapper > main > .complex-title { margin-bottom: 45px; }

/*--------------------------------------------------------------------------------------------------------------*/

#fields > .content-wrapper > main > .fields {}
#fields > .content-wrapper > main > .fields > .field {}
#fields > .content-wrapper > main > .fields > .field > .title {
	position: relative;
	padding: 30px 100px 30px 0;
	
	border-bottom: solid 1px rgba(19,96,100,.4);
	
	line-height: 50px;
	font-size: 40px;
	font-weight: 600;
	
	cursor: pointer;
}
#fields > .content-wrapper > main > .fields > .field > .title:after {
	content: "";
	position: absolute; top: 50%; right: 0;
	display: block; height: 26px; width: 26px;
	
	background-image: url("../../images/icons/collapse.svg");
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.loaded #fields > .content-wrapper > main > .fields > .field > .title:after { transition: transform .2s ease-out; }
#fields > .content-wrapper > main > .fields > .field.closed > .title:after { transform: translateY(-50%) rotate(0deg); }
#fields > .content-wrapper > main > .fields > .field.open > .title:after { transform: translateY(-50%) rotate(45deg); }
@media (min-width: 700px) {
	#fields > .content-wrapper > main > .fields > .field > .title {
		line-height: 50px;
		font-size: 40px;
	}
	#fields > .content-wrapper > main > .fields > .field > .keypoints { padding: 80px 75px; }
}
@media (max-width: 699.99px) {
	#fields > .content-wrapper > main > .fields > .field > .title {
		line-height: 30px;
		font-size: 25px;
	}
	#fields > .content-wrapper > main > .fields > .field > .keypoints { padding: 80px 0; }
}
#fields > .content-wrapper > main > .fields > .field.closed > .keypoints { display: none; }

#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint {
	font-size: 18px;
	font-weight: 700;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) {}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .points { margin-left: 25px; }
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .title,
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .points > .point {
	position: relative;
	padding-left: 20px;
	margin-bottom: 10px;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .points > .point { font-weight: 400; }
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .title:before,
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint:not(.plus) > .points > .point:before {
	content: "";
	position: absolute; top: 12px; left: 1px; transform: translateY(-50%);
	display: block; height: 7px; width: 7px;
	
	background-color: #136064;
	border-radius: 50%;
}

/*--------------------------------------------------------------------------------------------------------------*/

#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus {
	padding: 80px 75px;
	margin: 80px -75px 0;
	background-color: #136064;
	color: #FFF;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .title {
	margin-bottom: 40px;
	
	line-height: 120%;
	font-weight: 200;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .title > span { font-weight: 700; }
@media (min-width: 700px)	  { #fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .title { font-size: 42px; } }
@media (max-width:  699.99px) { #fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .title { font-size: 32px; } }
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .points {
	font-size: 18px;
	font-weight: 700;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .points > .point {
	position: relative;
	padding-left: 25px;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .points > .point:before {
	content: "";
	position: absolute; top: 12px; left: 1px; transform: translateY(-50%);
	display: block; height: 12px; width: 12px;
	
	background-image: url("../../images/icons/check.svg");
	background-size: contain;
	background-repeat: no-repeat;
}
#fields > .content-wrapper > main > .fields > .field > .keypoints > .keypoint.plus > .points > .point:not(:last-child) { margin-bottom: 10px; }