.elementor-kit-7{--e-global-color-primary:#3172B9;--e-global-color-secondary:#E0EBF5;--e-global-color-text:#003773;--e-global-color-accent:#A2D0FB;--e-global-color-848fd21:#FFFFFF;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-secondary-font-family:"Roboto";--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-848fd21 );overscroll-behavior:none;--e-page-transition-entrance-animation:e-page-transition-fade-out;--e-page-transition-exit-animation:e-page-transition-fade-in;--e-page-transition-animation-duration:300ms;}.elementor-kit-7 e-page-transition{background-color:var( --e-global-color-848fd21 );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1440px;}.e-con{--container-max-width:1440px;--container-default-padding-top:15px;--container-default-padding-right:15px;--container-default-padding-bottom:15px;--container-default-padding-left:15px;}.elementor-widget:not(:last-child){margin-block-end:30px;}.elementor-element{--widgets-spacing:30px 30px;--widgets-spacing-row:30px;--widgets-spacing-column:30px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:992px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* -------------------------------- 

Global CSS

-------------------------------- */
/* -------------------------------- 

General

-------------------------------- */
body{
overflow-y: scroll;
overflow-x: hidden !important;
font-family: "Roboto", sans-serif !important;
  font-optical-sizing: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-tap-highlight-color: transparent; /* For some Androids */
}

.blur{

-webkit-backdrop-filter: blur(6px);
backdrop-filter: blur(6px);
}

*:focus {
outline: none;
}

input::placeholder, textarea::placeholder {
color:var(--blue) !important;
opacity: 1 !important;
}

.aspect1-1{
aspect-ratio: 1 / 1;
}
.aspect4-3{
aspect-ratio: 4 / 3;
}
.aspect16-9{
aspect-ratio: 16 / 9;
}

.pointer_events_none{
pointer-events: none;
}
.custom_shadow_01{
box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}
.custom_shadow_02{
box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;
}
/* -------------------------------- 
BUTTONs
-------------------------------- */
.elementor-button-icon svg { 
width:30px; vertical-align:middle;
}

/* -------------------------------- 
POPUPs
-------------------------------- */

.dialog-close-button svg {
border-radius: 30px;
border: solid 2px var(--blue);
padding: 5px;
color:var(--blue);
}
.dialog-close-button {
border-radius: 30px;
background:var(--white);
}
@media (max-width: 1112px) {
.dialog-close-button svg {
border-radius: 30px;
border: solid 2.5px var(--blue);
padding: 5px;
color:var(--blue);
}
}

/* -------------------------------- 
FORMS
-------------------------------- */


/* -------------------------------- 
HELPER CLASSES
-------------------------------- */
.mt5{
margin-top:5px;
}
.mt10{
margin-top:10px;
}
.mt15{
margin-top:15px;
}
.mt20{
margin-top:20px;
}
.mt30{
margin-top:30px;
}
.mt40{
margin-top:40px;
}
.mt60{
margin-top:60px;
}
.mt90{
margin-top:90px;
}

.mt-10{
margin-top:-10px;
}
.mt-15{
margin-top:-15px;
}
.mbzero{
margin-bottom:0px;
}
.mb15{
margin-bottom:15px;
}
.mb20{
margin-bottom:20px;
}
.mb30{
margin-bottom:30px;
}
.mb40{
margin-bottom:40px;
}


/* -------------------------------- 

Color
color:var(--red);
-------------------------------- */
:root {
--darkblue: #001e60;
--blue: #3172b9;
--midblue: #83c3ff;
--lightblue: #e0ebf5;
--black: #101820;
--white: #ffffff;
}
.darkblue{
color: #001e60;
}
.blue{
color: #3172b9;
}
.midblue{
color: #83c3ff;
}
.lightblue{
 color: #e0ebf5;
}
.black{
color: #101820;
}
.white{
 color: #ffffff;
}

/* -------------------------------- 
MOBILE NAVIGATION
-------------------------------- */
.nav_desktop{
display:block;
}
.nav_mobile{
display:none;
}
@media (max-width: 992px) {
.nav_desktop{
display:none;
}
.nav_mobile{
display:block;
}
}

/* -------------------------------- 
Responsive Typography
-------------------------------- */
.display_xl { 
font-size: 44px !important; 
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
.display_xl {
font-size: calc(44px + (90 - 44) * ((100vw - 375px) / (1440 - 375))) !important; 
}
}
@media (min-width: 1440px) { 
.display_xl {
font-size: 90px !important;
}
}

.display_l { 
font-size: 40px !important;
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
.display_l {
font-size: calc(40px + (70 - 40) * ((100vw - 375px) / (1440 - 375))) !important; 
}
}
@media (min-width: 1440px) { 
.display_l {
font-size: 705px !important; 
}
}

.display_m { 
font-size: 28px !important;
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
.display_m {
font-size: calc(28px + (56 - 28) * ((100vw - 375px) / (1440 - 375))) !important;
}
}
@media (min-width: 1440px) { 
.display_m {
font-size: 56px !important; 
}
}


h1, .h1 { 
font-size: 28px; 
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
h1, .h1 {
font-size: calc(28px + (40 - 28) * ((100vw - 375px) / (1440 - 375))); 
}
}
@media (min-width: 1440px) { 
h1, .h1 {
font-size: 40px; 
}
}

h2, .h2 { 
font-size: 24px; 
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
h2, .h2 {
font-size: calc(24px + (30 - 24) * ((100vw - 375px) / (1440 - 375))); 
}
}
@media (min-width: 1440px) { 
h2, .h2 {
font-size: 30px; 
}
}


h3, .h3 { 
font-size: 20px; 
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
h3, .h3 {
font-size: calc(20px + (26 - 20) * ((100vw - 375px) / (1440 - 375)));    
}
}
@media (min-width: 1440px) { 
h3, .h3 {
font-size: 26px; 
}
}

h4, .h4 { 
font-size: 18px !important;
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
h4, .h4 {
font-size: calc(18px + (22 - 18) * ((100vw - 375px) / (1440 - 375))) !important;    
}
}
@media (min-width: 1440px) { 
h4, .h4 {
font-size: 22px !important; 
}
}

h5, .h5{ 
font-size: 16px !important;
cursor: default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}
@media (min-width: 375px) { 
h5, .h5 {
font-size: calc(16px + (20 - 16) * ((100vw - 375px) / (1440 - 375))) !important;   
}
}
@media (min-width: 1440px) { 
h5, .h5 {
font-size: 20px !important;
}
}

h6{ 
font-size: 15px; 
cursor: default;
letter-spacing: 3px;
font-weight:900;
text-transform: uppercase;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}

.display_xl, .display_l, .display_m{ 
line-height: 1.1 !important;
}
h1{ 
line-height: 1.3 !important;
}
h2{ 
line-height: 1.3 !important;
}
h3{ 
line-height: 1.2 !important;
}
h4{ 
line-height: 1.2 !important;
}
h5{ 
line-height: 1.3 !important;
}
h6{ 
line-height: 1.2 !important;
}
@media (max-width: 767px) {
.display_xl, .display_l, .display_m{ 
line-height: 1.2 !important;
}
}

p, .p{ 
font-size: 16px !important;
cursor: default;
line-height:1.5;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
@media (min-width: 375px) { 
p, .p {
font-size: calc(16px + (18 - 16) * ((100vw - 375px) / (1140 - 375)));    
}
}
@media (min-width: 1140px) { 
p, .p {
font-size: 18px !important; 
}
}

ul, ol{
font-size:16px !important;
line-height:1.5;
cursor:default;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}
@media (min-width: 375px) { 
ul, ol {
font-size: calc(16px + (18 - 16) * ((100vw - 375px) / (1140 - 375)));    
}
}
@media (min-width: 1140px) { 
ul, ol {
font-size: 18px !important; 
}
}

.p16{ 
font-size: 16px !important;
cursor: default;
line-height:1.5;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-optical-sizing: auto;
font-weight: 400;
}
.p15{ 
font-size: 15px !important;
cursor: default;
line-height:1.3;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-optical-sizing: auto;
font-weight: 400;
}
.p14{ 
font-size: 14px !important;
cursor: default;
line-height:1.3;
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-optical-sizing: auto;
font-weight: 400;
}

.fw8{
font-weight:800;
}
.fw7{
font-weight:700;
}
.fw6{
font-weight:600;
}
.fw5{
font-weight:500;
}
.fw4{
font-weight:400;
}

.italic{
font-style: italic;
}

.uppercase{
text-transform: uppercase;
}

.poppins{
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
}

/* -------------------------------- 

Hyperlinks

-------------------------------- */
a:link{
cursor:pointer !important;
}
.inline_hyper{
cursor:pointer !important;
color:var(--blue);
text-decoration: underline !important;
}
.inline_hyper:hover{
cursor:pointer !important;
color:var(--blue);
text-decoration: underline;
}

/* -------------------------------- 

Homepage

-------------------------------- */

.team_ul{
padding:5px 0px 15px 15px;
list-style-type: disc;
color:var(--darkblue);
font-family: "Roboto", sans-serif;
  font-optical-sizing: auto;
font-size:16px !important;
font-weight:400;
}
#popup_anmeldung{
height:100vh;
}
.table-striped a{
color:var(--blue);
font-size:18px;
margin-top:20px;
}
.table-striped a:hover{
color:var(--darkblue);
}
.svg_icon img{
fill:#3172b9;
}
#hero_hp{
background-image: url("https://www.team-humm.ch/wp-content/uploads/2025/06/hp_hero_bg.webp");
background-repeat: no-repeat;
background-position: center center;
background-size: cover 
}

@media screen and (max-width: 992px) {
#hero_hp{
background-image: url("https://www.team-humm.ch/wp-content/uploads/2025/06/hp_hero_bg_mbl.webp");
background-repeat: no-repeat;
background-position: center bottom;
background-size: cover 
}
}/* End custom CSS */