/* OpenSans */

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/open-sans/OpenSans-Light-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/open-sans/OpenSans-Light-webfont.woff') format('woff'), url('../fonts/open-sans/OpenSans-Light-webfont.ttf') format('truetype'), url('../fonts/open-sans/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/open-sans/OpenSans-Regular-webfont.woff') format('woff'), url('../fonts/open-sans/OpenSans-Regular-webfont.ttf') format('truetype'), url('../fonts/open-sans/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/open-sans/OpenSans-Italic-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/open-sans/OpenSans-Italic-webfont.woff') format('woff'), url('../fonts/open-sans/OpenSans-Italic-webfont.ttf') format('truetype'), url('../fonts/open-sans/OpenSans-Italic-webfont.svg#open_sansitalic') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/open-sans/OpenSans-Semibold-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/open-sans/OpenSans-Semibold-webfont.woff') format('woff'), url('../fonts/open-sans/OpenSans-Semibold-webfont.ttf') format('truetype'), url('../fonts/open-sans/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/open-sans/OpenSans-Bold-webfont.eot');
    src: url('../fonts/open-sans/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/open-sans/OpenSans-Bold-webfont.woff') format('woff'), url('../fonts/open-sans/OpenSans-Bold-webfont.ttf') format('truetype'), url('../fonts/open-sans/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
    font-weight: 700;
    font-style: normal;
}

:root {
    --primary-color: #ee7f00;
    --primary-color-transparent-70: rgba(238, 127, 0, 0.7);
    --primary-color-transparent-50: rgba(238, 127, 0, 0.5);
    --primary-color-transparent-30: rgba(238, 127, 0, 0.3);
    --primary-color-transparent-10: rgba(238, 127, 0, 0.10);
    --secondary-color: #ff9933;
    --secondary-color-hover: rgba(255, 153, 51, 0.8);
    --tertiary-color: #555;
    --font-color: #333;
    --headline-color: #555;
    --light-font-color: #999;
    --inactive-color: #ccc;
    --grey-background: #ddd;
    --grey-background-border: #ddd;

    --light-background: #f2f2f2;
    --white-background: #fff;
    --bright-background: #F9F9F9;
    --accent-border-color: #ddd;
    --secondary-button-color: #ddd;
    --secondary-button-color-hover: #e5e5e5;

    --font-family: "Open Sans", Arial, sans-serif;

    --border-radius: 8px;
    --border-radius-checkbox: 4px;
    --box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

    --status-green: #41b96f;
    --status-green-background: rgba(65, 185, 111, 0.5);
    --status-yellow: #ffdd22;
    --status-yellow-background: rgba(255, 221, 34, 0.5);
    --status-yellow-darker: #d5b400;
    --status-orange: #ec731b;
    --status-red: #da1b1c;
    --status-red-background: #fbe7e9;
}

html * {
    font-family: var(--font-family);
    color: var(--font-color);
    hyphens: none;
    font-size: 16px;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    -o-hyphens: none;
    word-break: break-word;
    word-wrap: break-word;
    overflow-wrap: break-word;
    transition: all ease 0.2s;
}

@media (max-width: 930px) {
    html * {
        hyphens: auto;
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
    }
}

body {
    background-color: var(--light-background);
    margin: 0px;
}

.content {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 80px;
}

h1 {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 50px;
    margin: 20px 0px;
    color: var(--tertiary-color);
}

h2 {
    font-family: var(--font-family);
    font-weight: 700;
    font-size: 36px;
    margin: 20px 0px;
    color: var(--headline-color);
}

h3,
.errorText a {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 24px;
    margin: 0px;
}

h4 {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 24px;
    margin: 20px 0px;
    color: var(--primary-color);
}

h5 {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 18px;
    margin: 10px 0px;
}

h6 {
    font-family: var(--font-family);
    font-weight: 600;
    font-size: 16px;
    color: var(--font-color);
    margin: 10px 0px;
}

p {
    font-weight: normal;
    font-size: 16px;
    line-height: 24px;
    color: var(--font-color);
}

a {
    text-decoration-line: none;
    color: var(--primary-color);
}

a:hover {
    color: var(--secondary-color);
}

ul {
    padding: 0 20px;
}

mark {
    background-color: var(--primary-color-transparent-30);
}

table th {
    font-weight: 600;
}

.greyHeadline {
    color: var(--light-font-color);
}

.headlineInvert,
.textInvert {
    color: #fff;
}

.boldText {
    font-weight: 600;
}

#container {
    min-height: calc(100vh - 174px);
    padding-bottom: 55px;
}

.desktopPage,
.inner-page-content {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    width: calc(100% - 60px);
}

.inner-page-content {
    padding: 0 30px;
}

.mainpage .inner-page-content,
.productpage .inner-page-content {
    max-width: none;
    width: 100%;
    padding: 0;
}

.wideDesktopPage {
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}

.hidden {
    display: none;
}

.space {
    border: none;
    margin: 10px 0;
    width: 100%;
}

.space.small {
    margin: 5px 0;
}

.space.big {
    margin: 20px 0;
}

.flex {
    display: flex;
}

.flexAlignCenter {
    align-items: center;
}

.no-margin {
    margin: 0 !important;
}

:focus:not(a),
:focus-visible:not(a) {
    outline: 0;
    box-shadow: 0px 0px 0px 3px var(--primary-color-transparent-30);
}

::-moz-selection {
	background-color: var(--primary-color);
	color: #ffffff;
}

::selection {
	background-color: var(--primary-color);
	color: #ffffff;
}

.dooIcon {
    transition: all ease 0.2s;
}

/* iconfont */

.dooIcon.dooIconSize-10 {
    font-size: 10px;
    -webkit-text-stroke: 0.6px;
}

.dooIcon.dooIconSize-12 {
    font-size: 12px;
    -webkit-text-stroke: 0.5px;
}

.dooIcon.dooIconSize-14 {
    font-size: 14px;
    -webkit-text-stroke: 0.4px;
}

.dooIcon.dooIconSize-16 {
    font-size: 16px;
    -webkit-text-stroke: 0.3px;
}

.dooIcon.dooIconSize-18 {
    font-size: 18px;
    -webkit-text-stroke: 0.3px;
}

.dooIcon.dooIconSize-20 {
    font-size: 20px;
    -webkit-text-stroke: 0.2px;
}

.dooIcon.dooIconSize-22 {
    font-size: 22px;
    -webkit-text-stroke: 0.2px;
}

.dooIcon.dooIconSize-24 {
    font-size: 24px;
    -webkit-text-stroke: 0.1px;
}

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

                Header

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

.inner-header {
    background-color: var(--white-background);
    width: 100%;
    box-shadow: var(--box-shadow);
    display: flex;
    align-items: center;
    position: fixed;
    z-index: 100;
    border-bottom: 3px solid var(--primary-color);
}

#primaryLogo {
    margin: 0 20px;
    width: calc((100% - 1260px) / 2);
    min-width: 200px;
    height: 40px;
}

.inner-header img.logoImg {
    height: 40px;
}

#nav {
    max-width: 1200px;
    width: 1200px;
    min-width: fit-content;
}

.inner-nav {
    display: flex;
    align-items: center;
    padding: 0;
}

/* Wordpress Menu */

#nav .menu-item {
    list-style-type: none;
}

#nav .menu-item a,
.mainNavLink {
    position: relative;
    padding: 20px 30px 23px 35px;
    color: var(--headline-color);
    text-decoration: none;
    vertical-align: middle;
}

#nav .menu-item a:hover,
#nav .mainNavLink:hover {
    color: var(--primary-color);
    text-decoration: none;
}

#nav .menu-item:not(:first-child) a:before,
a.mainNavLink:before {
    background-color: var(--primary-color-transparent-50);
    content: '';
    display: block;
    height: 7px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 7px;
    margin-top: -4px;
    border-radius: var(--border-radius);
}

#nav #menu-main {
    display: flex;
    padding: 0;
}

#nav .menu-item.current-menu-item a {
    font-weight: 600;
    color: var(--primary-color);
}

#nav .menu-item:first-child a {
    padding: 15px 30px 15px 0px;
}

/* Wordpress Submenu */
#nav .menu-item-has-children {
    position: relative;
}

#nav .menu-item-has-children a:hover+.sub-menu,
#nav .sub-menu:hover {
    display: block;
    transition: all 0.5s;
}

#nav .sub-menu {
    display: none;
    position: absolute;
    top: 47px;
    left: 0;
    background-color: #fff;
    padding: 10px 0px;
    margin-left: 5px;
    border-bottom-right-radius: var(--border-radius);
    border-bottom-left-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    transition: all 0.5s;
    width: 100%;
}

#nav .sub-menu .menu-item a {
    padding: 10px 30px;
    display: inline-block;
    /* min-width: max-content; */
    width: -webkit-fill-available;
}

#nav .sub-menu .menu-item a::before {
    content: none;
}

#nav .menu-item-has-children.current-menu-item .sub-menu .menu-item a {
    font-weight: 400;
    color: var(--font-color);
}

#nav .menu-item-has-children.current-menu-item .sub-menu .menu-item a:hover {
    color: var(--primary-color);
}

/* Wordpress Submenu End */

/* Wordpress Menu End */

.header {
    padding-bottom: 64px;
}

.header #headerLinks {
    display: flex;
    justify-content: flex-end;
    height: 64px;
    margin-left: 20px;
    margin-right: 50px;
    width: calc((100% - 1240px) / 2);
    min-width: 200px;
}

.header #headerLinks .mainNavLinkIcon {
    padding: 0px 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.header #headerLinks .navIcon:before {
    font-size: 22px;
    color: var(--tertiary-color);
}

.header #headerLinks .mainNavLinkIcon:hover .navIcon:before {
    color: var(--primary-color);
}

.header #headerLinks .mainNavLinkIcon::before {
    display: none;
}

.header #headerLinks .mainNavLinkIcon.active .navIcon::before,
.header #headerLinks .mainNavLinkIcon.open .navIcon::before {
    color: var(--primary-color);
}

.shoppingCartCount {
    background-color: var(--primary-color);
    color: #fff;
    font-size: 10px;
    line-height: 16px;
    text-align: center;
    height: 15px;
    min-width: 15px;
    border-radius: 15px;
    position: absolute;
    bottom: 15px;
    right: 10px;
}

.header #headerLinks .mainNavLinkIcon:hover .shoppingCartCount {
    background-color: var(--secondary-color);
}

/* Responsive Header */
.menu-icon {
    cursor: pointer;
    display: inline-block;
    padding-left: 20px;
    position: relative;
    user-select: none;
    margin-top: -5px;
    margin-bottom: -5px;
    margin-left: -20px;
}

.menu-icon .navicon {
    background-color: var(--font-color);
    display: block;
    height: 2px;
    position: relative;
    transition: background 0.2s ease-out;
    width: 25px;
}

.menu-icon .navicon:before,
.menu-icon .navicon:after {
    background-color: var(--font-color);
    content: "";
    display: block;
    height: 100%;
    position: absolute;
    transition: all 0.2s ease-out;
    width: 100%;
}

.menu-icon .navicon:before {
    top: 7px;
}

.menu-icon .navicon:after {
    top: -7px;
}

.menu-icon.active .navicon {
    background: transparent;
}

.menu-icon.active .navicon:before {
    transform: rotate(-45deg);
}

.menu-icon.active .navicon:after {
    transform: rotate(45deg);
}

.menu-icon.active .navicon:before,
.menu-icon.active .navicon:after {
    top: 0;
}

html .header #headerLinks .menu-toggle {
    padding-top: 4px;
}

html .header #headerLinks .menu-toggle {
    display: none;
}

/* searchbar -- like new backend searchbar */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
}

.searchbarHeader {
    margin-left: auto;
    position: relative;
    z-index: 9999;
}

html .header #searchbarHeaderButton {
    margin: 0;
    width: 40px;
    height: 40px;
    padding: 0 !important;
    border: 1px solid var(--grey-background-border) !important;
    z-index: 99;
    position: relative;
    border-radius: 100px !important;
    background-color: var(--white-background) !important;
    cursor: pointer;
}

.searchbarHeader.open #searchbarHeaderButton {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.searchbarHeader.open #searchbarHeaderButton * {
    color: #fff;
}

.searchbarHeaderOpen {
    width: 0px;
    position: absolute;
    top: 0;
    right: 50%;
    box-shadow: 0 0 10px 0px transparent;
    border-radius: var(--border-radius);
    transition: all ease 0.3s;
}

.searchbarHeader.open .searchbarHeaderOpen {
    width: 300px;
    height: 40px;
    right: 0;
    border-radius: 100px;
    box-shadow: var(--box-shadow);
}

.searchbarHeader.open .searchbarHeaderOpen:after {
    content: "";
    position: absolute;
    width: calc(100% + 20px);
    height: calc(100% + 20px);
    left: -10px;
    top: -10px;
}

.searchbar {
    position: relative;
    z-index: 1;
}

.searchbarOb3 {
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-right: 20px;
}

.responsiveMenu .searchbarOb3 {
    margin-left: auto;
}

.searchbarDashboard {
    max-width: 800px;
    margin: 0 auto;
}

.searchbarWrapper {
    background-color: var(--grey-background);
    padding: 30px 0px;
}

.searchbarInner {
    display: flex;
    align-items: stretch;
}

.searchbarInputWrapper {
    position: relative;
    flex: 1;
}

.pageColumnHeader .ob3NewButton,
.pageBreadcrumbs,
#searchbarInput {
    min-height: 36px;
}

#searchbarInput {
    padding-top: 0;
    padding-bottom: 0;
    padding-left: 45px;
    padding-right: 0;
    transition: all ease 0.2s;
    border: 1px solid var(--grey-background-border);
    border-radius: 100px;
    min-height: 40px;
    appearance: none;
    cursor: text;
    font-size: 16px;
}

.searchbarHeader #searchbarInput {
    padding-left: 0px;
    width: 0;
}

.searchbarHeader #searchbarInput::placeholder {
    color: var(--light-font-color);
}

.searchbarHeader.open #searchbarInput {
    padding-left: 15px;
}

.open #searchbarInput {
    padding-right: 80px;
    width: 100%;
}

.searchbar #searchbarDelete,
.searchbar #searchbarButton {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.searchbar #searchbarDelete {
    right: 0;
}

.searchbarHeader.open .searchbar #searchbarDelete {
    right: 40px;
}

.searchbar #searchbarButton {
    left: 0;
}

.searchbar #searchbarDelete,
.searchbarHeader .searchbar #searchbarDelete.active {
    opacity: 0;
    pointer-events: none;
}

.searchbar #searchbarDelete.active,
.searchbarHeader.open .searchbar #searchbarDelete.active {
    opacity: 1;
    pointer-events: all;
}

.searchbarHeader #searchbarHeaderButton .dooIcon {
    color: var(--primary-color);
}

.searchbarHeader.open #searchbarHeaderButton .dooIcon {
    color: #fff;
}

.searchbarHeaderResults {
    padding: 0px 15px;
    background-color: var(--white-background);
    box-shadow: var(--box-shadow);
    border-radius: var(--border-radius);
    margin-top: 5px;
    width: calc(300px - 30px);
    opacity: 0;
    display: none;
}

.searchbarHeader.open .searchbarHeaderOpen .searchbarHeaderResults {
    opacity: 1;
}

.searchResultRow {
    padding: 10px 0px;
    display: block;
    color: var(--font-color);
    display: none;
}

.searchResultRow {
    border-bottom: 1px solid var(--grey-background-border);
}

.searchResultRow.no-results {
    font-style: italic;
    color: var(--light-font-color);
}

.searchResultRow.lastResult {
    border-bottom: none;
}

.searchbarHeaderOverlay,
.searchbarHeaderOverlay.active {
    display: none;
}

