/*
 Theme Name:     2Special
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    2Special customizations
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/


/* =Theme customization starts here
------------------------------------------------------- */

/*---------------------------------------- start website settings ----------------------------------------*/
/*--------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------*/

:root {
	--rem:15px;
	--site-width:1440px;
	--row-width:80%;
	--standard-padding:clamp(1.85rem, 3vw, 3rem);
	--line-height:1.75rem;
	--gap-size:clamp(1.85rem, 3vw, 3rem);
	@media only screen and (max-width: 980px) {
		--row-width:90%	
	}
	
	/*------------------- DEFINE COLORS IN RGB ----------------*/
    --RGB-color-first: 3, 50, 108;
    --RGB-color-second: 233, 79, 53;
    --RGB-color-third: 239, 125, 0;
    --RGB-color-fourth: 226, 227, 227;
    --RGB-color-black: 29, 29, 29;
	
	/*------------------- DEFINE border-radius  ----------------*/
	--border-radius: clamp(8px, 1vw, 1rem);
	--border-radius-s: calc(var(--border-radius) / 2);
	--border-radius-xs: calc(var(--border-radius) / 4);
	
}

/*--------------------------------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------------------------------*/
/*----------------------------------------- end website settings -----------------------------------------*/

html,
body {
	font-size: var(--rem)!important;
	color:var(--color-first)!important;
	line-height: var(--line-height)!important;
}

.et_pb_section {
    padding-top: var(--standard-padding);
    padding-bottom: var(--standard-padding);
}

.et_pb_row {
    padding-top: var(--standard-padding)!important;
    padding-bottom: var(--standard-padding)!important;
}


@media (min-width: 981px) {
    .et_flex_column>.et_pb_row, .et_flex_group>.et_pb_row, .et_flex_section>.et_pb_row {
        padding: initial;
    }
}

/*--- set max content width ---*/
.container, .et_pb_row, .et_pb_slider .et_pb_container, .et_pb_fullwidth_section .et_pb_title_container, .et_pb_fullwidth_section .et_pb_title_featured_container, .et_pb_fullwidth_header:not(.et_pb_fullscreen) .et_pb_fullwidth_header_container {
    max-width: var(--site-width);
}

.et_pb_row {
    width: var(--row-width);
}

.et_flex_row, .et_flex_section {
    row-gap: var(--gap-size);
}

.et_flex_section {
	row-gap: 0;
}

/*----------------- menu aanpassingen ----------------------*/

.horizontal-menu.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul {
	display:flex;
	align-items: center;
	gap:2rem;
}

.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li {
    margin-top: 0px;
	border-bottom:1px solid rgba(0,0,0,0.00)!important;
}

.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li a{
	border-bottom:1px solid rgba(0,0,0,0.00)!important;
}

.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li.current_page_item a {
	border-color:var(--color-second)!important;
}

.et_pb_menu .et-menu>li {
    padding-left: 0px;
    padding-right: 0px;
	font-size:1rem;
	line-height: var(--line-height)!important;
}

.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li>a {
    padding-bottom: 0px;
	/*color:var(--color-first)!important;*/
}

.et_pb_menu .et-menu {
    margin-left: 0px;
    margin-right: 0px;
}

.vertical-menu.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul {
	flex-direction: column;
	gap:0;
}

.vertical-menu.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul a {
	line-height: var(--line-height)!important;
}

.vertical-menu.et_pb_menu .et_pb_menu__menu {
        display: flex;
    }

.vertical-menu.et_pb_menu .et_mobile_nav_menu {
	display: none;
}

.vertical-menu.et_pb_menu .et_pb_menu__wrap {
        justify-content: flex-start!important;
    }

/*----------------- hamburger menu ---------------------------------*/

.hamburger {
  width: 30px;
  display: flex;
  flex-direction: column;
  cursor: pointer;
  gap:5px;
}

