/*
Theme Name: Divi Child Theme
Theme URI: https://www.wouterhendrixen.nl
Description: Divi Child Theme
Author: Wouter Hendrixen
Author URI: https://www.wouterhendrixen.nl
Template: Divi
Version: Updated for Divi 3+
*/


/*------------------------------------------------*/
/*--------------------[COLORS]--------------------*/
/*------------------------------------------------*/

:root {
	--color-1: #000000;
    --color-2: #ffffff;
    --color-3: #000000;
    --color-4: #000000;
    --color-5: #000000;
    --color-6: #000000;
    --color-7: #000000;
    --color-8: #000000;
    --color-9: #000000;
    --color-10: #000000;
	--warning: #ffc107;
	--danger: #dc3545;
	--succes: #28a745;
}

/*------------------------------------------------*/
/*------------------[TYPOGRAPHY]------------------*/
/*------------------------------------------------*/

/* fonts */
@font-face {
    font-family: "Font-Name";
    src: url("/wp-content/uploads/et-fonts/Font-Name.ttf") format("truetype");
	font-display: swap;
}

:root {
    --font-1: 'Arial', sans-serif;
    --font-2: 'Arial', sans-serif;
    --font-3: 'Arial', sans-serif;
}

/* overal body text proportions */
:root {
    --vw: 4vw;
	--body-font-size: clamp(16px, var(--vw), 16px);
	--body-line-height: clamp(32px, var(--vw), 32px);
}