/* dropdown */
.accountUserDropdown {
    position: absolute;
    top: 0;
    background-color: var(--white-background);
    width: 280px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    margin-top: 64px;
    cursor: default;
    visibility: hidden;
    transform: translateY(-10%);
    opacity: 0;
    transition: all ease 0.3s;
}

.accountUserDropdown.active {
    visibility: visible;
    transform: translateY(0);
    z-index: 99;
    pointer-events: all;
    opacity: 1;
}

.accountUserDropdown p {
    margin: 0;
    font-size: 16px;
}

.accountUserDropdown .userDropdownHeader,
.accountUserDropdown .userDropdownContent {
    display: flex;
    align-items: center;

}

.accountUserDropdown .userDropdownHeader {
    border-bottom: 1px solid var(--grey-background-border);
    padding: 15px 20px;
    gap: 15px;
}

.accountUserDropdown .userDropdownContent {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 0;
}

.accountUserDropdown .userDropdownProfile {
    border-radius: 100%;
    background-color: var(--light-background);
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    color: var(--light-font-color);
}

.accountUserDropdown .userDropdownLink {
    display: flex;
    gap: 10px;
    align-items: center;
    width: 100%;
    cursor: pointer;
    padding: 10px 20px;
}

.accountUserDropdown .userDropdownLink:hover * {
    color: var(--primary-color);
}

.userDropdownProfile .avatar {
    border-radius: 100%;
    margin-top: 3px;
}


/* responsive nav*/
@media screen and (max-width:1050px) {
    html .header #headerLinks .menu-toggle {
        display: flex;
    }

    .header #headerLinks {
        margin-right: 10px;
        margin-left: 0;
        width: auto;
    }

    .inner-header {
        justify-content: space-between;
    }

    #nav {
        position: absolute;
        top: 64px;
        background-color: var(--white-background);
        border-top: 1px solid var(--accent-border-color);
        width: 100%;
        transform: translateY(-10%);
        opacity: 0;
        visibility: hidden;
        border-radius: 0 0 var(--border-radius) var(--border-radius);
    }

    #nav.open {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
    }

    .inner-nav {
        flex-direction: column;
        align-items: flex-start;
    }

    .menu-main-menu-container {
        width: 100%;
    }

    a.mainNavLink:before,
    html #nav .menu-item a:before,
    #nav .menu-item:not(:first-child) a:before {
        display: none;
    }

    .mainNavLink,
    a.mainNavLink:first-child,
    #nav .menu-item a,
    #nav .menu-item:first-child a {
        padding: 15px 30px;
        font-size: 18px;
        display: block;
    }

    .menu-main-container {
        width: 100%;
    }

    .menu-item {
        width: 100%;
    }

    #nav #menu-main {
        margin: 0;
    }

    #nav .sub-menu {
        display: block;
        margin: 0;
        position: static;
        box-shadow: none;
        padding: 0px 30px 0 60px;
    }

    #nav .sub-menu .menu-item a::before {
        background-color: var(--primary-color-transparent-50);
        content: '';
        display: block;
        height: 7px;
        left: 0;
        position: absolute;
        top: 50%;
        width: 7px;
        margin-top: -4px;
        border-radius: var(--border-radius);
    }

    .searchbarHeader {
        position: static;
    }

    .searchbarHeader.open .searchbarHeaderOpen {
        top: 80px;
        right: 0;
        width: calc(100% - 40px);
        margin: 0 20px;
    }

    .mainNavLinkIcon.searchContainer {
        order: 1;
    }

    .mainNavLinkIcon.menu-toggle {
        order: 2;
    }

    .searchbarHeaderOverlay.active,
    .searchbarHeaderOverlay.nav {
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        height: 100vh;
        z-index: 99;
        background-color: rgba(0, 0, 0, 0.3);
        display: block;
    }

    .searchbarHeaderResults {
        width: calc(100% - 30px);
    }

    .searchbarHeader.open .searchbar #searchbarDelete {
        right: 5px;
    }

    .searchbarHeader #searchbarInput {
        border: 0;
    }

    html .productTimetable .tableBody .tableCell {
        display: block;
        padding: 10px 20px 0 20px;
    }

    .productTimetable .tableBody .tableRow {
        position: relative;
    }

    .productTimetable .tableBody .tableRow td:last-child {
        position: absolute;
        top: 0;
        right: 0;
    }

}

@media screen and (max-width:600px) {

    /* .inner-header img.logoImg {
    	height: 25px;
	} */
    #primaryLogo,
    #headerLinks {
        width: auto;
        min-width: auto;
    }

    .header #headerLinks .mainNavLinkIcon {
        padding: 0px 10px;
    }

    html .header #headerLinks .menu-toggle {
        padding: 0px 10px;
    }

    .shoppingCartCount {
        right: 8px;
    }
}

@media screen and (max-width:480px) {
    /* .inner-header img.logoImg {
    	height: 22px;
	} */
}

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

                Footer

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

.otgs-development-site-front-end {
    display: none;
}


#footer {
    background-color: var(--tertiary-color);
    position: absolute;
    width: 100%;
}

#footer p,
#footer a {
    color: #fff;
    margin: 0;
}

#footer a {
    margin: 0px 10px;
    text-decoration-line: none;
}

.footerContent {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: 100%;
}

.footerContentLeft {
    display: flex;
    gap: 30px;
    align-items: center;
}

#footer .footerContentLeft a {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 6px;
}

#footer .footerContentLeft a:hover {
    text-decoration: underline;
}

.footerContentLeft a .dooIcon {
    color: #fff;
    -webkit-text-stroke: 0;
}

#footerContentWrapper {
    width: 100%;
    min-width: fit-content;
    display: flex;
    justify-content: space-between;
    margin: 0 30px;
    gap: 30px;
}

.footerEndLinks .inner-footer {
    display: flex;
}

.footerEndLinks .inner-footer li {
    list-style-type: none;
}

.footerEndLinks .inner-footer li:hover a {
    text-decoration-line: underline;
}

#footer .menu-item {
    min-width: fit-content;
}

.footerEndLinks ul {
    padding-right: 0;
}

.footerEndLinks li:last-child a {
    margin-right: 0 !important;
}



@media (max-width:767px){

    .footerContentLeft {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
    
    .footerContent {
        padding: 20px 0;
    }
    
    .footerEndLinks .inner-footer {
        flex-direction: column;
        gap: 20px;
        margin-top: 5px;
    }
    
    #footer .menu-item {
        text-align: right;
    }

}

@media (max-width:520px){

    #footerContentWrapper {
        flex-direction: column;
        gap: 15px;
    }
    
    #footer .menu-item {
        text-align: left;
    }
    
    .footerEndLinks .inner-footer {
        padding: 0;
        gap: 15px;
    }
    
    #footer a {
        margin: 0;
    }

}

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

                Buttons

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

.themeButton {
    transition: all ease 0.2s;
    padding: 16px 32px;
    border-radius: var(--border-radius);
    border: none;
    font-size: 16px;
    /* margin-top: 10px; */
    box-shadow: var(--box-shadow);
    position: relative;
    cursor: pointer;
    font-weight: 600;
}

.themeButton.disabled {
    pointer-events: none;
    opacity: 0.5;
}

.primaryButton {
    background-color: var(--primary-color);
    color: #fff;
}

.primaryButton:hover {
    background-color: var(--secondary-color);
    color: #fff;
}

.primaryButton.inactive {
    background-color: var(--inactive-color);
    cursor: not-allowed;
    pointer-events: none;
}

.arrowButton {
    padding: 16px 60px 16px 32px;
}

.arrowButton .icon-arrow_right {
    right: 25px;
    position: absolute;
}

.arrowButton:hover .icon-arrow_right {
    right: 20px;
}

.arrowButton span.icon-arrow_right:before {
    color: #fff;
}

.iconButton {
    background-color: transparent;
    border: 1px solid #fff;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
}

.iconButton:hover {
    background-color: #fff;
}

.iconButton:hover *:before {
    color: var(--primary-color);
}

.buttonMarginLeft {
    margin-left: 20px;
}

.secondaryButton {
    background-color: var(--tertiary-color);
    color: #fff;
    box-shadow: none;
}

.secondaryButton:hover {
    background-color: var(--font-color);
    opacity: 0.7;
}

.secondaryButton.inactive {
    background-color: none;
    cursor: not-allowed;
    opacity: 0.3;
}

.tertiaryButton {
    background-color: var(--white-background);
    color: var(--primary-color);
}

.tertiaryButton:hover {
    background-color: var(--light-background);
}

.arrowButtonBack .dooIconContainer {
    transform: rotate(180deg);
    position: absolute;
    left: 20px;
    top: 14px;
}

.arrowButtonBack:hover .dooIconContainer {
    left: 15px;
}

.arrowButtonBack .dooIcon::before {
    color: var(--primary-color);
}

.arrowButtonBack {
    padding: 16px 32px 16px 52px;
    position: relative;
}

.arrowButtonBack span {
    display: inline-block;
}

.arrowButtonBack .icon-arrow_right:before {
    display: inline-block;
    transform: rotate(180deg);
    color: var(--primary-color);
    margin-right: 10px;
}

.themeButton.fullWidth {
    width: 100%;
}

.smallButton {
    padding: 8px 16px;
    height: auto;
    min-height: auto;
}

.buttonText.lightColor,
.buttonText.lightColor * {
    color: var(--font-color);
}

.buttonText:hover {
    background-color: transparent;
    color: var(--secondary-color);
}

.buttonText:hover * {
    color: var(--secondary-color);
}

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

                Startpage

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

.startpage {
    background-color: var(--light-background);
}

.lightSection {
    background-color: var(--white-background);
}

/* header */

.startHeader {
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('https://shop.doodev.de/wp-content/uploads/2024/01/Headerbild_v2.jpg');
    background-color: #f2f2f2;
    padding: 130px 0;
}

.headerImageContainer {
    background-repeat: no-repeat;
    background-position: right;
    background-size: cover;
}

.headerTextStart {
    max-width: 1200px;
    margin: auto;
    padding: 0 30px;
}

.bigHeaderText {
    font-size: 80px;
    max-width: 1100px;
}

.startSectionWrapper {
    display: flex;
    max-width: 1200px;
    margin: auto;
    padding: 130px 30px;
    gap: 70px;
}

.startTextWrapper {
    flex: 2;
    min-width: 300px;
}

.startTextWrapper .themeButton {
    margin-top: 20px;
    display: inline-block;
}

.subheadlineOrange {
    margin-top: -20px;
    margin-bottom: 50px;
}

