/*
Theme Name: GULA DEV 3.0 - SteckWeb
Theme URI: http://www.steckdesign.ch/
Author: SteckDesign.ch
Author URI: http://www.steckdesign.ch/
Description: Template by SteckDesign.
Version: 3.0 - 2025
License: no license
License URI: -
Text Domain: -
Domain Path: /languages/
Tags: -
*/
@import url("library/fonts/webfonts/fonts.css");
@import url("library/css/aspect-ratio.css");
@import url("library/css/colors/colors.css");
@import url("library/css/root.css");


/*	============================================================
 *	HTML + BODY
 */
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    height: 100%;
}

/*
 * font Shorthand
 * font-style font-variant font-weight font-size/line-height font-family 
 */
 body {
    font: var( --font-normal ) var( --bodyweight ) var( --fontsize )/var( --lineheight ) var( --body-font );
	letter-spacing: 0px;
	color: var(--sitefgcolor);
    background-color: var(--sitebgcolor);
	margin: 0px;
	padding: 0px;
		display: flex;
		flex-direction: column;
		min-height: 100vh;
}

a, 
a:visited {
    color: var(--site_link_color);
    text-decoration: none;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    text-decoration: none;
}
a:hover {
    color: var(--site_linkhover_color);
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
a:focus {
	outline:0;
}
a:hover,
a:active {
	outline:0;
}
input:focus {
	outline:0;
	border:1px solid #04A4CC;
}

a[id*="dest"] {
    display: block;
    width: 0;
    height: 0;
    position: relative;
    top: calc(-0.5 * var( --size-10 ));
    visibility: hidden;
}

.lead {
    font-size: calc(var( --fontsize ) * 1.15);
	font-weight: var( --bodyweight );
    font-style: var( --font-normal );
    line-height: calc(var( --fontsize ) * 1.6);
	margin-bottom: calc( var( --fontsize ) * 1 );
}
.small {
    font-size: calc(var( --fontsize ) * 0.85);
	font-weight: var( --bodyweight );
    font-style: var( --font-normal );
    line-height: calc(var( --fontsize ) * 1.25);
	margin-bottom: calc( var( --fontsize ) * 0.65 );
}
strong {
	font-weight: var( --titleweight );
    font-style: var( --font-normal );
	letter-spacing: 0.01em;
}
em {
	font-style: var( --font-italic );
}
sup {
    margin-left: 2px;
}
span.initial {
    font-size: calc(var( --fontsize ) * 2.85);
    margin: calc(var( --fontsize ) * 0.58) var( --size-0125 ) 0 calc(var( --fontsize ) * -0.19);
    float: left;
    line-height: 0.5;
}


::-moz-selection {
	background-color: var(--selection_color);
    color: rgba(var(--white), 1);
}
::selection {
	background-color: var(--selection_color);
    color: rgba(var(--white), 1);
}

#ie_hinweis {
	display: block;
	font-size: 1.2em;
	color: #131F5B;
	margin-left: auto;
	width: 1000px;
	margin-right: auto;
}
.preview_bg {
    background: repeating-linear-gradient(
        45deg,
        #ffffff,
        #ffffff 10px,
        #f8f8f8 10px,
        #f8f8f8 20px
    );
}
pre {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: var(--size-075);
    line-height: 1.42857143;
    color: #333;
    word-break: break-all;
    word-wrap: break-word;
    white-space: pre-wrap;
    background-color: rgb(194, 207, 212);
    border: transparent;
    border-radius: 4px;
    max-width: 100%;
}


h1, h2, h3, .h1, .h2, .h3 {
    color: var(--title_color);
	font-family: var( --title-font );
    font-style: var( --font-normal );
	font-weight: var( --titleweight );
	margin: 0px;
	padding: 0px;
}
h4, h5, h6, .h4, .h5, .h6 {
    color: var(--title_color);
	font-family: var( --title-font );
	font-weight: var( --titleweight );
    font-style: var( --font-normal );
	margin: 0px;
	padding: 0px;
}