.line {
  display: block;
  height: 3px;
  width: 100%;
  background: var(--color-first);
  opacity: 1;
  -webkit-transition: .3s ease-in-out;
  -moz-transition: .3s ease-in-out;
  -o-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

.hamburger.open .line {
	background:white;
}

.hamburger .line-1 {
	position: relative;
    top: 0px;
}

.hamburger.open .line-1 {
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
 	position: relative;
    top: 8px;

}

.hamburger.open .line-2 {
	opacity:0;
  
  transition-delay: 100ms;
   transition: all 0.5s ease;
}

.hamburger .line-3 {
	position: relative;
    bottom: 0px;
}

.hamburger.open .line-3 {
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
	position: relative;
    bottom: 8px;
}  

#slide-in-menu-container {
  -webkit-transition: all 0.3s ease !important;
  -moz-transition: all 0.3s ease !important;
  -o-transition: all 0.3s ease !important;
  -ms-transition: all 0.3s ease !important;
  transition: all 0.3s ease !important;
	height: 100vh;
    position: fixed;
    top: 0;
    left: 100%;
    width: 100dvw;
	z-index:9;
}

#slide-in-menu-container.slide-in-menu-open {
	left:0!important;
}

#section-mobile-menu{
  -webkit-transition: all 0.3s ease !important;
  -moz-transition: all 0.3s ease !important;
  -o-transition: all 0.3s ease !important;
  -ms-transition: all 0.3s ease !important;
  transition: all 0.3s ease !important;
}

#section-mobile-menu.open{
	background-color:rgba(0,0,0,0.00)!important;
}

.hide-scrollbar {
	overflow:hidden;
}

#logo.hidden {
    opacity: 1;
	transition: all .3s;
}

#logo.hidden {
    opacity: 0;
}

/*----------------- DEFINE TEXT SIZES ----------------------*/


.et_pb_text h1,
.et_pb_text h2,
.et_pb_text h3,
.et_pb_text h4 {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}


.et_pb_text h1 {
    font-size: clamp(2.5rem, 5.5vw, 5.5rem)!important;
	font-weight: 600!important;
	line-height: 100%;
}

.et_pb_text .h1-size-l h1 {font-size: clamp(2.25rem, 9vw, 9vw);}
.et_pb_text .h1-size-m h1 {font-size: clamp(3rem, 6vw, 6vw);}
.et_pb_text .h1-size-s h1 {font-size: clamp(2.5rem, 2vw, 2vw);}

.et_pb_text h2 {
    font-size: clamp(1.5rem, 2.25vw, 2.25rem) !important;
    line-height: 130%;
   
}

.h2-size-s h2 {font-size: clamp(1.25rem, 2vw, 2rem)!important;}
.h2-size-l h2 {font-size: clamp(1.75rem, 3.vw, 3rem)!important; font-weight:600!important;}


h3 {
    font-size: clamp(1.25rem, 1.75vw, 1.75rem)!important;
    line-height: 130%!important;
	padding-bottom:0;
}

h4 {
    font-size: clamp(16px, 1.25vw, 24px) !important;
    font-weight: 600!important;
	line-height: 150%;
}

.text-s {
	font-size:0.75rem!important;
}

/*----------------------------------- start define colors ---------------------------------*/

 /*--------------- DEFINE COLORS SHORTCODE -----------------*/