.startIllustrationWrapper {
    background-image: url(https://shop.doodev.de/wp-content/uploads/2024/01/coming-soon-1-1.svg);
    flex: 1;
    height: 400px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

button[class^="icon-"]:before,
button[class*=" icon-"]:before {
    font-family: "dooiconfont";
    font-style: normal;
    font-weight: normal;
    color: #fff;
    font-size: 18px;
    margin-right: 0.2em;
}

span[class^="icon-"]:before,
span[class*=" icon-"]:before {
    font-family: "dooiconfont";
    font-style: normal;
    font-weight: normal;
    color: var(--primary-color);
}

.arrowButton .icon-arrow_right {
    right: 25px;
    position: absolute;
}

.icon-arrow_right:before {
    content: '\e943';
}

.icon-arrow-right:before {
    content: '\E801';
}

.page-template-startpage #container {
    padding-bottom: 0;
    /* Abstand nach Unten - nur setzen wenn zweiter Contentbereich leer */
}

/* slider section */
.startSectionSlider {
    max-width: 1200px;
    width: calc(100% - 60px);
    margin: auto;
    padding: 130px 30px;
}

html .swiper-container {
    overflow: visible;
}

.swiper-slide {
    background-color: #fff;
}

html .swiper {
    width: 100%;
    position: static;
    padding: 25px 0;
    overflow: hidden;
}

html .swiper-slide {
    height: auto;
    margin-bottom: 0;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.swiper-container .elearning-item {
    height: 100%;
    display: flex;
    flex-direction: column;
}

html .swiper-button-next.swiper-button-disabled,
html .swiper-button-prev.swiper-button-disabled {
    opacity: 0;
}

html .swiper-button-prev,
html .swiper-button-next {
    width: 50px;
    height: calc(100% + 50px);
    background: transparent;
    transition: all ease 0.3s;
    top: -25px;
    margin-top: 0;
    outline: 0;
}

html .swiper-button-prev,
html .swiper-button-prev:hover {
    left: auto;
    right: calc(100% - 10px);
    justify-content: flex-start;
    padding-left: 15px;
}

html .swiper-button-next,
html .swiper-button-next:hover {
    left: calc(100% - 10px);
    justify-content: flex-end;
    padding-right: 15px;
}

html .swiper-button-prev:before,
html .swiper-button-next:before {
    content: "";
    width: 25px;
    height: 25px;
    border-width: 4px 4px 0 0;
    border-style: solid;
    border-color: var(--primary-color);
    transition: all ease 0.2s;
    display: block;
    transform-origin: 50%;
    transform: rotate(45deg);
    margin-left: -15px;
    border-radius: 1px;
    pointer-events: none;
}

html .swiper-button-prev:before {
    margin-left: 0;
    margin-right: -15px;
    transform: rotate(225deg);
    z-index: 9;
}

html .swiper-button-next:before {
    transform: rotate(45deg);
    z-index: 9;
}

html .swiper {
    display: flex;
    align-items: center;
}

html .swiper-button-prev:after,
html .swiper-button-next:after {
    content: "";
    display: block;
    justify-content: flex-start;
    position: absolute;
    top: 5px;
    bottom: 0;
    width: 60px;
    pointer-events: none;
    transition: all ease 0.3s;
}

html .swiper-button-prev:after {
    left: 25px;
    background: linear-gradient(90deg, var(--light-background) 20%, rgba(242, 242, 242, 0) 100%);
}

html .swiper-button-next:after {
    right: 25px;
    background: linear-gradient(-90deg, var(--light-background) 20%, rgba(242, 242, 242, 0) 100%);
}

html .swiper-button-next.swiper-button-disabled,
html .swiper-button-prev.swiper-button-disabled {
    opacity: 0;
    pointer-events: none;
}

html .swiper-button-prev:hover:after,
html .swiper-button-next:hover:after {
    width: 100px;
}


/* contact section */

.startContactWrapper {
    display: flex;
    align-items: center;
    gap: 30px;
    max-width: 1200px;
    margin: auto;
    padding: 130px 30px;
    /* margin-bottom: 100px; */
    flex-wrap: wrap;
}

.startContactInformation,
.startContactText {
    background-color: #fff;
    padding: 20px 40px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.startContactInformation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    flex: 1;
}

.startContactInformation,
.startContactText {
    flex: 1;
}

.startContactHeadline {
    margin-top: 10px;
}

.startContactInformationPicture {
    background-image: url(https://shop.doodev.de/wp-content/uploads/2024/01/Mitarbeiterfoto_Andreas_Herting_quadratisch.png);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: var(--border-radius);
    flex: 1;
    /* padding: 110px; */
    height: 200px;
    background-position: center;
}

.startContactInformation {
    max-width: 450px;
}

.contactName {
    text-transform: uppercase;
    color: #919191;
    margin-bottom: 0px;
}

.contactPosition {
    margin-top: 0px;
    margin-bottom: 30px;
}

.contactPhone,
.contactMail {
    white-space: nowrap;
}

.contactPhone *,
.contactMail * {
    color: var(--font-color);
}





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

                Trainings

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

.headerTextWrapper {
    margin: 80px 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.trainingTable {
    margin: 0px auto;
}

/* course cards */

.catalog-elearning-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0px -20px;
}

.catalog-elearning-wrapper .elearning-item {
    width: calc(25% - 40px);
    margin: 20px;
    display: flex;
    flex-direction: column;
    box-shadow: var(--box-shadow);
    background-color: var(--white-background);
    border-radius: var(--border-radius);
    outline: 1px solid transparent;
    cursor: pointer;
    position: relative;
}

.catalog-elearning-wrapper .elearning-item:hover {
    outline: 1px solid var(--primary-color);
}

.catalog-elearning-wrapper .filter-no-results {
    display: none;
}

.catalog-item .cardPictureRatio {
    position: relative;
    width: 100%;
    height: auto;
    background-color: #f2f2f2;
    overflow: hidden;
    padding-top: 71.43%;
    border-radius: var(--border-radius) var(--border-radius) 0 0;
}

.catalog-item .catalog-image {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 1;
    background-image: url(../img/placeholder.jpg);
}

.catalog-item .catalog-teaser {
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 21px;
}

.catalog-information {
    margin-bottom: 20px;
    margin-top: 15px;
}

.catalog-item .catalog-appointment {
    padding: 20px;
}

.catalog-information,
.catalog-teaser {
    padding: 0px 20px;
}

.catalog-item-title {
    margin: 0;
    color: var(--font-color);
}

.catalog-item-sub-headline,
.catalog-item-sub-headline * {
    color: var(--light-font-color);
    margin: 0;
    margin-bottom: 5px;
    font-size: 14px;
    font-weight: 400;
}

.catalog-price {
    font-weight: bold;
}

.catalog-item .catalog-price {
    float: right;
}

.catalog-item .catalog-price,
.catalog-item .catalog-language {
    color: var(--tertiary-color);
}

.catalog-item .catalog-footer {
    margin-top: auto;
    padding: 20px 20px 15px 20px;
}

.catalog-footer .primaryButton {
    width: 100%;
    text-align: left;
}

.inverseDarkWrapper .innerSection {
    align-items: center;
}

.externalLink .headlineInvert {
    margin-top: 0;
}

@media (max-width: 1500px) {
    .catalog-elearning-wrapper .elearning-item {
        width: calc(33% - 40px);
    }
}

@media (max-width: 979px) {
    .catalog-elearning-wrapper .elearning-item {
        width: calc(50% - 40px);
    }
}

@media (max-width: 580px) {
    .catalog-elearning-wrapper .elearning-item {
        width: calc(100% - 40px);
    }
}


/* catalog filter */


.filterBox {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    background-color: #fff;
    box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.2);
    z-index: 110;
    min-width: 300px;
    transform: translateX(-110%);
    visibility: hidden;
    transition: all ease 0.5s;
}

.filterContentContent {
    max-height: calc(100vh - 77px);
    overflow: auto;
}

.filterBox.active {
    transform: translateX(0);
    visibility: visible;
}

.filterHeader {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #ddd;
}

.filterHeader h2,
.filterHeader .closeFilter {
    padding: 11.5px 20px;
    margin: 0;
}

.buttonText,
.buttonText * {
    color: var(--primary-color);
}

.buttonText {
    background: none;
    border: 0;
    cursor: pointer;
    border-radius: var(--border-radius);
    box-shadow: none;
}

.buttonText .buttonContent {
    display: inline-block;
    border-radius: var(--border-radius);
    border: 2px solid transparent;
    transition: all ease 0.2s;
}

.hauptKlassifikationHead .open {
    display: none;
}

.filterContent {
    border-bottom: 1px solid #ddd;
    padding: 10px 20px;
}


.FilterUnterpunkte .filterContent {
    border-bottom: 0;
    padding: 10px 0px;
}


.hauptKlassifikationHead .open {
    display: none;
}

.filterContent {
    border-bottom: 1px solid #ddd;
    padding: 10px 20px;
}


.FilterUnterpunkte .filterContent {
    border-bottom: 0;
}

h3.hkText {
    margin-bottom: 10px;
}

.filter {
    margin-top: 5px;
    color: #333;
    font-weight: 400;
    transition: all ease 0.2s;
    display: block;
    padding: 5px 10px;
    border-radius: var(--border-radius);
    transition: all ease 0.2s;
    -webkit-border-radius: var(--border-radius);
    -moz-border-radius: var(--border-radius);
    -ms-border-radius: var(--border-radius);
    -o-border-radius: var(--border-radius);
    -webkit-transition: all ease 0.2s;
    -moz-transition: all ease 0.2s;
    -ms-transition: all ease 0.2s;
    -o-transition: all ease 0.2s;
}

.filter:first-child {
    margin-top: 0px;
}

.filter.active {
    background-color: var(--primary-color);
}

.filter.active,
.filter.active * {
    color: #fff;
}

.filter .deleteFilter {
    visibility: hidden;
    opacity: 0;
    margin-right: 5px;
}

.filter.active .deleteFilter {
    visibility: visible;
    opacity: 1;
}

div#catalogPageFilter {
    margin-bottom: 20px;
}

.button.white.small.filterDelete span {
    margin-left: 5px;
}

/* filter show hide */


.catalog-courses-wrapper.activeFilter .catalog-item.showFilter,
.catalog-courses-wrapper.activeTextFilter .catalog-item.showFilterText,
.catalog-courses-wrapper.activeFilter.activeTextFilter .catalog-item.showFilter.showFilterText {
    display: flex;
}

.catalog-courses-wrapper.activeFilter .catalog-item,
.catalog-courses-wrapper.activeTextFilter .catalog-item,
.catalog-courses-wrapper.activeFilter.activeTextFilter .catalog-item {
    display: none;
}

/*
.catalog-courses-wrapper.activeFilter.activeTextFilter .catalog-item {
    display: none;
}
.catalog-courses-wrapper.activeFilter.activeTextFilter .catalog-item.showFilter.showFilterText {
    display: block;
}*/


/** buttons **/

.button,
.button *,
.buttonText,
.buttonText * {
    font-weight: 600;
    transition: all ease 0.2s;
}

.button {
    background-color: #ddd;
    border: 0;
    cursor: pointer;
    border-radius: var(--border-radius);
    padding: 8px 20px;
    margin-right: 10px;
    margin-top: 10px;
    font-size: 16px;
}

.button,
.button * {
    color: #fff;
}

.button.small {
    padding: 8px 16px;
}

.button.primary {
    background-color: var(--primary-color);
}

.button.primary:hover {
    background-color: var(--secondary-color);
}

.button.white {
    background-color: #fff;
    box-shadow: var(--box-shadow);
}

.button.white,
.button.white * {
    color: #333;
}

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

                Contact Wrapper

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

.contactWrapper {
    width: 500px;
    max-width: calc(100% - 120px);
    box-sizing: border-box;
    background-color: var(--white-background);
    padding: 20px 20px 20px 30px;
    box-shadow: var(--box-shadow);
    margin: 50px auto;
    display: flex;
    justify-content: space-between;
    border-radius: var(--border-radius);
}

.contactWrapper .contactTitle {
    font-size: 24px;
}

.contactWrapper .dooIconContainer {
    margin-right: 10px;
}

.icon_primary:before {
    color: var(--primary-color);
}

.contactWrapper a,
.contactWrapper .dooIconContainer {
    display: flex;
    align-items: center;
}

.contactTextWrapper p:last-child {
    margin-bottom: 0;
}

.contactImgWrapper {
    width: 180px;
    height: 180px;
}

.contactImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background-color: #f2f2f2;
    border-radius: var(--border-radius);
}

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

               Event Overview Page

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

.eventOverviewTable .singleEvent,
#seminarCustomRequest.cardAnimation,
#seminarCustomRequestPage.cardAnimation {
    background-color: var(--white-background);
    box-shadow: var(--box-shadow);
    display: flex;
    justify-content: left;
    margin: 15px 0;
    position: relative;
    border-radius: var(--border-radius);

}

.eventOverviewTable .singleEvent.highlighted {
    outline: 1px solid var(--primary-color);
}