.titel-big {
    font-size: calc( var( --fontsize ) * 3.9 );
    line-height: calc( var( --fontsize ) * 4.3);
    margin-bottom: calc( var( --fontsize ) * 1.5 );
    letter-spacing: 0rem;
/*     letter-spacing: 0.25rem;
 */    word-spacing: -0.75rem;
}
.titel-extralarge {
    font-size: calc( var( --fontsize ) * 2.6 );
    line-height: calc( var( --fontsize ) * 2.8 );
    margin-bottom: calc( var( --fontsize ) * 0.5 );
    letter-spacing: 0rem;
    /* letter-spacing: 0.25rem; */
    word-spacing: -0.25rem;
}
.titel-large {
    font-size: calc( var( --fontsize ) * 2.3 );
    line-height: calc( var( --fontsize ) * 2.5 );
    margin-bottom: calc( var( --fontsize ) * 0.5 );
    letter-spacing: 0.15rem;
    word-spacing: -0.75rem;
}

h1, .h1 {
    font-size: calc( var( --fontsize ) * 2 );
    line-height: calc( var( --fontsize ) * 2.2 );
    margin-bottom: calc( var( --fontsize ) * 0.45 );
    letter-spacing: 0.05rem;
}
h2, .h2 {
    font-size: calc( var( --fontsize ) * 1.6 );
    line-height: calc( var( --fontsize ) * 1.8);
    margin-bottom: calc( var( --fontsize ) * 0.4 );
    letter-spacing: -0.05rem;
}
h3, .h3 {
    font-size: calc( var( --fontsize ) * 1.45 );
    line-height: calc( var( --fontsize ) * 1.65);
    margin-bottom: calc( var( --fontsize ) * 0.4 );
    letter-spacing: -0.05rem;
}
h4, .h4 {
    font-size: calc( var( --fontsize ) * 1.25 );
    line-height: calc( var( --fontsize ) * 1.45);
    margin-bottom: calc( var( --fontsize ) * 0.3 );
    letter-spacing: -0.025rem;
}
h5, .h5 {
    font-size: calc( var( --fontsize ) * 1.13 );
    line-height: calc( var( --fontsize ) * 1.33);
    margin-bottom: calc( var( --fontsize ) * 0.25 );
    letter-spacing: -0.025rem;
}
h6, .h6 {
    font-size: calc( var( --fontsize ) * 1);
    line-height: calc( var( --fontsize ) * 1.2);
    margin-bottom: calc( var( --fontsize ) * 0.15 );
    letter-spacing: -0.025rem;
}


p {
	margin: 0px;
	padding: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.65 );
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}

ul {
	margin: 0px;
	padding: 0px;
	/* margin-bottom: calc( var( --fontsize ) * 0.65 ); */
    list-style: none;
    text-align:left;
}
ol {
	margin: 0px;
	padding: 0px;
	/* margin-bottom: calc( var( --fontsize ) * 0.65 ); */
    text-align:left;
}
p ~ ul, p ~ ol {
	margin-top: calc( var( --fontsize ) * -0.65 );
}
ul li {
	margin-left: calc( var( --fontsize ) * 0.8 );
	padding-left: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.2 );
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}
@media (min-width: 768px) { 
    ul li {
        margin-left: calc( var( --fontsize ) * 0.8 );
        padding-left: 0px;
        -moz-hyphens: auto;
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        -o-hyphens: auto;
        hyphens: auto; 
    }
}
/*ul li:before {
    content: "\f138";
    font-family: FontAwesome;
    color: red;
    margin-right: 0.5rem;
    margin-left: -1rem;
}*/
ul li:before { /* the custom styled bullets */
    background-color: var(--title_color);
    border-radius: 50%;
    content: "";
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 2px;
    height: 8px;
    width: 8px;
    margin-left: -1.05rem;
}
@media (min-width: 768px) { 
    ul li:before { /* the custom styled bullets */
        background-color: var(--title_color);
        border-radius: 50%;
        content: "";
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 2px;
        height: 8px;
        width: 8px;
        margin-left: -1.05rem;
    }
}

ol li {
	margin-left: calc( var( --fontsize ) * 2 );
	padding-left: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.2 );
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}
.small ul li {
	margin-left: calc( var( --fontsize ) * 0.8 );
	padding-left: 0px;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}
.small ol li {
	margin-left: calc( var( --fontsize ) * 1.5 );
	padding-left: 0px;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}
.lead ol li {
	margin-left: calc( var( --fontsize ) * 2.8 );
	padding-left: 0px;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto; 
}

