:root {
	/* Näitä kahta arvoa voi muuttaa tarvittaessa */
	--content-width: 1000px; /* Sisällön leveys pikseleinä työpöydällä */
	--img-width: 45; /* Kuvan leveys prosentteina suhteessa sisällön leveyteen */
	
	/* Älä muuta näitä kaavoja  */
	--content-width-half: calc(var(--content-width) / 2);
	--imd-r: calc(var(--content-width) * var(--img-width) / 2 / 100);
	--img-b: 20px;
	--img-total-r: calc(var(--imd-r) + var(--img-b));
	--img-total-d: calc(var(--img-total-r) * 2);
	--imd-d: calc(var(--imd-r) * 2);
	--imd-size: calc(var(--imd-d));
	
	--m-content-width: 100%; /* Sisällön leveys pikseleinä mobiilissa */
	--m-img-width: 90; /* Kuvan leveys prosentteina suhteessa sisällön leveyteen */
	
	--m-imd-r: calc(var(--m-content-width) * var(--m-img-width) / 2 / 100);
	--m-img-b: 20px;
	--m-img-total-r: calc(var(--m-imd-r) + var(--m-img-b));
	--m-img-total-d: calc(var(--m-img-total-r) * 2);
	--m-imd-d: calc(var(--m-imd-r) * 2);
	--m-imd-size: calc(var(--m-imd-d));
	
	/* Työpaikka-sivun iso kuva. */
	--image-radius-xl: 300px;
	--image-border-xl: 80px;
	--total-radius-xl: 380px;
	--total-diameter-xl: 600px;
}

.content-width {
	width: calc(var(--content-width));
	margin: auto;
}

.item-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4rem;
    padding: 5% 10%;
    background-color: #F8F8F8;
}

.item {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #F8F8F8;
}

.item-image {
    aspect-ratio: 1 / 1;
    width: 100%;
    position: relative;
}

.item-circle {
    clip-path: circle(50%);
    position: absolute;
    background-color: #F8F8F8;
}

.item-image img {
    height: 100%;
    width: 100%;
    aspect-ratio: 1;
}

.item-top {
    width: 100%;
    aspect-ratio: 2 / 1;
}

.item-bottom {
    width: 100%;
    aspect-ratio: 2 / 1;
    background-color: #FFFFFF !important;
}

.item-paragraph {
    background-color: #FFFFFF !important;
}

.mobile-image-wrapper {
	position: relative;
	width: 100%;
	height: auto;
	padding-top: calc(5%);
	padding-bottom: calc(15%);
}

.mobile-image-left {
	position: relative;
	width: 90%;
	margin-right: 10%;
}

.mobile-image-right {
	position: absolute;
	width: 90%;
	margin-left: 10%;
	margin-top: 10%;
}

.fs-03 {
	font-size: 0.3rem;
}

.fs-04 {
	font-size: 0.4rem;
}

.fs-06 {
	font-size: 0.6rem;
}

.fs-07 {
	font-size: 0.7rem;
}

.fs-08 {
	font-size: 0.8rem;
}

.fs-10 {
	font-size: 1.0rem;
}

.fs-11 {
	font-size: 1.1rem;
}

.fs-12 {
	font-size: 1.2rem;
}

.fs-13 {
	font-size: 1.3rem;
}

.fs-14 {
	font-size: 1.4rem;
}

.fs-15 {
	font-size: 1.5rem;
}

.fs-17 {
	font-size: 1.7rem;
}

.fs-18 {
	font-size: 1.8rem;
}

.fs-19 {
	font-size: 1.9rem;
}

.fs-20 {
	font-size: 2.0rem;
}

.fs-22 {
	font-size: 2.2rem;
}

.fs-25 {
	font-size: 2.5rem;
}

.fs-26 {
	font-size: 2.6rem;
}

.fs-27 {
	font-size: 2.7rem;
}

.fs-28 {
	font-size: 2.8rem;
}

.fs-30 {
	font-size: 3.0rem;
}

.fs-35 {
	font-size: 3.5rem;
}

.fs-40 {
	font-size: 4.0rem;
}