.openCustomRequest {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.eventOverviewTable .singleEventColor {
    width: 8px;
    min-height: 100%;
    border-radius: var(--border-radius) 0 0 var(--border-radius);
}

.eventOverviewTable .eventIsUnavailable .singleEventColor {
    background-color: var(--status-red);
}

.eventOverviewTable .eventIsLowAvailable .singleEventColor {
    background-color: var(--status-orange);
}

.eventOverviewTable .eventIsAvailable .singleEventColor {
    background-color: var(--status-green);
}

.eventOverviewTable .singleEventContent {
    width: 100%;
}

/* .eventOverviewTable .singleEventContentInner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 0 0 25px;
    width: calc(100% - 24px);
}

.eventOverviewTable .singleEventContentInnerActive {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px;
    width: calc(100% - 30px);
    box-shadow: inset 0px 4px 10px rgba(0, 0, 0, 0.1);
    border-radius: 0 0 var(--border-radius) 0;
} */

.eventOverviewTable .singleEventContentInner,
.eventOverviewTable .singleEventContentInnerActive {
    display: flex;
    justify-content: space-between;
	align-items: center;
	padding-left: 30px;
    width: calc(100% - 29px);
}

.eventOverviewTable .singleEventContentInnerActive {
    box-shadow: inset 0px 4px 10px rgba(0,0,0,0.1);
    width: calc(100% - 30px);
    border-radius: 0 0 var(--border-radius) 0;
}

.eventOverviewTable .toggleAdditionalEventInfo {
    display: none;
    z-index: 2;
    position: relative;
    background-color: var(--white-background);
    border-radius: var(--border-radius);
}

.allEventsResponsive {
    display: none;
}

.singleEventResponsive {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
}

.singleEventResponsive .additionalEventText,
.singleEventResponsive .additionalEventLocation {
    margin: 0;
}

.additionalEventText,
.additionalEventLocation {
    margin: 5px 0;
}

.additionalEventText {
    display: flex;
    gap: 20px;
    white-space: nowrap;
}

.additionalEventLocationText {
    margin: 5px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

.additionalEventTimezoneText {
    margin: 5px 0 5px 20px;
}

.additionalEventTimeText {
    white-space: nowrap;
}

.eventOverviewTable .singleEventDate {
    width: 22%;
    min-width: 22%;
    margin: 10px 0px;
}

.eventOverviewTable .singleEventProduct {
    width: 23%;
    min-width: 23%;
    padding: 10px 5px 10px 0px;
}

.eventOverviewTable .singleEventLocation {
    width: 15%;
}

.eventOverviewTable .singleEventLanguage {
    width: 5%;
}

.eventOverviewTable .singleEventTimezone {
    width: 20%;
}

.singleEventLanguage {
    text-transform: uppercase;
}

.eventOverviewTable .singleEventPrice {
    width: 10%;
}

.eventOverviewTable .tableCell.lastRow {
    width: 15%;
}

.eventOverviewTable .singleEventStatus {
    width: 15%;
    display: flex;
    align-items: center;
    padding-right: 5px;
}

.eventOverviewTable .singleEventAdditional {
    width: 18%;
    color: var(--inactive-color);
    font-style: italic;
}

.dateLocationWrapper {
    display: flex;
    align-items: center;
    gap: 20px;
}

.eventOverviewTable .singleEventButtonLink {
    padding: 15px 30px 15px 30px;
    margin-left: 10px;
    border-radius: var(--border-radius);
    display: flex;
    align-items: center;
    gap: 10px;
}

.eventOverviewTable .singleEventButtonText {
    color: #fff;
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
}

.eventOverviewTable .singleEvent:hover .singleEventContentInner .singleEventButtonLink {
    background-color: var(--primary-color);
}

.eventOverviewTable .toggleAdditionalEventInfo .singleEventButtonLink {
    visibility: hidden;
}

.eventOverviewTable .singleEvent:hover .singleEventButtonLink .dooIcon::before {
    color: #fff;
}

.singleEventHandle {
    cursor: pointer;
}

.availableCircle {
    width: 15px;
    height: 15px;
    min-width: 15px;
    border-radius: 15px;
    margin-right: 10px;
}

.singleEventStatus .availableCircle {
    box-sizing: border-box;
}

.singleEventStatus .availableCircle.eventIsAvailable {
    border: 2px solid var(--status-green);
}

.singleEventStatus .availableCircle.eventIsLowAvailable {
    border: 2px solid var(--status-orange);
}

.singleEventStatus .availableCircle.eventIsUnavailable {
    border: 2px solid var(--status-red);
}

.eventOverviewTable .singleEvent.eventIsUnavailable .singleEventButtonLink {
    cursor: not-allowed;
}

.eventOverviewTable .singleEvent.eventIsUnavailable .singleEventButtonLink .dooIcon-arrow_right::before {
    color: var(--inactive-color);
}

.eventOverviewTable .eventFilter {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
    flex-wrap: wrap;
    gap: 20px;
}

.eventOverviewTable .singleEventHandle .dooIcon-arrow-down::before {
    font-size: 14px;
    font-weight: bold;
    padding-left: 5px;
    transition: all ease 0.2s;
}

.eventOverviewTable .singleEventHandle .dooIcon-arrow-down.active::before {
    transform: rotate(180deg);
    transform-origin: 12px;
}


/* custom dropdown select */

.customSelect {
    position: relative;
    min-width: 30%;
    margin-right: 20px;
}

.customSelect::before {
    content: "\e856";
    font-family: "dooiconfont";
    color: #fff;
    font-size: 20px;
    pointer-events: none;
    position: absolute;
    right: 0px;
    top: 0px;
    line-height: 50px;
    text-align: center;
    background-color: var(--primary-color);
    height: 50px;
    width: 50px;
    z-index: 15;
    border-radius: 0 var(--border-radius) var(--border-radius) 0;
}

.customSelect .custom-select-list .selectContainer {
    background-color: #fff;
    box-shadow: var(--box-shadow);
    color: var(--font-color);
    cursor: pointer;
    font-size: 16px;
    line-height: 50px;
    height: 50px;
    padding-left: 20px;
    width: calc(100% - 115px);
    max-width: 400px;
    padding-right: 95px;
    z-index: 5;
    position: relative;
    border-radius: var(--border-radius);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.customSelect .customSelectList {
    position: absolute;
    box-shadow: var(--box-shadow);
    background: white;
    margin-top: -5px;
    padding: 0;
    width: calc(100% - 50px);
    z-index: 1;
    display: none;
    border-radius: 0 0 var(--border-radius) var(--border-radius);
}

.customSelect .customSelectList li {
    padding: 5px;
    cursor: pointer;
    background-color: var(--white-background);
    padding: 10px 20px;
    list-style-type: none;
}

.customSelect .customSelectList li:hover {
    background-color: var(--primary-color-transparent-10);
    color: var(--primary-color);
}

.customSelect .customSelectList li:last-child {
    border-radius: 0 0 var(--border-radius) var(--border-radius);
}

.customSelect .customSelectList li:first-child {
    padding-top: 15px;
}

.customSelect li.selected {
    display: none;
}

html .customSelect button.deleteFilter {
    position: absolute;
    right: 50px;
    top: 0;
    height: 50px;
    width: 50px;
    background: none;
    border: none;
    display: none;
    cursor: pointer;
    z-index: 8;
}

.customSelect button.deleteFilter .icon-cancel:before {
    color: var(--font-color);
}

.customSelect button.deleteFilter:hover .icon-cancel:before {
    color: var(--light-font-color);
}

.customSelect.active:hover .deleteFilter,
.customSelect.active .deleteFilter {
    display: block;
}

.customSelect:first-child .selectContainer {
    z-index: 12;
}

.customSelect:first-child .customSelectList {
    z-index: 10;
}

.customSelect:first-child .deleteFilter {
    z-index: 12;
}

/* custom checkbox */
.customCheckbox input[type="checkbox"] {
    position: absolute;
    cursor: pointer;
    opacity: 0;
    margin-left: 0;
    margin-right: 10px;
}

.customCheckbox input[type="checkbox"]+span {
    background: #fff;
    content: "";
    display: inline-block;
    margin: 0 12px 0 0;
    padding: 0;
    vertical-align: middle;
    width: 22px;
    height: 22px;
    min-width: 22px;
    border: 1px solid transparent;
    box-sizing: content-box;
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    transition: background ease 0.2s, box-shadow ease 0.2s;
    box-shadow: var(--box-shadow);
    border-radius: var(--border-radius-checkbox);
}

.customCheckbox input[type="checkbox"]+span::after {
    content: "";
    display: block;
    width: 5px;
    height: 10px;
    margin-left: 7px;
    margin-top: 3px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    box-sizing: content-box;
    transform: rotate(45deg) scale(0);
    transition: transform 0.2s;
}

.customCheckbox input[type="checkbox"]:checked+span {
    background-color: var(--primary-color);
}

.customCheckbox input[type="checkbox"]:checked+span::after {
    transform: rotate(45deg) scale(1);
}

.customCheckbox .bigCustomLabel {
    display: flex;
    align-items: center;
    cursor: pointer;
}

html .woocommerce-checkout .woocommerce form .form-row label.checkbox {
    align-items: center;
}

html .woocommerce-checkout .woocommerce form .form-row label.checkbox span.customCheckoutBox {
    margin-bottom: 5px;
}

html .woocommerce-checkout .woocommerce td.product-name dl.variation {
    width: 100%;
}

html .woocommerce-checkout .woocommerce .cart_item .product-quantity {
    min-width: fit-content;
}

html .woocommerce-checkout .woocommerce .product-total {
    word-break: auto-phrase;
}

.woocommerce-checkout th.product-total {
    text-align: end;
}

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

               Single Product Page

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

/* product page */
.productRightBoxInner span {
    white-space: break-spaces;
}

.customSingleProductPage,
.inner-page-content.participant-registration {
    padding-top: 30px;
}

h1.singleProductHeadline {
    margin-top: 0;
}

.singleProductHeadlineWrapper.mobile {
    display: none;
    flex: 1;
}

.productBackButton {
    top: 0px;
    z-index: 99;
    margin-bottom: 40px;
    display: inline-block;
}

.inner-content.productImageInner {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    position: relative;
    z-index: 10;
}

.productContentInner {
    display: flex;
    margin: 30px 0;
    gap: 50px;
}

.productLeft {
    flex: 2;
}

.productRight {
    flex: 1;
}

.productText {
    white-space: break-spaces;
}

.productRightMainWrapper {
    display: flex;
    gap: 30px;
    width: 100%;
}

.productRightCardContainer.productRightMain {
    width: 100%;
    flex: 1;
}

.productText {
    background-color: var(--white-background);
    padding: 20px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.productText>*:last-child {
    margin-bottom: 0;
}

.productText>*:first-child {
    margin-top: 0;
}

.productRightBox td>*:first-child {
    margin-top: 0;
}

.productRightCardContainer {
    box-shadow: var(--box-shadow);
    border-radius: var(--border-radius);
    width: 100%;
}

.productRightCardContainer.productRightContact .productRightBoxInner {
    flex-direction: row;
    gap: 20px;
}

.productRightContact {
    max-width: 450px;
}

.productRightContact .contactPhone,
.productRightContact .contactMail {
    white-space: normal;
}

.productRightImage {
    min-height: 200px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/placeholder.jpg);
    border-radius: var(--border-radius) var(--border-radius) 0 0;
}

.productRightBox {
    background-color: var(--white-background);
    padding: 20px;
    border-radius: var(--border-radius);
}

.productRightBox td {
    vertical-align: top;
}

.productRightMain .productRightBox {
    border-radius: 0 0 var(--border-radius) var(--border-radius);
}

.productRightBoxInner {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.productRightBoxInner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.productRightMain .productRightBoxInner {
    text-align: center;
}

.productRightBox .productPrice {
    margin-top: 0px;
    font-weight: 700;
    color: var(--primary-color);
}

.productRightBox .themeButton {
    margin-top: 20px;
}

.productRightCardContainer.productRightDocuments span,
.productRightCardContainer.productRightDocuments a,
.productDocuments {
    text-align: left;
}

.productContactInformationText * {
    text-align: left;
}

.productContactInformationText {
    flex: 1.5;
}

.productContactInformationPicture {
    background-image: url(https://shop.doodev.de/wp-content/uploads/2024/01/Mitarbeiterfoto_Andreas_Herting_quadratisch.png);
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: var(--border-radius);
    flex: 1;
    /* padding: 110px; */
    height: 200px;
    background-position: center;
}


.productBookmark {
    margin-top: 20px;
}

.productRightCardContainer:not(.productRightMain) {
    margin-top: 20px;
}

.productRightCardContainer table {
    text-align: left;
    table-layout: fixed;
    width: 100%;
}

.textHighlight {
    font-weight: bold;
}

.productRightBox .courseQuantity {
    box-sizing: border-box;
    margin-top: 20px;
    margin-right: 0 !important;
    border: none;
    outline: none;
    color: var(--font-color);
    background-color: #fff;
    font-size: 16px;
    padding: 16px;
    position: relative;
    height: 48px;
    border: 1px solid var(--primary-color);
    width: 100%;
    text-align: center;
    border-radius: var(--border-radius);
}

.productRightBoxAdditional {
    margin-top: 40px;
}

.productRightAdditional {
    background-color: var(--white-background);
    box-shadow: var(--box-shadow);
    padding: 30px;
    margin-top: 20px;
}

.productAdditionalInner {
    margin-top: 10px;
}

.productAdditionalFlex {
    display: flex;
    gap: 20px;
    margin-top: 10px;
    color: var(--primary-color);
}

.productAdditionalText {
    margin-top: 3px;
    color: var(--primary-color);
    line-height: 24px;
}

.productAdditionalText .boldText,
.productAdditionalText li {
    color: var(--primary-color);
}

.productAdditionalFlex:first-child {
    margin-top: 0px;
}

.productAdditionalFlex .icon_primary {
    font-size: 22px;
}

.productpage .eventOverviewTable {
    margin-top: 0;
}

.productpage .contactWrapper {
    margin: 0;
    width: 100%;
    max-width: 100%;
    margin-top: 20px;
}

.productpage .eventOverviewTable .singleEventContentInner {
    width: calc(100% - 45px);
    padding: 15px 15px 15px 30px;
}

#seminarCustomRequest.cardAnimation,
#seminarCustomRequestPage.cardAnimation {
    padding: 15px;
    width: calc(100% - 30px);
}

div#seminarCustomRequest {
    flex-direction: column;
}

.productpage .eventOverviewTable .singleEventContentInnerActive {
    padding: 0 15px 0 30px;
    width: calc(100% - 45px);
}

.priceRowAdditionalInfo {
    font-size: 12px;
}


/* seminar event overview table */
.productTimetable .toggleEventDetails {
    cursor: pointer;
}

.productTimetable .toggleEventDetails .dooIcon-arrow-down:before {
    font-size: 14px;
    font-weight: bold;
    padding-left: 5px;
    transition: all ease 0.2s;
}

.productTimetable .activeRow .toggleEventDetails .dooIcon-arrow-down:before {
    transform: rotate(180deg);
    transform-origin: 12px;
}

.productTimetable .tableEventDetailsList {
    display: none;
    border: none;
}

.productTimetable .tableEventDetailsList .tableCell {
    padding: 25px 0 25px 0;
}

.productTimetable .eventStatus,
.registerParticipants .eventStatus {
    display: flex;
    align-items: center;
    hyphens: auto;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
}

.productTimetable .availableCircle {
    box-sizing: border-box;
}

.productTimetable .eventStatus .availableCircle.eventIsAvailable,
.registerParticipants .eventStatus .availableCircle.eventIsAvailable {
    border: 2px solid var(--status-green);
}

.productTimetable .eventStatus .availableCircle.eventIsLowAvailable,
.registerParticipants .eventStatus .availableCircle.eventIsLowAvailable {
    border: 2px solid var(--status-orange);
}

.productTimetable .eventStatus .availableCircle.eventIsUnavailable,
.registerParticipants .eventStatus .availableCircle.eventIsUnavailable {
    border: 2px solid var(--status-red);
}

.productTimetable .flexJustifyEnd {
    justify-content: flex-end;
}

.productTimetable .tableRow.mainTableRow:hover .iconChooseLink,
.productTimetable .tableRow.mainTableRow .iconChooseLink.active {
    background-color: var(--secondary-color);
}

.productTimetable .tableRow.mainTableRow:hover .iconChooseLink .icon-arrow_right:before,
.productTimetable .tableRow.mainTableRow .iconChooseLink.active .icon-arrow_right:before {
    color: #fff;
}

.seminarTableWrapper .headlineFilterWrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

.seminarTableWrapper {
    margin: 0;
}

.seminarTableWrapper .eventFilter {
    margin: 20px 0 20px 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#seminarCustomRequest.cardAnimation,
#seminarCustomRequestPage.cardAnimation {
    margin-bottom: 100px;
}

.tableEventDetailsList .singleEventDate {
    min-width: 22%;
}

.tableEventDetailsList .singleEventLocation {
    min-width: 15%;
}

.productpage .eventOverviewTable .singleEventLink {
    width: 150px;
}

.eventRegisterButton {
    white-space: nowrap;
}

.singleEvent.highlighted .eventRegisterButton {
    z-index: 10;
}

.singleEvent.highlighted .eventRegisterButton::before {
    content: "";
    height: 100%;
    width: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: var(--border-radius);
    background-color: var(--primary-color-transparent-30);
    z-index: -1;
    animation: growShrink 2s infinite;
    transform-origin: center;
}

.singleEvent.highlighted.eventIsUnavailable .eventRegisterButton::before {
    display: none;
}

@keyframes growShrink {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.15);
    }
    100% {
        transform: scale(1);
    }
}

/* additional info wrapper */

.additionalCourseInfos {
    padding: 50px 0px;
    margin: 50px auto;
    display: flex;
    gap: 20px;
}

.targetGroupWrapper,
.requirementsWrapper {
    width: 50%;
}

/* individual request form */
.customEventRequestButton {
    margin-top: 30px;
}

.seminarCustomRequestFormular {
    display: none;
}

.page-template-individual_request_page .seminarCustomRequestFormular {
    display: block;
}

.seminarCustomRequestFormular {
    background-color: #fff;
    margin: 0;
    padding: 0 10px 10px 10px;
    margin-top: 10px;
    border-top: 1px solid #ddd;
    /* box-shadow: var(--box-shadow); */
    /* border-radius: var(--border-radius); */
}

.page-template-individual_request_page .seminarCustomRequestFormular {
    margin-top: 0;
    border: none;
}

.seminarCustomRequestFormular form .form-row input.input-text {
    border: 1px solid #ddd;
    border-radius: var(--border-radius);
}

.seminarCustomRequestFormular form .form-row input.input-text,
.seminarCustomRequestFormular form .form-row textarea,
.seminarCustomRequestFormular form .form-row select.input-text {
    width: 100%;
    box-sizing: border-box;
    margin: 0px;
    color: var(--font-color);
    background-color: #fff;
    font-size: 18px;
    line-height: 24px;
    padding-left: 20px;
    display: flex;
    position: relative;
    height: 36px;
    border: 1px solid var(--grey-background-border);
    border-radius: var(--border-radius);
    /* border-bottom: 1px solid transparent !important;
    transition: border-bottom-color 200ms ease 0s; */
}

.seminarCustomRequestFormular form .form-row {
    margin-bottom: 15px;
}

.seminarCustomRequestFormular form .form-row label:not(.input-checkbox), 
.seminarCustomRequestFormular form .form-row label:not(.input-checkbox) span {
    color: var(--light-font-color);
}

.seminarCustomRequestFormular form .form-row label {
    line-height: 2;
}

.customEventRequestBoxData .flex.form-row div input {
    padding-right: 20px;
}

.customEventRequestBoxData .flex.form-row div:not(:last-child) {
    margin-right: 10px;
}

#seminarCustomRequest .requestHeadline {
    padding: 0 10px;
}

button.newSeminarRequest {
    /* background: #fff;
    padding: 16px 32px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow); */
    padding: 16px 0px 16px 32px;
    border: none;
    font-size: 16px;
    color: var(--primary-color);
    cursor: pointer;
    /* margin-bottom: -10px; */
    /* margin-top: 10px; */
    transition: 0.2s;
    background-color: transparent;
}

button.newSeminarRequest:hover,
button.newSeminarRequest:hover .dooIcon-arrow-down:before {
    color: var(--secondary-color);
}

button.newSeminarRequest:focus {
    box-shadow: none;
}

.newSeminarRequest .dooIcon-arrow-down:before {
    color: var(--primary-color);
}

button.newSeminarRequest i:before {
    transition: 0.2s;
}

button.newSeminarRequest.active i:before {
    transform: rotate(180deg);
}

.seminarCustomRequestFormular .messageMargin.sdds-message.sdds-message__type-success.sdds-message__icon-active.sdds-message__extended-active.sdds-message-ongrey {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.seminarCustomRequestFormular p.sdds-message-extended {
    width: 100%;
}

.seminarCustomRequestFormular svg.sdds-message-icon.sdds-message-icon--success {
    margin-right: 20px;
    width: 40px;
    height: 40px;
}

.page-template-individual_request_page #seminarCustomRequestPage.cardAnimation {
    display: block;
}

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

               Participant Registration

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


.registerEvents {
    /* display: flex; */
    gap: 50px;
    margin-bottom: 60px;
}

.registerEventTable {
    /* display: flex; */
    gap: 30px;
}

.participantRegistration .additionalEventLocationText {
    width: unset;
    text-overflow: unset;
    overflow: unset;
    order: 3;
    white-space: unset;
}

.participantRegistration .additionalEventTimezoneText {
    margin-left: 0;
}

