html {
    font-size: 18px;
    font-family: 'Frutiger LT Com';
}

.full-width-div {
	width: 100vw;
	position: relative;
	margin-left: -50vw;
	left: 50%;
}
/*
*************************************************************
** Internet                                                 *
*************************************************************
*/

body {
    overflow-x: hidden;
}

.internet-viewer {
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 500px;
    min-height: 500px;
    width: 100%;
    background-image: url(https://thomasjoss.s3-eu-west-1.amazonaws.com/Websitde_Content_Konnektivitaet_Spreadsheet.png);
    background-size: 2500px;
    background-position: 0 50%;
    background-repeat: no-repeat;
}

@media (max-width: 992px) {
    .internet-viewer {
        max-width: 300px;
        min-height: 300px;
        background-size: 1500px;
    }
}

@media (max-width: 992px) {
    .internet-viewer {
        max-width: 300px;
        min-height: 300px;
        background-size: 1500px;
    }
}
/*
*************************************************************
** Mobile                                                   *
*************************************************************
*/


.mobilesectionred {
    color: white;
}

    .mobilesectionred h4, .mobilesectionred h3, .mobilesectionred h2 {
        color: white;
    }

/*
*************************************************************
** Fernsehen                                                *
*************************************************************
*/
#videowrapper, #fernsehtopgraficwrapper {
    width: 100%;
    padding: 10px 25px 0px 0px;
    margin: 0px;
    position: relative;
}

#fernsehtopgraficwrapper {
    padding-top: 20px;
}

video {
    padding: 0px;
    margin: 0px;
}

.fernseh-mockup {
    position: absolute;
    top: 0;
    left: 0;
    width: 101%;
    margin: -5px;
}

.fernsehtopgrafic-spacer {
    /*margin-bottom:-230px;*/
}

.fernseh-otherdivices {
    display: block;
    position: absolute;
    bottom: -200px;
    right: -160px;
}

@media (max-width: 992px) {
    .fernseh-otherdivices {
        display: none;
    }
}

.fernsehtopgrafic {
    position: relative;
    margin-bottom: 75px;
    z-index: 99;
}

.fernsehinfoblock {
    margin-top: 200px;
}

img.remotecontrol {
    width: 100%;
}

@media only screen and (max-width: 992px) {
    .fernseh-mockup {
        width: 102%;
        margin: -1px;
    }

    .fernsehtopgrafic {
        position: relative;
        margin-bottom: 0px;
    }

    img.remotecontrol {
        width: 50%;
    }
}

/*
*************************************************************
** Telefon                                                  *
*************************************************************
*/

.telefon-header {
    margin-bottom: 150px;
}