/* h1 */
h1:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h1 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h1 {
    --vw: 4vw;
    min-height: 0vw;
    font-size: clamp(38px, var(--vw), 54px);
    line-height: clamp(40px, var(--vw), 64px);
    margin-top: clamp(32px, var(--vw), 32px);
    margin-bottom: clamp(24px, var(--vw), 40px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
	-webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* h2 */
h2:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h2 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h2 {
    --vw: 3vw;
    min-height: 0vw;
    font-size: clamp(28px, var(--vw), 36px);
    line-height: clamp(32px, var(--vw), 40px);
    margin-top: clamp(32px, var(--vw), 32px);
    margin-bottom: clamp(8px, var(--vw), 8px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
	-webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* h3 */
h3:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h3 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h3 {
    --vw: 4vw;
    min-height: 0vw;
    font-size: clamp(21px, var(--vw), 24px);
    line-height: clamp(32px, var(--vw), 32px);
    margin-top: clamp(32px, var(--vw), 32px);
    margin-bottom: clamp(8px, var(--vw), 8px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* h4 */
h4:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h4 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h4 {
    --vw: 4vw;
    min-height: 0vw;
    font-size: var(--body-font-size);
    line-height: var(--body-line-height);
    margin-top: clamp(32px, var(--vw), 32px);
    margin-bottom: clamp(0px, var(--vw), 8px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* h5 */
h5:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h5 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h5 {
    --vw: 4vw;
    min-height: 0vw;
    font-size: var(--body-font-size);
    line-height: var(--body-line-height);
    margin-top: clamp(24px, var(--vw), 24px);
    margin-bottom: clamp(0px, var(--vw), 0px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* h6 */
h6:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .h6 * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .h6 {
    --vw: 4vw;
    min-height: 0vw;
    font-size: var(--body-font-size);
    line-height: var(--body-line-height);
    margin-top: clamp(24px, var(--vw), 24px);
    margin-bottom: clamp(0px, var(--vw), 0px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* p */
p:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *), #page-container .p * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .p, footer ul, .et_pb_section ul, .et_pb_section ol, footer ol pre, table:not( .wp-core-ui *), blockquote {
    --vw: 4vw;
    min-height: 0vw;
    font-size: var(--body-font-size);
    line-height: var(--body-line-height);
    margin-top: clamp(0px, var(--vw), 0px);
    margin-bottom: clamp(32px, var(--vw), 32px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* p small */
#page-container .p-small * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .p-small {
    --vw: 4vw;
    min-height: 0vw;
    font-size: clamp(13px, var(--vw), 13px);
    line-height: clamp(16px, var(--vw), 16px);
    margin-top: clamp(0px, var(--vw), 0px);
    margin-bottom: clamp(16px, var(--vw), 16px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* stand first */
#page-container .stand-first p:not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container .et_pb_post_content p:first-of-type {
    --vw: 4vw;
    min-height: 0vw;
    font-size: clamp(16px, var(--vw), 16px);
    line-height: clamp(32px, var(--vw), 32px);
    margin-top: clamp(0px, var(--vw), 0px);
    margin-bottom: clamp(32px, var(--vw), 32px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 700;
    font-family: var(--font-1);
}

/* subtitle */
#page-container .subtitle * :not(.et-fb-component-settings *, .et-fb-module-button-wrap--add *, .ui-sortable div), #page-container * .subtitle {
    --vw: 4vw;
    min-height: 0vw;
    font-size: clamp(16px, var(--vw), 16px);
    line-height: clamp(32px, var(--vw), 32px);
    margin-top: clamp(0px, var(--vw), 0px);
    margin-bottom: clamp(32px, var(--vw), 32px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 700;
    text-transform: uppercase;
    font-family: var(--font-1);
}

/* no top margin first element */
.no-margin-top :first-child * {
    margin-top: 0px !important;
}

/* no bottom margin last element */
.no-margin-bottom :last-child * {
    margin-bottom: 0px !important;
}

/*** hyphens mobile only ***/
@media all and (max-width: 767px) {
	h1, #page-container .h1 *, #page-container * .h1, h2, #page-container .h2 *, #page-container * .h2 {
 		-webkit-hyphens: auto;
    	-ms-hyphens: auto;
		hyphens: auto;
	}
}

/*------------------------------------------------*/
/*---------------------[FORMS]--------------------*/
/*------------------------------------------------*/

.input:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *) {
	--vw: 1.5vw;
    min-height: 0vw;
    font-size: var(--body-font-size) !important;
    line-height: clamp(32px, var(--vw), 32px);
    padding-bottom: clamp(0px, var(--vw), 0px);
    font-weight: 400;
    font-family: var(--font-1);
}

/* placeholder */
.input:not(.wp-fb-ui *, .et-fb-modal *, .et-core-modal *, .nojq *, .wp-core-ui *)::placeholder{
	color: var(--color-1) !important;
}

/* recaptcha */
.grecaptcha-badge { 
	opacity: 0;
}

/*------------------------------------------------*/
/*----------------[BULLETED LISTS]----------------*/
/*------------------------------------------------*/

:root {
    --ul-margin-bottom: 32px;
    --ul-margin-bottom-nested: 0px;
    --ul-margin-top: 0px;
    --ul-line-height: var(--body-line-height);
    --ul-indent: -16px;
    --ul-indent-from-bullet: 16px;
}

/* bullet style */
.et_pb_text_inner ul li:not(.et_pb_social_icon, ul ol > li):before, .et_pb_post_content ul li:not(.et_pb_social_icon, ul ol > li):before, .et_pb_de_mach_content ul li:not(.et_pb_social_icon, ul ol > li):before, footer ul li:not(.et_pb_social_icon, ul ol > li):before, #footer-widgets .footer-widget li:not(.et_pb_social_icon, ul ol > li)::before {
	
    /* custom bullet */
    content: url(https://...);
	position: relative;
    top: 0px !important;
    text-align: right;
    display: table-cell;
	position: relative;
    top: 1px !important;
	
    /* or... */
	
    /* Elegant Themes bullet*/
    content: "\5c"; /* https://www.elegantthemes.com/blog/resources/elegant-icon-font */
    font-family: 'ETmodules';
    font-size: 16px;
    margin-top: 8px;
    font-weight: 400;
    line-height: 0px;
    color: var(--color-1);
    position: relative;
    top: 1px !important;
}

/* bullet style nested list */
.et_pb_text_inner ul ul li:not(.et_pb_social_icon, ul ol > li):before, .et_pb_post_content ul ul li:not(.et_pb_social_icon, ul ol > li):before, .et_pb_de_mach_content ul ul li:not(.et_pb_social_icon, ul ol > li):before, footer ul ul li:not(.et_pb_social_icon, ul ol > li):before, #footer-widgets .footer-widget li:not(.et_pb_social_icon, ul ol > li)::before {
	
    /* custom bullet */
    content: url(https://...);
	position: relative;
    top: 0px !important;
    text-align: right;
    display: table-cell;
	position: relative;
    top: 1px !important;
	
    /* or... */
	
    /* Elegant Themes bullet*/
    content: "\5b"; /* https://www.elegantthemes.com/blog/resources/elegant-icon-font */
    font-family: 'ETmodules';
    font-size: 16px;
    margin-top: 8px;
    font-weight: 400;
    line-height: 0px;
    color: var(--color-1);
    position: relative;
    top: 1px !important;
}

/* margin and padding ul*/
.et_pb_text ul, .et_pb_post_content ul, footer ul:not(.et_pb_social_media_follow), .et_pb_de_mach_content:not(.et_pb_social_media_follow) {
    margin-top: 0px;
    margin-bottom: var(--ul-margin-bottom);
    padding-top: 0px;
    padding-bottom: 0px;
    display: table;
}

.et_pb_text p + ul, .et_pb_post_content p + ul, .et_pb_de_mach_content p + ul {
    margin-top: var(--ul-margin-top);
}

/* remove standard bullets + line height*/
.et_pb_text ul li, .et_pb_post_content ul li, footer ul li, .et_pb_de_mach_content ul li {
    list-style: none;
    display: table-row;
    line-height: var(--ul-line-height);
}

/* indent */
.et_pb_text ul, .et_pb_post_content ul, .et_pb_de_mach_content ul {
    margin-left: var(--ul-indent);
    display: table;
}

/* indent from bullet */
.et_pb_text ul > li::before, .et_pb_post_content ul > li:before, footer ul > li:before, .et_pb_de_mach_content ul > li:before {
    padding-right: var(--ul-indent-from-bullet) !important;
    text-align: right;
    display: table-cell;
}

/* nested ul */
.et_pb_text ul ul, .et_pb_post_content ul ul, footer ul ul, .et_pb_de_mach_content ul ul, .et_pb_text ol ul, .et_pb_post_content ol ul, footer ol ul, .et_pb_de_mach_content ol ul {
    margin-bottom: var(--ul-margin-bottom-nested);
}

/* bullet list footer underline */
footer ul li a:not(.et-social-icons a, .et_pb_social_media_follow *) {
    text-decoration: underline !important;
}

/*
footer ul li::before {
    display: none !important;
} */

/* different bullet in footer
footer ul li:not(.et_pb_social_icon):before, #footer-widgets .footer-widget li:not(.et_pb_social_icon)::before, footer .et_pb_section ul li:not(.et_pb_social_icon)::before {
    content: url(https://...);
    content: "\5a";
    font-family: 'ETmodules';
    font-size: 16px;
    margin-top: 8px;
    font-weight: 400;
    line-height: 0px;
    color: var(--color-1);
 	position: relative;
    top: 0px !important;
} */

/*------------------------------------------------*/
/*----------------[NUMBERED LISTS]----------------*/
/*------------------------------------------------*/

:root {
    --ol-margin-bottom: 32px;
    --ol-margin-bottom-nested: 0px;
    --ol-margin-top: 0px;
    --ol-line-height: var(--body-line-height);
    --ol-indent: 0px;
    --ol-indent-from-number: 28px;
    --ol-indent-from-number-nested: 32px;
}

/* number style */
.et_pb_text ol > li::before, .et_pb_post_content ol > li::before, .et_pb_de_mach_content ol > li::before {
    content: counter(li) ".";
    display: table-cell;
    color: #000000;
    font-weight: 400;
	color: var(--color-1);
	font-family: var(--font-1);
}

.et_pb_text ol ol > li, .et_pb_post_content ol ol > li, .et_pb_de_mach_content ol ol > li {
  counter-increment: item;
}

.et_pb_text ol ol > li::before, .et_pb_post_content ol ol > li::before, .et_pb_de_mach_content ol ol > li::before  {
    counter-increment: li;
    content: counters(li, '.', decimal) ' ' !important;
}

/* margin and padding ol */
.et_pb_text ol, .et_pb_post_content ol, .et_pb_de_mach_content ol {
    margin-top: 0px;
    margin-bottom: var(--ol-margin-bottom);
    padding-top: 0px;
    padding-bottom: 0px;
    counter-reset: li;
    display: table;
}

.et_pb_text p + ol, .et_pb_post_content p + ol, .et_pb_de_mach_content p + ol {
    margin-top: var(--ol-margin-top);
}

/* indent */
.et_pb_text ol, .et_pb_post_content ol, .et_pb_de_mach_content ol {
    padding-left: var(--ol-indent) !important;
}

/* line height */
.et_pb_text ol > li, .et_pb_post_content ol > li, .et_pb_de_mach_content ol > li {
    line-height: var(--ol-line-height);
    counter-increment: li;
    display: table-row;
}

/* indent from number */
.et_pb_text ol > li::before, .et_pb_post_content ol > li::before, .et_pb_de_mach_content ol > li::before {
    --indent: var(--ol-indent-from-number);
    /* verander alleen deze waarde */
    padding-left: var(--indent);
    text-indent: calc(var(--indent) * -1);
}

/* nested ol */
.et_pb_text ol ol, .et_pb_post_content ol ol, .et_pb_de_mach_content ol ol, .et_pb_text ul ol, .et_pb_post_content ul ol, .et_pb_de_mach_content ul ol {
    margin-bottom: var(--ol-margin-bottom-nested);
}

.et_pb_text ol ol > li::before, .et_pb_post_content ol ol > li::before, .et_pb_de_mach_content ol ol > li::before {
    --indent: var(--ol-indent-from-number-nested);
    /* verander alleen deze waarde */
    padding-left: var(--indent);
    text-indent: calc(var(--indent) * -1);
}


/*------------------------------------------------*/
/*-------------------[BUTTONS]--------------------*/
/*------------------------------------------------*/

body #page-container .et_pb_button {
	font-family: var(--font-1);
}

body #page-container .et_pb_button:after {
 
}

@media all and (min-width: 768px) {
    .inline-buttons .et_pb_button_module_wrapper {
        display: inline-block;
    }
}

@media all and (max-width: 767px) {
    .inline-buttons .et_pb_button {
        min-width: 100% !important;
    }
}

.inline-buttons-centered {
    text-align: center !important;
}

/*------------------------------------------------*/
/*-------------------[IMAGES]---------------------*/
/*------------------------------------------------*/ 

.full-width-image .et_pb_image_wrap img,
.full-width-image .et_pb_image_wrap {
    width: 100%;
    height: auto;
}

.image-1-1 .et_pb_gallery_image,
.image-1-1 .et_pb_image_wrap,
.image-1-1 .et_pb_module_inner  {
  padding-top: 100%;
}

.image-2-3 .et_pb_gallery_image,
.image-2-3 .et_pb_image_wrap,
.image-2-3 .et_pb_module_inner  {
  padding-top: 150%;
}

.image-3-2 .et_pb_gallery_image,
.image-3-2 .et_pb_image_wrap,
.image-3-2 .et_pb_module_inner  {
  padding-top: 66.66%;
}

.image-3-4 .et_pb_gallery_image,
.image-3-4 .et_pb_image_wrap,
.image-3-4 .et_pb_module_inner  {
  padding-top: 133.33%;
}

.image-4-3 .et_pb_gallery_image,
.image-4-3 .et_pb_image_wrap,
.image-4-3 .et_pb_module_inner {
  padding-top: 75%
}

.image-9-16 .et_pb_gallery_image,
.image-9-16 .et_pb_image_wrap,
.image-9-16 .et_pb_module_inner  {
  padding-top: 177.77%;
}

.image-16-9 .et_pb_gallery_image,
.image-16-9 .et_pb_image_wrap,
.image-16-9 .et_pb_module_inner  {
  padding-top: 56.25%;
}

.image-1-1 .et_pb_gallery_image,
.image-1-1 .et_pb_image_wrap,
.image-1-1 .et_pb_module_inner,
.image-2-3 .et_pb_gallery_image,
.image-2-3 .et_pb_image_wrap,
.image-2-3 .et_pb_module_inner, 
.image-3-2 .et_pb_gallery_image,
.image-3-2 .et_pb_image_wrap,
.image-3-2 .et_pb_module_inner,
.image-3-4 .et_pb_gallery_image,
.image-3-4 .et_pb_image_wrap,
.image-3-4 .et_pb_module_inner,
.image-4-3 .et_pb_gallery_image,
.image-4-3 .et_pb_image_wrap,
.image-4-3 .et_pb_module_inner, 
.image-9-16 .et_pb_gallery_image,
.image-9-16 .et_pb_image_wrap,
.image-9-16 .et_pb_module_inner,
.image-16-9 .et_pb_gallery_image,
.image-16-9 .et_pb_image_wrap,
.image-16-9 .et_pb_module_inner {
	display: block !important;
} 

.image-1-1 .et_pb_gallery_image img,
.image-1-1 .et_pb_image_wrap img,
.image-1-1 .et_pb_module_inner img,
.image-2-3 .et_pb_gallery_image img,
.image-2-3 .et_pb_image_wrap img,
.image-2-3 .et_pb_module_inner img, 
.image-3-2 .et_pb_gallery_image img,
.image-3-2 .et_pb_image_wrap img,
.image-3-2 .et_pb_module_inner img,
.image-3-4 .et_pb_gallery_image img,
.image-3-4 .et_pb_image_wrap img,
.image-3-4 .et_pb_module_inner img,
.image-4-3 .et_pb_gallery_image img,
.image-4-3 .et_pb_image_wrap img,
.image-4-3 .et_pb_module_inner img, 
.image-9-16 .et_pb_gallery_image img,
.image-9-16 .et_pb_image_wrap img,
.image-9-16 .et_pb_module_inner img,
.image-16-9 .et_pb_gallery_image img,
.image-16-9 .et_pb_image_wrap img,
.image-16-9 .et_pb_module_inner {
  position: absolute !important ;
  height: 100% !important;
  width: 100% !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  object-fit: cover;
}

/* full with on mobile */
@media all and (max-width: 767px) {
    #page-container .full-width-on-mobile {
        width: 100vw;
        max-width: 100vw !important;
        left: 50%;
        right: 50%;
        margin-left: -50vw;
        margin-right: -50vw;
    }
}

/*------------------------------------------------*/
/*-------------------[GENERAL]--------------------*/
/*------------------------------------------------*/

/* Avoid horizontal scrolling on mobile */
#page-container {
	overflow: hidden;
}

/*------------------------------------------------*/
/*--------------------[MENU]----------------------*/
/*------------------------------------------------*/

/* remove hover opacity menu */
#top-menu-nav > ul > li > a:hover {
    opacity: 1;
}

/* shrink menu items on resize */
#top-menu-nav li a {
    --vw: 1.3vw;
    min-height: 0vw;
    font-size: clamp(13px, var(--vw), 16px) !important;
}

/* remove shadow from divi menu 
#main-header, #main-header.et-fixed-header {
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
} */

/*------------------------------------------------*/
/*----------------[MOBILE MENU]-------------------*/
/*------------------------------------------------*/

#dtb-m-menu {
    max-width: 100vw;
    margin-top: 60px
}

#dtb-m-menu li a {
    font-family: var(--font-2);
}

#dtb-m-menu ul ul li > a {
    font-family: var(--font-1) !important;
}

#dtb-m-menu ul ul li:last-of-type a {
    font-family: var(--font-2);
}

#dtb-m-menu .sub-menu a {
    color: var(--color-1) !important;
}