.registerEventSessions {
    background-color: var(--white-background);
    padding: 15px 20px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.registerHeadline {
    font-weight: bold;
}

.registerEventSessions .registerHeadline {
    margin-top: 0px;
}

.primaryButton.registerSingle {
    margin: 0 0 40px 0;
}

.registerParticipantRow {
    background-color: var(--white-background);
    padding: 0px 20px 0px 20px;
    box-shadow: var(--box-shadow);
    margin-bottom: 10px;
    min-height: 54px;
    display: flex;
    align-items: center;
    border-radius: var(--border-radius);
}

.registerParticipantTitle {
    color: var(--font-color);
    font-weight: bold;
}

.registerParticipantText {
    color: var(--font-color);
}

.registerParticipantRow span:before,
.registerAlert span:before {
    font-size: 24px;
    color: var(--primary-color);
}

.registerParticipantRow.add-row:hover span:before,
.registerParticipantRow.add-row:hover .registerParticipantTitle {
    color: var(--secondary-color);
}

.registerAlert {
    color: var(--primary-color);
    /* background-color: var(--primary-color-transparent-10); */
    background-color: var(--white-background);
    border: 1px solid var(--primary-color);
    padding: 15px 20px;
    display: flex;
    gap: 10px;
    margin-top: 20px;
    align-items: center;
    border-radius: var(--border-radius);
}

.registerAlert * {
    color: var(--primary-color);
    margin: 0;
}

.registerAlert span:before {
    color: #fff;
}

.registerAlert.alertNoFreePlaces {
    display: none;
    margin: 0 0 20px 0;
    color: var(--status-red);
    border-color: var(--status-red);
}

.registerAlert.alertNoFreePlaces * {
    color: var(--status-red);
}

.participantAlreadyRegistered {
    display: none;
    width: calc(100% - 60px);
}

/* .registerAlert b {
    opacity: 0.7;
} */

.add-participant-form {
    display: none;
}

.add-participant,
.add-participant-filled-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.registerParticipantRow.add-row {
    cursor: pointer;
    width: fit-content;
}

.registerParticipantRow.add-row .dooIcon {
    margin-right: 10px;
    color: var(--primary-color);
}

.registerParticipantRow.add-row:hover {
    background-color: var(--light-background);
}

.registerParticipantRow.self-registration .add-participant-filled {
    display: block;
}

.registerParticipantRow.self-registration {
    display: none;
}

.registerParticipantRow.self-registration.active {
    display: flex;
}

.add-participant-form-wrapper {
    display: flex;
    flex-wrap: wrap;
    padding: 5px 0 15px 0;
}

.participantInputRow {
    width: calc(50% - 30px);
    margin: 10px 0;
}

.participantInputRow.wideRow {
    width: calc(100% - 20px);
}

.participantInputRow.rowGap {
    padding-right: 40px;
}

.participantInputRow label {
    display: block;
    color: var(--light-font-color);
}

.participantInputRow .input-text {
    width: calc(100% - 20px);
    border-radius: 0;
    border: 1px solid #ccc;
    outline: none;
    font-size: 18px;
    line-height: 24px;
    height: 36px;
    border-radius: var(--border-radius);
    padding: 0;
    padding-left: 20px;
}

.add-participant-form .primaryButton {
    margin: 0;
}

.add-participant-form .secondaryButton {
    margin: 0;
}

.registerParticipantName {
    border-right: 1px solid var(--font-color);
    padding: 0px 10px;
    margin-right: 10px;
}

.add-participant .registerParticipantTitle {
    margin: 0 10px;
    color: var(--primary-color);
}

.registerParticipantInformation {
    display: flex;
}

.add-participant-filled {
    display: none;
}

.add-participant-form,
.add-participant-filled {
    width: 100%;
}

.registerParticipantTable .changeParticipantWrapper .dooIcon:hover {
    color: var(--primary-color);
    cursor: pointer;
}

.selfRegistrationCheckbox {
    margin: 30px 0px 10px 0px;
    padding: 15px 20px;
    border-radius: var(--border-radius);
}

.selfRegistrationCheckbox .checkbox {
    margin: 0;
}

.selfRegistrationCheckbox.active {
    background-color: var(--white-background);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
}

.selfRegistrationCheckbox.disabled {
    opacity: 0.5;
    pointer-events: none;
}

.selfRegistrationCheckbox .registerParticipantInformation {
    display: none;
}

.selfRegistrationCheckbox.active .registerParticipantInformation {
    display: flex;
}

.selfRegistrationCheckbox .labelFlex {
    gap: 5px;
}

.registerParticipantTable.inactive,
.registerAlert.inactive {
    opacity: 0.4;
    pointer-events: none;
}

.registerParticipantFooter {
    display: flex;
    align-items: center;
    gap: 30px;
    margin-top: 60px;
}

.purchasePriceInformation {
    margin-top: 10px;
}

.purchasePriceInformation .countedPrice,
.purchasePriceInformation .countedPrice span[data-price] {
    font-size: 20px;
}

.buttonWrapperParticipantRegistration {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: flex-end;
    align-items: center;
    margin: 20px 15px 10px auto;
    gap: 20px;
}

.registerParticipantRow.in-addParticipantForm .saveButton, 
.registerParticipantRow.in-editing:not(.in-addParticipantForm) .addButton {
    display: none;
}

/* participant-registration with users from avendoo */
#enterNewParticipantButton {
    margin-bottom: 20px;
}

.registerParticipantRow.userFromSystem .add-participant-form {
    display: block;
}

.checkAllParticipantsRow {
    border-bottom: 1px solid var(--accent-border-color);
    margin-top: 20px;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.registerParticipantRow.userFromSystem .checkbox input:not(:checked)+span {
    border: 1px solid var(--accent-border-color);
}

.participantRow.enterNewParticipant {
    display: none;
    align-items: center;
}

.newParticipantInputs {
    margin-bottom: 10px;
    flex: 1;
}

.newParticipantInputs .input-text {
    width: calc(33% - 40px);
    /* max-width: 250px; */
    border-radius: 0;
    border: 1px solid #ccc;
    outline: none;
    font-size: 16px;
    line-height: 24px;
    height: 36px;
    border-radius: var(--border-radius);
    padding: 0;
    padding-left: 20px;
    margin-right: 10px;
}

.newParticipantInputs .input-text[disabled] {
    background: #f2f2f2;
    opacity: 0.5;
    cursor: not-allowed;
}



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

               Purchase Form Page

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

.purchaseFormWrapper {
    min-height: calc(100vh - 244px);
}

.purchaseFormWrapper .userBillingAdress * {
    margin: 5px;
    font-style: italic;
}

.purchaseFormWrapper .userBillingAdress {
    margin-top: 10px;
    margin-bottom: 30px;
}

.purchaseFormWrapper .userBillingAdress {
    display: none;
}

html .woocommerce form.courseRegistrationForm .form-row .input-textarea {
    padding: 20px;
    margin: 0;
    font-size: 16px;
    height: 150px;
}

html .woocommerce form.courseRegistrationForm .form-row .input-textarea::placeholder {
    color: var(--light-font-color);
    line-height: 24px;
}

.participantOverviewSingleRow {
    background-color: var(--white-background);
    padding: 15px 10px 15px 65px;
    box-shadow: var(--box-shadow);
    margin-bottom: 10px;
    min-height: 24px;
    display: flex;
    align-items: center;
    position: relative;
}


.participantOverviewSingleName {
    color: var(--primary-color);
    font-weight: bold;
}

.participantOverviewNumberIndicator {
    position: absolute;
    background-color: var(--primary-color);
    height: 100%;
    width: 54px;
    left: 0;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
}

.participantOverview {
    margin: 60px 0;
}

.purchaseFormInfobox {
    margin-top: 30px;
}

.purchaseFormInfobox * {
    margin: 5px;
}

.purchaseFormRequiredCheckboxes {
    margin-top: 40px;
}

html .woocommerce .purchaseFormRequiredCheckboxes .form-row {
    margin: 0px;
}

.requiredMark {
    color: var(--secondary-color);
}

html body .woocommerce form .form-row label.checkbox {
    display: flex;
    align-items: flex-start;
    gap: 5px;
}

.purchaseFormActionContainer {
    justify-content: space-between;
    align-items: center;
}

.purchaseFormWrapper .totalPrice {
    margin: 10px 0px 5px 0px;
    color: var(--secondary-color);
    font-size: 28px;
}

/* custom checkboxes */

input[type=checkbox] {
    width: auto;
}

body .checkbox {
    position: relative;
    cursor: pointer;
    margin-bottom: 10px;
    padding-left: 0;
    display: flex;
    align-items: center;
}

html body input[type=checkbox] {
    position: absolute;
    cursor: pointer;
    opacity: 0;
    margin-left: 0;
    margin-right: 10px;
}

body .checkbox::selection {
    background: transparent;
}

body .checkbox input+span {
    background: #fff;
    content: "";
    display: inline-block;
    margin: 0 0.5em 0 0;
    padding: 0;
    vertical-align: middle;
    width: 22px;
    height: 22px;
    min-width: 22px;
    border: 1px solid transparent;
    box-sizing: content-box;
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    transition: background ease 0.2s, box-shadow ease 0.2s;
    border-radius: var(--border-radius-checkbox);
}

body .checkbox input+span::after {
    content: "";
    display: block;
    width: 5px;
    height: 10px;
    margin-left: 7px;
    margin-top: 3px;
    border: solid #fff;
    border-width: 0 3px 3px 0;
    box-sizing: content-box;
    transform: rotate(45deg) scale(0);
}

body .checkbox input+span::after {
    content: "";
    display: block;
    transform: rotate(45deg) scale(0);
    transition: transform 0.2s;
}

body .checkbox input:checked+span::after {
    transform: rotate(45deg) scale(1);
}

body .checkbox input:focus+span {
    box-shadow: 0px 0px 0px 3px var(--primary-color-transparent-30);
    transition: background ease 0.2s, box-shadow ease 0s;
}

body .checkbox input:checked+span {
    background-color: var(--primary-color);
}

body .checkbox input.disabled+span,
body .checkbox input[disabled]+span {
    opacity: 0.5;
    cursor: not-allowed;
}


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

               Register Overview

**********************************/
.registerOverviewSiteHeader {
    padding-bottom: 20px;
}

.registerOverviewLinkWrapper {
    background-color: var(--white-background);
    border-radius: var(--border-radius);
    margin: 40px 0;
    box-shadow: var(--box-shadow);
}

.registerOverviewInnerHeader {
    padding: 15px 20px;
    background-color: var(--bright-background);
    border-radius: var(--border-radius) var(--border-radius) 0 0;
    display: flex;
    justify-content: space-between;
}

.registerOverviewInnerHeader div {
    display: flex;
    gap: 40px;
}

.registerOverviewInnerHeader p {
    margin: 0;
}

.registerOverviewContent {
    padding: 15px 20px;
}

.registerOverviewLinkWrapper h3 {
    margin: 0;
}

.registerOverviewLink {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
}

.registerOverviewLink span {
    min-width: fit-content;
}

.registerOverviewLinkWrapper .registrationsTableScroll {
    border: 1px solid var(--inactive-color);
    border-radius: var(--border-radius);
}

#container .woocommerce .registerOverviewLinkWrapper .registrationsTable {
    border-spacing: 0;
    width: 100%;
    box-shadow: none;
}

.registerOverviewLinkWrapper .registrationsTable thead {
    border-bottom: 1px solid var(--inactive-color);
}

.registerOverviewTableText {
    margin-top: 30px
}

.licensesUsedUp {
    color: var(--status-red);
    font-weight: 600
}

.licensesAvailable {
    color: var(--status-green);
    font-weight: 600
}

.registerOverviewLinkWrapper .registerHighlight {
    font-weight: 600;
}

.registrationsTable th,
#container .woocommerce table.registrationsTable td,
#container .woocommerce table.registrationsTable td:last-child {
    text-align: left;
}

/* scrollable table */

.scrollTable {
    width: 100%;
    border-collapse: collapse;
}

.scrollTable thead {
    display: block;
}

.scrollTable tbody {
    display: block;
    max-height: 300px;
    width: 100%;
    overflow-y: auto;
}

.scrollTable tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.scrollTable th,
.scrollTable td {
    width: 20%;
    text-align: left;
}

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

    Avendoo Shop Error Messages

**********************************/
#container:has(.errorMessage) {
    display: flex;
    justify-content: center;
    align-items: center;
}
.errorMessage {
    padding: 20px;
    max-width: 500px;
    box-shadow: var(--box-shadow);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    border-radius: var(--border-radius);
    background-color: #fff;
}
.errorText {
    margin-bottom: 20px;
    text-align: center;
}




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

               WooCommerce

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

/* notifications */

.woocommerce-notices-wrapper>div,
.woocommerce-notices-wrapper>ul {
    border-radius: var(--border-radius);
    border: 1px solid var(--primary-color);
}

html .woocommerce-message {
    color: var(--status-green);
    border-color: var(--status-green);
    background-color: var(--white-background);
}

html .woocommerce-error {
    border-color: var(--status-red);
    background-color: var(--status-red-background);
}

html .woocommerce-error li {
    color: var(--status-red);
}

html .woocommerce-cart .woocommerce-message[role="alert"] a.button {
    display: none;
}

html .woocommerce-cart .woocommerce-message[role="alert"]::before {
    top: 15px;
}

/* account navigation */

html .woocommerce-account .woocommerce-MyAccount-navigation,
html .woocommerce-account .woocommerce-MyAccount-content {
    float: none;
    width: 100%;
}

html .woocommerce-account .woocommerce-MyAccount-navigation,
html .woocommerce-message,
html .woocommerce-info,
html .woocommerce-error,
#container .woocommerce table {
    box-shadow: var(--box-shadow);
}

.woocommerce-MyAccount-navigation ul {
    display: flex;
    flex-wrap: wrap;
    list-style-type: none;
    margin: 0;
    padding: 0;
    margin-bottom: 60px;
}

.woocommerce-MyAccount-navigation-link:first-child {
    padding-left: 0;
}


/* .woocommerce-MyAccount-navigation-link:not(:last-child) {
    padding-right: 2rem;
} */


html .woocommerce-MyAccount-navigation-link a {
    text-decoration: none;
    font-weight: normal;
    font-size: 16px;
    line-height: calc((6/ 4) * 1rem);
    color: var(--headline-color);
    padding: 12px 0;
    margin-right: 30px;
    text-decoration: none;
    display: block;
    position: relative;
    -webkit-transition: color 0.15s ease-in-out;
    transition: color 0.15s ease-in-out;
    white-space: nowrap;
}

/* html .woocommerce-MyAccount-navigation-link a:first-child {
    margin-left: 24px;
} */

html .woocommerce-MyAccount-navigation-link.is-active a,
html .woocommerce-MyAccount-navigation-link a:hover {
    color: var(--primary-color);
}

html .woocommerce-MyAccount-navigation-link a::after {
    content: " ";
    position: absolute;
    bottom: 0px;
    right: 0;
    left: 0;
    margin-left: auto;
    width: 0;
    margin-right: auto;
    height: 2px;
    background-color: var(--secondary-color);
    -webkit-transition: width 0.15s ease-in-out;
    transition: width 0.15s ease-in-out;
    z-index: 2;
}

html .woocommerce-MyAccount-navigation-link.is-active a::after {
    width: 100%;
    background-color: var(--secondary-color);
}

html .woocommerce-MyAccount-navigation-link a:hover::after {
    width: 100%;
}

nav.woocommerce-MyAccount-navigation {
    background: #fff;
    position: relative;
}

nav.woocommerce-MyAccount-navigation::after {
    content: " ";
    display: block;
    left: 0px;
    right: 0px;
    bottom: 0px;
    position: absolute;
}

html .woocommerce-MyAccount-content .woocommerce-info::before {
    top: 25px;
}

.inner-page-content .woocommerce {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding: 30px 0px 100px 0px;
}

html .woocommerce-info {
    /* border-top-color: var(--primary-color); */
    border: 1px solid var(--primary-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 20px;
    padding: 15px 20px 15px 65px;
    background-color: #fff;
    color: var(--font-color);
}

html .woocommerce-info.cart-empty {
    border-color: var(--status-red);
}

html .woocommerce-info::before {
    color: var(--secondary-color);
    content: "\e833";
    font-family: 'dooiconfont';
    font-size: 26px;
    position: absolute;
    top: 13px;
    left: 20px;
}
html .woocommerce-checkout .woocommerce-message[role="alert"]::before {
    top: 13px;
}

html .woocommerce-info.cart-empty::before {
    color: var(--status-red);
}

html .woocommerce-message::before {
    content: "\e85a";
    font-family: "dooiconfont";
    font-size: 26px;
    position: absolute;
    top: 27px;
    left: 20px;
    color: var(--status-green);
}

html .woocommerce .error-message {
    border: 1px solid var(--primary-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    padding: 1em 2em 1em 3.5em;
    margin: 0 0 2em;
    list-style: none outside;
    width: auto;
    word-wrap: break-word;
}


html .woocommerce-MyAccount-navigation-link--customer-logout {
    flex-grow: 1;
    display: flex;
    justify-content: flex-end;
}

html .woocommerce-MyAccount-navigation-link--customer-logout a {
    width: fit-content;
}

html .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
    color: var(--status-red);
    border-color: var(--status-red);
}

html .woocommerce-MyAccount-navigation-link--customer-logout a::after {
    background-color: var(--status-red);
}

nav.woocommerce-MyAccount-navigation ul {
    display: flex;
}

html .woocommerce-account .woocommerce-MyAccount-navigation {
    box-shadow: none;
    background-color: transparent;
}





/* woocommerce login */
html .woocommerce form.woocommerce-form-login.login {
    background-color: transparent;
    border: none;
    padding: 0;
}




/* woocommerce buttons */
html .woocommerce-Button,
html .woocommerce .button {
    transition: all ease 0.2s;
    padding: 16px 32px !important;
    border-radius: var(--border-radius) !important;
    font-size: 16px !important;
    position: relative;
    cursor: pointer;
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
    font-weight: 300 !important;
    margin-left: auto !important;
    min-width: fit-content;
}

html .woocommerce-Button:hover,
html .woocommerce .button:hover {
    background-color: #f2f2f2 !important;
}

html .woocommerce .edit-account .button,
html .woocommerce-form-login .woocommerce-form-login__submit {
    background-color: var(--secondary-color) !important;
    color: #fff !important;
    margin: 10px 0px 40px 0px !important;
    border: none !important;
    font-weight: bold !important;
}

html .woocommerce .edit-account .button:hover,
html .woocommerce-form-login .woocommerce-form-login__submit:hover {
    background-color: var(--secondary-color-hover) !important;
}

html .woocommerce .checkout-button,
.woocommerce-checkout #place_order {
    background-color: var(--primary-color) !important;
    color: #fff !important;
    margin: 10px 0px 40px 0px !important;
    border: none !important;
    font-weight: bold !important;
}