:root {	
    --color-first: rgb(var(--RGB-color-first));
    --color-second: rgb(var(--RGB-color-second));
    --color-third: rgb(var(--RGB-color-third));
    --color-fourth: rgb(var(--RGB-color-fourth));
	--color-black: rgb(var(--RGB-color-black));
	
    /*---------- DEFINE OPACITY STEPS COLOR PRIMARY -----------*/
	
    --color-first-10: rgba(var(--RGB-color-first), .1);
    --color-first-20: rgba(var(--RGB-color-first), .2);
    --color-first-30: rgba(var(--RGB-color-first), .3);
    --color-first-40: rgba(var(--RGB-color-first), .4);
    --color-first-50: rgba(var(--RGB-color-first), .5);
    --color-first-60: rgba(var(--RGB-color-first), .6);
    --color-first-70: rgba(var(--RGB-color-first), .7);
    --color-first-80: rgba(var(--RGB-color-first), .8);
    --color-first-90: rgba(var(--RGB-color-first), .9);
    --color-first-95: rgba(var(--RGB-color-first), .95);

    /*---------- DEFINE OPACITY STEPS COLOR second ----------*/
    --color-second-10: rgba(var(--RGB-color-second), .1);
    --color-second-20: rgba(var(--RGB-color-second), .2);
    --color-second-30: rgba(var(--RGB-color-second), .3);
    --color-second-40: rgba(var(--RGB-color-second), .4);
    --color-second-50: rgba(var(--RGB-color-second), .5);
    --color-second-60: rgba(var(--RGB-color-second), .6);
    --color-second-70: rgba(var(--RGB-color-second), .7);
    --color-second-80: rgba(var(--RGB-color-second), .8);
    --color-second-90: rgba(var(--RGB-color-second), .9);
    --color-second-95: rgba(var(--RGB-color-second), .95);

    /*---------- DEFINE OPACITY STEPS COLOR third ----------*/
    --color-third-10: rgba(var(--RGB-color-third), .1);
    --color-third-20: rgba(var(--RGB-color-third), .2);
    --color-third-30: rgba(var(--RGB-color-third), .3);
    --color-third-40: rgba(var(--RGB-color-third), .4);
    --color-third-50: rgba(var(--RGB-color-third), .5);
    --color-third-60: rgba(var(--RGB-color-third), .6);
    --color-third-70: rgba(var(--RGB-color-third), .7);
    --color-third-80: rgba(var(--RGB-color-third), .8);
    --color-third-90: rgba(var(--RGB-color-third), .9);
    --color-third-95: rgba(var(--RGB-color-third), .95);

    /*---------- DEFINE OPACITY STEPS COLOR fourth ----------*/
    --color-fourth-10: rgba(var(--RGB-color-fourth), .1);
    --color-fourth-20: rgba(var(--RGB-color-fourth), .2);
    --color-fourth-30: rgba(var(--RGB-color-fourth), .3);
    --color-fourth-40: rgba(var(--RGB-color-fourth), .4);
    --color-fourth-50: rgba(var(--RGB-color-fourth), .5);
    --color-fourth-60: rgba(var(--RGB-color-fourth), .6);
    --color-fourth-70: rgba(var(--RGB-color-fourth), .7);
    --color-fourth-80: rgba(var(--RGB-color-fourth), .8);
    --color-fourth-90: rgba(var(--RGB-color-fourth), .9);
    --color-fourth-95: rgba(var(--RGB-color-fourth), .95);
	
	/*---------- DEFINE OPACITY STEPS COLOR black ----------*/
    --color-black-5: rgba(var(--RGB-color-black), .05);	
    --color-black-10: rgba(var(--RGB-color-black), .1);
    --color-black-20: rgba(var(--RGB-color-black), .2);
    --color-black-30: rgba(var(--RGB-color-black), .3);
    --color-black-40: rgba(var(--RGB-color-black), .4);
    --color-black-50: rgba(var(--RGB-color-black), .5);
    --color-black-60: rgba(var(--RGB-color-black), .6);
    --color-black-70: rgba(var(--RGB-color-black), .7);
    --color-black-80: rgba(var(--RGB-color-black), .8);
    --color-black-90: rgba(var(--RGB-color-black), .9);
    --color-black-95: rgba(var(--RGB-color-black), .95);
}

/*---------------DEFINE TEXT COLORS -------------------------*/

.h1-color-first h1,
.h2-color-first h2,
.h3-color-first h3,
.h4-color-first h4,
.span-color-first span,
.link-color-first a,
.text-color-first p,
.text-color-first {
    color: var(--color-first) !important;
}

.h1-color-second h1,
.h2-color-second h2,
.h3-color-second h3,
.h4-color-second h4,
.span-color-second span,
.link-color-second a,
.text-color-second p,
.text-color-second,
.text-strong-color-second strong{
    color: var(--color-second) !important;
}

.span-background-color-second span {
    color: white;
    background: var(--color-second);
    padding: 0 .5rem;
}

.h1-color-third h1,
.h2-color-third h2,
.h3-color-third h3,
.h4-color-third h4,
.span-color-third span,
.link-color-third a,
.text-color-third p,
.text-color-third,
.text-strong-color-third strong{
    color: var(--color-third) !important;
}

.link-color-third a {
	text-decoration:underline;
	font-weight:600;
	transition: all 0.5s ease;
}

.link-color-third a:hover {
	opacity:0.6;
}

.h1-color-fourth h1,
.h2-color-fourth h2,
.h3-color-fourth h3,
.h4-color-fourth h4,
.span-color-fourth span,
.link-color-fourth a,
.text-color-fourth p,
.text-color-fourth,
.text-strong-color-fourth strong{
    color: var(--color-fourth) !important;
}

.h1-color-white h1,
.h2-color-white h2,
.h3-color-white h3,
.h4-color-white h4,
.span-color-white span,
.link-color-white a,
.text-color-white,
.text-color-white p {
    color: white !important;
}