dl.base,
dl.base_wide,
dl.base_no_line {
    display: grid;
    grid-template-columns: max-content auto;
    column-gap: 0;
    margin: 0px;
    padding: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.8 );
}
dl.base_wide dt,
dl.base dt {
    grid-column-start: 1;
    font-weight: var( --bodyweight );
    padding-right: calc( var( --fontsize ) * 1 );
    margin-bottom: calc( var( --fontsize ) * 0.5 );
    margin-right: 0px;
    border-bottom: 1px solid var(--sitefgcolor_t30);
}
dl.base_wide dd,
dl.base dd {
    grid-column-start: 2;
    text-align: left;
    margin-bottom: calc( var( --fontsize ) * 0.5 );  
    margin-left: 0px;
    border-bottom: 1px solid var(--sitefgcolor_t30);
}
dl.base_no_line dt {
    grid-column-start: 1;
    font-weight: var( --bodyweight );
    padding-right: calc( var( --fontsize ) * 1 );
    margin-bottom: calc( var( --fontsize ) * 0.5 );
    margin-right: 0px;
}
dl.base_no_line dd {
    grid-column-start: 2;
    margin-bottom: calc( var( --fontsize ) * 0.5 );  
    margin-left: 0px;
}
@media (max-width: 575.98px) { 
    dl.base,
    dl.base_wide {
        grid-template-columns: 1fr;
    }
    dl.base dt,
    dl.base_wide dt {
        grid-column-start: 1;
        border-bottom: 0px solid var(--sitefgcolor_t30);
        margin-bottom: calc( var( --fontsize ) * 0.1 );
    }
    dl.base dd,
    dl.base_wide dd {
        grid-column-start: 1;
        margin-bottom: calc( var( --fontsize ) * 0.5 );  
    }
}
@media (min-width: 768px) and (max-width: 1199px) { 
    dl.base,
    dl.base_no_line {
        grid-template-columns: 1fr;
    }
    dl.base dt {
        grid-column-start: 1;
        border-bottom: 0px solid var(--sitefgcolor_t30);
        margin-bottom: calc( var( --fontsize ) * 0.1 );
    }
    dl.base dd {
        grid-column-start: 2;
        margin-bottom: calc( var( --fontsize ) * 0.5 );  
    }
}




dl.image_left {
    display: grid;
    grid-template-columns: 33.33% 66.66%;
    /* grid-template-columns: 40% 60%; */
    align-items: center;
    margin: 0px;
    padding: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.8 );
}
dl.image_left dt {
    grid-column-start: 1;
    font-weight: var( --bodyweight );
    padding-right: calc( var( --fontsize ) * 0.8 );
    padding-top: calc( var( --fontsize ) * 0.8 );
    padding-bottom: calc( var( --fontsize ) * 1 );
    /* margin-bottom: calc( var( --fontsize ) * 0.5 );
    border-bottom: 1px solid var(--sitefgcolor_t30); */
}
dl.image_left dd {
    grid-column-start: 2;
    padding-top: calc( var( --fontsize ) * 0.8 );
    margin-left: calc( var( --fontsize ) * 0.8 );
    /* margin-bottom: calc( var( --fontsize ) * 0.5 );  
    border-bottom: 1px solid var(--sitefgcolor_t30); */
}
@media (max-width: 767.98px) { 
    dl.image_left {
        display: grid;
        grid-template-columns: 100% 100%;
        margin: 0px;
        padding: 0px;
        margin-bottom: calc( var( --fontsize ) * 0.8 );
    }
    dl.image_left dt {
        grid-column-start: 1;
        border-bottom: 0px solid var(--sitefgcolor_t30);
        padding-top: calc( var( --fontsize ) * 0 );
        padding-bottom: calc( var( --fontsize ) * 0.3 );
    }
    dl.image_left dt img {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        max-width: 60%;
    }
    dl.image_left dd {
        text-align: center;
        grid-column-start: 1;
        margin-left: 0px;
        padding-top: calc( var( --fontsize ) * 0 );
        padding-bottom: calc( var( --fontsize ) * 2 );
        margin-bottom: calc( var( --fontsize ) * 2 );
        border-bottom: 1px solid var(--sitefgcolor_t30);
    }    
}

