body{background-color:#485056;font-family:arial, verdana;color:white;}
body *{float:left;padding:0px;margin:0px;border:none;z-index:1;position:absolute;box-sizing:border-box;}
a{text-decoration:none;}
div.kofi{display:flex;justify-content:center;}
input#menu{display:none;}
label.menu{z-index:99;}
#nav{z-index:98;width:150px;height:100%;top:0px;background-color:#212629;position:fixed;}
#nav *{position:relative;}
#nav div.profil{width:inherit;display:flex;align-items:center;}
#nav div.zeile{width:inherit;display:flex;align-items:center;}
#nav div.zeile:hover{background-color:#141719;}
#nav div.zeile:hover > a span{color:#29abe0;}
#nav div.zeile:hover > a div.svg{fill:#29abe0;stroke:#29abe0;}
div.zeile span{color:white;text-align:right;}
div.zeile div.svg{stroke:white;fill:white;}
#nav div#aktuell{background-color:#141719;}
#nav div#aktuell span{color:#29abe0;}
#nav div#aktuell svg{fill:#29abe0;stroke:#29abe0;}
#nav div.footer{width:inherit;height:25px;margin-top:10px;display:flex;align-items:center;justify-content:center;}
#nav div.sn_link svg{fill:white;}
#nav div.sn_link svg:hover{fill:#29abe0;}
#nav div.impressum{width:inherit;position:absolute;}
#nav div.impressum a{color:white;float:right;text-align:right;}
#nav div.impressum a:hover{color:#29abe0;}
#nav div.no_link:hover{cursor:pointer;}
#nav div.no_link:hover > span{color:#29abe0;}
#nav div.no_link:hover svg{fill:#29abe0;}
#shop_list, #support_list{width:200px;padding-top:10px;background-color:#212629;border-left:solid 1px lightgrey;text-align:center;display:none;}
#shop_list a, #support_list a{width:100%;color:white;margin-bottom:10px;}
#shop_list a:hover, #support_list a:hover{color:#29abe0;}
#main{top:0px;width:100%;display:flex;justify-content:center;}
#main *{position:relative;}
#header{width:100%;background-image:url('/images/header_background.png');display:flex;justify-content:center;align-items:center;}
#header img{height:80%;}
#content{width:100%;padding-bottom:10px;}
#content *{float:none;}
#content > div:nth-child(2){margin-top:40px;}
#content p, #auftrag ul{padding:10px 8%;font-size:1.15em;text-align:justify;}
#auftrag p{text-align:justify;}
#auftrag ul{margin-left:20px;}
#content a{color:#29abe0;}
#impressum h1{padding:15px 8% 10px 8%;font-size:1.5em;}
#impressum h1.imp_en{text-decoration:underline;}
#impressum h1.ask{font-style:italic;font-size:1.2em;}
#contact_img{width:334px;left:calc(50% - 167px);margin-bottom:15px;}
#download_img{width:700px;left:calc(50% - 350px);margin-bottom:15px;}
#download_link{width:120px;left:calc(50% - 60px);font-size:1.4em;margin-top:20px;}
#send{top:20px;font-size:1.3em;text-align:center;}
#portfolio_bilder{margin-top:30px;}
#portfolio_bilder div{float:left;}
#portfolio_bilder img{margin-bottom:10px;}
#portfolio_bilder div.portfolio_spalte, #portfolio_weit{margin-left:1%;}
#galerie{top:-10px;height:auto;}
#galerie div.galerie_bild{margin-left:1%;overflow:hidden;float:left;margin-bottom:10px;max-width:500px;}
#big{position:absolute;display:none;left:0px;top:0px;z-index:9999;}
#big_bild{display:flex;align-items:center;width:0px;margin-bottom:100px;transition:width 0.5s;}
#keks{background-color: #212629;font-size: 1.05em;width:300px;height:auto;position:absolute;left:calc(50% - 150px);top:50px;padding: 10px;display: none;}
#keks input{width:140px;height: 25px;left:calc(50% - 70px);position: relative;margin:20px 0px;border-radius: 1em;background-color: #29abe0;color: white;}
@media only screen and (max-width:400px) {
#galerie div.galerie_bild{width:32%;}
}
@media only screen and (min-width:401px) and (max-width:767px) {
#galerie div.galerie_bild{width:23.75%;}
}
@media only screen and (min-width:2370px) {
#galerie {width:2000px;left:calc(50% - 1000px);}
}
@media only screen and (min-width:768px) {
#portfolio_bilder div.portfolio_spalte{width:32%;}
#portfolio_medium{display:none;}
#portfolio_max{display:block;}
#portfolio_weit{width:98%;}
}
@media only screen and (min-width:381px) and (max-width:767px) {
#portfolio_bilder div.portfolio_spalte{width:48.5%;}
#portfolio_max{display:none;}
#portfolio_medium{display:block;}
#portfolio_weit{width:98%;}
}
@media only screen and (max-width:380px) {
#portfolio_bilder div.portfolio_spalte, #portfolio_weit{width:98%;}
#portfolio_max{display:none;}
#portfolio_medium{display:block;}
}
@media only screen and (min-width:1450px){
#portfolio{width:1140px;left:calc(50% - 570px);}
}
@media only screen and (min-width:1250px){
#auftrag, #impressum, #kontakt{width:1000px;left:calc(50% - 500px);}
}
@media only screen and (max-height:360px) {
#hide_height{margin-bottom:-10px;top:-10px;}
#sn{margin-bottom:-10px;}
#nav div.zeile{margin-bottom:-5px;}
#nav .footer, #nav .impressum{margin-bottom:-10px;}
}
@media only screen and (max-width:767px) {
#nav{display:block;width:150px;left:-100%;top:0px;font-size:0.95em;min-height:300px;padding-top:10px;padding-right:15px;}
#nav *{float:left;}
div.profil div.lang{left:12px;height:30px;width:30px;}
div.profil img.flag{width:30px; height:30px;}
#nav div.profil{height:40px;}
div.profil #img, #img img{height:35px;width:35px;}
#img{left:77px;}
#kofi_big{display:none;}
#nav div.zeile, #kofi_small{height:25px;margin-top:10px;}
#kofi_small img{height:25px;}
#kofi_small{float:right;margin-left:25px;}
div.zeile span{left:-15px;width:100px;}
div.zeile div.svg{width:20px;height:20px;left:115px;}
#sn{margin-top:10px;margin-bottom:5px;height:20px;float:right;}
#sn div.sn_link{width:20px;height:20px;margin-left:6px;}
#nav div.impressum{height:20px;bottom:10px;}
#nav_impressum_de a{font-size:0.7em;padding-right:10px;}
#nav_impressum_en a{font-size:0.65em;padding-right:10px;}
#shop_list, #support_list{left:150px;}
#shop_list{top:-95px;}
#support_list{top:-60px;}
#main{width:100%;left:0px;}
#menu_label{display:block;position:fixed;top:10px;left:5px;width:38px;height:38px;background-color:#29abe0;border-radius:20%;}
label.menu span.line{height:2px;width:inherit;background:white;}
label.menu span.line:nth-child(1){top:8px;}
label.menu span.line:nth-child(2){top:18px;}
label.menu span.line:nth-child(3){top:28px;}
#header{height:80px;}
#content{min-height:400px;}
#foto_about{width:300px;left:calc(50% - 150px);}
#download_img{width:75%;left:calc(12.5%);}
}
@media only screen and (min-width:768px) and (max-width:1050px) {
#menu_label{display:none;}
#nav{display:block;width:150px;left:0px;top:0px;font-size:0.95em;min-height:300px;padding-top:10px;padding-right:15px;}
#nav *{float:left;}
div.profil div.lang{left:12px;height:30px;width:30px;}
div.profil img.flag{width:30px; height:30px;}
#nav div.profil{height:40px;}
div.profil #img, #img img{height:35px;width:35px;}
#img{left:77px;}
#kofi_big{display:none;}
#nav div.zeile, #kofi_small{height:25px;margin-top:10px;}
#kofi_small img{height:25px;}
#kofi_small{float:right;margin-left:25px;}
div.zeile span{left:-15px;width:100px;}
div.zeile div.svg{width:20px;height:20px;left:115px;}
#sn{margin-top:10px;margin-bottom:5px;height:20px;float:right;}
#sn div.sn_link{width:20px;height:20px;margin-left:6px;}
#nav div.impressum{height:20px;bottom:10px;}
#nav_impressum_de a{font-size:0.70em;padding-right:10px;}
#nav_impressum_en a{font-size:0.65em;padding-right:10px;}
#shop_list, #support_list{left:150px;}
#shop_list{top:-95px;}
#support_list{top:-60px;}
#main{width:calc(100% - 150px);left:150px;}
#content{min-height:400px;}
#foto_about{width:400px;left:calc(50% - 200px);margin-bottom:20px;}
#header{height:120px;}
#galerie div.galerie_bild{width:23.75%;}
}
@media only screen and (min-width:1051px) {
#menu_label{display:none;}
#nav{display:block;width:250px;left:0px;top:0px;padding-top:20px;padding-right:15px;font-size:1.2em;min-height:540px;}
div.profil div.lang{left:25px;height:40px;width:40px;}
div.profil img.flag{width:40px; height:40px;}
#nav div.profil{height:60px;}
div.profil #img{height:60px;left:120px;}
#img img{height:60px;}
#kofi_small{display:none;}
#kofi_big{margin-top:20px;margin-left:35px;}
#kofi_big img{margin-top:8px;}
#nav div.zeile{height:35px;margin-top:15px;}
div.zeile span{width:170px;padding-right:30px;margin-top:5px;}
div.zeile div.svg{width:30px;height:30px;margin-left:30px;margin-right:20px;}
#sn{float:right;margin-top:10px;margin-right:13px;}
#nav div.sn_link{width:30px;height:30px;}
#nav div.erste{margin-right:11px;}
#nav div.impressum{height:20px;bottom:10px;margin-left:-10px;}
#nav_impressum_de a{font-size:0.8em;padding-right:15px;}
#nav_impressum_en a{font-size:0.8em;padding-right:15px;}
#shop_list, #support_list{left:250px;}
#shop_list{top:-140px;}
#support_list{top:-90px;}
#main{width:calc(100% - 250px);left:250px;}
#content{min-height:560px;}
#foto_about{width:500px;left:calc(50% - 250px);margin-bottom:20px;}
#header{height:200px;}
#galerie div.galerie_bild{width:23.75%;}
}