.h1-color-black h1,
.h2-color-black h2,
.h3-color-black h3,
.h4-color-black h4,
.span-color-black span,
.link-color-black a,
.text-color-black,
.text-color-black p {
    color: black !important;
}

/*-------------------------------- START Buttons ------------------------------------------- */

a.custom-button, .custom-button a {
	text-align: center!important;
    display: flex!important;
    transition: all 300ms ease 0ms!important;
	align-items: center;
	width:fit-content;
	border-radius: var(--border-radius-xs)!important;
	padding-bottom: 0.25rem!important;
	padding-left: 1rem!important;
	padding-right: 1rem!important;
	padding-top: 0.25rem!important;
}

.custom-button.color-first a {
    color: white!important;
	border: 1px solid var(--color-first)!important;
	background-color: var(--color-first)!important;
}

.custom-button.color-first.outline a {
	color: var(--color-first)!important;
	border: 1px solid var(--color-first)!important;
	background-color: unset!important;
}

.custom-button.color-first.outline a:hover {
	color: white!important;
	border: 1px solid var(--color-first)!important;
	background-color: var(--color-first)!important;
}

.custom-button.color-second a, .custom-form.custom-button input.gform_button {
    color: white!important;
	border: 1px solid var(--color-second)!important;
	background-color: var(--color-second)!important;
}

.custom-button.color-second a:hover, .custom-form.custom-button input.gform_button:hover {
    color: var(--color-second)!important;
	border: 1px solid var(--color-second)!important;
	background-color: white!important;
}

.custom-button.color-second.outline a {
    color: var(--color-second)!important;
	border: 1px solid var(--color-second)!important;
	background-color: white!important;
}

.custom-button.color-second a:hover {
    color: white!important;
	border: 1px solid var(--color-first)!important;
	background-color: var(--color-first)!important;
}

.custom-button.color-third a {
    color: var(--color-first)!important;
	border: 1px solid var(--color-third)!important;
	background-color: var(--color-third)!important;
}

.custom-button.color-third a:hover {
	color: white!important;
	border: 1px solid var(--color-second)!important;
	background-color: var(--color-second)!important;
}

.custom-button.color-white a {
	color: var(--color-first)!important;
	border: 1px solid white!important;
	background-color: white!important;
}

.custom-button.color-white a:hover {
	color: white!important;
	border: 1px solid var(--color-first)!important;
	background-color: var(--color-first)!important;
}


/*-------------------------------- START Border radius ------------------------------------------- */
.border-radius, .border-radius.et_pb_image img {
	border-radius: var(--border-radius);
}

.border-radius.size-s, .border-radius.size-s.et_pb_image img {
	border-radius: var(--border-radius-s)!important;
}

/* ------------------------------ ***** START CUSTOM FORMS ***** ------------------------------*/

.custom-form .gform-theme--foundation .gform_fields{
grid-row-gap: 1rem;
}


.custom-form p.gform_required_legend {
	display:none;
}

.custom-form .gform-theme--framework .gform-field-label>.gfield_required {
   
}

.gf_login_links a:first-child {
	display:none;
}

.gform_heading {
    display: none !important;
}
.custom-form input,
.custom-form textarea {

}



.custom-form input[type=text], .custom-form input[type=email], .custom-form input[type=tel], .custom-form input[type=password], .custom-form input[type=textarea] {
    height: clamp(36px, 3vw, 50px)!important;
	padding: 0 16px!important;
	width:100%;
	border:1px solid var(--color-fourth)!important;
	background:var(--color-fourth-10)!important;
	box-shadow:none!important;
	border-radius:var(--border-radius-xs)!important;
}

.custom-form  textarea {
	padding: 10px 16px!important;
	width:100%;
	border:1px solid var(--color-fourth)!important;
	background:var(--color-fourth-10)!important;
	box-shadow:none!important;
	border-radius:var(--border-radius-xs)!important;
}

.custom-form input::placeholder {
  color: black;
}

.custom-form .gform_wrapper.gravity-theme .gfield_required {
    color: #999;
}



.gform_footer, .gform_wrapper.gravity-theme .gform_page_footer {
    margin: 0!important;
    padding: 8px 0!important;
}

.custom-form label {
	font-size:1rem!important;
	color: var(--color-first)!important;
	/*font-family: "bio-sans", sans-serif;*/
	font-weight:300!important;
}