.spalte_40_60.vcenter {
    display: grid;
    grid-template-columns: 40% 60%;
    column-gap: calc( var( --fontsize ) * 1.3 );
    align-items: center;
    margin: 0px;
	margin-bottom: calc( var( --fontsize ) * 0.8 );
    border-bottom: 1px solid var(--sitefgcolor_t30);
}
.spalte_40_60.vcenter:last-child {
    border-bottom: 0px solid var(--sitefgcolor_t30);
}
.spalte_40_60 {
    display: grid;
    grid-template-columns: 40% 60%;
    column-gap: calc( var( --fontsize ) * 1.3 );
    margin: 0px;
    padding-top: calc( var( --fontsize ) * 1.0 );
	margin-bottom: calc( var( --fontsize ) * 0.8 );
    border-bottom: 1px solid var(--sitefgcolor_t30);
}
.spalte_40_60:last-child {
    border-bottom: 0px solid var(--sitefgcolor_t30);
}
.spalte_40_60:nth-child(1) {
    grid-column-start: 1;
	margin-bottom: calc( var( --fontsize ) * 0.8 );
}
.spalte_40_60:nth-child(2)  {
    grid-column-start: 2;
    margin: 0px;
}
/*
.spalte_40_60 p  {
}
*/
.spalte_40_60 img  {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 767.98px) { 
    .spalte_40_60.vcenter,
    .spalte_40_60 {
        display: grid;
        grid-template-columns: 100%;
        column-gap: 0px;
        align-items: none;
        margin: 0px;
        margin-bottom: calc( var( --fontsize ) * 0.8 );
        padding-top: calc( var( --fontsize ) * 1.0 );
        padding-bottom: calc( var( --fontsize ) * 1.2 );
        border-bottom: 1px solid var(--sitefgcolor_t30);
    }
    .spalte_40_60:nth-child(1) {
        grid-column-start: 0;
        text-align: center;
        margin: 0px;
        margin-bottom: calc( var( --fontsize ) * 0.8 );
    }
    .spalte_40_60:nth-child(2)  {
        grid-column-start: 0;
        margin: 0px;
        text-align: center;
    }
    .spalte_40_60 p  {
        text-align: center;
        margin-bottom: calc( var( --fontsize ) * 0.4 );
    }
    .spalte_40_60 img  {
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        max-width: 60%;
    }
}



/*	============================================================
 *	BLOCKQUOTE
 */

    blockquote {
        margin-left: 0px;
        margin-bottom: calc(var( --fontsize ) * 0.25);
        margin-right: 0%;
        padding-top: 0em;
        padding-right: 0px;
        padding-left: calc(var( --fontsize ) * 2);
        padding-bottom: calc(var( --fontsize ) * 0.25);
        position: relative;
        border-left: 0px solid rgba(102,113,138,1.00);
    }
    blockquote strong {
        font-style: bold;
    }
    blockquote:before {
        font-family: Georgia, serif;
        display: block;
        content: "\201C";
        font-size: calc(var( --fontsize ) * 5);
        position: absolute;
        left: -8px;
        top: calc(var( --fontsize ) * 1);
    }
    blockquote cite {
        font-size: calc(var( --fontsize ) * 0.85);
        display: block;
        margin-top: calc(var( --fontsize ) * 0.3);
    }
    blockquote cite:before {
        content: "\2014 \2009";
    }


/*	============================================================
 *	SECTIONS
 */
section {
    padding-left: var(--size-2);
    padding-right: var(--size-2);
    position: relative;
}
section-wide {
    position: relative;
    display: block; 
}

 .contentwidth-90, 
 .contentwidth-80 {
    padding-left: 0px;
    padding-right: 0px;
}
 .contentwidth-70 {
    padding-left: 5%;
    padding-right: 5%;
}
 .contentwidth-60 {
    padding-left: 10%;
    padding-right: 10%;
}
    @media (min-width: 576px) {
        section {
            padding-left: var(--size-4);
            padding-right: var(--size-4);
            position: relative;
        }
        .contentwidth-90 {
            padding-left: 0px;
            padding-right: 0px;
        }
        .contentwidth-70 {
            padding-left: 5%;
            padding-right: 5%;
        }
        .contentwidth-60 {
            padding-left: 10%;
            padding-right: 10%;
        }
    }
    @media (min-width: 768px) { 
        section {
            padding-left: var(--size-8);
            padding-right: var(--size-8);
            position: relative;
        }
       .contentwidth-90 {
            padding-left: 5%;
            padding-right: 5%;
        }
        .contentwidth-80 {
            padding-left: 10%;
            padding-right: 10%;
        }
        .contentwidth-70 {
            padding-left: 15%;
            padding-right: 15%;
        }
        .contentwidth-60 {
            padding-left: 20%;
            padding-right: 20%;
        }
    }