#dtb-m-menu .sub-menu {
    width: 100vh !imporatant;
    margin: 0px -20px;
    padding: 20px 0px;
    box-shadow: inset 0px 11px 20px -20px #000, inset 0px -11px 20px -20px #000;
}

.sub-menu .menu-item {
    font-family: var(--font-2);
}

/*------------------------------------------------*/
/*-------------------[FOOTER]---------------------*/
/*------------------------------------------------*/

/* no border widget footer */
.et_pb_widget_area {
    border: 0px !important;
}

/* same height columns mobile */
@media (max-width: 980px) {
    footer .et_pb_column:not(.footer-credits *) {
        margin-bottom: -32px !important;
    }
}

/* remove parent item from footer menu 
#menu-main-menu .menu-item-has-children::before {
    content: ""
}

.et-l--footer .menu-item-has-children > ul {
    margin-left: -42px ;
}

.et-l--footer .menu-item-has-children > a {
    display: none !important;
}

.et-l--footer .sub-menu {
    margin-bottom: 0px !important;
}
} */

.footer-credits .footer-separator::after {
	content: "|";
	margin: 0px 16px;
} 

/*------------------------------------------------*/
/*-----------------[STAR RATING]------------------*/
/*------------------------------------------------*/

.star {
    display: inline-block;
    color: var(--color-1);
    /* Default star color */
}