.custom-form.custom-form-white label {
	color:white!important;
}

.gform-theme--framework .gform-field-label>.gfield_required {
	color:var(--color-first);
}

.custom-form .gform-theme--framework .gform-field-label>.gfield_required {
	color:white;
}

.gfield_required, .gfield_required_asterisk.gfield_required {
	display:none!important;
}


/*--------------------------------- END CUSTOM FORMS ------------------------------*/

/* ------------------------------ > START tabless --------------------------*/

@media only screen and (max-width: 768px) {
.table-holder {
	overflow-x: scroll;
}
}
	
.table-holder .et_pb_code_inner{
	padding:1px;	
}

table {
 	border-collapse: collapse;
    border-radius: var(--border-radius);
    border-style: hidden; /* hide standard table (collapsed) border */
    box-shadow: 0 0 0 1px #666; /* this draws the table border  */ 
	width:100%;
}

table tr:first-child th:first-child  {
    border-top-left-radius: var(--border-radius);
}

table tr:first-child th:last-child  {
    border-top-right-radius: var(--border-radius);
}


td, th {
	padding:.5rem 1rem;
}

th {
	background:var(--color-first);
	color:white;
	text-align:left;
}

tr {
	border:1px solid var(--color-first);
}

.price {
	display: flex;
    justify-content: space-between;
    gap: .5rem;
}

tr td:first-child{
	background:var(--color-third-10);
}

/* ------------------------------ > START Manuel template margins --------------------------*/

/*padding-0*/
.p-0, #page-container .p-0 { padding: clamp(0rem, 0vw, 0rem) !important;}
.pt-0, #page-container .pt-0 { padding-top: clamp(0rem, 0vw, 0rem) !important;}
.pb-0, #page-container .pb-0 { padding-bottom: clamp(0rem, 0vw, 0rem) !important;}
.pr-0, #page-container .pr-0 { padding-right: clamp(0rem, 0vw, 0rem) !important;}
.pl-0, #page-container .pl-0 { padding-left: clamp(0rem, 0vw, 0rem) !important;}
.px-0, #page-container .px-0 { padding-left: clamp(0rem, 0vw, 0rem) !important; padding-right: clamp(0rem, 0vw, 0rem) !important;}
.py-0, #page-container .py-0 { padding-top: clamp(0rem, 0vw, 0rem) !important; padding-bottom: clamp(0rem, 0vw, 0rem) !important;}

/*margin-0*/
.m-0, #page-container .mt-0 { margin: clamp(0rem, 0vw, 0rem) !important;}
.mt-0, #page-container .mt-0 { margin-top: clamp(0rem, 0vw, 0rem) !important;}
.mb-0, #page-container .mb-0 { margin-bottom: clamp(0rem, 0vw, 0rem) !important;}
.mr-0, #page-container .mr-0 { margin-right: clamp(0rem, 0vw, 0rem) !important;}
.ml-0, #page-container .ml-0 { margin-left: clamp(0rem, 0vw, 0rem) !important;}
.mx-0, #page-container .mx-0 { margin-left: clamp(0rem, 0vw, 0rem) !important; margin-right: clamp(0rem, 0vw, 0rem) !important;}
.my-0, #page-container .my-0 { margin-top: clamp(0rem, 0vw, 0rem) !important; margin-bottom: clamp(0rem, 0vw, 0rem) !important;}

:root {
	--05-min: 0.5rem;
	--05-var: 0.5vw;
	--05-max: 1rem;
}

/*padding-0.5*/
.p-0\.5, #page-container .pt-0\.5 { padding: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pt-0\.5, #page-container .pt-0\.5 { padding-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pb-0\.5, #page-container .pb-0\.5 { padding-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pr-0\.5, #page-container .pr-0\.5 { padding-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.pl-0\.5, #page-container .pl-0\.5 { padding-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.px-0\.5, #page-container .px-0\.5 { padding-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   padding-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.py-0\.5, #page-container .py-0\.5 { padding-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   padding-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}

