.OffsetCircleSection{
		width:100%;
		height: 560px;
		background-color:#bbb;
		
		background-image: url(/images/offset-circles/offset-circle-bg2.webp);
		background-size: cover;
		background-position: top;
		
		position:relative;
		overflow-x:clip;
		overflow-y:visible;
		display:flex;
		align-items: center;
	}
	
	.OffsetCircleSectionTextBox{
		width:100%;
		max-width:560px;		
		box-sizing:border-box;
		margin:0 auto;
		
		color:#fff;	
		font-size:20px;
		text-align:center;
		font-family: "Questrial", sans-serif;
		line-height:35px;
		z-index:2;
	}
	
	.OffsetCircleSectionTextHeader{
		font-family: 'Montserrat', sans-serif;
		font-size:80px;
		letter-spacing: 10px;
		line-height:96px;
		padding-bottom:20px;
	}
	
		
	.circle-btn-home {
		background-color: transparent;
		color: #fff;
		border: 2px solid #fff;
		border-radius:40px;
		
		display: inline-flex;
		align-items: center;
		font-weight: 500;
		cursor: pointer;
		text-decoration: none;
		transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease;
		white-space: nowrap;
		text-align:center;
		
		font-size:20px;
		padding:5px 30px;
		margin:20px;
	}
	
	.circle-btn-home:link {
		color:#fff;
	}
	.circle-btn-home:visited {
		color:#fff;
	}
	.circle-btn-home:active {
		color:#fff;
	}
	.circle-btn-home:hover {
		color:#fff;
		background-color: var(--client-main-color);
	}
	
	
	.OffsetCircleSectionCircle{
		--circle-size: 633px;
		
		width:var(--circle-size);
		height:var(--circle-size);
		border-radius:var(--circle-size);
		position:absolute;
		border: 3px solid #fff;
		z-index:1;
		overflow:hidden;
	}
	
	.OffsetCircleSectionCircleLeft{
		background-color:red;
		bottom: calc(var(--circle-size) / 5 * -1);
		left: calc(var(--circle-size) / 3.3333 * -1);
		
		background-image: url(/images/offset-circles/left-circle-woman.webp);
		background-size: cover;
		background-position: top;		
	}
	
	.OffsetCircleSectionCircleRight{
		background-color:blue;
		top: calc(var(--circle-size) / 5 * -1);
		right: calc(var(--circle-size) / 3.3333 * -1);
		
		background-image: url(/images/offset-circles/right-circle-man.webp);
		background-size: cover;
		background-position: top;		
	}
	
	@media only screen and (min-width: 1800px) {
		.OffsetCircleSectionCircle{--circle-size: 800px;}		
		.OffsetCircleSection{height:960px;}		
	}
	
	@media only screen and (min-width: 1251px) and (max-width: 1450px) {
		.OffsetCircleSectionCircle{--circle-size: 500px;}	
	}
	
	@media only screen and (min-width: 1001px) and  (max-width: 1250px) {
		.OffsetCircleSectionCircle{--circle-size: 350px;}	
	}
	
	@media only screen and (min-width: 771px) and  (max-width: 1000px) {
		.OffsetCircleSectionCircle{--circle-size: 250px;}	
	}
	
	@media only screen and (max-width: 770px) {
		.OffsetCircleSectionTextHeader{font-size:40px;line-height:50px;}
		.OffsetCircleSectionTextBox{font-size:16px;}
		.OffsetCircleSectionCircle{--circle-size: 170px;}	
	}