/* Button - Fill Style
--------------------------------------------- */

.wp-block-button .wp-element-button {
	background-color: var(--wp--preset--color--primary);
	outline-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	border: 0;
	transition: var(--odm--preset--transition);
}
.wp-block-button .wp-block-button__link:hover {
	box-shadow: none;
	/* transform: translateY(-3px); */
}
.wp-block-button.is-style-fill .wp-block-button__link:hover,
.wp-block-button.is-style-fill .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--secondary);
	outline-color: var(--wp--preset--color--secondary);
}

/* Button - Outline Style
--------------------------------------------- */

.wp-block-button.is-style-outline .wp-block-button__link {
	background-color: transparent;
	outline-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--primary);
	outline-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

/* Button Primary Skew
--------------------------------------------- */
.wp-block-button[class*="is-style-skew-button"],
.wp-block[class*="is-style-skew-button"] {
	padding-right: 20px;
	padding-left: 20px;
}

.wp-block-button[class*="is-style-skew-button"] .wp-element-button,
.wp-block[class*="is-style-skew-button"] .wp-element-button {
	background: var(--wp--preset--color--primary);
	outline-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
	padding-right: 15px;
	padding-left: 15px;
	position: relative;
}
.wp-block-button.is-style-skew-button-white .wp-element-button,
.wp-block.is-style-skew-button-white .wp-element-button {
	background: var(--wp--preset--color--white);
	outline-color: var(--wp--preset--color--white);
	color: var(--wp--preset--color--secondary);

}
.wp-block-button[class*="is-style-skew-button"] .wp-element-button span,
.wp-block[class*="is-style-skew-button"] .wp-element-button span {
	position: relative;
	z-index: 2;
}
.wp-block-button[class*="is-style-skew-button"] .wp-element-button::before,
.wp-block[class*="is-style-skew-button"] .wp-element-button::before {
	content: '';
	position: absolute;
	top: 0;
	left: -10px;
	width: calc(100% + 20px);
	height: 100%;
	background-color: var(--wp--preset--color--primary);
	transform: var(--odm--preset--transform--skew);
	transition: var(--odm--preset--transition);
	z-index: 1;
}
.wp-block-button.is-style-skew-button-white .wp-element-button::before,
.wp-block.is-style-skew-button-white .wp-element-button::before {
	background-color: var(--wp--preset--color--white);
}
.wp-block-button[class*="is-style-skew-button"]:hover .wp-element-button,
.wp-block-button[class*="is-style-skew-button"]:hover .wp-element-button {
	background: var(--wp--preset--color--secondary);
	outline-color: var(--wp--preset--color--secondary);
}
.wp-block-button[class*="is-style-skew-button"]:hover .wp-element-button::before,
.wp-block[class*="is-style-skew-button"]:hover .wp-element-button::before {
	background-color: var(--wp--preset--color--secondary);
}
.wp-block-button.is-style-skew-button-white:hover .wp-element-button,
.wp-block-button.is-style-skew-button-white:hover .wp-element-button {
	background: var(--wp--preset--color--primary);
	outline-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}
.wp-block-button.is-style-skew-button-white:hover .wp-element-button::before,
.wp-block.is-style-skew-button-white:hover .wp-element-button::before {
	background-color: var(--wp--preset--color--primary);
}

.block-editor-page #editor .wp-block[class*="is-style-skew-button"] {
	padding: 10px;
}
.block-editor-page #editor .wp-block[class*="is-style-skew-button"] .wp-element-button {
	transform: var(--odm--preset--transform--skew);
	padding: 24px;
}
.block-editor-page #editor .wp-block[class*="is-style-skew-button"] .wp-element-button::before {
	content: none;
}

@media (max-width: 781px) {
	.wp-block-button[class*="is-style-skew-button"] {
		padding-right: 12px;
		padding-left: 12px;
	}
	.wp-block-button[class*="is-style-skew-button"] .wp-element-button {
		padding: 16px 10px;
	}
	.wp-block-button[class*="is-style-skew-button"] .wp-element-button::before {
		left: -6px;
		width: calc(100% + 12px);
	}
}



/* Button Arrow Style
--------------------------------------------- */
.wp-block-buttons.is-style-arrow-button {
	width: calc((100vw / 2) + (var(--wp--style--global--content-size) / 2 - 5%)) !important;
	height: 80px !important;
	border: none !important;
	background-image: url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' viewBox='0 0 1239 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 50 50.012 50 .03-.03h1188.958v-99.94h-1188.958l-.03-.03z' fill='%23942f2b' fill-rule='nonzero' transform='matrix(-1 0 0 -1 1239 100)'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
	/* margin-top: 50px !important; */
	margin-left: calc(-100% / 2 + 100% / 2 - var(--wp--preset--spacing--medium)) !important;
	margin-right: auto !important;
	max-width: 95% !important;
	position: relative;
	z-index: 2;
	transform: translateY(-50%);
	transition: var(--odm--preset--transition);
}
.wp-block-buttons.is-style-arrow-button:hover {
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg clip-rule='evenodd' fill-rule='evenodd' stroke-linejoin='round' stroke-miterlimit='2' viewBox='0 0 1239 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m0 50 50.012 50 .03-.03h1188.958v-99.94h-1188.958l-.03-.03z' fill='%231f4052' fill-rule='nonzero' transform='matrix(-1 0 0 -1 1239 100)'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right center;
	background-size: cover;
}
.wp-block-buttons.is-style-arrow-button .wp-block-button,
.wp-block-buttons.is-style-arrow-button .wp-block-button .wp-element-button {
	width: 100%;
	height: 100%;
	background: transparent;
	outline: none;
	box-shadow: none;
	font-family: var(--wp--preset--font-family--jura);
	font-weight: 500;
	text-align: right;
	padding-right: var(--wp--preset--spacing--large);
	font-size: clamp(1.25rem, 2.5vw + 0.5rem, 2rem);
}
@media (min-width:782px){
	.wp-block-buttons.is-style-arrow-button {
		height: 100px !important;
		max-width: 85% !important;
	}
}

/* Certification Download Style */
.wp-block-button.is-style-certification-download-button .wp-element-button {
	font-family: var(--wp--preset--font-family--jura);
	background-color: var(--wp--preset--color--light-grey);
	outline: var(--wp--preset--color--light-grey);
	color: var(--wp--preset--color--dark-grey);
	padding: 24px;
	font-size: 20px;
	font-style: normal;
	font-weight: 500;
	line-height: 30px;
	text-transform: none;
	text-align: left;
	display: flex;
	align-items: center;
}
.wp-block-button.is-style-certification-download-button .wp-element-button::before {
	content: '';
	background-image: var(--odm--preset--svg--circle-check);
	width: 34px;
	height: 34px;
	display: inline-block;
	margin-right: 12px;
	vertical-align: middle;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	transition: var(--odm--preset--transition);
	flex: 0 0 auto;
}

.wp-block-button.is-style-certification-download-button .wp-element-button:hover {
	background-color: var(--wp--preset--color--primary);
	outline: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--white);
}

.wp-block-button.is-style-certification-download-button .wp-element-button:hover::before {
	background-image: var(--odm--preset--svg--circle-check--white);
}

@media (max-width:782px){
	.wp-block-button.is-style-certification-download-button .wp-element-button {
		font-size: 18px;
	}
	.wp-block-button.is-style-certification-download-button .wp-element-button::before {
		width: 26px;
		height: 26px;
		margin-right: 8px;
	}
}