/*margin-0.5*/
.m-0\.5, #page-container .mt-0\.5 { margin: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mt-0\.5, #page-container .mt-0\.5 { margin-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mb-0\.5, #page-container .mb-0\.5 { margin-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mr-0\.5, #page-container .mr-0\.5 { margin-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.ml-0\.5, #page-container .ml-0\.5 { margin-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.mx-0\.5, #page-container .mx-0\.5 { margin-left: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   margin-right: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}
.my-0\.5, #page-container .my-0\.5 { margin-top: clamp(var(--05-min), var(--05-var), var(--05-max)) !important; 
								   margin-bottom: clamp(var(--05-min), var(--05-var), var(--05-max)) !important;}

:root {
	--1-min: 1rem;
	--1-var: 1vw;
	--1-max: 2rem;
}
/*padding-01*/
.p-1, #page-container .p-1 { padding: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pt-1, #page-container .pt-1 { padding-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pb-1, #page-container .pb-1 { padding-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pr-1, #page-container .pr-1 { padding-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.pl-1, #page-container .pl-1 { padding-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.px-1, #page-container .px-1 { padding-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   padding-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.py-1, #page-container .py-1 { padding-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   padding-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}

/*margin-1*/
.m-1, #page-container .m-1 { margin: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mt-1, #page-container .mt-1 { margin-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mb-1, #page-container .mb-1 { margin-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mr-1, #page-container .mr-1 { margin-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.ml-1, #page-container .ml-1 { margin-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.mx-1, #page-container .mx-1 { margin-left: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   margin-right: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}
.my-1, #page-container .my-1 { margin-top: clamp(var(--1-min), var(--1-var), var(--1-max)) !important; 
							   margin-bottom: clamp(var(--1-min), var(--1-var), var(--1-max)) !important;}

:root {
	--15-min: 1rem;
	--15-var: 1vw;
	--15-max: 2rem;
}

/*padding-1.5*/
.p-1\.5, #page-container .p-1\.5 { padding: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pt-1\.5, #page-container .pt-1\.5 { padding-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pb-1\.5, #page-container .pb-1\.5 { padding-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pr-1\.5, #page-container .pr-1\.5 { padding-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.pl-1\.5, #page-container .pl-1\.5 { padding-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.px-1\.5, #page-container .px-1\.5 { padding-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   padding-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.py-1\.5, #page-container .py-1\.5 { padding-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   padding-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}

/*margin-1.5*/
.m-1\.5, #page-container .m-1\.5 { margin: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mt-1\.5, #page-container .mt-1\.5 { margin-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mb-1\.5, #page-container .mb-1\.5 { margin-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mr-1\.5, #page-container .mr-1\.5 { margin-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.ml-1\.5, #page-container .ml-1\.5 { margin-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.mx-1\.5, #page-container .mx-1\.5 { margin-left: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   margin-right: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}
.my-1, #page-container .my-1\.5 { margin-top: clamp(var(--15-min), var(--15-var), var(--15-max)) !important; 
							   margin-bottom: clamp(var(--15-min), var(--15-var), var(--15-max)) !important;}


:root {
	--2-min: 1.5rem;
	--2-var: 2vw;
	--2-max: 2rem;
}
/*padding-2*/
.p-2, #page-container .p-2 { padding: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pt-2, #page-container .pt-2 { padding-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pb-2, #page-container .pb-2 { padding-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pr-2, #page-container .pr-2 { padding-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.pl-2, #page-container .pl-2 { padding-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.px-2, #page-container .px-2 { padding-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   padding-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.py-2, #page-container .py-2 { padding-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   padding-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}

/*margin-2*/
.m-2, #page-container .m-2 { margin: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mt-2, #page-container .mt-2 { margin-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mb-2, #page-container .mb-2 { margin-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mr-2, #page-container .mr-2 { margin-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.ml-2, #page-container .ml-2 { margin-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.mx-2, #page-container .mx-2 { margin-left: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   margin-right: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}
.my-2, #page-container .my-2 { margin-top: clamp(var(--2-min), var(--2-var), var(--2-max)) !important; 
							   margin-bottom: clamp(var(--2-min), var(--2-var), var(--2-max)) !important;}

@media only screen and (max-width: 980px) {
	.m-2-screensize-m, #page-container .m-2-screensize-m { margin: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
}

:root {
	--3-min: 1.5rem;
	--3-var: 3vw;
	--3-max: 6rem;
}
/*padding-3*/
.p-3, #page-container .p-3 { padding: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pt-3, #page-container .pt-3 { padding-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pb-3, #page-container .pb-3 { padding-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pr-3, #page-container .pr-3 { padding-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.pl-3, #page-container .pl-3 { padding-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.px-3, #page-container .px-3 { padding-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   padding-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.py-3, #page-container .py-3 { padding-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   padding-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}