.filled {
    color: var(--color-1);
    /* Filled star color */
}

.half-filled {
    position: relative;
}

.half-filled::before {
    content: '\00bd';
    /* Half-star character */
    position: absolute;
    left: 0;
    color: #var(--color-1);
    /* Half-star color */
}


/*------------------------------------------------*/
/*----------------[COOKIE CONSENT]----------------*/
/*------------------------------------------------*/

/* cookie notice styling */
:root {
    /* container */
    --container-bg-color: var(--color-2);
    --container-font-color: var(--color-1);
    --container-link-color: var(--color-3);
    --container-link-color-hover: var(--container-link-color);
    --container-border-radius: 0px;
    --container-line-height: var(--body-line-height);
        
    /* buttons general */
    --button-font-family: var(--font-1);
    --button-text-transform: uppercase;
    --button-font-size: 18px;
    --button-letter-spacing: 0px;
    --button-border-radius: px;
    --button-font-weight: 400;
    --button-padding: 12px 30px;
    
    /* primary button */
    --primary-button-bg-color: var(--color-3);
    --primary-button-border-color: var(--color-3);
    --primary-button-text-color: var(--color-2);
        
    --primary-button-bg-color-hover: var(--color-2);
    --primary-button-border-color-hover: var(--color-3);
    --primary-button-text-color-hover: var(--color-3);
    
    /* secondary button */
    --secondary-button-bg-color: var(--color-3);
    --secondary-button-border-color: var(--color-3);
    --secondary-button-text-color: var(--color-2);
        
    --secondary-button-bg-color-hover: var(--color-2);
    --secondary-button-border-color-hover: var(--color-3);
    --secondary-button-text-color-hover: var(--color-3);
}


