:root {
--bg1: #545454;
--bg1_color:#ffffff;
--bg2: #545454;
--bg2_color:#ffffff;
--bg3: #545454;
--bg3_color:#ffffff;
--bg4: #545454;
--bg4_color:#ffffff;
--bg5: #545454;
--bg5_color:#ffffff;
--smile_color:#82c91e;
--link_acolor:#454545;
--link_hover:#545454;
--main_p:3rem 0;
--headline_p:3rem 0;
}

@font-face{font-family:'lato-regular'; font-display:swap; font-style: normal; font-weight: 400; src: local('Lato'), local('Lato-Regular'), url("/fonts/lato-regular.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:'lato-light'; font-display:swap; font-style: normal; font-weight: 300; src: local('Lato'), local('Lato-Light'), url("/fonts/lato-light.woff2") format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

html,body{max-width:100%; height:101%;}

body, li, h1, p{font-family:"lato-regular",Arial,Helvetica;}
h2, h3, a{font-family:"lato-light",Arial,Helvetica;}

a:link, a:visited{color:var(--link_acolor); text-decoration:none;}
a:hover{color:var(--link_hover);}

img{max-width:100%; height:auto;}
section{padding:var(--main_p);}

.seite{max-width:100%; margin:0 auto;}
.container{max-width:75rem;}
.columns{padding-top:1rem; padding-bottom:1rem;}
.containeri{height:100%; background:#edf2f2; padding:0.25rem;}
.unterstrich{border-bottom:0.0625rem solid #bcbcbc;}
.linkpadding{padding-left:2rem;}

#cookies {background:var(--bg1); padding:0.5rem; color:var(--bg1_color);}
#cookies .textlink{color:var(--bg1_color);}
.alert#cookies {border-radius:0;}
.alert-warning#cookies {border:0px;}
.smiliefarbe {color:var(--smile_color);}


h1{color:#881A10;}
h2{font-size:1.5rem; text-transform:uppercase;}
.untertitel{font-size:1.5rem; text-transform:none;}

#infoboard{position:fixed; background:rgba(33,33,33,0.85); top:0; left:0; z-index:1050; width:100%; height:100%; overflow-x:hidden; overflow-y:auto;}
#infoboard .container{margin-top:1rem;}
#infoboard .card-body{padding:0;}
#infoboard .card{border:none;}
#infoboard h2, #infoboard p{margin:0.5rem;}
#infoboard .btn-primary, .btn-secondary{background-color:transparent; border-color:#343434; text-align:left;}
#infoboard .btn-primary {color:#FFFFFF;}
#infoboard a:link{font-weight:bold;}
.kartenlink:link, .kartenlink:visited, .kartenlink:hover{color:#333; margin:0.5rem;}

.d_grau{background:#343434;}
.igruen{color:#99b977;}
.irot {color:#ff883b;}

#animation{background:#555; color:#fff; padding:var(--main_p);}
#headline{padding:var(--main_p);}
#seiteninhalte p{margin-bottom:0;}

.link{display:inline-block; position:relative; z-index:1;}
.link span{color:#000; text-transform:uppercase; padding:.125rem .625rem; display:block; transition:all 0.3s ease-in-out;}
.link:hover span{color:#000;}
.link:before,.link:after{content:''; background-color:#ed5100; width:100%; height:.25rem; transform:scaleX(0) rotate(7deg); position:absolute; left:0; top:50%; transition:top .15s 0s ease-out, transform .15s .25s ease-out;}
.link:hover:before{transform:scaleX(1) rotate(0); top:0; transition-delay:.25s, 0s;}
.link:hover:after{transform:scaleX(1) rotate(0); top:90%; transition-delay:.25s, 0s;}

.containerlink{display:inline-block; overflow:hidden; position:relative;}
.containerlink:before, .containerlink:after{content:""; width:50%; height:.25rem; background:#881a10; position:absolute; top:0; left:0; opacity:0.7; transition:all 0.4s ease-in-out 0.5s;}
.containerlink:after{background:#ed5100; top:auto; left:auto; bottom:0; right:0;}
.containerlink:hover:before, .containerlink:hover:after{width:.35rem; height:100%;}
.containerlink > span{display:block; padding:10px 20px; color:#333; text-transform:uppercase;}
@media only screen and (max-width: 767px){.containerlink{margin-bottom:1.25rem;}}

.textlink{display:inline-block; padding:0.0625rem 0.3125rem; background:rgba(0,0,0,0.05); color:#ed5100; text-transform:uppercase; z-index:1; position:relative; transition:all 0.3s ease 0s;}
.textlink:hover{color:#fff;}
.textlink:before, .textlink:after{content:""; width:50%; height:100%; background:#ed5100; position:absolute; top:0; left:0; opacity:0; z-index:-1; transform:rotate3d(-1,1,0,100deg); transform-origin:0 0; transition:all 0.3s ease 0s;}
.textlink:after{left:50%; transform-origin:100% 100%;}
.textlink:hover:before,.textlink:hover:after{opacity:1; transform:rotate3d(0,0,0,0);}

#page_footer{margin-top:2.5rem;}
.recht_bg, .copy_bg{padding-top:.5rem; padding-bottom:.5rem;}

.recht_bg{background:#881A10;}
.recht_color i{font-size:2rem;}
.copy_bg{background:#343434; color:#FFF;}

.recht_color i,.recht_color a:link,.recht_color a:visited,.recht_color a:hover,
.copy_color a:link,.copy_color a:visited,.copy_color a:hover{color:#FFF;}

.infobutton{position:static;}
.infobutton .fa-circle{color:#fff; font-size:4rem; top:2rem;}
.infobutton .fa-info-circle{color:#ed5100; font-size:3rem;}

@media screen and (min-width:768px){
.infobutton{position:relative; height:0px; bottom:4.5rem; z-index:2;}
.infobutton .fa-circle{font-size:8rem; top:0;}
.infobutton .fa-info-circle{font-size:6rem;}}

#linkinfo {position:absolute; left:0px; top:-240px; z-index:99; height:0;}
#linkinfo .card {background-color:#fefefe; background-clip:border-box; box-shadow:0 0 1rem #ed5100; border:1px solid rgba(0,0,0,.125); border-radius:1rem;}