.woocommerce-checkout #place_order:hover,
html .woocommerce .checkout-button:hover {
    background-color: var(--secondary-color) !important;
}

/* woocommerce input text and textarea styling */

html .woocommerce form .form-row input.input-text,
html .woocommerce form .form-row textarea,
html .woocommerce form .form-row select.input-text {
    width: 100%;
    box-sizing: border-box;
    margin: 0px;
    color: var(--font-color);
    background-color: #fff;
    /* font-size: 16px; */
    line-height: 24px;
    padding-left: 20px;
    display: flex;
    position: relative;
    height: 38px;
    border: 1px solid var(--grey-background-border);
    border-radius: var(--border-radius);
    /* border-bottom: 1px solid transparent !important;
    transition: border-bottom-color 200ms ease 0s; */
}

html .woocommerce form .form-row input.input-text.disabled,
html .woocommerce form .form-row textarea.disabled, 
html .woocommerce form .form-row select.input-text.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

html .woocommerce form .form-row textarea {
    resize: vertical;
}

/* html .woocommerce form .form-row input.input-text:hover,
html .woocommerce form .form-row textarea:hover,
html .woocommerce form .form-row select.input-text:hover {
    border-bottom-color: var(--accent-border-color) !important;
}

html .woocommerce form .form-row input.input-text:focus,
html .woocommerce form .form-row textarea:focus,
html .woocommerce form .form-row select.input-text:focus {
    border-bottom: 2px solid var(--primary-color) !important;
    height: 57px;
    margin-bottom: -1px;
} */

html .woocommerce form .form-row.woocommerce-invalid input.input-text:hover,
html .woocommerce form .form-row.woocommerce-invalid input.input-text:focus,
html .woocommerce form .form-row.woocommerce-invalid textarea:hover,
html .woocommerce form .form-row.woocommerce-invalid textarea:focus,
html .woocommerce form .form-row.woocommerce-invalid select.input-text:hover,
html .woocommerce form .form-row.woocommerce-invalid select.input-text:focus,
html .woocommerce form .form-row input.input-text.isEmpty,
html .woocommerce form .form-row textarea.isEmpty {
    border-bottom-color: var(--status-red) !important;
}

html .woocommerce form .form-row.woocommerce-invalid label {
    color: var(--status-red);
}

html .woocommerce form .form-row.woocommerce-invalid label.checkbox span.customCheckoutBox {
    outline: 1px solid var(--status-red);
}

html .woocommerce form .form-row label.checkbox span.customCheckoutBox {
    margin-top: 5px;
}

html .woocommerce form .form-row label.checkbox span.customCheckoutText {
    line-height: 24px;
    color: var(--font-color);
}

/* .woocommerce form .form-row label:not(.input-checkbox),
.woocommerce form .form-row label:not(.input-checkbox) span {
    color: var(--light-font-color);
} */

html .woocommerce form .form-row.woocommerce-validated .select2-container,
html .woocommerce form .form-row.woocommerce-validated input.input-text,
html .woocommerce form .form-row.woocommerce-validated select {
    border-color: var(--status-green) !important;
}

html .woocommerce form .form-row .required {
    font-weight: normal;
    border: 1px solid var(--grey-background-border) !important;
}

/* hide border on required star */
html .woocommerce form .form-row span.required {
    border: none !important;
}

html .messageBox {
    display: none;
    margin: 20px 0 0;
}

.messageMargin {
    margin: 30px 0;
}


.inputContainer {
    position: relative;
}

.datetime-icon.icon-datetime-local {
    height: 20px;
    width: 20px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 18px;
    pointer-events: none;
}

.woocommerce-Address h3 {
    font-size: 24px;
}

header.woocommerce-Address-title {
    margin: 10px 0px;
}

html .woocommerce form .form-row {
    margin-bottom: 15px;
}

.woocommerce .coupon input[type="text"] {
    min-width: 200px !important;
    box-sizing: border-box;
    margin: 0px;
    border: none;
    outline: none;
    color: var(--font-color);
    background-color: #fff;
    font-size: 16px;
    padding: 16px !important;
    display: flex;
    position: relative;
    height: 50px;
    margin-right: 10px !important;
    border-radius: var(--border-radius);
}

html .woocommerce form .form-row label abbr.required {
    border: none !important;
}

.select2-container--default .select2-selection--single {
    border: 1px solid var(--grey-background-border) !important;
    border-radius: var(--border-radius) !important;
    height: 38px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--font-color) !important;
    line-height: 38px !important;
    padding-left: 20px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px !important;
    right: 5px !important;
}

.select2-dropdown {
    color: var(--grey-background-border) !important;
    border-color: var(--grey-background-border) !important;
    border-bottom-right-radius: var(--border-radius) !important;
    border-bottom-left-radius: var(--border-radius) !important;
}

html .select2-container--default .select2-results__option--highlighted[aria-selected],
html .select2-container--default .select2-results__option--highlighted[data-selected] {
    background-color: var(--primary-color);
    color: #fff;
}

.select2-results__option {
    padding-left: 20px !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border-color: var(--grey-background-border);
    border-radius: var(--border-radius);
}

.select2-search--dropdown {
    padding-left: 20px !important;
}

@media (max-width: 930px) {
    .checkout_coupon .form-row.form-row-first {
        width: 100%;
    }
    .checkout_coupon .form-row.form-row-last {
        width: 99%;
    }
    .checkout_coupon .button[name="apply_coupon"] {
        width: 100%;
    }
}




/* woocommerce table style */
#container .woocommerce table {
    background-color: #fff;
    border: 0;
    border-radius: var(--border-radius);
    padding: 10px;
}

#container .woocommerce table th,
#container .woocommerce table td {
    border-top: 0;
}





/* woocommerce cart */
.woocommerce-cart-form .product-thumbnail img {
    min-height: 100px;
    min-width: 140px;
    display: block;
    object-fit: cover;
}

.woocommerce-cart-form td.product-thumbnail {
    width: 160px;
}

.woocommerce-cart-form .product-name a {
    font-family: var(--font-family);
    font-weight: normal;
    font-size: 18px;
    color: var(--primary-color);
    margin: 0px;
}

.woocommerce-cart-form tbody>tr:last-child>td {
    padding-top: 30px;
}

.woocommerce-cart .coupon {
    display: flex;
    align-items: center;
}

.woocommerce-cart-form .button[name="apply_coupon"],
.woocommerce-cart-form .button[name="update_cart"] {
    background-color: var(--tertiary-color) !important;
    color: #fff !important;
    border-color: var(--tertiary-color) !important;
    box-shadow: none;
    font-weight: 600 !important;
    margin-top: 0;
}

.woocommerce-cart-form .button[name="apply_coupon"]:hover,
.woocommerce-cart-form .button[name="update_cart"]:hover {
    background-color: var(--font-color) !important;
    color: #fff !important;
    border-color: var(--font-color) !important;
}

h1.cart_headline {
    margin: 0;
    padding: 60px 0px 10px 0px;
}

.cart_totals {
    max-width: 400px;
}

#container .woocommerce .cart_totals table {
    padding: 0;
}

#container .woocommerce .cart_totals table td,
#container .woocommerce .cart_totals table th {
    padding: 10px 20px;
    width: unset;
}

#container .woocommerce .cart_totals table tr:last-child td,
#container .woocommerce .cart_totals table tr:last-child th {
    padding-bottom: 10px;
}

#container .woocommerce .cart_totals .order-total {
    background-color: var(--light-background);
}

#container .woocommerce table tr:last-child th {
    border-bottom-left-radius: var(--border-radius);
    word-break: auto-phrase;
}

#container .woocommerce table tr:last-child td {
    border-bottom-right-radius: var(--border-radius);
}

.woocommerce-Price-amount {
    word-break: auto-phrase;
}

#container .woocommerce table tr th.product-subtotal,
#container .woocommerce table tr th.product-price {
    text-align: end;
}

/* Update shopping cart Hide button */
#container .woocommerce table td.actions button[name="update_cart"] {
    display: none;
}

@media (min-width: 930px) and (max-width: 1200px) {
    .woocommerce .cart_item .variation dt {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .woocommerce table.cart td.actions .coupon {
        margin-bottom: 20px;
    }

    .woocommerce-page table.cart td.actions .coupon {
        display: flex;
        flex-direction: column;
    }

    .woocommerce-cart table.cart td.actions .coupon #coupon_code,
    .woocommerce-cart table.cart td.actions .coupon button[name="apply_coupon"] {
        width: 100%;
    }

    .woocommerce-cart table.cart td.actions .coupon #coupon_code {
        margin-bottom: 10px;
    }
}




/* woocommerce checkout */
form.checkout.woocommerce-checkout {
    display: flex;
    flex-wrap: wrap;
}

#customer_details,
#order_review {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout {
    width: 100%;
}

html .woocommerce .col2-set .col-1,
html .woocommerce .col2-set .col-2 {
    width: calc(100% - 50px);
}


.cart_item .variation p {
    margin: 0;
}

.cart_item .variation dt {
    font-weight: 600;
}

.woocommerce-checkout h3 {
    font-size: 36px;
    margin: 20px 0px;
    letter-spacing: normal;
    text-transform: none;
}

.woocommerce-checkout #place_order {
    width: 100%;
}

.woocommerce-checkout .wc-gzd-order-submit {
    order: 10;
}

.woocommerce-checkout .shop_table {
    order: 2;
}

.woocommerce-checkout .wc-gzd-checkbox-placeholder {
    order: 3;
}

.woocommerce-checkout .product-name {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

.woocommerce-checkout .cart_item img {
    min-height: 60px;
    min-width: 90px;
    display: block;
    object-fit: cover;
}

.woocommerce-checkout .wc-gzd-product-name-left {
    margin-right: 20px;
    min-width: 90px;
}

.woocommerce-checkout .wc-gzd-product-name-right {
    width: -webkit-fill-available;
}

.woocommerce-checkout .product-total {
    min-width: 120px;
}

#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods {
    background-color: #fff;
    border: 0;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}

.wc_payment_method * {
    color: var(--fontColor);
}

html #add_payment_method #payment div.payment_box,
html .woocommerce-cart #payment div.payment_box,
html .woocommerce-checkout #payment div.payment_box {
    background-color: var(--primary-color);
    border: 0;
    border-radius: var(--border-radius);
}

ul.wc_payment_methods.payment_methods.methods .payment_box {
    display: none !important;
}

html #add_payment_method #payment div.payment_box *,
html .woocommerce-cart #payment div.payment_box *,
html .woocommerce-checkout #payment div.payment_box * {
    color: #fff;
    margin: 0;
}

html #add_payment_method #payment div.payment_box::before,
html .woocommerce-cart #payment div.payment_box::before,
html .woocommerce-checkout #payment div.payment_box::before {
    border: 1em solid var(--primary-color);
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}

tr.woocommerce-cart-form__cart-item.cart_item .product-thumbnail img {
    border-radius: var(--border-radius);
}

.woocommerce-checkout-review-order-table tr.order-total {
    background-color: var(--light-background);
}

table.woocommerce-checkout-review-order-table {
    padding: 0;
}

#container .woocommerce table {
    border-collapse: collapse;
}

#container .woocommerce table tr th,
#container .woocommerce table tr td {
    padding: 10px 20px;
}

.woocommerce-order-details .product-total {
    width: 160px;
    text-align: right;
}

#container .woocommerce table td:last-child,
#container .woocommerce table tr td.product-price {
    text-align: right;
}

table.woocommerce-checkout-review-order-table tr.wc-gzd-cart-item-has-thumbnail .wc-gzd-cart-item-name-wrapper .wc-gzd-cart-item-thumbnail img {
    border-radius: var(--border-radius);
}

table.woocommerce-checkout-review-order-table tr.wc-gzd-cart-item-has-thumbnail .wc-gzd-cart-item-name-wrapper .wc-gzd-cart-item-thumbnail {
    min-width: 90px !important;
}

/* 2/3 width */
.form-row-two-thirds {
    width: 67%;
}

/* 1/3 width */
.form-row-one-third {
    width: 27%;
}

.form-row-left {
    float: left;
}

.form-row-right {
    float: right;
}

@media (max-width: 930px) {
    html .woocommerce-checkout .woocommerce .col2-set .col-1 {
        width: 100%;
    }

    form.checkout.woocommerce-checkout {
        flex-direction: column;
    }

    form.checkout #billing_first_name_field,
    form.checkout #billing_last_name_field {
        width: calc(100% - 6px);
    }

    form.checkout #billing_last_name_field {
        float: left;
    }
}

@media (max-width: 600px) {
    .orderHeadlineIcon svg {
        display: none;
    }

    /* order details */
    .woocommerce-order-received .woocommerce td.product-name .wc-item-meta {
        width: 100%;
    }

    /* customization horizontal card to vertical card*/
    .woocommerce-order-received .wide-trainings-container-inner,
    .woocommerce-order-received .wide-training-catalog-content {
        flex-direction: column;
    }
    .woocommerce-order-received .wide-training-catalog-content {
        align-items: flex-start;
        width: auto;
    }
    .woocommerce-order-received .wide-training-catalog-image {
        width: 100%;
        height: 300px;
        border-top-right-radius: var(--border-radius);
        border-bottom-left-radius: 0;
    }
    .wide-trainings-wrapper .catalog-content-regCode {
        flex-direction: column;
        align-items: start;
    }
}




/* woocommerce purchase */
.woocommerce .woocommerce-order .woocommerce-order-details {
    margin-bottom: 60px;
}




/* woocommerce customer details */
html .woocommerce .woocommerce-customer-details address {
    border: 1px solid var(--primary-color);
    border-radius: 0;
    padding: 20px;
    width: calc(100% - 40px);
}

html .woocommerce form .show-password-input,
.woocommerce-page form .show-password-input {
    top: calc(50% - 20px);
    right: 10px;
    padding: 10px;
}

html .woocommerce form .show-password-input.display-password::after,
html .woocommerce-page form .show-password-input.display-password::after {
    color: var(--secondary-color);
}

html .woocommerce form .show-password-input::after,
html .woocommerce-page form .show-password-input::after {
    color: var(--primary-color);
}

.woocommerce fieldset {
    border: 1.5px solid var(--primary-color);
}

.woocommerce fieldset legend {
    color: var(--primary-color);
}

