@charset "utf-8";

@font-face {
font-family: "quicksand_regular";
src: url("../fonts/quicksand_regular.ttf");
}
@font-face {
font-family: "quicksand_bold";
src: url("../fonts/quicksand_bold.ttf");
}

body {font-family: "quicksand_regular", sans-serif;}
h1,h2,h3,h4,h5,h6 {font-family: "quicksand_bold", sans-serif;}
body, html {
    height: 100%;
    color: #777;
    line-height: 1.8;
}

.but01 {
    background-color: rgb(250, 184, 51);
    color: black;
}
.but01:hover {
    background-color: darkgray;
    color: black;
}

.fi_co1 {   /* blau */
    color: #1e314c;
}
.fi_co2 {   /* ocker_dunkel */
    color: #8a6f2f;
}
.fi_co3 {   /* ocker_mittel */
    color: #896e12;
}
.fi_co4 {   /* ocker_hell */
    color: #fab833;
}
.fi_co5 {   /* gelb */
    color: #ffdc36;
}

.fi_bg1 {   /* blau */
    background-color: #1e314c;
}
.fi_bg2 {   /* ocker_dunkel */
    background-color: #8a6f2f;
}
.fi_bg3 {   /* ocker_mittel */
    background-color: #896e12;
}
.fi_bg4 {   /* ocker_hell */
    background-color: #fab833;
}
.fi_bg5 {   /* gelb */
    background-color: #ffdc36;
}

.bgimg-1 {
    background-image: url('../images/0029-20191202-DSCF8760_small.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 75%;
}
.bgimg-2 {
    background-image: url("../images/dandelion_460383_cut_web.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 60%;
}
.bgimg-3 {
    background-image: url("../images/sky_1525902_web.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 60%;
}
.bgimg-4 {
    background-image: url("../images/turkey_3649131_web.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 60%;
}

.w3-wide {letter-spacing: 10px;}
.w3-hover-opacity {cursor: pointer;}

.bild_flex30 {
    width:30%;
    height:30%;
}
@media only screen and (max-width: 600px) {
    .bild_flex30 {
        width:70%;
        height:70%;
    }
}