.phone-viewer {
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 350px;
    min-height: 650px;
    width: 100%;
    background-image: url(https://thomasjoss.s3-eu-west-1.amazonaws.com/Websitde_Content_Telefonie_Spreadsheet.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
}

.phone-viewer-mobile {
    height: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 250px;
    min-height: 500px;
    width: 100%;
    background-image: url(https://thomasjoss.s3-eu-west-1.amazonaws.com/Websitde_Content_Telefonie_Spreadsheet.png);
    background-position: 0 50%;
    background-repeat: no-repeat;
    background-size: 1500px 474px;
}




/*
*************************************************************
** List Style                                               *
*************************************************************
*/

.page-wrapper ul {
    list-style: none;
    padding-left: 0px;
}

li.gga-list-arrow {
    display: flex;
    align-items: start;
    flex-direction: row;
    padding-bottom: 10px;
}

    li.gga-list-arrow::before {
        content: '';
        display: inline-block;
        font-family: "around-icons" !important;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        vertical-align: middle;
        color: #d22630;
        font-size: 1.3rem !important;
        line-height: 1.2;
        padding: 0px 10px 0px 0px;
    }

li.gga-list-dash {
    background: url(../img/gga-bonded.png) no-repeat;
    padding: 0 0 3px 15px;
    list-style: none;
    margin: 0;
    background-position: 0 7px;
}

.redlistbox a {
    display: block;
    text-decoration: none;
    color: var(--ar-body-color);
    background-color: var(--ar-primary);
    color: var(--ar-white);
    padding: 40px;
    margin: 0px 0px 20px 0px;
}

/*
*************************************************************
** News Style                                               *
*************************************************************
*/
.blog .cropped {
    width: 100%;
    height: 230px;
    background-position: center center;
    background-repeat: no-repeat;
    overflow: hidden;
}

    .blog .cropped img {
        min-height: 230px;
    }

.blog .swiper-blog-text {
    height: 132px;
    overflow: hidden;
}

/*
*************************************************************
** Cards Style                                              *
*************************************************************
*/

.card .card-img {
    width: auto;
    height: 70px;
    padding-bottom: 25px;
}

.endcardimg {
}



/*
*************************************************************
** Layout Topspacer & NAV (to avoid content behind nav      *
*************************************************************
*/

.navbar {
    padding: 0px;
}

.topspacer {
	display: block;
	width: 100%;
	height: 0px;
}

@media only screen and (max-width: 991px) {
    .topspacer {
        height: 1rem;
    }

    #topnavcontainer {
        display: none !important;
    }
}

.footer-bottom-nav {
    padding: 3px 0px 0px 0px;
}

@media only screen and (min-width: 421px) {
    div.eapps-widget {
        position: relative;
        width: 100%;
    }
}

@media only screen and (max-width: 420px) {
    div.eapps-widget {
        position: relative;
        width: 220px;
    }
}

.scnd:active {
    color: black !important;
}

.scnd:hover {
    color: black !important;
}

.scnd:focus {
    color: black !important;
}
























/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* ************************************************************  REDESIGN ************************************************************** */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */


/* Schriftarten */
@font-face {
    font-family: 'F77';
    src: url('../fonts/FrutigerLTPro-BlackCn.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    color: #4D4D4D;
}

@font-face {
    font-family: 'F67';
    src: url('../fonts/FrutigerLTPro-BoldCn.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
    color: #4D4D4D;
}

@font-face {
    font-family: 'F57';
    src: url('../fonts/FrutigerLTPro-Condensed.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    color: #4D4D4D;
}

@font-face {
    font-family: 'F47';
    src: url('../fonts/FrutigerLTPro-LightCn.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    color: #4D4D4D;
}

@font-face {
    font-family: 'schreibschrift';
    src: url('../fonts/Caveat-VariableFont_wght.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    color: #fff;
}



/* ************************* */
/* Titel und Absätze */
h1 {
    font-family: F67;
    font-size: 40px;
    color: #4D4D4D;
}

h2 {
    font-family: F67;
    font-size: 32px;
    color: #4D4D4D;
}

h3 {
    font-family: F67;
    font-size: 24px;
    color: #4D4D4D;
}

h4 {
    font-family: F67;
    font-size: 20px;
    color: #4D4D4D;
}

h5 {
    font-family: F67;
    font-size: 18px;
    color: #4D4D4D;
}

h6 {
    font-family: F67;
    font-size: 16px;
    color: #4D4D4D;
}

p {
    font-family: F57;
    font-size: 18px;
    color: #4D4D4D;
}

.p0 {
    font-family: F57;
    font-size: 18px;
    color: #4D4D4D;
}

.ps {
	font-family: F57;
	font-size: 16px;
	color: #4D4D4D;
} 

.pxs {
    font-family: F57;
    font-size: 14px;
    color: #4D4D4D;
}

li {
    font-family: F57;
    font-size: 18px;
    color: #4D4D4D;
}

/* ************ ************ ************ */
.likeh3 {
    font-family: F67;
    font-size: 20px;
    color: #4d4d4d;
}


/* ************************* */
/* Media Querry */

@media screen and (max-width: 1023px) {
    h1 {
        font-family: F67;
        font-size: 32px;
    }

    h2 {
        font-family: F67;
        font-size: 24px;
    }

    h3 {
        font-family: F67;
        font-size: 20px;
    }

    h4 {
        font-family: F67;
        font-size: 18px;
    }

    h5 {
        font-family: F67;
        font-size: 16px;
    }

    h6 {
        font-family: F67;
        font-size: 14px;
    }

    p {
        font-family: F57;
        font-size: 18px;
    }

    .ps {
        font-family: F57;
        font-size: 16px;
    }

    .pxs {
        font-family: F57;
        font-size: 14px;
    }
}

/* ************************* */
/* Testklassen */

.farbe1 {
    background-color: green;
    height: 300px;
}

.farbe2 {
    background-color: #EDF5FB;
    height: 100%;
    border-radius: 10px;
}



/* ************************ */
/* Inhalte */

.brad {
	border-radius: 10px !important;
}

.brad-l {
	border-radius: 10px 0px 0px 10px !important;
}

.brad-r {
	border-radius: 0px 10px 10px 0px !important;
}

.TopSpace {
	padding-top: 24px;
}

.TopSpaceL {
	padding-top: 70px;
}


.TopDownSpace {
	padding-top: 24px;
	padding-bottom: 24px;
}

.backspace1 {
	margin-bottom: -30px !important;
}

.BottomSpace {
	padding-bottom: 24px;
}

.topPad {
	padding-top: 24px;
}

.botPad {
	padding-bottom: 24px;
}

.margin0 {
	margin: 0px;
}

li.gga-list-check {
    background: url(../img/check.png) no-repeat;
    padding: 3px 0 0 25px;
    list-style: none;
    margin: 0;
    background-position: 0 7px;
}

li.gga-list-dash {
	background: url(../img/gga-bonded.png) no-repeat;
	padding: 3px 0 3px 25px;
	list-style: none;
	margin: 0;
	background-position: 0 7px;
}

.stoerer_rund {
	position: relative;
	top: -50px;
	left: 60px;
	width: 100px;
}

.stoerer_rund2 {
    position: relative;
    top: -35px;
    left: 30px;
    width: 92px;
}

.stoerer_rund3 {
	position: relative;
	height: 100px;
	max-width: fit-content;
	top: -65px;
	left: 60px;
}

.stoerer_rund4 {
	position: relative;
	height: 100px;
	max-width: fit-content;
	top: -25px;
	left: 15px;
}

.stoerer_rund5 {
	position: relative;
	height: 100px;
	max-width: fit-content;
	top: -390px;
	left: 515px;
}

.stoerer_rund6 {
	position: relative;
	height: 100px;
	max-width: fit-content;
	top: -75px;
	left: 15px;
}

.stoerer_rund7 {
	position: relative;
	top: -385px;
	left: 1230px;
	width: 92px;
}


/* ********** BUTTTONs ********** */
.btn-p {
	background-color: #fff;
	border: 1px solid #4d4d4d;
	padding: 7px 15px 10px 15px;
	border-radius: 10px;
	height: 48px;
}

.btn-h4p {
    font-family: F67;
    font-size: 18px;
    margin-bottom: 2px;
    color: #4d4d4d;
}

.ProdKachel {
	margin-top: 15px;
	margin: 0px 10px 10px 10px;
	background-color: #4d4d4d;
	height: 100% !important;
}


/* Hover oder Klick auf den Button */
.btn-p:hover,
.btn-p:focus {
    border-color: #000000;
}

.btn-p a:hover {
	color: #000000;
}

.btn-s {
	background-color: #4d4d4d;
	border: 1px solid #4d4d4d;
	padding: 7px 35px 10px 25px;
	border-radius: 10px;
	transition: background-color 0.3s ease;
	height: 48px;
}

.btn-h4s {
    font-family: F67;
    font-size: 18px;
    margin-bottom: 2px;
    color: #fff;
}

.btn-h3s {
	font-family: F57;
	font-size: 29px !important;
	margin-bottom: 2px;
	color: #fff;
}

.btn-confirm {
    background-color: #478324;
    padding: 7px 35px 10px 25px;
    border-radius: 10px;
    transition: background-color 0.3s ease;
    height: 48px;
}

	.btn-confirm:hover {
		background-color: #3C721C;
		padding: 7px 35px 10px 25px;
		border-radius: 10px;
		transition: background-color 0.3s ease;
		height: 48px;
	}

	.btn-confirm:active {
		background-color: #3C721C;
		padding: 7px 35px 10px 25px;
		border-radius: 10px;
		transition: background-color 0.3s ease;
		height: 48px;
	}

.btn-h4confirm {
	font-family: F67;
	font-size: 18px;
	margin-bottom: 2px;
	color: #fff;
	text-decoration: none;
}

	.btn-h4confirm:hover {
		font-family: F67;
		font-size: 18px;
		margin-bottom: 2px;
		color: #fff;
		text-decoration: none;
	}

	.btn-h4confirm:active {
		font-family: F67;
		font-size: 18px;
		margin-bottom: 2px;
		color: #fff;
		text-decoration: none;
	}

.btn-cancel {
    background-color: #d9d9d9;
    padding: 7px 35px 10px 25px;
    border-radius: 10px;
    transition: background-color 0.3s ease;
    height: 48px;
}

	.btn-cancel:active {
		background-color: #f2f2f2;
		padding: 7px 35px 10px 25px;
		border-radius: 10px;
		transition: background-color 0.3s ease;
		height: 48px;
		text-decoration: none;
	}

	.btn-cancel:hover {
		background-color: #f2f2f2;
		padding: 7px 35px 10px 25px;
		border-radius: 10px;
		transition: background-color 0.3s ease;
		height: 48px;
		text-decoration: none;
	}

.btn-h4cancel {
	font-family: F67;
	font-size: 18px;
	margin-bottom: 2px;
	color: #4d4d4d;
	text-decoration: none;
}

	.btn-h4cancel:hover {
		font-family: F67;
		font-size: 18px;
		margin-bottom: 2px;
		color: #4d4d4d;
		text-decoration: none;
	}

	.btn-h4cancel:active {
		font-family: F67;
		font-size: 18px;
		margin-bottom: 2px;
		color: #4d4d4d;
		text-decoration: none;
	}










/* Theme-Pseudo-Elemente der alten Lösung abschalten */
.btn-more::after,
.btn-more::before {
	content: none !important;
	background: none !important;
}

/* Icon vor dem Text – mit sanfter Animation */
.collapse-icon {
	display: inline-block;
	transition: transform .2s ease;
	transform-origin: center;
}

/* Geöffnet: Pfeil nach oben (aus ▼ wird ▲) */
button[aria-expanded="true"] .collapse-icon {
	transform: rotate(180deg);
}

/* Label-Text aus den Data-Attributen lesen */
.collapse-label::before {
	content: attr(data-show-label);
}

button[aria-expanded="true"] .collapse-label::before {
	content: attr(data-hide-label);
}










.form-control {
	padding: .425rem 1rem;
}


.prod-kachel {
	transition: background-color 0.3s ease;
}

.prod-kachel:hover,
.prod-kachel:active {
	background-color: #000000 !important;
}

.prod-kachel:hover .ai-arrow-right,
.prod-kachel:active .ai-arrow-right {
	transform: translateX(12px);
	transition: transform 0.3s ease;
}






/* *********************** Tooltipp **************** */
.info-wrapper {
	position: relative;
}

.info-tooltip,
.info-tooltipM {
	position: absolute;
	bottom: 125%; /* oberhalb des Icons */
	left: 50%;
	transform: translateX(-50%);
	background-color: #fff;
	color: #4d4d4d;
	padding: 10px;
	border-radius: 8px;
	border: 1px solid #ccc;
	box-shadow: 0px 3px 6px rgba(0,0,0,0.1);
	white-space: nowrap;
	font-size: 14px;
	min-width: 200px;
	display: none;
	z-index: 2000; /* Über dem Backdrop */
}

.info-tooltipM {
	left: 85%;
}

	.info-tooltip::after,
	.info-tooltipM::after {
		content: "";
		position: absolute;
		top: 100%;
		left: 50%;
		margin-left: -6px;
		border-width: 6px;
		border-style: solid;
		border-color: #fff transparent transparent transparent;
	}

.tooltip-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5); /* halbtransparent */
	z-index: 1000; /* Hinter Tooltip */
	display: none;
}



	/* ** overlay ** */

.overlay-img {
	width: 100%;
	height: auto;
	display: block;
}

.overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 10000;
}

.overlay-content {
	position: relative; /* wichtig für die X-Positionierung */
	background: white;
	padding: 20px 20px 0px 20px;
	max-width: 800px;
	width: 90%;
	text-align: center;
	border-radius: 10px;
}

	.overlay-content h3 {
		margin-bottom: 10px;
		color: #333;
	}

	.overlay-content img {
		width: 100%;
		height: auto;
		margin-bottom: 15px;
	}

.overlay-text {
	font-size: 16px;
	line-height: 1.4;
	color: #444;
	padding: 10px;
	border-radius: 5px;
	text-align: left;
}

.close-btn {
	position: absolute;
	top: 10px;
	right: 15px;
	font-size: 28px;
	color: #333;
	cursor: pointer;
	background: #fff;
	width: 32px;
	height: 32px;
	line-height: 30px;
	text-align: center;
}

@keyframes fadeIn {
	from {
		opacity: 0;
		transform: scale(0.95);
	}

	to {
		opacity: 1;
		transform: scale(1);
	}
}



/* Standard Abstand fürs Icon */
..ai-arrow-right {
	display: inline-block;
	transition: transform 0.2s ease;
	margin-left: 12px;
}

.defaultabstand {
	margin-left: 12px;
}

.unterteiler {
	margin-left: 10px;
	margin-right: 10px;
}

.unterteiler2 {
	width: 48%;
	margin: 0px 10px 0px 0px;
}

.unterteiler3 {
	width: 48%;
	margin: 0px 0px 0px 10px;
}

.topab{
	margin-top:10px; 
}

/* Wenn der Button gehovt oder fokussiert wird, erhöhe Abstand vom Icon */
.btn-arrow:hover .ai-arrow-right,
.btn-arrow:focus .ai-arrow-right {
	transform: translateX(8px);
	transition: transform 0.4s ease;
}

.btn-s:hover,
.btn-s:focus {
    background-color: #000000;
}

.accordion-button {
	color: #4d4d4d;
}

	.accordion-button:not(.collapsed) {
		color: #000000;
	}

.MKachel {
	width: 100px;
	text-align: right;
	float: right;
}

.MKachelText {
	text-align: left;
	margin-top: 40px;
}

.MKachelPfeil {
	margin-top: 27px;
	font-size: 30px;
}


/* *************************** */

.bgRed {
    background-color: #d22630;
    color: #fff;
    padding: 10px;
    border-radius: 10px 10px 0px 0px;
    margin-top: 10px;
}

.schreibschrift {
	font-family: schreibschrift;
	font-size: 20px;
	color: #d22630;
}


/* ************** FORMULAR ***************** */

#address::placeholder {
	color: #8c8c8c;
}







/* ***************** MEDIA QUERIES ********************* */

@media screen and (max-width: 1250px) {
    .stoerer_rund {
        position: relative;
        top: -25px;
        left: 40px;
        width: 100px;
    }

	.stoerer_rund2 {
		position: relative;
		top: -25px;
		left: 40px;
		width: 100px;
	}

	.qPad {
		padding-top: 24px;
	}


	.stoerer_rund5 {
		position: relative;
		height: 100px;
		max-width: fit-content;
		top: -390px;
		left: 415px;
	}


	.topab {
		margin-top: 0px;
	}


}


@media screen and (max-width: 1050px) {
	.stoerer_rund5 {
		position: relative;
		height: 100px;
		max-width: fit-content;
		top: -390px;
		left: 315px;
	}
}


@media screen and (max-width: 991px) {
	.stoerer_rund5 {
		position: relative;
		height: 100px;
		max-width: fit-content;
		top: -50px;
		left: 330%;
	}
}


@media screen and (max-width: 600px) {
	.stoerer_rund5 {
		position: relative;
		height: 100px;
		max-width: fit-content;
		top: -50px;
		left: 280%;
	}
}

@media screen and (max-width: 460px) {
	.padSM {
		width: 29px !important;
	}
}
/* ********* Verlinkungen ************* */

a {
	color: #4d4d4d;
	text-decoration: none;
	font-size:18px;
	font-family:F57;
}

	a:hover {
		color: #000000;
		text-decoration: underline;
	}

	a:active {
		color: #000000;
		text-decoration: underline;
	}

.aicon {
    color: #4d4d4d;
    text-decoration: none !important;
}

	.aicon:hover {
		color: #000000;
		text-decoration: none !important;
	}

	.aicon:active {
		color: #000000;
		text-decoration: none !important;
	}

.btn-p a {
	color: #4d4d4d;
	text-decoration: none;
}

.btn-s a {
    color: #fff;
    text-decoration: none;
}






/* ************ USP Widget *************** */
.USP_Icon {
    max-width: 40px;
}

.USP_Untertitel {
	font-weight: bold;
	color: #d22630;
	font-family: schreibschrift;
}

.USP_Text {
    color: #4D4d4d;
}

/* ***************** Hintergrundfarben ************ */

.TitleColorBlue {
	background-color: blue;
}



/* ************* Bilder ********************* */
.icon {
	width: 39px;
}

.Kontaktbild {
	width: 183px;
}

.zahlicon {
	font-size: 48px;
}

.rand1 {
	padding-top: 0px;
	padding-right: 35px;
	padding-bottom: 35px;
	padding-left: 15px;
}

.rand2 {
	padding-left: 35px;
}

.rand3 {
	padding-top: 0px;
	padding-right: 35px;
	padding-bottom: 35px;
	padding-left: 16.5px;
}

.rand4 {
	padding-top: 35px;
	padding-right: 35px;
	padding-bottom: 0px;
	padding-left: 35px;
}


.image-wrapper {
	height: 100%;
	width: 100%;
}

	.image-wrapper img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}



/* ******************* ACORDEON ***************** */

.accordion-wrapper {
	padding: 20px;
	border-radius: 10px;
	background-color: #fff;
	cursor: pointer;
	transition: all 0.3s ease;
}

.accordion-header {
	cursor: pointer;
	user-select: none;
}

.accordion-icon {
	font-size: 1.5rem;
	transition: transform 0.3s ease;
}

.accordion-body {
	/* max-height: 0; */
	overflow: hidden;
	transition: max-height 0.4s ease, padding 0.3s ease;
	padding-top: 0;
}

.accordion-wrapper.open .accordion-body {
	max-height: 500px; /* Groß genug für deinen Content */
	padding-top: 15px;
}

.accordion-wrapper.open .accordion-icon {
	transform: rotate(180deg); /* Pfeil nach oben */
}




/* ****  Bermuda CSS ********** */
a.prodlink:hover {
	background-color: #000;
}


a.prodlink {
	display: block;
	width: 100%;
	height: 100%;
	padding: 24px;
	background-color: #4d4d4d;
	color: white;
	border-radius: 12px;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.3s ease;
}


#enlarged-image-overlay.active {
	display: flex;
}