h2.formPartHeading {
    font-weight: 900;
    color: var(--tertiary-color);
    margin-top: 40px;
}




/* woocommerce dashboard */
.dashboardInner {
    display: flex;
    gap: 20px;
}

.dashboardInner .dashboardOptions {
    background-color: var(--white-background);
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    width: calc(25% - 20px);
    text-align: center;
    padding: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.dashboardInner .dashboardOptions:hover {
    outline: 1px solid var(--primary-color);
}

@media (max-width: 600px) {
    .dashboardInner {
        flex-direction: column;
    }

    .dashboardInner .dashboardOptions {
        width: calc(100% - 40px);
    }
}



/* woocommerce orders */
.woocommerce-orders #container .woocommerce table tr th span {
    word-break: auto-phrase;
}
.woocommerce-orders #container .woocommerce table .woocommerce-orders-table__cell-order-status {
    hyphens: auto;
}
.woocommerce-orders #container .woocommerce table tr td.woocommerce-orders-table__cell-order-products p:first-child {
    margin-top: 0;
}



/* woocommerce-view-order */
.woocommerce-view-order .woocommerce-table--order-details tr.order_item:nth-of-type(2n + 1) {
    background-color: var(--light-background);
}

.woocommerce-view-order .woocommerce-table--order-details tfoot tr:last-child:has(.woocommerce-Price-amount) {
    background-color: var(--light-background);
}

html .woocommerce-view-order #container .woocommerce table tr.order_item:last-child td {
    border-radius: 0;
}

@media (max-width: 600px) {
    .woocommerce-view-order td.product-name .wc-item-meta:last-child {
        padding: 0;
        margin-top: -10px;
    }
}
@media (max-width: 400px) {
    .woocommerce-view-order #container th.woocommerce-table__product-table {
        width: 44%;
    }
    .woocommerce-view-order #container .woocommerce table tr th, 
    .woocommerce-view-order #container .woocommerce table tr td {
        padding: 10px;
    }
}


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

        Favorites/ Wishlist

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

.productBookmark .tinv-wishlist {
    padding-bottom: 20px;
    padding-top: 20px;
}

.cardBookmark a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart.tinvwl-position-after span {
    display: none !important;
}

.cardBookmark .tinv-wraper.woocommerce.tinv-wishlist.tinvwl-shortcode-add-to-cart.tinvwl-no-action {
    padding: 0;
}

.cardBookmark {
    position: absolute;
    z-index: 9;
    opacity: 0;
}

.catalog-elearning-wrapper .elearning-item:hover .cardBookmark {
    opacity: 1;
}

.cardBookmark a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart.tinvwl-position-after {
    position: absolute;
    border-radius: 100px;
    top: 0;
    z-index: 10;
    margin: 10px;
    padding: 0;
    width: 34px;
    height: 34px;
    background-color: #fff;
    box-shadow: var(--box-shadow);
}

html .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
html .woocommerce ul.products li.product a.tinvwl-button.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
html .woocommerce-page ul.products li.product a.tinvwl-button.tinvwl-icon-heart.tinvwl_add_to_wishlist_button:before,
html a.wishlist_products_counter.top_wishlist-heart:before,
span.wishlist_products_counter.top_wishlist-heart:before,
html a.sidr-class-wishlist_products_counter.sidr-class-top_wishlist-heart:before {
    font-size: 25px;
}

.cardBookmark .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.cardBookmark .woocommerce ul.products li.product a.tinvwl-button.tinvwl_add_to_wishlist_button.tinvwl-icon-heart:before,
.cardBookmark .woocommerce-page ul.products li.product a.tinvwl-button.tinvwl-icon-heart.tinvwl_add_to_wishlist_button:before,
.cardBookmark a.wishlist_products_counter.top_wishlist-heart:before,
span.wishlist_products_counter.top_wishlist-heart:before,
.cardBookmark a.sidr-class-wishlist_products_counter.sidr-class-top_wishlist-heart:before {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}

.tinv-modal-inner {
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
}


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

               Wordpress

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

/* account login page */

.loginLoginformWrapper,
.loginRegisterWrapper {
    display: none;
}

.loginChooseWrapper,
.loginLoginformWrapper,
.loginRegisterWrapper {
    padding-top: 50px;
}

.loginChooseWrapper label,
.loginLoginformWrapper label,
.loginRegisterWrapper label {
    color: var(--light-font-color);
}

.loginLoginformWrapper {
    max-width: 500px;
}

.registerChooseType button {
    display: flex;
    align-items: center;
}

.registerChooseType .active .registerChooseTypeIcon {
    border-color: transparent;
}

.registerChooseType .registerChooseTypeIcon {
    height: 20px;
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    border-radius: 100px;
    background-color: #fff;
    border: 1px solid #9A9B9C;
}

.registerChooseType .active .registerChooseTypeIcon:before {
    content: '';
    position: absolute;
    background-color: var(--primary-color);
    height: 10px;
    width: 10px;
    border-radius: 100px;
}

.registerChooseType .themeButton.active {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.formField {
    flex: 1;
}

.formField.short {
    flex: 0.5;
}

.formField.long {
    flex: 2;
}

.formField:first-child {
    margin-right: 20px;
}

.formField:last-child {
    margin-left: 20px;
}

.formField:first-child:last-child {
    margin: 0px;
}

.registerForm {
    max-width: 900px;
}

.startpage .startLoginNotification {
    position: absolute;
    right: 0;
    left: 0;
}

.formMessage,
html .woocommerce-lost-password .woocommerce-message[role="alert"],
html .woocommerce-checkout .woocommerce-message[role="alert"] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background-color: #fff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    margin-top: 40px;
    padding: 15px 20px 15px 65px;
    position: relative;
    border-radius: var(--border-radius);
    border: 1px solid var(--status-green);
}

html .woocommerce .formMessage.error-message {
    border-color: var(--status-red);
}

.formMessage::before,
html .woocommerce-lost-password .woocommerce-message[role="alert"]::before {
    font-family: "dooiconfont";
    font-size: 26px;
    position: absolute;
    left: 20px;
    content: "\e85a";
    color: var(--status-green);
    top: unset;
}

html .woocommerce .formMessage {
    border: 1px solid var(--secondary-color);
    border-radius: var(--border-radius);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    padding: 1em 2em 1em 3.5em;
    margin: 0 0 2em;
    list-style: none outside;
    width: auto;
    word-wrap: break-word;
}

.formMessage.success-message .message-container {
    padding-left: 0px;
}

.formMessage.error-message h4,
.formMessage.error-message .messageIcon:before {
    color: var(--status-red);
}

.formMessage.success-message h4,
.formMessage.success-message .messageIcon:before {
    color: var(--status-green);
}

.formMessage.success-message h4 {
    margin-top: 0;
}

.formMessage.success-message p {
    margin-bottom: 0;
}

.formMessage.error-message::before {
    content: "\e833";
    color: var(--status-red);
    top: unset;
}

html .woocommerce .formMessage.success-message {
    border-color: var(--status-green);
}

.formMessage.success-message * {
    color: var(--font-color);
}

.formMessage .messageIcon:before {
    margin: 20px;
    font-size: 36px;
}

.formMessage h4 {
    font-size: 20px;
    font-weight: bold;
}

.formMessage h4,
.formMessage p {
    margin: 5px;
}

.productContentInner .formMessage,
.trainingTable .formMessage,
.eventOverviewTable .formMessage {
    margin-top: 0;
    margin-bottom: 40px;
}

.headlineButton {
    margin-top: 0px;
}

.requiredStar {
    color: red !important;
}

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

               Purchase End Page

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

.woocommerce-order section.woocommerce-customer-details,
.woocommerce-order section.woocommerce-order-details,
.woocommerce-notice.woocommerce-thankyou-order-received {
    display: none;
}

.woocommerce-order .orderFeedbackWrapper section.woocommerce-customer-details,
.woocommerce-order .orderFeedbackWrapper section.woocommerce-order-details {
    display: block;
}

.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details {
    padding: 20px;
    margin: 30px 0;
    background-color: var(--white-background);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    width: fit-content;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border-radius: var(--border-radius);
}

[class^="woocommerce-order-overview__"] {
    display: flex;
    flex-direction: column;
    border-right: 1px dashed var(--light-font-color);
    padding: 0 20px 0 10px
}

[class^="woocommerce-order-overview__"]:last-child {
    border: none;
}

.orderFeedbackWrapper {
    margin-top: 80px;
}

.orderFeedback {
    border: 0;
    /* display: flex; */
    align-items: flex-start;
    padding-top: 30px;
}

.orderFeedbackRight {
    width: 100%;
}

.orderFeedbackLeft {
    width: 30%;
}

.orderFeedbackLeft {
    padding: 0px 40px 0px 0px;
}

.orderHeadlineIcon svg {
    min-width: 50px;
    height: 50px;
    padding: 12px;
    background-color: var(--status-green);
    border-radius: 100%;
    margin-right: 30px;
    color: #fff;
}

.orderHeadlineIcon h1 {
    margin: 0;
}

.orderHeadlineText p {
    margin: 5px 0 10px 5px;
}

.orderHeadlineIcon svg path {
    fill: #fff;
}

.orderHeadlineIcon {
    display: flex;
    align-items: center;
}

.woocommerce-order .wc-item-meta {
    width: 50%;
    margin: 0;
    padding: 0;
}

.woocommerce-order .wc-item-meta p {
    margin: 0;
}

.woocommerce-order strong.product-quantity {
    padding: 0 20px 0 5px;
}

.purchaseError {
    padding: 20px;
    border: 2px solid var(--status-red);
    margin: 10px 0;
}

.purchaseError b {
    color: var(--status-red);
}

.purchaseErrorMargin {
    margin: 0 20px;
}

