.datenschutz-link { color: #000000; }
.datenschutz-link:hover { color: #000000 !important; }
div.checkbox { text-align: center; }
div.checkbox label { margin: 0 auto !important; }


#fox-framebox { min-height: 850px; }


.arrow-down {z-index: 999999999999; width: 100% !important; text-align: center; display: flex; justify-content: center; }
.arrow-down { animation: MoveUpDown 2s linear infinite 1s; position: absolute; bottom: 20px; }
@keyframes MoveUpDown { 0%, 100% { bottom: 20px; } 50% { bottom: 40px; } }

#merchground-bild {height: 80vh; position: relative; }

.bg-wrap { clip: rect(0, auto, auto, 0); position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.bg { position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%;
    background-size: cover; background-position: center center; transform: translateZ(0); will-change: transform;
}

/*--------------------------------------------------------------
MENU
--------------------------------------------------------------*/
#responsive-menu-button { z-index: 999999999999999 !important; }
#responsive-menu-container { z-index: 99999999999 !important; }
#responsive-menu-container { background: transparent !important; }
#responsive-menu-wrapper { margin-top: 30px !important; }
#responsive-menu-wrapper, #responsive-menu li a { background: transparent !important; font-size: 14pt !important; font-weight: bold; border: none !important; }
#responsive-menu li a:hover { color: #eeeeee !important; cursor: pointer !important; }



.textbox-button { margin: 20px auto 0 auto; border: 1px solid #ffffff; padding: 5px; max-width: 130px !important; }
.textbox-button:hover { border: 1px solid #000000; font-weight: bold; }

/*---------------------------------------------------------------------------------------------------------------------------------------------------
SPITZBUB CSS 07.2020
---------------------------------------------------------------------------------------------------------------------------------------------------*/
.desktop {display: inherit;}
.mobile, #bgvideo-home.mobile {display: none;}

header#header, article header.header, aside#sidebar, footer#footer {display:none;}
.panel-grid.panel-has-style {margin:0px !important;}

body { background-color: #000000;  }
body, span, div, a, p, #responsive-menu li a, label, input { font-size: 12pt; line-height: normal; font-family: neue-kabel, sans-serif; font-weight: 400; font-style: normal; color: #ffffff; }

h3 { font-size: 12pt; font-weight: bold; }
h4 { font-size: 22pt; font-weight: bold; float: none; text-align: center; justify-content: center; display: block;  width: 100%; margin-bottom: 20px;  }
h4.merchground { color: #000000; margin-bottom: 40px; }

span.highlight { font-size: 14pt; font-weight: bold; }

.content-column { font-size: 14pt; }
#fox-footer a, #fox-footer span { font-size: 8pt; }

.contact-column, .contact-column a { font-size: 10pt; }

.nolinkstyle {text-decoration:none; box-shadow: none; outline: none; }
.linkhover:hover {text-decoration: underline;}
hr.contact-line { border: 0; height: 1px; background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0)); }

.arrow-down {text-align: center; display: flex; justify-content: center; bottom: 5%; position: absolute; margin: auto; width: 100%; }

#home {height:100vh; justify-content: center; }
#home-second {height:100vh;  justify-content: center; }
#home-third {height:auto; justify-content: center; }
.contact {margin-bottom: 0px;}

#fox-footer { bottom: 5% !important; margin-bottom: 20px; width: 100%; color: #ffffff; height: auto; padding: 10px 1% 10px 1%; }
#fox-footer.mg-footer, .mg-footer a, .mg-footer span { color: #000000 !important; }
/*--------------------------------------------------------------
FLEXBOX
--------------------------------------------------------------*/
#fox-flexbox { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; justify-content: center; }
.center-content { justify-content: center !important; text-align: center !important; }
.column { padding: 20px; width: 40%; height: 30%; justify-content: center; text-align: center; margin: 0 5% 0 5%; }

.contact-column { padding: 0px 0 0px 0; justify-content: center; text-align: center; }
.first { width: 35%; margin-left: 5%; padding-left: 5%; }
.second { width: 20%; }
.third { width: 35%; margin-right: 5%; padding-right: 5%; }
.content-column { padding: 0px; width: 55%; justify-content: center; text-align: center; }

#panel-1738-1-0-0 { margin-bottom: 10px !important; }

/*--------------------------------------------------------------
MOBILE STARTSEITE + FOOTER
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
.desktop, .textbox  {display:none !important;}
.mobile, #bgvideo-home.mobile {display:inherit !important;}

#fox-framebox { height: 90vh !important; width: 100%; }


body, span, div, a, p, #responsive-menu li a, label, input { font-size: 8pt !important; }
.contact-column, .contact-column a, h3 { font-size: 8pt !important; }
#fox-footer a, #fox-footer span { font-size: 6pt !important; }
#fox-footer { padding: 0 3% 5% 3% !important; }

.contact-column { padding: 5px !important; }
.first { width: 33% !important; margin-left: 0% !important; padding-left: 3% !important; }
.second { width: 33% !important; }
.third { width: 33% !important; margin-right: 0% !important; padding-right: 3% !important; }
.contact, #panel-1738-1-0-0 { margin-bottom: 20px !important; }

#foxgrnd-logo-box, #foxgrndmedia-logo-box, #mgrnd-logo-box { width: 100% !important; padding: 0px !important; margin-bottom: 5% !important; }
.textbox { margin: 0px !important; }
.textbox-button { margin-top: 0px !important; }

.column { padding: 20px; width: 100%; display: block !important; height: auto; margin: 0px !important; }

#foxgrnd-logo { width: 100px !important; margin: auto;  transform: scale(1.5); }
#foxgrndmedia-logo { width: 100px !important; margin: auto; transition: 1.5s all; }
#mgrnd-logo { width: 100px !important; margin: auto; transition: 1.5s all; }

.fox-frame { width: 100%; height: auto; justify-content: center; text-align: center; top: 50%; margin-top: -100px !important; }
}
/*--------------------------------------------------------------
MOBILE MERCHGROUND
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
#panel-1625-0-0-0, #panel-1625-0-0-1 { margin-bottom: 0px !important; }

#mg-box { height: 100px !important; display: flex; justify-content: center !important; align-items: center; text-align: center; float: none; }
.mg-headerlogo { max-width: 45% !important; margin: 40px 0 0 0 !important; }
h4.merchground { font-size: 11pt !important; margin-bottom: 0px !important;  }
h4 { font-size: 11pt !important; margin-bottom: 0px !important; margin-top: 20px !important;  }

.mg-textbox, .mg-textbox div { display: block !important; position: relative !important; height: auto !important; color: #000000 !important; background: #ffffff; }
.mg-textbox div { padding: 0 10% 0 10% !important; }
.mg-img-mobile { display: block !important; max-width: 100% !important; width: 100% !important; height: auto; margin: 20px auto 20px auto !important; }

.mg-logobox { display: block !important; height: 40vh; }
.mg-fairtradelogo { max-height: 40px !important; }
.mg-fairtradelogo:nth-child(2) { max-height: 24px !important; margin: 0 30px 6px 30px !important; }

form#CF5f2bfb555993b_1 { width: 90% !important; margin: 0px auto 20px auto !important; padding: 0px 0 10px 0 !important; }
form#CF5f2bfb555993b_1 .row { margin-bottom: 0px !important; }

.caldera-grid .form-control::-webkit-input-placeholder { font-size: xx-small !important; }
.caldera-grid .form-control:-moz-placeholder { font-size: xx-small !important; }
.caldera-grid .form-control::-moz-placeholder { font-size: xx-small !important; }
.caldera-grid .form-control:-ms-input-placeholder { font-size: xx-small !important; }
}

/* -- IOS ZOOOM - -- */
@media screen and (-webkit-min-device-pixel-ratio:0) { 
  select,
  textarea,
  input { font-size: 16px !important;  }
}
/* ----------- DISABLE LANDSCAPE MOBILE ------------ */
#turn-device { display: none; }
@media only screen and (orientation: landscape) and (max-width: 768px) {
.turn-one { max-width: 15%; }
.turn-two { max-width: 5%; }
html, body { background-color: #000000; background: #000000; overflow: hidden; }
    #turn-device { display: flex; justify-content: center !important; align-items: center; text-align: center;
        background-color: #000000; background: #000000; z-index: 9999999999999999999;
        display: block;
        height: 100vh; overflow: hidden !important; padding-top: 10%;
        position: fixed;
        top: 0; left: 0; right: 0;
        width: 100%;
    }
}


/*--------------------------------------------------------------
COOKIE HINWEIS
--------------------------------------------------------------*/
div.pea_cook_wrapper { align-items: center; justify-content: center;
z-index:999999999999999999999999999999999999 !important; background: #000000 !important; background-color: #000000 !important; opacity: 1; 
border-radius: 0 !important; min-width: 100% !important; top: 0px !important; left: 0px !important; margin: 0px !important; position: fixed !important;
}
.pea_cook_wrapper p a { font-size: small !important; }
.pea_cook_wrapper p a:hover { color: #000000 !important; font-color: #000000 !important; }
.pea_cook_wrapper p { width: 100%; min-height: 90px; padding: 40px 40px 40px 40px; align-items: center; justify-content: center; 
                                       font-size: small !important; text-align: justify; font-family: aktiv-grotesk, sans-serif !important; font-style: normal; line-height: normal; }

#pea_cook_btn { display: block; margin-right: auto; margin-left: auto; margin-top: 20px; padding: 5px;
background: #000000 !important; background-color: #000000 !important; border: 1px solid #FFFFFF; border-radius: 0px; box-shadow: none; color: #fff; text-shadow: none; }
#pea_cook_btn:hover { background: #ffffff !important; background-color: #ffffff !important; color: #000000; }

div.eucookie span { font-color: #fff !important; color: #fff !important; }