/* container */
#ct-ultimate-gdpr-cookie-popup.ct-ultimate-gdpr-cookie-popup-classic {
    border-radius: var(--container-border-radius) !important;
    padding: 32px 32px 16px 32px;
    margin-bottom: 32px;
    width: calc(100% - 64px) !important;
    max-width: 1170px;
    left: 50%;
    transform: translate(-50%, 0%);
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4);
    background-color: var(--container-bg-color) !important;
}

#ct-ultimate-gdpr-cookie-content {
    --vw: 4vw;
    min-height: 0vw;
    font-size: var(--body-font-size) !important;
    line-height: var(--body-line-height);
    margin-bottom: 32px;
    font-family: var(--container-font-family) !important;
    color: var(--container-font-color);
}

/* primary button */
#ct-ultimate-gdpr-cookie-accept {
    padding: var(--button-padding);
    background-color: var(--primary-button-bg-color) !important;
    border-color: var(--primary-button-border-color) !important;
    border-width: 2px;
    color: var(--primary-button-text-color) !important;
    text-transform: var(--button-text-transform);
    font-size: var(--button-font-size) !important;
     transition: all 300ms ease 0ms;
    font-weight: var(--button-font-weight);
    letter-spacing: var(--button-letter-spacing);
    font-family: var(--button-font-family) !important;
    border-radius: var(--button-border-radius);
    line-height: var(--button-line-heigth);
}