.mainHeadlineContainer {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ssoLogin.button {
    margin-top: 20px !important;
}

.button.ssoLogin {
    height: fit-content;
}

.woocommerce-order-received .catalog-content-button {
    min-width: max-content;
}

/* order details */

.woocommerce-order .orderFeedbackWrapper .orderFeedback .woocommerce-customer-details {
    display: none;
}

.woocommerce-order .orderFeedbackWrapper .orderFeedback .woocommerce-order-details {
    width: 100%;
}

.woocommerce-order .orderFeedbackWrapper .orderFeedback .woocommerce-order-details .woocommerce-order-details__title {
    display: none;
}

.woocommerce-order .orderFeedbackWrapper .orderFeedback .orderFeedbackMain {
    display: none;
}

.orderFeedback .mainHeadlineContainer {
    cursor: pointer;
}

.orderFeedback .dooIcon-arrow-down:before {
    color: var(--primary-color);
    transition: all ease 0.2s;
}

.orderFeedback .mainHeadlineContainer:hover .dooIcon-arrow-down::before {
    color: var(--secondary-color);
}

.orderFeedback .mainHeadlineContainer:hover h4 {
    color: var(--secondary-color);
}

.orderFeedback .orderFeedbackArrowDown.active .dooIcon-arrow-down::before {
    transform: rotate(180deg);
}

/* wide trainings wrapper */
.wide-trainings-container {
    margin: 20px 0;
}

.wide-trainings-container-inner {
    display: flex;
    width: 100%;
    background-color: var(--white-background);
    box-shadow: var(--box-shadow);
    border-radius: var(--border-radius);
}

.wide-training-catalog-image {
    min-width: 100px;
    width: 20%;
    background-size: cover;
    background-position: center center;
    background-image: url(/wp-content/uploads/woocommerce-placeholder.png);
    border-radius: var(--border-radius);
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.wide-training-catalog-content {
    display: flex;
    align-items: flex-end;
    gap: 20px;
    padding: 15px 20px;
    width: 100%;
}

.wide-trainings-wrapper .catalog-content-inner {
    flex-grow: 1;
}

.wide-trainings-wrapper .catalog-content-inner .catalog-content-elearning-type {
    margin: 0;
    color: var(--light-font-color);
}

.wide-trainings-wrapper .catalog-content-inner .catalog-content-title {
    margin: 5px 0 20px 0;
}

.wide-trainings-wrapper .catalog-content-inner p {
    margin: 0;
}

.wide-trainings-wrapper .catalog-content-inner .catalog-content-participants {
    margin-bottom: 10px;
}

.wide-trainings-wrapper .catalog-content-regCode {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.wide-trainings-wrapper .catalog-content-regCode b {
    min-width: fit-content;
}

.wide-trainings-wrapper .regCodeWrapper {
    padding: 8px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: var(--light-background);
    border-radius: var(--border-radius);
    width: -webkit-fill-available;
}

.wide-trainings-wrapper .regCodeWrapper a {
    color: var(--font-color);
}

.wide-trainings-wrapper .regCodeCopy {
    cursor: pointer;
    display: flex;
    align-items: center;
}

.wide-trainings-wrapper .regCodeCopy:hover .dooIcon {
    color: var(--primary-color);
}

.wide-trainings-wrapper .regCodeCopy .dooContainerName-ok {
    display: none;
}

.wide-trainings-wrapper .regCodeCopy.success .dooContainerName-ok {
    display: block;
}

.wide-trainings-wrapper .regCodeCopy.success .dooContainerName-copy {
    display: none;
}

.wide-trainings-wrapper .regCodeCopy.success .dooIcon {
    color: var(--status-green);
}

.wide-trainings-wrapper .regCodeCopyText {
    color: var(--status-green);
    margin-right: 10px;
    display: none;
}

.wide-trainings-wrapper .regCodeCopy.success .regCodeCopyText {
    display: block;
}

.wide-trainings-container-error {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1.5px solid var(--status-red);
    color: var(--status-red);
    padding: 20px;
    margin-top: 5px;
    position: relative;
    border-radius: var(--border-radius);
}

.wide-trainings-container-error .alertIcon::before {
    color: var(--status-red);
}

.container-error-inner,
.container-error-inner b {
    color: var(--status-red);
}

.container-error-code {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 5px 10px;
    color: #fff;
    background-color: #555;
    background-color: var(--status-red);
    font-size: 12px;
    border-radius: var(--border-radius) 0 var(--border-radius) 0;
}

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

               Register Page

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

.registerPageContent {
    padding-top: 30px;
}

.registerPageContent .loginChooseWrapper,
.registerPageContent .loginLoginformWrapper,
.registerPageContent .loginRegisterWrapper {
    padding-top: 10px;
}

.registerPageContent .formFieldPot {
    position: absolute;
    top: -999px;
    left: 0;
    height: 0;
    width: 0;
    z-index: -1
}

.registerAlreadyLoggedIn #loggedInform,
.registerPageContent .buttonPaddingTop {
    padding-top: 10px;
}

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

               WPML

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

.wpmlContainer {
    position: absolute;
    padding: 0px;
    z-index: 100;
    position: absolute;
    top: 0;
    background-color: var(--white-background);
    min-width: 200px;
    border-radius: var(--border-radius);
    box-shadow: var(--box-shadow);
    margin-top: 64px;
    cursor: default;
    visibility: hidden;
    transform: translateY(-10%);
    opacity: 0;
    transition: all ease 0.3s;
}

.wpmlContainer.active {
    visibility: visible;
    transform: translateY(0);
    z-index: 99;
    pointer-events: all;
    opacity: 1;
}

.wpmlContainer .wpml-ls-legacy-list-vertical a {
    padding: 15px 20px;
    width: 160px;
    display: flex;
    align-items: center;
}

.wpmlContainer .wpml-ls-legacy-list-vertical a span {
    color: var(--font-color);
}

.wpmlContainer .wpml-ls-legacy-list-vertical a:hover span {
    color: var(--primary-color);
}

.wpmlContainer .wpml-ls-legacy-list-vertical .wpml-ls-item:not(:last-child) {
    border-bottom: 1px solid var(--grey-background-border);
}

.mainNavLinkIcon.languageSwitch {
    user-select: none;
}

.wpml-ls-statics-shortcode_actions .wpml-ls-current-language>a span,
.wpml-ls-statics-shortcode_actions .wpml-ls-current-language>a:hover span {
    color: var(--primary-color);
}

.currentLanguageIndicator {
    color: var(--tertiary-color);
    text-transform: uppercase;
    padding: 5px;
    min-width: fit-content;
}

.wpml-ls-legacy-list-vertical .wpml-ls-flag {
    display: inline;
    vertical-align: middle;
    border-radius: 15px;
    object-fit: cover;
    width: 15px;
    height: 15px;
}

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

               Responsive

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

@media screen and (max-width:1600px) {
    .wideDesktopPage {
        margin: 0 20px;
    }
}

@media screen and (min-width: 931px) and (max-width:1200px) {
    .productRightContact .productRightBoxInner {
        display: block;
    }

    .productContactInformationPicture {
        max-width: 200px;
    }
}

@media screen and (max-width:1200px) {
    /* .headerText {
		margin: 0 40px;
		width: auto;
	} */
    /* .inner-page-content .woocommerce, h1.cart_headline {
		margin: 0 40px;
	} */
    /* startpage */

    .headlineInvert {
        font-size: 42px;
    }

    .bigHeaderText {
        font-size: 60px !important;
        max-width: 850px;
    }

    .startContactWrapper {
        flex-direction: column;
        align-content: center;
        padding: 70px 60px;
    }

    .startContactText {
        max-width: 450px;
    }

    .startSectionWrapper {
        padding: 70px 60px;
    }

    .startSectionSlider {
        width: calc(100% - 120px);
        padding: 70px 60px;
    }

    /* single product page */
    .additionalCourseInfos {
        margin: 40px;
    }

    .inner-content.productImageInner.desktopPage {
        margin: 0 40px;
    }

    .customSingleProductPage {
        /* padding: 0 20px; */
        box-sizing: border-box;
    }

    /* participant registration page */
    .headerTextWrapper {
        margin: 80px 0px;
    }

    .desktopPage,
    .inner-page-content {
        width: calc(100% - 120px);
    }

    .inner-page-content {
        padding: 0 60px;
    }

    .headerTextStart {
        padding: 0 60px;
    }

    /* event overview */
    .eventOverviewTable .singleEventContentInner {
        flex-wrap: wrap;
        padding: 0;
        justify-content: flex-start;
        gap: 10px 40px;
    }

    .eventOverviewTable .singleEventContent .singleEventContentInner {
        padding: 20px 30px;
    }

    .customSelect {
        width: calc(50% - 40px);
    }

    .eventOverviewTable .singleEventDate {
        width: 100%;
        order: 2;
        margin: 0;
    }

    .eventOverviewTable .singleEventProduct {
        width: 100%;
        order: 1;
    }
    .singleEventContentInnerActive .singleEventProduct {
        display: none;
    }

    .eventOverviewTable .singleEventLocation,
    .eventOverviewTable .singleEventLanguage,
    .eventOverviewTable .singleEventTimezone,
    .eventOverviewTable .singleEventStatus,
    .eventOverviewTable .singleEventAdditional,
    .eventOverviewTable .singleEventPrice {
        order: 3;
        width: auto;
    }

    .singleEventContentInnerActive .singleEventStatus {
        padding: 0;
    }

    .eventOverviewTable .singleEventLink,
    .eventOverviewTable .tableCell.lastRow {
        width: 35%;
        position: absolute;
        right: 10px;
    }

    .eventOverviewTable .singleEventButtonLink {
        position: absolute;
        right: 10px;
    }

    .productpage .singleEventContentInnerActive .singleEventLink {
        display: none;
    }

    .eventOverviewTable .singleEventDate .icon-arrow-down {
        display: none;
    }

    .eventOverviewTable .singleEventContentInnerActive {
        padding: 0;
        width: calc(100% - 60px);
        padding: 20px 30px;
        justify-content: flex-start;
        gap: 20px;
    }

    .singleEventContentInnerActive .singleEventDate {
        margin: 10px 0;
    }

    .singleEventContentInnerActive .singleEventDate,
    .singleEventContentInnerActive .singleEventLocation {
        width: auto;
        min-width: unset;
    }
}

@media screen and (max-width:930px) {
    /* startpage */

    .startIllustrationWrapper {
        display: none;
    }

    /* event overview page */
    .allEventsResponsive {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        width: 100%;
        margin: 10px 0;
        gap: 20px;
    }
    .singleEventResponsive {
        align-items: flex-start;
        flex-direction: column;
    }

    .singleEventContentInnerActive .singleEventDate,
    .singleEventContentInnerActive .singleEventLocation,
    .singleEventContentInnerActive .singleEventLanguage,
    .singleEventContentInnerActive .singleEventTimezone,
    .singleEventContentInnerActive .singleEventStatus,
    .singleEventContentInnerActive .singleEventPrice,
    .singleEventContentInnerActive .tableCell.lastRow {
        display: none;
    }

    .additionalEventLocationText {
        overflow: hidden;
    }

    /* single product page */
    .singleProductHeadlineWrapper.mobile {
        display: block;
    }

    .singleProductHeadlineWrapper.desktop {
        display: none;
    }

    .productContentInner {
        flex-direction: column-reverse;
    }

    .productRight,
    .productRightAdditional {
        width: auto;
        margin: 0;
    }

    .productRightBox {
        margin: 0;
    }

    .productRight,
    .productRightBoxAdditional {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
        margin-top: 20px;
    }

    .productTimetable .tableHeader .tableCell:nth-child(2),
    .productTimetable .tableBody .tableCell:nth-child(2),
    .productTimetable .tableBody .tableEventDetailsList {
        display: none;
    }

    .iconChooseLink {
        padding: 20px 20px;
    }

    .productTimetable th {
        display: none;
    }

    .productTimetable .tableBody .tableRow td:first-child {
        border-radius: var(--border-radius) var(--border-radius) 0 0;
    }

    .productTimetable .tableBody .tableRow td:nth-last-child(2) {
        border-radius: 0 0 var(--border-radius) var(--border-radius);
        padding-bottom: 10px;
    }

    .seminarTableWrapper .eventFilter {
        flex-direction: column-reverse;
        gap: 20px;
        align-items: start;
    }

    /* participant registration */
    .dateLocationWrapper {
        flex-direction: column;
        align-items: start;
        gap: 0;
    }

    .dateLocationWrapper:not(:last-child) {
        margin-bottom: 20px;
    }

    /* purchase form page */
    .purchaseFormExtraFields {
        flex-direction: column;
    }

    .purchaseFormExtraFields .formField:first-child,
    .formField:last-child {
        margin: 0;
    }

    .purchaseFormExtraFields .formField:first-child {
        margin-bottom: 15px;
    }
}

@media screen and (max-width:800px) {

    /* startpage */
    .headlineInvert {
        font-size: 33px;
        margin: 0;
    }

    .bigHeaderText {
        font-size: 50px !important;
        max-width: 550px;
    }

    /* event overview page */
    .singleEventContentInner .singleEventTimezone {
        display: none;
    }

    .eventOverviewTable .singleEventLocation:not(.singleEventContentInnerActive .singleEventLocation),
    .eventOverviewTable .singleEventStatus:not(.singleEventContentInnerActive .singleEventLocation),
    .eventOverviewTable .singleEventAdditional:not(.singleEventContentInnerActive .singleEventLocation),
    .eventOverviewTable .singleEventPrice:not(.singleEventContentInnerActive .singleEventLocation) {
        width: 100%;
    }

    .productpage .additionalEventText {
        width: auto;
    }

    .eventOverviewTable .singleEventButtonLink {
        background-color: var(--primary-color);
    }

    a.singleEventButtonLink i:before {
        color: #fff;
    }

    .registerOverviewTableText,
    .registrationsTableScroll {
        display: none;
    }

    .registerOverviewLink {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }
}

@media screen and (max-width:768px) {
    /* startpage */

    .startHeader,
    .startSectionSlider,
    .startSectionWrapper {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .startContactWrapper {
        margin-bottom: 70px;
    }

    /* participant registration page */
    .registerEvents {
        flex-direction: column;
        gap: 20px;
    }

    .startContactText,
    .startContactInformation {
        max-width: calc(100% - 20px);
    }

    .newParticipantInputs .input-text {
        width: calc(100% - 40px);
    }
    .newParticipantInputs .labelFlex:not(:last-child) .input-text {
        margin-bottom: 10px;
    }


    /* .startContactWrapper {
        padding: 70px 30px;
    } */

    /* single product page */
    .productRightMainWrapper {
        display: block;
    }

    .productRightMain .productRightBoxInner {
        max-width: 300px;
        margin: 0 auto;
    }

    .productRightImage {
        min-height: 300px;
    }

    /* event overview*/
    .singleEventContentInnerActive .singleEventDate {
        flex: 2;
    }

    .singleEventContentInnerActive .singleEventLocation {
        flex: 1;
    }
}

@media screen and (max-width:600px) {
    h1 {
        font-size: 36px;
    }

    h2 {
        font-size: 30px;
    }

    h3,
    h4,
    h5,
    h6 {
        font-size: 18px;
    }

    /* .headerText {
		margin: 0 20px;
	} */
    /* .inner-page-content .woocommerce, h1.cart_headline {
		margin: 0 20px;
	} */

    /*pages margin */
    .desktopPage,
    .inner-page-content {
        width: calc(100% - 60px);
    }

    .contactWrapper {
        width: auto;
        max-width: calc(100% - 60px);
    }

    .cart_totals {
        max-width: 100%;
    }

    .inner-page-content {
        padding: 0 30px;
    }

    /*startpage*/
    .headerTextStart {
        padding: 0 30px;
    }

    .startSectionSlider {
        width: calc(100% - 60px);
        padding: 70px 30px;
    }

    .startContactWrapper {
        padding: 70px 30px;
    }

    .headlineInvert {
        font-size: 28px;
        margin: 0;
    }

    .bigHeaderText {
        font-size: 40px !important;
        max-width: 400px;
    }

    .startSectionWrapper {
        padding: 70px 30px;
    }

    /* event overview page */

    .customSelect {
        width: 100%;
    }

    .eventOverviewTable .eventFilter {
        margin-bottom: 60px;
    }

    .customSelect select {
        max-width: none;
    }

    .singleEventContentInnerActive .singleEventDate,
    .singleEventContentInnerActive .singleEventLocation {
        display: none;
    }

    .additionalEventText {
        margin: 0;
    }

    .eventOverviewTable .singleEventButtonLink {
        position: static;
        order: 4;
        margin: 0;
    }

    /* single product page */
    .productTimetable .tableHeader .tableCell:nth-child(5),
    .productTimetable .tableBody .tableCell:nth-child(5) {
        display: none;
    }

    .eventOverviewTable .singleEventLink,
    .eventOverviewTable .tableCell.lastRow {
        position: static;
        order: 4;
        width: 100%;
    }

    .singleEventLink .flex.flexJustifyEnd {
        display: block;
    }

    /* .productRightBox, .productRightAdditional {
		width: 100%;
	} */
    .productImageHeader {
        height: 250px;
    }

    .productBackButton {
        top: 60px;
    }

    .productBackButton button {
        margin: 0;
    }

    .productTimetable .tableBody .tableCell {
        padding: 10px 10px;
    }

    .additionalCourseInfos {
        flex-direction: column;
        margin: 40px 20px;
    }

    .targetGroupWrapper,
    .requirementsWrapper {
        width: 100%;
    }

    .inner-content.productImageInner.desktopPage {
        margin: 0 20px;
    }

    .productRightImage {
        min-height: 300px;
    }


    /* woocommerce */
    .woocommerce .coupon input[type="text"] {
        min-width: auto !important;
    }

    .woocommerce-checkout .product-total {
        min-width: 70px;
    }

    html .woocommerce form .form-row {
        flex-direction: column;
    }

    .formField:first-child,
    .formField:last-child {
        margin: 0;
    }

    .formField:first-child {
        margin-bottom: 15px;
    }

    /* participant registration page */
    .headerTextWrapper {
        margin: 50px 0px;
    }

    .registerAlert {
        gap: 10px;
    }

    .participantInputRow {
        width: calc(100% - 20px);
    }

    .registerParticipantInformation {
        flex-direction: column;
    }

    .registerParticipantName {
        padding: 0;
        border: none;
        margin-bottom: 3px;
    }

    .add-participant .registerParticipantTitle {
        margin: 0;
    }

    .participantInputRow.rowGap {
        padding-right: 0px;
    }

    .registerParticipantFooter {
        align-items: flex-start;
        flex-direction: column-reverse;
        margin-top: 30px;
    }

    /* purchase action page */
    .orderFeedback {
        flex-direction: column;
        padding: 0px;
    }

    .orderFeedback * {
        text-align: start;
    }

    .orderFeedbackLeft {
        margin: 0;
    }

    /* purchase form page */
    .purchaseFormActionContainer {
        flex-direction: column;
        align-items: inherit;
    }

    /* trainings page */
    .inverseDarkWrapper .themeButton {
        height: auto;
    }
}

@media screen and (max-width:480px) {
    /* startpage */

    .startHeader {
        padding: 50px 0;
    }

    .startSectionSlider,
    .startSectionWrapper {
        padding: 30px 0;
    }

    .arrowButton {
        margin: 20px 0;
    }

    .subheadlineOrange {
        margin-bottom: 30px;
    }

    /* single product page */
    .productTimetable .tableHeader .tableCell:nth-child(4),
    .productTimetable .tableBody .tableCell:nth-child(4) {
        display: none;
    }
}

@media screen and (max-width:420px) {

    /* Startpage */
    .bigHeaderText {
        font-size: 32px !important;
        max-width: 320px;
    }

    .headlineInvert {
        font-size: 20px;
    }

    h1 {
        font-size: 25px;
    }

    h3,
    h4,
    h5,
    h6 {
        font-size: 16px;
    }

    .startSectionSlider {
        padding-bottom: 0;
    }

    .startSliderHeadline {
        margin: 0;
        margin-bottom: 10px;
    }

    .startContactInformationPicture {
        display: none;
    }

    #mehrFragen {
        min-width: 0;
    }

    .startContactWrapper {
        padding: 50px 30px;
        margin-bottom: 50px;
    }

    .startTextWrapper {
        min-width: 0;
    }

}


/* WP FORMS Feedback am Ende des Kaufs */
.customFeedbackWrapper div.wpforms-container-full .wpforms-field-label {
    color: var(--primary-color);
}

:root .customFeedbackWrapper {
    --wpforms-button-background-color: var(--secondary-color);
}

.customFeedbackWrapper div.wpforms-container-full button[type=submit] {
    background: var(--secondary-color);
    border-radius: 0;
}

.customFeedbackWrapper div.wpforms-container-full button[type=submit]:hover {
    background: var(--secondary-color-hover);
}

.customFeedbackWrapper {
    background-color: var(--white-background);
    padding: 1px 20px;
    box-shadow: var(--box-shadow);
    margin-top: 20px;
}

html div.wpforms-container-full .wpforms-confirmation-container-full,
html div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: white;
    border: 1px solid var(--status-green);
    margin-bottom: 0;
}

html div.wpforms-container-full .wpforms-confirmation-container-full p,
html div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) p {
    color: var(--status-green);
}

html div.wpforms-container-full {
    margin: 20px 0;
}

/* honeypot */
input#checkbox3 {
    visibility: hidden;
}
input#hp_ID {
    position: absolute;
    top: -500px;
    left: -500px;
}
input#hp_ID2 {
    position: absolute;
    top: -900px;
    left: -900px;
}