#enlarged-image-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: rgba(0, 0, 0, 0.8);
	z-index: 99999;
	justify-content: center;
	align-items: center;
}

a.prodlink-mobile:hover {
	background-color: #000;
}


a.prodlink-mobile {
	display: flex;
	align-items: center;
	padding: 24px;
	width: 100%;
	height: 84px;
	background-color: #4d4d4d;
	color: white;
	text-decoration: none;
	transition: background-color 0.3s ease;
	cursor: pointer;
}




/* **************** TABELLE ********************** */

table td,
table th {
	vertical-align: top;
	font-family: F57;
	font-size: 18px;
}

.tabwidth {
	width: 30%;
}

.myTable {
	border-collapse: collapse;
	width: 100%; /* volle Breite */
	table-layout: auto; /* Spalten passen sich Inhalt und Platz an */
}

.myTable td,
.myTable th {
	border: 1px solid #ccc; /* feine graue Linie */
	padding: 12px 10px; /* etwas mehr Platz um den Inhalt */
	vertical-align: top;
	
}

.myTable th {
	background-color: #f9f9f9; /* optional: dezenter Hintergrund für Überschriften */
	text-align: left; /* schön linksbündig */
}


/* *********************************************** */





/* ************************************ */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* **************************************************************  ENDE **************************************************************** */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/* ************************************************************************************************************************************* */
/*


/*
*************************************************************
** IA REDESIGN CHANGES - HEADER                             *
*************************************************************
*/


.skip-link {
    position: absolute;
    top: -50px;
    left: 0;
    background: #d22630;
    color: #fff;
    padding: 8px 16px;
    z-index: 100;
    text-decoration: none;
    transition: top 0.2s;
}



    .skip-link:focus {
        top: 0;
    }



.scroll-to-top {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 64px;
    height: 64px;
    background-color: #4D4D4D;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    cursor: pointer;
    z-index: 9999; /* Keep on top */
    opacity: 0; /* Start hidden */
    pointer-events: none; /* Disable clicks when hidden */
    transition: opacity 0.4s ease;
}

.scroll-to-top.visible {
    opacity: 1;
    pointer-events: auto; /* Enable clicks when visible */
}

.scroll-to-top:hover {
    background-color: #000000;
}

.scroll-to-top-link {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

.scroll-to-top-svg {
    width: 48px;
    height: 48px;
    display: block;
}

.svg-icon {
    height: 22px;
    width: 22px;
    margin-right: 6px;
    margin-top: -2px;
    &.support-svg {
					  padding: 3px;
	              }
}

#topnavcontainer {
    height: 32px;
}

    #topnavcontainer .topnav.signin {
        justify-content: flex-end;
    }

    #topnavcontainer .topnav li {
        padding: 6px 0px;
        line-height: 16px;
        font-size: 16px;
        font-weight: 500;
        color: #D22630;
    }

        #topnavcontainer .topnav li a {
            font-size: 16px;
            font-weight: 500;
            color: #D22630;
            display: inline-block;
        }

            #topnavcontainer .topnav li a:hover {
                text-decoration: underline;
            }

        #topnavcontainer .topnav li::after {
            content: '|';
            color: #D22630;
            padding: 0 12px;
        }

        #topnavcontainer .topnav li:last-child::after {
            display: none;
        }

#mainnavcontainer {
    height: 68px;
    padding-bottom: 6px;
}

    #mainnavcontainer .navbar-nav .nav-link, #mainnavcontainer .navkorr .dropdown-menu .dropdown-item {
        color: #4D4D4D;
    }

        #mainnavcontainer .navbar-nav .nav-link.active, #mainnavcontainer .navkorr .dropdown-menu .dropdown-item.active {
            color: #000000;
        }

	#mainnavcontainer .navbar-brand {
		padding: 0px;
		margin: 0px;
		width: 140px;
		height: 52px;
		object-fit: contain;
}
#mainnavcontainer .navbar-nav {
	display:flex;
	gap:44px;
}
#mainnavcontainer .navkorr li{
	font-size:22px;
	font-weight:500;
}

#mainnavcontainer .navkorr li a {
	text-decoration: none;
	font-size: 22px; /* FontSize Menu */
	font-weight: 500;
	padding: 0px;
}
    #mainnavcontainer .navkorr li a:hover, #mainnavcontainer .navkorr li a:focus, #mainnavcontainer .navkorr li a.hover-active {
        color: #000000;
    }