main {
	display: block;
	flex: 1;
}
main img {
    display: block;
    height: auto;
    max-width: 100%;
}

.fadeInBlock {
    opacity:1;
}

.vhtheme {
    height: 100vh;
    /* height: calc( 100vh - var(--fontsize)*9 ); */
    /* height: fit-content; */
    display: grid;
}
.vh100 {
    height: 100vh;
    display: grid;
    min-height:fit-content;
}
.vh75 {
    height: 75vh;
    display: grid;
    min-height: fit-content;
}
.vh50 {
    height: 50vh;
    display: grid;
    min-height: fit-content;
}

.module.cover {
	position: relative;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-webkit-background-size: cover !important;
	-moz-background-size: cover !important;
	-o-background-size: cover !important;
	background-size: cover !important; 
}



/*	============================================================
 *	GRID
 */
 grid_wrapper, .grid_wrapper { display: grid;position:relative; }
 grid_wrapper_inline, .grid_wrapper_inline { display: inline-grid;position:relative; }
    grid_item, .grid_item { display: block;position:relative; }
 .flex_wrapper { display: flex; flex-wrap: wrap; }



/*	============================================================
 *	Footer
 */
#footer {
	font-size: calc( var( --fontsize ) * 0.8 );
}
#footer img {
    display: block;
    height: auto;
    max-width: 100%;
}

/* 
 * Footer Spalten
 */
 /*
#footer .S02, #footer .S03, #footer .S04 {
	margin-bottom: var( --size-05 );
}
*/

#footer .sidebar-mitglieder h3 {
    font-size: calc( var( --fontsize ) * 1.25 );
    text-transform: uppercase;
    letter-spacing: 1px;
	margin-bottom: var( --size-05 );
}
#footer .S01 h4, #footer .S02 h4, #footer .S03 h4, #footer .S04 h4,
#footer .S01 h5, #footer .S02 h5, #footer .S03 h5, #footer .S04 h5,
#footer .S01 h6, #footer .S02 h6, #footer .S03 h6, #footer .S04 h6 {
    text-transform: uppercase;
    letter-spacing: 1px;
	margin-bottom: var( --size-05 );
}
.footer .S01 h3, .footer .S02 h3, .footer .S03 h3, .footer .S04 h3 {
    text-transform: none;
    letter-spacing: 0px;
	margin-bottom: calc( var( --fontsize ) * 0 );
}


/*	--- Footer - Footernav ---
	Links intern ---*/

    /* .footer_content .S02 ul,
    .footer_content .S03 ul,
    .footer_content .S04 ul {
        width: 100%;
        margin-top: 1px;
        border-bottom: 1px dotted rgba(var(--sitefgcolor), 0.6);
    }
    .footer_content .S02 ul li,
    .footer_content .S03 ul li,
    .footer_content .S04 ul li {
        border-top: 1px dotted rgba(var(--sitefgcolor), 0.6);
        margin: 0px;
        padding: 0px;
    }
    .footer_content .S02 ul li a,
    .footer_content .S03 ul li a,
    .footer_content .S04 ul li a {
        display: block;
        padding-top: 4px;
        padding-bottom: 4px;
        text-decoration: none;
    } */
    .footer_content .S02 ul li a:active,
    .footer_content .S02 ul li a:focus,
    .footer_content .S02 ul li a:hover,
    .footer_content .S03 ul li a:active,
    .footer_content .S03 ul li a:focus,
    .footer_content .S03 ul li a:hover,
    .footer_content .S04 ul li a:active,
    .footer_content .S04 ul li a:focus,
    .footer_content .S04 ul li a:hover
    {
        color: var(--sitefgcolor);
    }
/*    
    .footer_content .S02 li a:before,
    .footer_content .S03 li a:before,
    .footer_content .S04 li a:before {
        position: relative;
        top: 0px;
        display: inline-block;
        font-family: 'FontAwesome';
        font-style: normal;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        padding-top: 0px;
        padding-right: 10px;
        padding-left: 0px;
        padding-bottom: 0;
        content: "\f105";
        margin-left:0px;
    }
    */
    .footer_content .S02 li:before,
    .footer_content .S03 li:before,
    .footer_content .S04 li:before {
        background-color: transparent;
        border-radius: 0%!important;
        content: none!important;
        display: block;
        margin-right: 0px!important;
        margin-bottom: 0px!important;
        height: 0px!important;
        width: 0px!important;
        margin-left: 0rem!important;
    }