/* hover primary button */
#ct-ultimate-gdpr-cookie-accept:hover {
    background-color: var(--primary-button-bg-color-hover) !important;
    border-color: var(--primary-button-border-color-hover);
    opacity: 1;
    color: var(--primary-button-text-color-hover) !important;
}

#ct-ultimate-gdpr-cookie-content a {
    text-decoration: underline;
    color: var(--container-link-color) !important;
}

#ct-ultimate-gdpr-cookie-content a:hover {
    color: var(--container-link-color-hover);
}

/* secondary button */
#ct_ultimate-gdpr-cookie-reject {
    transition: all 300ms ease 0ms;
    border: 2px solid !important;
    border-color: var(--secondary-button-border-color) !important;
    border-radius: var(--button-border-radius);
}

#ct_ultimate-gdpr-cookie-reject a {
    color: var(--secondary-button-text-color) !important;
    background-color: var(--secondary-button-bg-color);
    padding: var(--button-padding)!important;
    text-transform: var(--button-text-transform);
    font-size: var(--button-font-size) !important;
    transition: all 300ms ease 0ms;
    font-weight: var(--button-font-weight);
    letter-spacing: var(--button-letter-spacing);
    font-family: var(--button-font-family) !important;
    border-radius: var(--button-border-radius);
    line-height: var(--button-line-heigth);
}