#mainnavcontainer .navkorr li a.nav-link::after {
	margin-left: 5px;
	display:none;
}
    #mainnavcontainer .navkorr li a.nav-link .dropdownsvg {
        margin-left: 7px;
        width: 17px;
        height: auto;
        stroke: #4D4D4D;
    }
    #mainnavcontainer .navkorr li a:hover .dropdownsvg, #mainnavcontainer .navkorr li a:focus .dropdownsvg, #mainnavcontainer .navkorr li a.hover-active .dropdownsvg {
        stroke: #000000;
    }

    #mainnavcontainer .navkorr .dropdown-menu .dropdown-item {
        padding: 0px 12px;
        font-size: 20px;
        font-weight: 500;
        color: #4D4D4D;
        position: relative;
        display: inline-block;
        width: auto;
    }

        #mainnavcontainer .navkorr .dropdown-menu .dropdown-item:hover, #mainnavcontainer .navkorr .dropdown-menu .dropdown-item:focus {
            color: #000000;
        }

            #mainnavcontainer .navkorr .dropdown-menu .dropdown-item:hover::before, #mainnavcontainer .navkorr .dropdown-menu .dropdown-item:focus::before, #mainnavcontainer .navkorr .dropdown-menu .dropdown-item.active::before {
                content: '';
                position: absolute;
                left: 0;
                bottom: 0;
                width: calc(100% - 24px);
                height: 1px;
                background-color: #000000;
                margin: 0px 12px;
            }


    #mainnavcontainer .navkorr .nav-link:hover::before, #mainnavcontainer .navkorr .nav-link:focus::before, #mainnavcontainer .navkorr .nav-link.active::before, #mainnavcontainer .navkorr .nav-link.hover-active::before {
        content: '';
        width: calc(100% - 24px);
        height: 1px;
        background-color: black;
        position: absolute;
        left: 0;
        bottom: 1px;
    }
#mainnavcontainer .navbar-nav .dropdown-menu {
	margin-top: 0px !important;
	border-radius: 0 0 10px 10px;
	border: none;
	box-shadow: 0 4px 6px rgba(0, 0, 0, .15);
}
#mainnavcontainer .mainnavul2 {
	display: flex;
	flex-direction: row; /* horizontal stack */
	gap: 24px;
}
#mainnavcontainer .mainnavul2 li {
	padding:2px 0px;
}
#mainnavcontainer .mainnavul2 li a {
	text-decoration: none;
	position: relative;
	font-size: 16px; /* FontSize Menu2 */
	padding: 0px;
	display: block;
}
	#mainnavcontainer .mainnavul2 li a .me-1 {
		margin-right:12px !important;
	}
#mainnavcontainer .mainnavul2 li a.dropdown-toggle::after {
	display: none;
}
    #mainnavcontainer .mainnavul2 .dropdown-menu .dropdown-item {
        font-size: 16px;
        font-weight: 500;
        color: #4D4D4D;
        position: relative;
        display: inline-block;
        width: auto;
        padding: 0px 12px;
    }
#mainnavcontainer .mainnavul2 .dropdown-menu .dropdown-item i{
	padding-bottom:2px;
    font-weight:bold;
}
#mainnavcontainer .mainnavul2 .dropdown-menu li a:hover::before, #mainnavcontainer .mainnavul2 .dropdown-menu li a:focus::before {
	content: '';
	width: calc(100% - 51px);
	height: 1px;
	background-color: black;
	position: absolute;
	right: 11px;
	bottom: 3px;
}

/* NavDesktop changes*/
@media only screen and (min-width: 1400px) {
	#mainnavcontainer .navkorr {
		padding-left: 53px;
	}

    #mainnavcontainer .navkorr > .navbar-nav > .nav-item > .nav-link {
        font-size: 20px;
    }

    .special-red {
        color: #af2028 !important;
    }

    #mainnavcontainer .navbar-brand img {
        height: unset !important;
    }

	#mainnavcontainer .mainnavul2 li a:hover::before, #mainnavcontainer .mainnavul2 li a:focus::before {
		content: '';
		width: calc(100% - 27px);
		height: 1px;
		background-color: black;
		position: absolute;
		right: 0;
		bottom: 3px;
	}

    #mainnavcontainer .mainnavul2 li a .ai-cross {
        display: none;
    }

    #navbarNav3 {
        display: none !important;
    }

    #mainnavcontainer .mainnavul2 li a {
        cursor: pointer
    }

    .dropdown-toggle:hover .dropdownsvg, .dropdown:hover .dropdown-toggle .dropdownsvg {
        transform: rotate(180deg);
    }

    .dropdown-toggle .dropdownsvg {
        transform: rotate(0deg);
    }

    .dropdown-toggle .dropdownsvg {
        transition: transform 0.1s linear;
    }
}

/* NAVmobile changes */


@media (max-width: 1399.98px) {
    .dropdown-toggle[aria-expanded="true"] .dropdownsvg {
        transform: rotate(180deg);
    }
    .dropdown-toggle[aria-expanded="false"] .dropdownsvg {
        transform: rotate(0deg);
    }
    .dropdown-toggle .dropdownsvg {
        transition: transform 0.1s linear;
    }
	#topnavcontainer {
		display: none !important;
	}
	#mainnavcontainer .navbar-brand img {
		width: 90px;
		height: 36px;
		object-fit: contain;
	}
#mainnavcontainer {
	padding-bottom: 0px;
}
		#mainnavcontainer .navbar-toggler .navbar-toggler-icon, #mainnavcontainer .navbar-toggler .navbar-toggler-icon:before, #mainnavcontainer .navbar-toggler .navbar-toggler-icon:after {
			width: 100%;
			height: 3px;
			border-radius: 1.5px;
		}

        #mainnavcontainer .navbar {
            position: unset;
        }

    .mobnavcontainer {
        height: 60px;
        display: flex;
        align-items: center;
    }

        .mobnavcontainer .mobnavicons {
            display: flex;
            flex-direction: row;
            gap: 18px;
            .svg-icon

{
    margin-right: 0;
}

}

.mobnavcontainer .mobnavicons a i {
    font-size: 24px;
    line-height: 24px;
    color: #4D4D4D;
}

#navbarNav, #navbarNav2, #navbarNav3 {
    z-index: 9999;
    position: fixed;
    overflow-y: scroll;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    top: 62px;
    left: 0;
    width: 100vw;
    height: calc(100dvh - 62px);
    padding-left: 0;
    padding-right: 0;
    padding-top: 6px;
    margin-top: 0px;
    background: #f2f2f2;
}

#navbarNav2, #navbarNav3 {
    padding-top: 0;
}

#mainnavcontainer .mainnavul2 .dropdown-menu .dropdown-item {
    padding-left: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
    padding-right: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
}

#mainnavcontainer .navkorr li a.nav-link .dropdownsvg {
    margin-right: 2px;
}

#navbarNav .navbar-nav, #navbarNav2 .navbar-nav, #navbarNav3 .navbar-nav {
    display: flex;
    flex-direction: column;
    gap: 3px;
    background: #F2F2F2;
    padding: 0px;
}

.mainnav3container a:hover {
    text-decoration:none;
}
.mainnav2container ul, .mainnav3container ul {
    background: unset !important;
}

.mainnav2container .dropdown-menu i, .mainnav3container .nav3block i {
    color: #D22630;
}

.mainnav2container > .navbar-nav, .mainnav3container > .navbar-nav {
    gap: 0 !important;
    max-height: unset;
}

.mainnav2container .mainnavul2 > li:first-child {
    display: none;
}

.mainnav2container .mainnavul2 > li .nav-link, .mainnav3container .mainnavul3 > li .nav-link {
    background: unset !important;
}

.mainnav2container .mainnavul2 .dropdown-menu {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

    .mainnav2container .mainnavul2 .dropdown-menu li {
        display: flex;
        background-color: #ffffff;
        height: 48px;
        align-items: center;
    }

.mainnav3container .nav3block {
    padding: 12px 0px;
    padding-left: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
    padding-right: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
    background: #ffffff;
    margin-bottom: 6px;
    .navBlockTitle

{
    font-weight: bold;
    margin-bottom: 12px;
}

.navBlockItem {
    display: flex;
    gap: 12px;
    i

{
    display: inline;
    line-height: 27px;
    font-size: 20px;
}

a {
    display: inline;
}

}
}

		#mainnavcontainer .mainnavul2 li a, #mainnavcontainer .mainnavul3 li a {
			display: flex;
		}
			#mainnavcontainer .mainnavul2 li a .ai-cross, #mainnavcontainer .mainnavul3 li a .ai-cross {
				font-size: 36px;
				font-weight: bold;
				margin-left: auto;
				display: inline;
                margin-right:-7px;
			}

#mainnavcontainer .navbar-nav .nav-link {
    font-size: 20px;
    height: 48px;
    background: #ffffff;
    color: #4D4D4D;
    padding-left: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
    padding-right: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
   
    display: flex;
    justify-content: space-between;
    align-items: center;
}
#mainnavcontainer .mainnav3container .nav-link {
    height: 51px;
}
#mainnavcontainer .navkorr .nav-link.hover-active::before {
    display:none;
}
#navbarNav .nav-link img {
    margin-right: -5px;
}


/* ******************* ACORDEON ***************** */
.accordion-wrapper {
	padding: 20px;
	border-radius: 10px;
	background-color: #fff;
	cursor: pointer;
	transition: all 0.3s ease;
}

.accordion-header {
	cursor: pointer;
	user-select: none;
}

.accordion-icon {
	font-size: 1.5rem;
	transition: transform 0.3s ease;
}

.accordion-body {
	/* max-height: 0; */
	overflow: hidden;
	transition: max-height 0.4s ease, padding 0.3s ease;
	padding-top: 0;
}

.accordion-wrapper.open .accordion-body {
	max-height: 500px; /* Groß genug für deinen Content */
	padding-top: 15px;
}

.accordion-wrapper.open .accordion-icon {
	transform: rotate(180deg); /* Pfeil nach oben */
}