/*	============================================================
 *	Copyright
 */

#copyright {
	padding-top: calc( var( --fontsize ) * 0.25 );
	padding-bottom: calc( var( --fontsize ) * 0.25 );
	font-size: calc( var( --fontsize ) * 0.6 );
    text-align: center;
    letter-spacing: 0px;
}
#copyright .copyright_content {
    display: grid;
    grid-template-columns: auto auto;
    align-content: space-around;
    justify-content: space-between;
}
/*
#copyright .copyright_item {
}
*/
#copyright a, #copyright a:visited {
    color: rgba(var(--white), 1.0);
    text-decoration: none;
}
#copyright a:hover {
    color: rgba(var(--redviolett), 1.0);
    text-decoration: none;
}
#copyright p {
	margin: 0px;
}


/*	============================================================
 *	Video
 */
.video-container {
    position: relative;
    /* padding-bottom: 56.25%; */
    aspect-ratio: 16/9;
    /* padding-top: 0;
    height: 0;
    overflow: hidden; */
    max-width: 100%;
}
/*
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
*/

/* WP Video Shortcode */
.wp-video { 
    width: 100%!important; 
}
.wp-video .mejs-controls {
    opacity: 0!important;
    transition: all 0.5s ease;
}
.wp-video .mejs-container:hover .mejs-controls {
    opacity: 1!important;
}
/* .mejs-overlay-button {
    display: none !important;
    visibility: hidden !important;
} */

/* .video-block{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.video-block iframe, .video-block object, .video-block embed, .video-block video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } */

iframe {
    max-width: 100%;
  }


/*	============================================================
 *	TABELLE
 */
table {
    display: table;
    border-collapse: separate;
    border-spacing: 0px;
    font-size: calc( var( --fontsize ) * 0.9 );
	text-align:left;
	vertical-align:top;
	padding-left: 0px;
	padding-right:0px;
	width:100%;
	margin-bottom: calc( var( --fontsize ) * 1 );
}
th {
	border-bottom: 1px dotted var(--sitefgcolor_t25);
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 0.25 );
	vertical-align: top;
}
th {
	background-color: var(--sitefgcolor_t15);
}

td {
	border-bottom: 1px dotted var(--sitefgcolor_t30);
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 0.25 );
	vertical-align: top;
}
    
tr:nth-child(odd) {
	background-color: var(--sitefgcolor_t005);
}
tr:nth-child(even) {
	background-color: var(--sitefgcolor_t01);
}


/* 
 * table > div
 */

.display-table { 
    display: table;
    /* border-spacing: calc( var( --fontsize ) * 0.3 ); */
	margin-bottom: calc( var( --fontsize ) * 1 );
}
 .display-table > div {
    display: table-row; 
}
.display-table > div > div { 
    display: table-cell;
    padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 1.75 );
	border-bottom: 1px solid var(--sitefgcolor_t15);
}
.display-table > div:nth-child(odd) {
	background-color: var(--sitefgcolor_t05);
}
.display-table > div:nth-child(even) {
	background-color: var(--sitefgcolor_t01);
}



/* 
 * Theme Table
 */
table.themetable {
    display: table;
    border-collapse: separate;
    border-spacing: 0px;
    font-size: calc( var( --fontsize ) * 0.9 );
	text-align:left;
	vertical-align:top;
	padding-left: 0px;
	padding-right:0px;
	width:100%;
	margin-bottom: calc( var( --fontsize ) * 1 );
}

.themetable th {
	border-bottom: 1px dotted rgba(var(--tablebg), 0.5);
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 0.25 );
	vertical-align: top;
}
.themetable th {
    font-family: var( --title-font );
    font-weight: var( --weight-700 );
	background-color: rgba(var(--tablebg), 0.5);
}

.themetable td {
	border-bottom: 1px dotted rgba(var(--tablebg), 0.5);
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 0.25 );
	vertical-align: top;
}
    