#ct_ultimate-gdpr-cookie-reject a:hover {
    color: var(--secondary-button-text-color-hover) !important;
    background-color: var(--secondary-button-bg-color-hover);
    opacity: 1 !important;
}

#ct_ultimate-gdpr-cookie-reject:hover {
    border-color: var(--secondary-button-border-color-hover) !important;
}

#ct-ultimate-gdpr-cookie-popup.ct-ultimate-gdpr-cookie-popup-classic #ct_ultimate-gdpr-cookie-reject {
    padding: 0px;
}

/* button icon */
#ct_ultimate-gdpr-cookie-reject i {
    display: none;
}

/* button margin */
#ct-ultimate-gdpr-cookie-popup.ct-ultimate-gdpr-cookie-popup-classic #ct-ultimate-gdpr-cookie-accept, #ct-ultimate-gdpr-cookie-popup.ct-ultimate-gdpr-cookie-popup-classic #ct_ultimate-gdpr-cookie-reject {
    margin: 0px 16px 16px 0px !important;
}

/* hide advanced cookie settings */
#ct-ultimate-gdpr-cookie-change-settings {
    display: none;
}

#ct-ultimate-gdpr-cookie-open {
    display: none !important;
}

/* button styling mobile */
@media all and (max-width: 786px) {
    #ct-ultimate-gdpr-cookie-accept, #ct_ultimate-gdpr-cookie-reject {
        width: 100%;
        text-align: center;
    }

    #ct-ultimate-gdpr-cookie-popup#ct-ultimate-gdpr-cookie-popup {
        margin-bottom: 16px;
        width: calc(100% - 32px) !important;
        left: 50% !important;
        transform: translate(-50%, 0%) !important;
    }
}