#mainnavcontainer .navbar-nav .dropdown-menu {
    border-radius: unset;
    box-shadow: unset;
    background: #ffffff;
    animation: unset;
    padding-top: 0px;
    margin-top: 0px;
}

    #mainnavcontainer .navbar-nav .dropdown-menu .dropdown-item {
        font-size: 18px;
        padding-left: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
    }


#mainnavcontainer .navkorr .nav-link.dropdown-toggle:hover::before, #mainnavcontainer .navkorr .nav-link.dropdown-toggle:focus::before, #mainnavcontainer .navkorr .nav-link.dropdown-toggle.active::before,
#mainnavcontainer .dropdown-menu li a:hover::before, #mainnavcontainer .dropdown-menu li a:focus::before {
    display: none;
}

#mainnavcontainer .dropdown-menu li a:hover, #mainnavcontainer .dropdown-menu li a:focus {
    text-decoration: underline;
}

#mainnavcontainer .navkorr .nav-link.dropdown-toggle:hover, #mainnavcontainer .navkorr .nav-link.dropdown-toggle:focus, #mainnavcontainer .navkorr .nav-link.dropdown-toggle.active {
    text-decoration: none;
}

		#navbarNav .navbar-nav li a.nav-link::after {
			position: absolute;
			right: calc(var(--ar-gutter-x) * 0.5 + 2.5vw);
		}


#mainnavcontainer .navbar-brand {
    margin: auto 0;
}

    #mainnavcontainer .navbar-brand img {
        height: 40px !important
    }

.navbar-toggler {
    width: 22px !important;
    height: 18px !important;
    padding: 0 !important;
    border: none !important;
    margin-left: 18px !important;
    .navbar-toggler-icon

{
    height: 3px;
    border-radius: 1.5px;
}

}
/*Mobiletopnav*/
#mainnavcontainer .mobiletopnav .navbar-nav {
    display: flex;
    flex-direction: column;
    gap: 0px;
    background: #F2F2F2;
    padding: 3px 0px 0px 0px;
}

	#mainnavcontainer .mobiletopnav .navbar-nav li a {
		color: #D22630;
		display: flex;
		align-items: center;
		background: #ffffff;
		font-size: 18px;
		padding-left: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
		padding-right: calc(var(--ar-gutter-x) * 0.5 + 2.5vw) !important;
		height: 40px;
	}

        #mainnavcontainer .mobiletopnav .navbar-nav li a:hover, #mainnavcontainer .mobiletopnav .navbar-nav li a:focus {
            text-decoration: underline;
        }

}

@media only screen and (max-width: 575px) {
    #mainnavcontainer .navbar-nav .nav-link {
        padding-left: calc(var(--ar-gutter-x) * 0.5) !important;
        padding-right: calc(var(--ar-gutter-x) * 0.5) !important;

    }
    #mainnavcontainer .mobiletopnav .navbar-nav li a {
        padding-left: calc(var(--ar-gutter-x) * 0.5) !important;
        padding-right: calc(var(--ar-gutter-x) * 0.5) !important;

    }
    #mainnavcontainer .navbar-nav .dropdown-menu .dropdown-item {
        padding-left: calc(var(--ar-gutter-x) * 0.5) !important;
    }
    .mainnav3container .nav3block {
        padding: 12px 0px;
        padding-left: calc(var(--ar-gutter-x) * 0.5) !important;
        padding-right: calc(var(--ar-gutter-x) * 0.5) !important;
    }
}

    /*FooterNAV*/
    .footer-top {
        background-color: #4d4d4d;
    }

    .footernavigation {
        display: flex;
        flex-direction: row;
        gap: 48px;
        flex-wrap: nowrap;
        padding: 0px;
    }

        .footernavigation li.nav-item.dropdown {
            flex: 1 1 auto; /* Allow shrinking and growing */
            min-width: 0;
        }

        .footernavigation li a, .footernavigation li a:hover, .footernavigation li a:focus, .dropdown-menu li:hover .dropdown-item {
            text-decoration: none;
            color: #ffffff;
        }

        .footernavigation .dropdown-menu li .dropdown-item:hover, .footernavigation .dropdown-menu li .dropdown-item:focus {
            text-decoration: underline;
        }

        .footernavigation .nav-link.dropdown-toggle {
            transition: none;
            font-size: 20px;
            font-weight: normal;
        }

        .footernavigation .dropdown-menu {
            transform: none !important;
        }

            .footernavigation .dropdown-menu.show {
                animation: none;
            }

            .footernavigation .dropdown-menu a {
                padding: 0px;
                font-size: 18px;
                line-height: 36px;
            }

    .footer-icons {
        gap: 15px;
        display: flex;
        width: max-content;
    }

        .footer-icons .footericonsvg {
            height: 30px;
            width: auto;
        }

    .footernavcontainer .row {
        margin: 0;
    }

    .footer-bottom .container .footer-text-container {
        gap: 24px;
        font-size: 16px;
        align-items: center;
        color: white;
        font-weight: bold;
        .nav

{
    font-weight: normal;
    gap: 24px;
    a

{
    padding: 0;
}

}
}


/* Footernav changes DESKTOP */


@media only screen and (min-width: 1200px) {
	.footernavigation .dropdown-menu {
		display: block;
		position: relative !important;
		transform: none !important;
		transition: none;
		animation: none;
		padding: 0px 0px 0px 0px;
		margin: 0px;
		box-shadow: none;
		border: none;
		background: none;
		min-width: inherit;
	}
	.footer-top{
		padding: 36px 0;
	}
	.footer-bottom .container .footer-text-container {
		height: 96px;
	}
	.footer-icons {
		margin: auto 0 auto auto;
	}
	.footernavigation .nav-link {
		padding: 0 0 24px 0;
	}
	.footernavigation .nav-link.dropdown-toggle:after {
		display: none;
	}

	.footernavigation .dropdown-menu .dropdown-item:hover {
		text-decoration:underline;
	}

	

}

/* Footernav Mobile */
@media only screen and (max-width: 1199px) {

    .footernavcontainer {
        width: 100vw;
        padding: 0px;
        max-width:100%;
    }

    .footer-top {
        background-color: white;
    }

    .footer-bottom {
        padding: 24px 0;
    }

    .footer-top footer.py-5 {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    .footer-bottom .container {
        flex-direction: column;
        gap: 24px;
        .footer-text-container

{
    flex-direction: column-reverse;
}

}

.footernavigation {
    flex-direction: column;
    gap: 3px;
}

    .footernavigation .nav-link.dropdown-toggle {
        margin: 0px;
        width: 100%;
        height: 48px;
        padding: 12px;
        background: #4d4d4d;
    }

        .footernavigation .nav-link.dropdown-toggle:after {
            position: absolute;
            right: 0px;
            margin-right: 12px;
        }

    .footernavigation .dropdown-menu {
        position: relative !important;
        padding: 0px 0px 12px 0px;
        box-shadow: none;
        border: none;
        background: #4d4d4d;
    }

        .footernavigation .dropdown-menu a {
            padding: 0px 12px;
        }

.footer-icons {
    margin: auto;
}

}


/* Breadcrumbs */
.breadcrumbscontainer {
    display: flex;
    height: 48px;
    align-items: center;
    padding-top:5px;
    > nav

{
    height: 100%;
    align-items: center;
    display: flex;
    >ol

{
    margin-bottom: 0;
}

}
}

.breadcrumbscontainer .breadcrumb-item, .breadcrumbscontainer .breadcrumb-item a {
    font-size: 16px;
    color: #4D4D4D;
    
}
    .breadcrumbscontainer .breadcrumb-item a {
        text-decoration: underline;
    }

    .breadcrumbscontainer .breadcrumb-item a:hover {
        color: #000000;
    }

    .breadcrumbscontainer .breadcrumb-item.active {
        color: #000000;
    }

    .breadcrumbscontainer .breadcrumb-item.active::before {
        color: #000000;
    }

.breadcrumbscontainer .breadcrumb .breadcrumb-item:first-child:before {
    display: none;
}
.breadcrumb-item + .breadcrumb-item::before {
    padding-right:0px;
    margin-top:0px;
}

@media only screen and (max-width: 991px) {
    .breadcrumbscontainer {
        height: 37px;
        overflow-x: auto;
        padding-top:3px;
    }
}
/*
*************************************************************
** Layout Colored Background Section                        *
*************************************************************
*/
.background-lightblue {
    background-color: rgb(246, 249, 252);
}

.background-red {
    background-color: rgb(210, 38, 48);
}

    .background-red *, .background-red li.gga-list-arrow::before {
        color: white;
    }

/*
*************************************************************
** Layout BannerWidget                                      *
*************************************************************
*/
.simplebannertitle {
    margin-top: -1.8em;
    margin-bottom: 1.8em;
}


/*
*************************************************************
** Blog Detail                                              *
*************************************************************
*/
.sharecontainer .first {
    padding-left: 0px !important;
}


/*
*************************************************************
** Mobile optimizations                                            *
*************************************************************
*/

.row {
    --ar-gutter-y: 1rem;
}


.hotspots .hotspot-inner {
    height: 48px;
    width: 48px;
}

.hotspots .hotspot {
    height: 64px;
    width: 64px;
}

.hotspots [class^=ai-], .hotspots [class*=" ai-"] {
    font-size: 19px;
}



@media only screen and (max-width: 767px) {
    .hotspots {
        padding-bottom: 70px;
    }
}


/* *********** Menükorrektur on mobile ***************** */
@media only screen and (max-width: 991px) {
}

/*
*************************************************************
** faq                                                      *
*************************************************************
*/

.faqheadercontainer {
    background-image: url(../img/faq_banner.jpg);
    background-size: cover;
    background-position: bottom;
}

a:hover.flywith-button {
    right: -60px;
}

.flywith-section {
    top: 30% !important;
}

.flywith-button i {
    font-size: 30px;
    margin-bottom: 15px;
    margin-left: 5px;
    padding-right: 10px;
    margin-right: 20px;
}

.flywidth-button-text {
    font-size: 18px;
    padding-top: 1px;
}

.btnmobile {
}

.rgt {
    margin-right: 20px;
    float: right;
}

.lft {
    margin-left: 20px;
}

@media only screen and (max-width: 990px) {
    .rgt {
        margin-right: 0px;
        float: none;
        width: 100%;
    }

    .lft {
        margin-left: 0px;
        width: 100%;
    }
}

@media only screen and (min-width: 600px) {
    .flywith-button {
        right: -70px;
        padding: 10px 20px 30px 5px;
    }
}

@media only screen and (max-width: 600px) {
    .flywith-button {
        padding: 10px 15px 10px 10px;
    }

        .flywith-button i {
            padding: 0px;
            margin: 0px;
        }

    a:hover.flywith-button {
        right: 0px;
    }
}

@media only screen and (max-width: 600px) {
    .flywith-section {
        width: calc(100vw - 30px);
    }
}

/*FAQsearch*/

.faqsearchcontainer {
    background-color: #e1eefa;
    padding: 45px 15px;
    text-align: center;
    margin: 0px 10px;
    margin-top: 22px;
}

#faqsearch {
    width: 75%;
    /* background: white; */
    padding: 5px 15px;
    margin-bottom: 0px;
}