.themetable tr:nth-child(odd) {
	background-color: rgba(var(--tablebg), 0.15);
}
.themetable tr:nth-child(even) {
	background-color: rgba(var(--tablebg), 0.25);
}

table.themetable a {
	color: rgba(var(--tablebg), 1);
	text-decoration: none;
}
table.themetable a:visited {
	color: rgba(102,113,138,1.00);
	text-decoration: none;
}
table.themetable a:hover {
	color: rgba(var(--tablebg), 0.25);
}

@media screen and (max-width:767px) {
	
	table.themetable {
		border:none;
	}
    .themetable thead {
		display:none;
	}
	.themetable tr {
		float: left;
		width: 100%;
        padding-top: calc( var( --fontsize ) * 0.4 );
        padding-bottom: calc( var( --fontsize ) * 0.1 );    
	}
	.themetable td {
		float: left;
		width: 100%;
        padding-top: calc( var( --fontsize ) * 0.4 );
        padding-bottom: calc( var( --fontsize ) * 0.1 );    
	}
	.themetable td::before {
		content:attr(data-label);
		word-wrap: break-word;
		min-width: 30%;
		float:left;
		font-weight: 700;
	}
}


/* 
 * Grid Table
 */
ul.base {
    width: 100%!important;
    display: inline-grid;
    grid-template-columns: repeat(7, auto);
    /*grid-template-columns: auto auto auto;*/
    grid-template-rows: auto;
    font-size: calc( var( --fontsize ) * 0.9 );
    margin: 0px;
    padding: 0px;
	/* margin-bottom: calc( var( --fontsize ) * 0.75 );  */
    list-style: none;
}
ul.base li {
    margin-left: 0px;
    font-weight: var( --bodyweight );
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 1 );
    margin-bottom: 0px;
    border-bottom: 1px solid rgba(var(--tablebg), 0.15);
    background-color: rgba(var(--tablebg), 0.15);
}
ul.base li.header {
    font-family: var( --title-font );
    font-weight: var( --weight-700 );
	background-color: rgba(var(--tablebg), 0.3);
}
ul.base li:before { /* the custom styled bullets */
    background-color: transparent;
    border-radius: 0;
    content: "";
    display: inline-block;
    margin-right: 0px;
    margin-bottom: 0px;
    height: 0px;
    width: 0px;
    margin-left: 0rem;
}

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

    ul.base {
        grid-template-columns: repeat(1, auto);
    }
    ul.base li::before {
        content:attr(data-label);
        word-wrap: break-word;
        min-width: 30%;
        font-family: var( --title-font );
        font-weight: var( --weight-700 );
        background-color: rgba(var(--tablebg), 0.3);
    }
    ul.base li.header {
        display: none;
    }

}


/* 
 * Grid Table
 */
.base-wrapper {
    display: grid;
    grid-template-columns: repeat(7, auto);
    font-size: calc( var( --fontsize ) * 0.9 );
    /*overflow-x: scroll;*/
}
.base-wrapper > div {
    font-weight: var( --bodyweight );
	padding-top: calc( var( --fontsize ) * 0.4 );
	padding-bottom: calc( var( --fontsize ) * 0.1 );
	padding-left: calc( var( --fontsize ) * 0.25 );
	padding-right: calc( var( --fontsize ) * 0.25 );
    border-bottom: 1px solid rgba(var(--tablebg), 0.3);
    background-color: rgba(var(--tablebg), 0.15);
}
.base-wrapper > div strong {
    font-family: var( --title-font );
    font-weight: var( --weight-700 );
}
.base-wrapper > div:nth-child(-n+7) {
	background-color: rgba(var(--tablebg), 0.25);
}


/*	============================================================
 *	WORDPRESS CORE
 */

.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 10px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 10px 0;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
/*
.sticky {
}
.bypostauthor {

}
*/

/*	============================================================
 *	Animations
 */
 @keyframes fade-up {
	0% {
		opacity: 0;
		transform: translateY(50px)
	}

	to {
		opacity: 1;
		transform: translateY(0)
	}
}

.fade-up {
	animation-name: fade-up;
	visibility: visible
}


@keyframes fade-in {
	0% {
		opacity: 0
	}

	to {
		opacity: 1
	}
}

.fade-in {
	animation-name: fade-in
}


@keyframes fade-left {
	0% {
		opacity: 0;
		transform: translate3d(-7%, 0, 0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.fade-left {
	animation-name: fade-left
}