/*margin-3*/
.m-3, #page-container .m-3 { margin: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mt-3, #page-container .mt-3 { margin-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mb-3, #page-container .mb-3 { margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mr-3, #page-container .mr-3 { margin-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.ml-3, #page-container .ml-3 { margin-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.mx-3, #page-container .mx-3 { margin-left: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   margin-right: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
.my-3, #page-container .my-3 { margin-top: clamp(var(--3-min), var(--3-var), var(--3-max)) !important; 
							   margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-3-screensize-m, #page-container .mb-3-screensize-m { margin-bottom: clamp(var(--3-min), var(--3-var), var(--3-max)) !important;}
}

:root {
	--4-min: 2rem;
	--4-var: 4vw;
	--4-max: 4rem;
}
/*padding-4*/
.p-4, #page-container .p-4 { padding: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pt-4, #page-container .pt-4 { padding-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pb-4, #page-container .pb-4 { padding-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pr-4, #page-container .pr-4 { padding-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.pl-4, #page-container .pl-4 { padding-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.px-4, #page-container .px-4 { padding-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   padding-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.py-4, #page-container .py-4 { padding-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   padding-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}

/*margin-4*/
.m-4, #page-container .m-4 { margin: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mt-4, #page-container .mt-4 { margin-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mb-4, #page-container .mb-4 { margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mr-4, #page-container .mr-4 { margin-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.ml-4, #page-container .ml-4 { margin-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.mx-4, #page-container .mx-4 { margin-left: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   margin-right: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
.my-4, #page-container .my-4 { margin-top: clamp(var(--4-min), var(--4-var), var(--4-max)) !important; 
							   margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-4-screensize-m, #page-container .mb-4-screensize-m { margin-bottom: clamp(var(--4-min), var(--4-var), var(--4-max)) !important;}
}

:root {
	--5-min: 2.5rem;
	--5-var: 5vw;
	--5-max: 5rem;
}
/*padding-5*/
.p-5, #page-container .p-5 { padding: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pt-5, #page-container .pt-5 { padding-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pb-5, #page-container .pb-5 { padding-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pr-5, #page-container .pr-5 { padding-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.pl-5, #page-container .pl-5 { padding-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.px-5, #page-container .px-5 { padding-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   padding-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.py-5, #page-container .py-5 { padding-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   padding-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}

/*margin-5*/
.m-5, #page-container .m-5 { margin: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mt-5, #page-container .mt-5 { margin-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mb-5, #page-container .mb-5 { margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mr-5, #page-container .mr-5 { margin-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.ml-5, #page-container .ml-5 { margin-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.mx-5, #page-container .mx-5 { margin-left: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   margin-right: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
.my-5, #page-container .my-5 { margin-top: clamp(var(--5-min), var(--5-var), var(--5-max)) !important; 
							   margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-5-screensize-m, #page-container .mb-5-screensize-m { margin-bottom: clamp(var(--5-min), var(--5-var), var(--5-max)) !important;}
}

:root {
	--6-min: 3rem;
	--6-var: 6vw;
	--6-max: 6rem;
}
/*padding-6*/
.p-6, #page-container .p-6 { padding: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pt-6, #page-container .pt-6 { padding-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pb-6, #page-container .pb-6 { padding-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pr-6, #page-container .pr-6 { padding-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.pl-6, #page-container .pl-6 { padding-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.px-6, #page-container .px-6 { padding-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   padding-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.py-6, #page-container .py-6 { padding-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   padding-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}

/*margin-6*/
.m-6, #page-container .m-6 { margin: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mt-6, #page-container .mt-6 { margin-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mb-6, #page-container .mb-6 { margin-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mr-6, #page-container .mr-6 { margin-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.ml-6, #page-container .ml-6 { margin-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.mx-6, #page-container .mx-6 { margin-left: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   margin-right: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
.my-6, #page-container .my-6 { margin-top: clamp(var(--6-min), var(--6-var), var(--6-max)) !important; 
							   margin-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
@media only screen and (max-width: 980px) {
	.mb-6-screensize-m, #page-container .mb-6-screensize-m { margin-bottom: clamp(var(--6-min), var(--6-var), var(--6-max)) !important;}
}