.result h3 {
    margin-bottom: 0px;
}

/*
     ################  CARD WIDGET ###############
*/
.nolinkclass {
    cursor: default;
}

/*
    ################ CARD WIDGET END #############
*/






/* ############# Banner Titel Farbig ############# */
@media (min-width: 1200px) {
    .TitleRed {
        color: #d22630;
        text-transform: uppercase !important;
        font-size: 4.5rem;
    }

    .TitleWhite {
        color: #ffffff;
        text-transform: uppercase !important;
        font-size: 4.5rem;
    }
}




@media (max-width: 1200px) {

    .TitleRed {
        color: #d22630;
        text-transform: uppercase !important;
    }

    .TitleWhite {
        color: #ffffff !important;
        text-transform: uppercase !important;
    }

    .schrift {
        font-size: 12px;
    }
}

/* ############# Banner Titel Farbig Ende ######## */

.faqlistwidget li {
    background: url(../img/gga-bonded.png) no-repeat;
    padding: 0 0 3px 15px;
    list-style: none;
    margin: 0;
    background-position: 0 7px;
}

.form-control {
    /*
	width: 2em;
	margin-left: -2.5em;
	background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e);
	background-position: left center;
	border-radius: 2em;
	transition: background-position .15s ease-in-out;
		*/
    margin-bottom: 20px;
}

.swiper-slide {
    background-color: #e8e8e8;
    padding: 20px;
}

.swiper-wrapper-blog {
    height: 650px;
}

.swiper {
    overflow: hidden !important;
}

/*
*************************************************************
** senderliste                                              *
*************************************************************
*/


.ggadevicefiltercontainer {
    margin-top: 25px;
    margin-bottom: 25px;
}

    .ggadevicefiltercontainer a {
        font-size: 23px;
        color: #707070;
        margin: 0 30px 0 0;
        text-decoration: none;
    }

        .ggadevicefiltercontainer a.active {
            border-bottom: 2px solid #d22630
        }

.dataTables_filter {
    display: none
}

.dt-buttons {
    position: absolute;
    right: 10px;
    bottom: -35px
}

    .dt-buttons button, .dt-buttons button span {
        background: none;
        border: none;
        font-size: 12px;
        color: #000
    }

        .dt-buttons button i {
            vertical-align: bottom;
            line-height: 11px;
            font-size: 12px
        }

#infosender, #infosendercount {
    margin-top: 30px;
    background: #f2f0f0;
    padding: 15px 5px 0 5px;
    font-weight: bold;
    font-size: 28px
}

.ggasendertable {
    background: #f2f0f0;
    border: 10px #f2f0f0 solid;
    width: 100% !important
}

table.dataTable {
    padding-bottom: 400px
}

.ggasendertable tr {
    border: 5px #f2f0f0 solid
}

.ggasendertable tbody tr td {
    background: #fff;
    padding: 15px 5px
}

    .ggasendertable tbody tr td img {
        height: 16px;
        width: auto;
    }

    .ggasendertable tbody tr td.iaimg img {
        height: 16px;
        width: auto;
    }

.ggasendertable thead tr th {
    padding-left: 0;
}

.ggasendertable tbody tr td, .ggasendertable thead tr th {
    font-size: 16px;
    border-bottom: 2px solid #707070;
}

.iaggasender_dropdown label {
    display: block;
    float: left;
    margin-right: 30px;
    font-size: 13px;
}

.iaggasender_dropdown select {
    display: block;
    width: auto;
    height: auto;
    font-size: 16px;
    border: none;
    border-bottom: 2px solid #707070;
    padding-left: 0;
    margin-left: 0;
}

.searchboxicon {
    position: relative;
    float: right;
    margin-right: 0px;
    padding: 6px;
    margin-left: -40px;
    z-index: 99;
}

input#searchbox {
    width: 200px;
    float: right;
    background: white url("/App_Themes/GGAMaurMaterialize/Images/search_icon.png") right no-repeat;
    padding: 0.2rem;
    padding-right: 33px;
}

@media screen and (max-width: 1200px) {
    .iaggasender_dropdown select, .iaggasender_dropdown label, .dt-buttons {
        display: none;
    }

    .ggadevicefiltercontainer {
        margin-bottom: 10px;
    }

    #iaggasender_wrapper {
        overflow-x: scroll;
    }
}

@media screen and (max-width: 550px) {
    .ggadevicefilter {
        display: block;
        max-width: 170px;
    }

    input#searchbox {
        float: none;
        width: 100%;
    }
}

.iaggasender_dropdown select:focus {
    outline: none;
}

.iaggasender_dropdown select * {
    font-size: 16px;
}

#bottomsendertable {
    background: #f2f0f0;
    height: 50px;
    margin-bottom: 25px;
}

#iaggasender_filter input[type=search]::placeholder, #iaggasender_filter input[type=search]:-ms-input-placeholder, #iaggasender_filter input[type=search]::-ms-input-placeholder {
    color: #000 !important;
    opacity: 1 !important;
}

#iaggasender_filter label {
    color: white;
}

#iaggasender_wrapper .printicon {
    margin-bottom: 3px;
    margin-right: 3px;
}


/*
*************************************************************
** forms - check                                            *
*************************************************************
*/

form label.control-label {
    font-weight: bold;
}

.ktc-checkbox input {
    display: inline-block;
    width: 46px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    background-position: left center;
    background-repeat: no-repeat;
    border-radius: 2.875em;
    transition: background-position .15s ease-in-out;
    margin-top: unset;
    margin-bottom: -5px;
    border: unset;
    background-color: var(--ar-gray-500);
    filter: none;
    padding: 0px;
}

    .ktc-checkbox input:focus {
        background-color: var(--ar-gray-500);
    }

    .ktc-checkbox input:checked {
        background-color: var(--ar-primary);
    }

    .ktc-checkbox input:checked {
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
        background-position: right center;
        background-repeat: no-repeat;
    }


.field-validation-error {
    color: #d22630;
}

form input[type=submit] {
    border: 1px solid #d22630;
    border-radius: 0px;
    background-color: #d22630;
    color: #ffffff;
    padding: 0.825rem 1.75rem;
    font-size: 19.25px;
    font-weight: 600;
}

    form input[type=submit]:hover {
        border-color: #af2028;
        background-color: #af2028;
        color: #ffffff;
    }

/*
*************************************************************
** login                                                    *
*************************************************************
*/
.topnav li.last {
    padding-right: 5px;
}

/*
*************************************************************
** header                                                   *
*************************************************************
*/

.bg-light {
    box-shadow: 0 4px 6px rgba(0,0,0,.15);
}


/*
*************************************************************
** FAQ Anführungsstrich entfernen und Text verbreitern                                                 *
*************************************************************
*/
.blockquote::before {
    display: none;
}

.blockquote {
    padding-left: 0px !important;
}

@media screen and (max-width: 767px) {
    .blockquote {
        font-size: 1.2rem;
    }
}

/*
*************************************************************
** FAQ Anführungsstrich Ende                                                *
*************************************************************
*/

/*
*************************************************************
** Suche                                                    *
*************************************************************
*/

.searchform {
    display: flex;
    flex-direction: row;
}

    .searchform input {
        height: 16px;
        border: none;
        border-bottom: 1px solid #d22630;
        padding: 0px;
        font-size: 14px;
        width: 100px;
    }

        .searchform input:focus {
            border: none;
            border-bottom: 1px solid #d22630;
        }

.searchpageformcontainer .btn.btn-primary {
    flex-shrink: 4;
}