.fs-60 {
	font-size: 6.0rem;
}

.fs-65 {
	font-size: 6.5rem;
}

.fs-80 {
	font-size: 8.0rem;
}

.fs-100 {
	font-size: 10.0rem;
}

.fw-bold-max {
	font-weight: 1000;
}

.narrow {
	letter-spacing: 2px;
}

.media-link {}

.media-link:hover {
	cursor: pointer;
	transform: scale(1.1);
	background-color: #007CB0;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}

.media-link-blue {
	background-color: #FFFFFF;
}

.media-link-blue:hover {
	cursor: pointer;
	background-color: #007CB0;
	color: white;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}

.text-link {}

.text-link:hover {
	cursor: pointer;
}

.text-link-blue {}

.text-link-blue:hover {
	cursor: pointer;
	transform: scale(1.1);
	color: #007CB0;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}

.text-link-green {}

.text-link-green:hover {
	cursor: pointer;
	color: #C9E265;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}

.icon-circle {
	height: 50px;
	width: 50px;
	margin: auto;
	background-color: #FFFFFF;
	color: #C9E265;
	border-radius: 50%;
	display: inline-block;
}

.icon-circle:hover {
	cursor: pointer;
	background-color: #007CB0;
	color: #FFFFFF;
	border-radius: 50%;
	display: inline-block;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}

.icon-circle-transparent {
	height: 50px;
	width: 50px;
	margin: auto;
}

.media-icon {
	height: 40px;
	margin-bottom: 5px;
}

.icon-circle-white {
	height: 45px;
	width: 45px;
	background-color: #FFFFFF;
	border-radius: 50%;
	display: inline-block;
}

.icon-circle-big {
	height: 80px;
	width: 80px;
	background-color: #C9E265;
	border-radius: 50%;
	display: inline-block;
}

.icon-circle-small {
	height: 20px;
	width: 20px;
	background-color: #000000;
	border-radius: 50%;
	display: inline-block;
}

.icon-circle-mobile {
	height: 30px;
	width: 30px;
	background-color: #C9E265;
	border-radius: 50%;
	display: inline-block;
}

.link-june-bud:hover {
	color: #C9E265 !important;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}

.fillparent {
	width: 100%;
	height: 100%;
}

.trapezoid-left {
	width: calc(50% + 20px);
	height: 500px;
	clip-path: polygon(0 0, 100% 0, calc(100% - 50px) 100%, 0 100%);
	background-color: #007CB0 !important;
	margin-right: -20px;
}

.image-left {
	opacity: 0%;
	transition: opacity 0.5s;
	background-image: url('./../image/page/front_page_left_wide.webp');
	background-size: inherit;
	background-position: right;
	background-repeat: no-repeat;
}

.image-left:hover {
	opacity: 100%;
}

.trapezoid-right {
	width: calc(50% + 20px);
	height: 500px;
	clip-path: polygon(50px 0, 100% 0, 100% 100%, 0 100%);
	background-color: #C9E265 !important;
	margin-left: -20px;
}

.image-right {
	opacity: 0%;
	transition: opacity 0.5s;
	background-image: url('./../image/page/front_page_right_wide.webp');
	background-size: inherit;
	background-position: left;
	background-repeat: no-repeat;
}

.image-right:hover {
	opacity: 100%;
}

.trapezoid-left-mobile {
	width: 2000px;
	height: 200px;
	background-size: contain;
	clip-path: polygon(0 0, 100% 0, calc(100% - 50px) 100%, 0 100%);
	background-color: #007CB0 !important;
	margin-right: -20px;
	background-image: url('./../image/page/front_page_left_wide_mobile.webp');
	background-size: cover;
	background-position: right;
}

.trapezoid-right-mobile {
	width: 2000px;
	height: 200px;
	background-size: contain;
	clip-path: polygon(50px 0, 100% 0, 100% 100%, 0 100%);
	background-color: #C9E265 !important;
	margin-left: -20px;
	background-position: left;
}

.img-text-wrapper {
	position: relative;
	text-align: center;
	color: #FFFFFF !important;
	z-index: 1000;
}

.img-top-left {
	position: absolute;
	top: 430px;
	left: 50px;
	font-weight: bold;
	font-size: 2.0rem;
}

.img-top-right {
	position: absolute;
	top: 30px;
	right: 50px;
	font-weight: bold;
	font-size: 2.0rem;
}
.img-top-left-mobile {
	position: absolute;
	top: 170px;
	left: 10px;
	font-weight: bold;
	font-size: 1.2rem; 
}

.img-top-right-mobile {
	position: absolute;
	top: 0px;
	right: 10px;
	font-weight: bold;
	font-size: 1.2rem;
}

.pointer {
	cursor: pointer;
}

.nav-link:hover {
	scale: 1.1;
    color: #007CB0 !important;
}

.nav-text-selected {
	scale: 1.2;
    color: #007CB0 !important;
}

.no-select-text {
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.polygon-6 {
	position: relative;
	height: 300px;
	width: 230px;
	background-color: #C9E265;
	float: right;
}

.polygon-6-image-wrapper {
	position: relative;
	height: 550px;
	width: 270px;
	margin-bottom: -650px;
}

.image-right-margin {
	margin-right: 50px;
	position: relative;
}

.button-1-left {
	width: 99%;
	margin-right: 1%;
}

.button-1-right {
	width: 99%;
	margin-left: 1%;
}

.button-1-left-mobile {
	width: 49%;
	margin-right: 1%;
}

.button-1-right-mobile {
	width: 49%;
	margin-left: 1%;
}

.btn-primary {
    background-color: #007CB0 !important;
    color: #FFFFFF !important;
    border-color: #007CB0 !important;
}

.btn-primary-mobile {
    background-color: #007CB0 !important;
    color: #FFFFFF !important;
    border-color: #007CB0 !important;
}

.btn-primary:hover {
	background-color: #C9E265 !important;
	border-color: #C9E265 !important;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}

.btn-danger:hover {
	background-color: #C9E265 !important;
	border-color: #C9E265 !important;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}

.info-textarea {	
	resize: none;
}

.job-card {
	border-color: #F8F8F8 !important;
}

.job-card:hover {
    border-color: #007CB0 !important;
	transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
}

.w-48 {
	width: 48%;
	padding-left: 1%;
	padding-right: 1%;
}

.w-46 {
	width: 46%;
	padding-left: 2%;
	padding-right: 2%;
}

.media-icon-circle {
	height: 50px;
	width: 50px;
	margin: auto;
	background-color: #C9E265;
	border-radius: 50%;
	display: inline-block;
}

.media-icon-circle:hover {
	cursor: pointer;
	background-color: #007CB0;
	border-radius: 50%;
	display: inline-block;
	transition: all 0.1s ease;
	-webkit-transition: all 0.1s ease;
	-moz-transition: all 0.1s ease;
	-o-transition: all 0.1s ease;
	-ms-transition: all 0.1s ease;
}


/*Uudet luokat*/

.image-diameter {
	height: calc(var(--imd-d));
}

.image-diameter-margin {
	height: calc(var(--imd-d) + 100px);
}

.border-vista-white {
	border: 20px #F8F8F8 solid;
	border-radius: 50%;
}

.page-bottom-space {
	padding: 100px;
}

.page-bottom-space-mobile {
	padding: 50px;
}

.circle-image-right {
	float: right;
	shape-outside: circle(50%);
	shape-margin: 100px;
	width: calc(var(--img-total-d));
}

.circle-image-left {
	float: left;
	shape-outside: circle(50%);
	shape-margin: 100px;
	width: calc(var(--img-total-d));
}

.circle-image-left-list {
	float: left;
	shape-outside: circle(50%);
	shape-margin: 100px;
	width: calc(var(--img-total-d));
}

@media only screen and (min-width: 1000px) {
	.clip-path-left-img {
		background-color: #FFFFFF;
		clip-path: polygon(var(--img-total-r) 0%, 100% 0, 100% 100%, var(--img-total-r) 100%);
		border-radius: 5px;
		min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
		height: auto;
	}
}

@media only screen and (max-width: 1000px) {
	.clip-path-left-img {
		background-color: #FFFFFF;
		clip-path: polygon(var(--img-total-r) 0%, 100% 0, 100% 100%, 0% 100%, 0% var(--img-total-r), var(--img-total-r) var(--img-total-r));
		border-radius: 5px;
		min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
		height: auto;
	}
}

@media only screen and (min-width: 1000px) {
	.clip-path-right-img {
		background-color: #FFFFFF;
		clip-path: polygon(0% 0%, calc(100% - var(--img-total-r)) 0, calc(100% - var(--img-total-r)) 100%, 0% 100%);
		border-radius: 5px;
		min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
		height: auto;
		width: 100%;
	}
}

@media only screen and (max-width: 1000px) {
	.clip-path-right-img {
		background-color: #FFFFFF;
		clip-path: polygon(0% 0%, calc(100% - var(--img-total-r)) 0, calc(100% - var(--img-total-r)) calc(var(--img-total-r)), 100% calc(var(--img-total-r)), 100% 100%, 0% 100%);
		border-radius: 5px;
		min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
		height: auto;
	}
}

.clip-path-right-img-heigh {
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--img-total-r)) 0, calc(100% - var(--img-total-r)) calc(var(--img-total-r)), 100% calc(var(--img-total-r)), 100% 100%, 0% 100%);
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}

.clip-path-left-img-high {
	background-color: #FFFFFF;
	clip-path: polygon(var(--img-total-r) 0%, 100% 0, 100% 100%, 0% 100%, 0% var(--img-total-r), var(--img-total-r) var(--img-total-r));
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}

.justify-text {
	text-align: justify;
	text-justify: inter-word;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

.float-center {
	margin: 0 auto;
}

.polygon-9 {
	position: relative;
	height: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--image-radius-xl)) 0%, calc(100% - var(--image-radius-xl)) 100%, 0% 100%);
	border-radius: 5px;
	z-index: 99;
	overflow: hidden;
}

.polygon-9-image-wrapper {
	position: relative;
	height: calc(var(--total-diameter-xl) + 90px);
	width: auto;
	bottom: calc(var(--total-diameter-xl));
	left: calc(43% + var(--content-width-half) - var(--total-diameter-xl) + var(--image-border-xl));
	border-radius: 100%;
	border: 100px solid #F8F8F8;
	margin-bottom: -700px;
	margin-left: -var(--total-diameter-xl);
	z-index: 100;
}

.polygon-9-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: auto;
}




/* Mobiili sivu */
.mobile-image-top {
	top: 50%;
	z-index: 100;
	overflow: hidden;
}

.mobile-image-margin {
	margin-top: 50%;
	height: auto;
}

.mobile-polygon-padding {
	padding-bottom: 1100px;
}




.m-border-vista-white {
	border: 50px #F8F8F8 solid;
	border-radius: 50%;
}

.m-image-diameter {
	height: calc(var(--m-imd-d));
}

.circle-image-top {
	shape-outside: circle(50%);
	width: 100%;
}

.clip-path-top {
	clip-path: polygon(0% calc(var(--m-img-total-r)), 100% calc(var(--m-img-total-r)), 100% 100%, 0% 100%;
	
	/*clip-path: polygon(0% 0%, 100% 0%, 100% calc(var(--m-img-total-r)), 0% calc(var(--m-img-total-r));*/
	
	border-radius: 5px;
	height: auto;
	background-color: #F8F8F8;
}

















.polygon-mobile-image-wrapper {
	position: relative;
	height: auto;
	width: 86%;
	margin-left: 7%;
	margin-right: 7%;
	border-radius: 100%;
	border: 20px solid #F8F8F8;
}







/* POISTA */

/*
.polygon-10 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(var(--image-radius-md) 0%, 100% 0, 100% 100%, var(--image-radius-md) 100%);
	border-radius: 5px;
}

.polygon-10-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 350px;
	left: calc(50% - var(--content-width-half) - var(--image-border-md));
	border-radius: 100%;
	border: 80px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter-md);
}

.polygon-10-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 250px;
}

.circle {
	float: left;
	shape-outside: circle(50% at top right);
	height: calc(var(--img-total-d));
	width: calc(var(--img-total-d));
	position: relative;
}

.polygon-right-image-wrapper {
	border-radius: 100%;
	border: var(--img-b) solid #F8F8F8;
}

.polygon-right-text-wrapper {
	width: calc(100% - var(--img-total-d));
}

.polygon-right {
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--img-total-r)) 0, calc(100% - var(--img-total-r)) calc(0% + var(--img-total-r)), 100% calc(0% + var(--img-total-r)), 100% 100%, 0% 100%);
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}

.polygon-right-low {
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--img-total-r)) 0, calc(100% - var(--img-total-r)) 100%, 0% 100%);
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}

.polygon-left {
	background-color: #FFFFFF;
	clip-path: polygon(var(--img-total-r) 0%, 100% 0, 100% 100%, 0% 100%, 0% var(--img-total-r), var(--img-total-r) var(--img-total-r));
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}

.polygon-left-low {
	background-color: #FFFFFF;
	clip-path: polygon(var(--img-total-r) 0%, 100% 0, 100% 100%, var(--img-total-r) 100%);
	border-radius: 5px;
	min-height: calc(var(--img-total-d) - var(--img-b) - var(--img-b));
	height: auto;
}


.text-area-width {
	width: calc(var(--content-width-half) + var(--image-radius));
}

.text-area-width-xl {
	width: calc(var(--content-width-half) + var(--image-radius-xl));
}

.polygon-1 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--image-radius)) 0, calc(100% - var(--image-radius)) calc(0% + var(--image-radius)), 100% calc(0% + var(--image-radius)), 100% 100%, 0% 100%);
	border-radius: 5px;
}

.polygon-1-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 505px;
	left: calc(50% + var(--content-width-half) - var(--image-diameter) + var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--image-diameter);
}

.polygon-1-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 490px;
}

.polygon-2 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(var(--image-radius) 0%, 100% 0, 100% 100%, var(--image-radius) 100%);
	border-radius: 5px;
}

.polygon-2-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 325px;
	left: calc(50% - var(--content-width-half) - var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-2-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 310px;
}

.polygon-3 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(0% 0%, calc(100% - var(--image-radius)) 0%, calc(100% - var(--image-radius)) 100%, 0% 100%);
	border-radius: 5px;
}

.polygon-3-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 325px;
	left: calc(50% + var(--content-width-half) - var(--total-diameter) + var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-3-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 310px;
}

.polygon-4-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	left: calc(50% + var(--content-width-half) - var(--total-diameter) + var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-4-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 470px;
}

.polygon-5 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(var(--image-radius) 0%, 100% 0%, 100% 100%, 0% 100%, 0% var(--image-radius), var(--image-radius) 0%);
	border-radius: 5px;
}

.polygon-5-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 660px;
	left: calc(50% - var(--content-width-half) - var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-5-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 640px;
}

.polygon-7 {
	position: relative;
	height: auto;
	overflow: auto;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
	clip-path: polygon(var(--image-radius) 0%, 100% 0%, 100% 100%, 0% 100%, 0% var(--image-radius), var(--image-radius) 0%);
	border-radius: 5px;
}

.polygon-7-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 540px;
	left: calc(50% - var(--content-width-half) - var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-7-text-wrapper {
	position: relative;
	color: #007CB0;
	z-index: 1000;
	height: 520px;
}

.polygon-8-image-wrapper {
	position: relative;
	height: auto;
	width: auto;
	bottom: 490px;
	left: calc(50% + var(--content-width-half) - var(--total-diameter) + var(--image-border));
	border-radius: 100%;
	border: 20px solid #F8F8F8;
	margin-bottom: -300px;
	margin-left: -var(--total-diameter);
}

.polygon-mobile-image-wrapper {
	position: relative;
	height: auto;
	width: 86%;
	margin-left: 7%;
	margin-right: 7%;
	border-radius: 100%;
	border: 20px solid #F8F8F8;
}
*/