/*Dekor Labor 2025#######################*/

*{margin:0;padding:0;}

body {margin: 0;padding: 0;font-family: Arial, sans-serif;line-height: 1.25em;font-size:16px;scroll-behavior: smooth;
      background-image: url('../tpl/bg-d.jpg');background-size: cover;color:white;background-position: center;background-repeat: no-repeat;background-attachment: fixed;
      }

h1 {color:#ccb98e;padding:10px 0 10px 0;line-height:1.3em;font-size:35px;}
h2 {color:#34546b;padding:10px 0 10px 0;line-height:1.3em;font-size:35px;}
h3 {color:#ccb98e;padding:10px 0 10px 0;line-height:1.3em;font-size:25px;font-style: italic;}
h4 {color:#34546b;padding:10px 0 10px 0;line-height:1.3em;font-size:25px;font-style: italic;}
h5 {color:#ccb98e;padding:10px 0 10px 0;line-height:1.3em;font-size:30px;}
h6 {color:#ffffff;padding:10px 0 10px 0;line-height:1.3em;font-size:20px;font-style: italic;}

a:link, a:visited {color:white;text-decoration: underline;}
a:hover,a:active, a.active {color:#ccb98e;}

.txt-center {text-align:center;}
.txt-right {text-align:right;}
.txt-left {text-align:left;}

p {padding:5px 0;margin:15px 0 15px 0;}
ul {padding:5px 0;margin:15px 0 15px 0;}
li {margin-left:25px;}

.logo a{display:block;width:150px;height:150px;background-image:url('../tpl/roestkollektiv-logo.png');background-size:150px auto;background-repeat: no-repeat;margin:0px auto;}
.logo a:hover{opacity: 0.8;}

#head {padding-top:50px; display: flex;flex-direction: column;justify-content: center;align-items: center;text-align: center;}
.block450 {max-width: 450px;padding: 25px;}	
.block300 {border-top:1px solid white;width: 300px;padding: 25px;}		
.block300 i {margin-right:10px;border-radius:20px;padding:3px;border:1px solid white;}
.txt i {margin-right:10px;border-radius:20px;padding:3px;border:1px solid white;}
.txt-wide i {margin-right:10px;border-radius:20px;padding:3px;border:1px solid white;}

#main {width:100%;background:#09131b;padding:50px 0 50px 0;}
.inside {max-width:1200px;margin:0px auto;}
.inside-small {max-width:900px;margin:0px auto;}
.box1 {display:flex;flex-direction:row;align-items:center;padding:25px;}
.box2 {display:flex;flex-direction:row-reverse;align-items:center;padding:25px;}
.pic {width:50%;}
.pic img {width:100%}
.txt {width:44%;padding:0 3%;}
.txt-wide {width:94%;padding:0 3%;}

#footer {width:100%;background:#611112;display:flex;justify-content: center;flex-direction: column;padding:50px 0 100px 0;}

.copy {text-align:center;font-size: 80%;}

a#topBtn {font-size:150%;margin:0;position:fixed;bottom:25px;right:25px;z-index:1111;display:none;transition:0.3s;text-decoration: none;background-color: #34546b;border-radius: 50%;padding:10px;}
a#topBtn:hover {background: #ccb98e;border-radius: 50%;color: black;}

/* cookie */
#cookie-banner {position: fixed;bottom: 0;left: 0;right: 0;background:rgba(0,0,0,0.9);color: white;padding: 25px;text-align: center;font-family: Arial, sans-serif;z-index: 100;}
#cookie-banner button {background-color: #ccb98e;color: #000;border: none;padding: 10px 20px;cursor: pointer;margin: 15px 15px 0 15px;border-radius:25px;}
#cookie-banner button:hover {background-color: #34546b;color:white;}
/* Hide the banner if already accepted */
#cookie-banner.hidden {display: none;}


@media screen and (max-width: 1100px){
body {font-size:85%;}
.pic {width:50%;}
}

@media screen  and (max-width: 900px) and (min-width: 700px){
body {font-size:85%;}
.pic {width:80%;padding:0 10%;}
.box1 {display:flex;flex-direction:column;}
.box2 {display:flex;flex-direction:column;}
.txt {width:80%;padding:0 10%;}
}

@media screen  and (max-width: 700px) and (min-width: 300px){
body {font-size:85%;}
.pic {width:96%;padding:0 2%;}
.box1 {display:flex;flex-direction:column;}
.box2 {display:flex;flex-direction:column;}
.txt {width:96%;padding:0 2%;}
}