.searchform button {
    padding: 0px;
    font-size: 12px;
    height: 16px;
}

.searchpageformcontainer {
    background-color: #e1eefa;
    padding: 45px 15px;
    text-align: center;
    margin-top: 22px;
    margin-bottom: 20px;
}

    .searchpageformcontainer form {
        display: flex;
        flex-direction: row;
        justify-content: center;
    }

    .searchpageformcontainer input {
        padding: 5px 15px;
        margin-bottom: 0px;
        width: 100%;
    }


.result {
    border-top: 1px solid #E6E3DF;
}

    .result a {
        display: block;
        text-decoration: none;
        padding: 25px 15px;
    }

        .result a:hover {
            background-color: rgb(246, 249, 252);
        }

    .result.noresult h3 {
        padding: 25px 15px;
    }

    .result .resultlink p {
        padding-bottom: 0px;
        margin-bottom: 0px;
        color: #576071;
    }

/* ******************* HERO BANNER MOBILE ***************** */
.mobileBannerHeight {
    height: 1050px !important;
}

.littlep p {
    margin-bottom: 0px;
}
/* **************** HERO BANNER MOBILE ENDE *************** */

/*
*************************************************************
** Tryouts                                                  *
*************************************************************
*/
.loadingbar {
    display: none;
}



/*
*************************************************************
** About Us & Maps Widget                                  **
*************************************************************
*/

.grayBG {
    background-color: #e8e8e8;
}

.yellowBG {
    background-color: #FBECCD;
}

.blueBG {
    background-color: #F5F9FC;
}

.whiteBG {
    background-color: #ffffff;
}

.colorBG {
}

.promoBlueBG {
    background-color: #EDF5FB;
}

.aboutus {
    padding: 10px 10px 10px 35px;
}

.stsbtn {
    align-items: center;
    justify-content: center;
    --bs-btn-border-radius: none;
    background-color: #d22630;
    color: #fff;
    height: 40px;
    width: 100%;
    padding-top: 8px;
    font-family: 'Frutiger LT Com';
    border-top: none;
    border-right: none;
    border-bottom: none;
    border-left: none;
}

.cta2btn {
    background-color: #d22630;
    padding: 10px;
}

.rand {
    padding: 35px;
}

.prodicon {
    text-decoration: none !important;
    font-size: 30px;
    color: white;
}

    .prodicon:hover {
        text-decoration: none;
        color: white;
    }

.maptitle {
    margin-top: 50px;
}

.prodbox {
    background-color: #d22630;
    border: 2px solid transparent;
    padding: 10px;
    color: white;
    margin-top: -10px;
    z-index: 99;
    margin: 0px 10px 10px 10px;
}

.prodboxMobile {
    background-color: #d22630;
    color: white;
    margin-top: -10px;
    z-index: 99;
    margin: 0px 10px 10px 10px;
}


.name {
    position: relative;
}

    .name::after {
        content: "";
        display: block;
        position: absolute;
        bottom: 10px;
        left: 0;
        transform: skewY(-7.5deg);
        width: 100%;
        height: 3px;
        background: #d22630;
    }

.Mname {
    position: relative;
    font-size: 18px;
}

    .Mname::after {
        content: "";
        display: block;
        position: absolute;
        bottom: 10px;
        left: 0;
        transform: skewY(-7.5deg);
        width: 100%;
        height: 3px;
        background: #d22630;
    }

/* Stil für den Container */
.image-container {
    position: relative;
    display: inline-block;
}

/* Stil für das vergrößerte Bild */
.enlarged-image {
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    text-align: center;
    margin-top: 0px;
}

    .enlarged-image img {
        max-width: 90%;
        max-height: 90%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

/* Stil für den Container, wenn das Bild vergrößert ist */
.enlarged {
    z-index: 9999;
    position: absolute;
    margin-top: -200px;
}

/* Stil für das vergrößerte Bild */
.enlarged-image.active {
    display: block;
}



.btn-secondary {
    background-color: #fff !important;
    --ar-btn-hover-color: #000;
    --ar-btn-active-color: #000;
    --ar-btn-hover-bg: #ccc;
    --ar-btn-active-bg: ccc;
    --ar-btn-hover-border-color: #000;
    --ar-btn-active-border-color: #000;
    --ar-btn-disabled-color: #000;
}

.bannerbtn {
    font-size: 21px !important;
}

.topper {
    height: 380px;
    padding: 50px
}

.downer {
    background-color: #F2F2F2;
    padding-bottom: 50px;
}


.shadowbox {
    box-shadow: inset 0 -3em 3em rgb(0 0 0 / 0%), 0 0 0 0px white, 0.3em 0.3em 1em rgb(0 0 0 / 15%);
    background-color: white;
    margin-top: -70px;
    padding: 30px;
}

.ramp {
    margin-bottom: 7px;
    margin-left: 0px;
}

.infowerbung {
    width: 70%;
    padding: 30px;
    box-shadow: inset 0 -3em 3em rgb(0 0 0 / 0%), 0 0 0 0px white, 0.3em 0.3em 1em rgb(0 0 0 / 15%);
    margin: auto;
    font-size: 16px;
}


.ggabox {
    /* border-bottom: 2px #333 solid; */
}

.whitebox1 {
    height: 194px;
    background-color: white;
    padding: 65px 0px;
    margin: 0px;
}

.whitebox2 {
    height: 194px;
    background-color: white !important;
    padding: 80px 0px;
}

.whitebox3 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox4 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox5 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox6 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox7 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox8 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox9 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox10 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.whitebox11 {
    height: 194px;
    background-color: white !important;
    padding: 00px 0px;
    margin-top: 45px;
}

.middle {
}

.unterstrich {
    text-decoration: none !important;
}

    .unterstrich:active {
        text-decoration: none !important;
    }

..unterstrich:hover {
    text-decoration: none !important;
}

.colored:active {
    color: white !important;
}

.colored:hover {
    color: white !important;
}

.uncolored:active {
    color: black !important;
}

.uncolored:hover {
    color: black !important;
}







.blackd {
    color: black !important;
    border-color: black;
}

    .blackd:active {
        color: black !important;
        border-color: black;
    }

    .blackd:hover {
        color: black !important;
        border-color: black;
    }







.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}

.modal-content {
    position: relative;
    margin: auto;
    padding: 0;
    width: 80%;
    max-width: 1200px;
    background-color: white;
    border-radius: 10px;
    overflow: hidden;
}

.modal-header {
    padding: 0px 10px;
    background-color: #f1f1f1;
    color: white;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-body {
    padding: 20px 30px;
    margin-left: 0px;
    margin-right: 0px;
}

.modal-footer {
    padding: 10px;
    background-color: #f1f1f1;
    justify-content: center;
}

.close {
    color: #4d4d4d;
    font-size: 28px;
    font-weight: bold;
    margin-left: auto;
}

    .close:hover,
    .close:focus {
        color: #4d4d4d;
        text-decoration: none;
        cursor: pointer;
    }


.fontsize {
    font-size: 22px !important;
}

.swipe-container {
    overflow-x: auto;
    white-space: nowrap;
}

.swipe-container2 {
    display: flex;
    overflow-x: auto;
}

.swipe-item {
    min-width: 300px;
    height: 200px;
    margin-right: 10px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    display: inline-block;
    text-align: center;
    line-height: 200px;
    font-size: 24px;
}

.swipe-item2 {
    min-width: 300px;
    height: 200px;
    margin-right: 10px;
    background-color: #f0f0f0;
    border: 1px solid #ccc;
    display: inline-block;
    text-align: center;
    line-height: 200px;
    font-size: 24px;
}

.scroll-arrow {
    position: absolute;
    right: 0px;
    margin-top: 30px;
    color: #ccc;
    animation: blink 1s infinite;
    margin-right: 30px;
    z-index: 1000;
}

.scroll-arrow2 {
    position: absolute;
    right: 0px;
    margin-top: 30px;
    color: #ccc;
    animation: blink 1s infinite;
    margin-right: 30px;
    z-index: 1000;
    transform: translateY(-50%);
    cursor: pointer;
}

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}

.scroll-arrow.hidden {
    display: none;
}

.scroll-arrow2.hidden {
    display: none;
}


@media only screen and (min-width: 1200px) {
    .shadowbox {
        margin-left: -30px;
    }

    .schrift {
        font-size: 18px;
    }
}



/* ************************************************************************************************************************************************* */


/*
*************************************************************
** Navigation                                               *
*************************************************************
*/
@media (min-width: 992px) {
    .navbar-expand-lg .dropdown:hover > .dropdown-menu {
        display: none;
        animation: none;
    }

    .navbar-expand-lg .dropdown > .dropdown-menu {
        animation: none;
    }

        .navbar-expand-lg .dropdown > .dropdown-menu.show {
            display: block;
        }
}


/*
*************************************************************
** TV Promo                                                 *
*************************************************************
*/

