/************************************ Start: Buttons ************************************/
.full_article_link { position: absolute; z-index: 11; inset: 0; }

.button-link { cursor: pointer; display: inline-flex; align-items: center; gap: 10px; width: auto !important; font-weight: 600; font-size: 17px; line-height: 26px; text-transform: uppercase; text-decoration: none; color: var(--secondary); background: transparent; border: none; border-radius: 0; padding: 0; transition: var(--transition); }
.cms_hasBtnYN_box:hover .button-link,
.button-link:hover { display: inline-flex; color: var(--primary); background: transparent; border: none; border-radius: 0; text-decoration: none; }
.button-link > .fa { display: none; }
.button-link > i { font-size: 17px; line-height: 26px; color: var(--secondary); transition: var(--transition); }
.cms_hasBtnYN_box:hover .button-link > i,
.button-link:hover > i { color: var(--primary); }
.button-icon { position: relative; width: 45px; height: 45px; border-radius: 50%; overflow: clip; }
.button-icon:before,
.button-icon:after { content: ""; position: absolute; z-index: 1; inset: 0; background-image: url("/pages/img/button/icon.svg"); background-repeat: no-repeat; background-position: center; background-size: 21px 15px; transition: var(--transition); will-change: transform; }
.button-icon:before { background-color: var(--secondary); }
.button-icon:after { background-color: var(--primary); transform: translateX(-100%); }
.cms_hasBtnYN_box:hover .button-icon:before,
.button-link:hover .button-icon:before { transform: translateX(100%); }
.cms_hasBtnYN_box:hover .button-icon:after,
.button-link:hover .button-icon:after { transform: translateX(0); }

.button-back > .button-icon:before { transform: rotate(180deg); }
.button-back > .button-icon:after { transform: rotate(180deg) translateX(-100%); }
.button-back:hover .button-icon:before { transform: rotate(180deg) translateX(100%); }
.button-back:hover .button-icon:after { transform: rotate(180deg) translateX(0); }

.align_1 { justify-content: flex-start; }
.align_2 { justify-content: center; }
.align_3 { justify-content: flex-end; }
.align_4 > .button-link { justify-content: center; width: 100% !important; text-align: center; }

@media screen and (max-width: 959px) {
	.button-link { font-size: 14px; line-height: 21px; }
	.button-link > i { font-size: 14px; line-height: 21px; }
	.button-icon { width: 35px; height: 35px; }
	.button-icon:before,
	.button-icon:after { background-size: 18px 13px; }
}
/************************************ Ende: Buttons ************************************/