:root {
	--mach-about-title-size: 50px;
	--mach-about-text-size: 16px;
	--mach-about-text-line-height: 2;
}

.mach-padding-top {
	font-size: var(--mach-about-title-size);
	padding:80px 0;
	background: #000;
}

@media screen and (max-width:1440px) {
  .mach-padding-top {
    padding: 50px 0;
  }
}

@media screen and (max-width:991px) {
  .mach-padding-top {
    padding: 30px 0;
  }
}


.mach-about__conpic, .mach-about__right {
	width: 100%;
	height: 100%;
}

.mach-about__conpic img {
	width: 100%;
	height: 9em;
	object-fit: cover;
}
 
.mach-about__right h2 {
	font-family: var(--title-font-family);
	font-size: clamp(16px, 1.3vw, 24px);
	color: #f8f8f8;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 0.4em;
}
.mach-about__right h3 {
	font-family: var(--title-font-family);
	font-size: clamp(24px, 1.9vw, 36px);
	color: #fff;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	margin-bottom: 0.4em;
	line-height: 1.5;
}
.mach-about__right .rich-text {
	font-family: var(--font-family);
	font-size: clamp(14px, 1.3vw, 24px);
	color: #333;
	font-style: normal;
	font-weight: 400;
	margin-bottom: 0.8em;
}
.mach-about__right .rich-text p{
	line-height:1.6;
	color: #f8f8f8;
}
.mach-about__right .main-href a {
	display: block;
	font-family: var(--font-family);
	font-size: var(--mach-about-text-size);
	font-weight: 800;
	line-height: normal;
	text-align: center;
	padding: 16px 40px;
	align-items: flex-start;
	background-color: var(--color-primary);
	color: #fff;
	cursor: pointer;
	border-radius: var(--button-radius);
	margin-top: 1.75em;
}

.mach-about__right .main-href a:hover {
	background: linear-gradient(0deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 100%), var(--color-primary);
}

@media (min-width: 992px) {
	.mach-about__conpic {
		padding-right: 1.2em;
	}
}

@media (max-width: 992px) {
	.mach-about__right {
		padding-top: 0.5em;
	}
}


@media screen and (max-width: 1500px) {
	:root {
	  --mach-about-title-size: 44px;
	  --mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 1280px) {
	:root {
		--mach-about-title-size: 38px;
		--mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 1200px) {
	:root {
		--mach-about-title-size: 38px;
		--mach-about-text-size: 16px;
	}
  }
  
  @media screen and (max-width: 992px) {
	:root {
		--mach-about-title-size: 32px;
		--mach-about-text-size: 14px;
	}
  }
  
  @media screen and (max-width: 768px) {
	:root {
		--mach-about-title-size: 26px;
		--mach-about-text-size: 14px;
	}
  }
  
  @media screen and (max-width: 576px) {
	:root {
		--mach-about-title-size: 20px;
		--mach-about-text-size: 14px;
	}
  }