.loader {
    font-size: 10px;
    margin: 50px auto;
    text-indent: -9999em;
    width: 11em;
    height: 11em;
    border-radius: 50%;
    background: #d22730;
    background: -moz-linear-gradient(left, #d22730 10%, rgba(210,39,48, 0) 42%);
    background: -webkit-linear-gradient(left, #d22730 10%, rgba(210,39,48, 0) 42%);
    background: -o-linear-gradient(left, #d22730 10%, rgba(210,39,48, 0) 42%);
    background: -ms-linear-gradient(left, #d22730 10%, rgba(210,39,48, 0) 42%);
    background: linear-gradient(to right, #d22730 10%, rgba(210,39,48, 0) 42%);
    position: relative;
    -webkit-animation: load3 1.4s infinite linear;
    animation: load3 1.4s infinite linear;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

    .loader:before {
        width: 50%;
        height: 50%;
        background: #d22730;
        border-radius: 100% 0 0 0;
        position: absolute;
        top: 0;
        left: 0;
        content: '';
    }

    .loader:after {
        background: #ffffff;
        width: 75%;
        height: 75%;
        border-radius: 50%;
        content: '';
        margin: auto;
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
    }

@-webkit-keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load3 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loadingbar {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -105px; /* Negative half of height. */
    margin-left: -55px; /* Negative half of width. */
    background-color: rgba(255, 255, 255, 0.8);
}

.name2 {
    position: relative;
}

    .name2::after {
        content: "";
        display: block;
        position: absolute;
        bottom: 13px;
        left: 0;
        transform: skewY(-7.5deg);
        width: 100%;
        height: 3px;
        background: #d22630;
    }


.oldprice {
    position: relative;
}

    .oldprice::after {
        content: "";
        display: block;
        position: absolute;
        bottom: 8px;
        left: 0;
        transform: skewY(-7.5deg);
        width: 100%;
        height: 3px;
        background: #d22630;
    }

@media only screen and (max-width: 600px) {
    .flywith-button {
        bottom: 200px;
    }
}


/* *************** CHAT BOT ******************** */

.chat-body-content {
    background-color: red !important;
}

/* **************** CHAT BOT ENDE ************** */


/* **************** SWIPER START *************** */
.swiper-button-disabled:disabled {
    opacity: .2;
}
/* **************** SWIPER Ende **************** */


.lheight {
    line-height: 27px;
}

/* **************** WIDGET-BOXES **************** */

.standard-widget-container {
    color: #4d4d4d;
    padding: 36px 0;
    line-height: 100%;
    clip-path: inset(0 -100vmax);
    font-family: F57;
    font-weight:500;
}

    .standard-widget-container .button {
        cursor: pointer;
        text-decoration: none;
        display: flex;
        align-items: center;
        gap: 12px;
        transition: all 0.2s ease-in-out;
    }

        .standard-widget-container .button:hover {
            gap: 24px;
        }

    .standard-widget-container .dark-btn {
        background: #4d4d4d;
        color: white;
        font-size: 20px;
        border-radius: 10px;
        font-weight: 700;
        height: 48px;
        justify-content: center;
        width: 100%;
        padding: 0 24px;
    }

        .standard-widget-container .dark-btn:hover {
            background: #000000;
            padding-right: 12px !important;
        }

    .standard-widget-container .light-btn {
        border: 1px solid #4d4d4d;
        background: white;
        color: #4d4d4d;
        font-size: 20px;
        border-radius: 10px;
        font-weight: 700;
        height: 48px;
        justify-content: center;
        width: 100%;
        padding: 0 24px;
    }

        .standard-widget-container .light-btn:hover {
            color: #000000;
            border: 1px solid #000000;
            padding-right: 12px !important;
        }

    .standard-widget-container .more-btn {
        font-size: 18px;
        height: unset;
        width: max-content;
        color: #4d4d4d;
        cursor: pointer;
        font-weight: 400;
        margin-right: auto;
    }

        .standard-widget-container .more-btn:hover {
            color: #000000;
            gap: 24px;
        }

    .standard-widget-container .standard-widget-topper h2 {
        font-size: 32px;
        margin: 0;
        font-weight: 700;
    }

    .standard-widget-container .standard-widget-topper.big-header h2 {
        font-size: 40px !important;
    }

    .standard-widget-container .standard-widget-topper p {
        font-size: 20px;
        margin: 0;
        margin-top: 24px !important;
    }

.standard-widget-tabs-mobile-container .standard-widget-tabs-container {
    padding-top: 36px;
    display: flex;
    gap: 24px;
    width: 100%;
    justify-content: center;
}

    .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab {
        max-width: 630px;
        padding: 24px;
        border-radius: 10px;
        background-color: white;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        font-size: 18px;
        flex: 1;
    }

        .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab .standard-widget-image-container {
            width: calc(100% + 48px);
            margin: -24px;
        }

            .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab .standard-widget-image-container img {
                width: 100%;
            }

        .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab h3 {
            font-size: 18px;
            font-weight: bold;
            margin: 0;
        }

/* --- Responsive styles --- */
@media (max-width: 991px) {
    .standard-widget-topper h2 {
        font-size: 24px !important;
    }

    .standard-widget-tabs-mobile-container {
        width: 100vw;
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
    }

        .standard-widget-tabs-mobile-container .standard-widget-tabs-container {
            width: 100%;
            justify-content: unset !important;
            scrollbar-width: none;
            -ms-overflow-style: none;
            overflow-x: scroll;
            scroll-snap-type: x mandatory;
            -webkit-overflow-scrolling: touch;
        }



            .standard-widget-tabs-mobile-container .standard-widget-tabs-container::-webkit-scrollbar {
                display: none;
            }

            .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab {
                width: 80%;
                max-width: unset !important;
                scroll-snap-align: center;
                flex: unset !important;
                flex-shrink: 0 !important;
                padding: 24px 12px;
            }

                .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab .standard-widget-image-container {
                    width: calc(100% + 24px);
                    margin: -12px;
                }

                .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab:first-of-type {
                    margin: 0 0 0 calc((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -1);
                }

                .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab:last-of-type {
                    margin: 0 calc((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -1) 0 0;
                }

                .standard-widget-tabs-mobile-container .standard-widget-tabs-container .standard-widget-tab:only-child {
                    margin: 0 calc((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -1);
                    width: calc(100% - ((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -2));
                    max-width: 630px;
                }
}

/* **************** PRODUCT TAB WIDGET **************** */

.standard-product-tab-container {
    font-family:F57;
    font-weight:500;
    color: #4d4d4d;
    padding: 36px 0;
    line-height: 100%;
    clip-path: inset(0 -100vmax);
}

    .standard-product-tab-container .standard-product-tab-topper h2 {
        font-size: 32px;
        margin: 0;
        font-weight: 700;
    }

    .standard-product-tab-container .standard-product-tab-topper.big-header h2 {
        font-size: 40px !important;
    }

    .standard-product-tab-container .standard-product-tab-topper p {
        font-size: 20px;
        margin: 0;
        margin-top: 36px;
    }

.standard-product-tab-mobile-container {
    width: 100%;
}

    .standard-product-tab-mobile-container .standard-product-tab-downer {
        padding-top: 48px;
        width: 100%;
    }

.standard-product-tab-downer .standard-product-tab-menu-bar-container {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 1px;
}

    .standard-product-tab-downer .standard-product-tab-menu-bar-container::-webkit-scrollbar {
        display: none;
    }

.standard-product-tab-menu-bar-container .standard-product-tab-menu-bar {
    min-width: 100%;
    width: max-content;
    display: flex;
    gap: 36px;
    border-bottom: 1px solid #4b4b4b;
}

.standard-product-tab-menu-bar .standard-product-tab-menu-bar-item {
    font-size: 18px;
    display: flex;
    height: 53px;
    padding: 0 12px 13px 12px;
    gap: 12px;
    align-items: center;
    flex-wrap: nowrap;
    white-space: nowrap;
    flex-shrink: 0;
    margin: 0;
    margin-bottom: -1.5px;
    border-bottom: 4px solid transparent;
    cursor:pointer;
}

    .standard-product-tab-menu-bar .standard-product-tab-menu-bar-item img {
        width: 40px;
    }

.standard-product-tab-downer .standard-product-tab-content-container {
    padding-top: 36px;
    width: 100%;
}

    .standard-product-tab-downer .standard-product-tab-content-container .standard-product-tab-content {
        width: 100%;
        display: none;
        position:relative;
        line-height:normal;
    }
.standard-product-tab-content .badge {
    aspect-ratio: 1 / 1;
    background-color: #d22630;
    font-size: 36px;
    max-width: 120px;
    max-height: 120px;
    font-weight: 700;
    display: flex;
    color white
    align-items: center;
    justify-content: center;
    transform: rotate(15deg);
    position: absolute;
    top: 20px;
    right: 20px;
    border-radius: 50%;
    padding:10px;

}
.standard-product-tab-content .badge .badge-text {
    margin: auto;
    text-align: center;
    white-space: normal;
}


/* --- Responsive styles --- */
@media (max-width: 991px) {
    .standard-product-tab-container {
        padding-top: 24px;
    }

    .standard-product-tab-topper h2 {
        font-size: 24px !important;
    }

    .standard-product-tab-menu-bar-container .standard-product-tab-menu-bar {
        gap: 12px;
        margin: 0 calc((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -1);
    }

    .standard-product-tab-menu-bar .standard-product-tab-menu-bar-item img {
        display: none;
    }

    .standard-product-tab-mobile-container {
        width: 100vw;
        position: relative;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
    }
    .standard-product-tab-downer .standard-product-tab-content-container {
        padding: 0 calc((calc(-1 * (var(--ar-gutter-x) * .5) - 2.5%)) * -1);
        padding-top: 36px;
    }
    }

@-webkit-keyframes tabFadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes tabFadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}