/*
#################################
 Cookie / Datenschutz Info
#################################
*/

#cdi {
         display: block;
         position: fixed;
         z-index: 50001;

         bottom: 5vw;
         left: 10vw;
         width: calc(100% - 40px);
         max-width: calc(80vw - 40px);

         background: #FFFFFF;
         padding: 20px;

         color: #000000;
         font-size: 1.1em;
         font-weight: normal;
         text-shadow: #FFFFFF 1px 1px 0px;
         text-align: center;

         -webkit-box-shadow: inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25), 0px 0px 25px 0px rgba(0, 0, 0, 0.35);
         -moz-box-shadow:    inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25), 0px 0px 25px 0px rgba(0, 0, 0, 0.35);
         box-shadow:         inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25), 0px 0px 25px 0px rgba(0, 0, 0, 0.35);
}
#cdi .cdi-l { float: left; width: 80px; margin-right: 20px; }
#cdi .cdi-r { float: left; width: calc(100% - 100px); }

#cdi .cdi-clear { clear:both; line-height:0.0em; height: 0px; display: block; }

#cdi .cdi-info, #cdi .cdi-button {
         float:none;
         width: calc(100% - 40px);
         padding: 10px 20px 10px 20px;
         text-align: left;
}

#cdi .cdi-info a, #cdi .cdi-info a:visited {
         color: #000000;
         font-weight: bold;
         text-decoration: underline;
         text-shadow: #FFFFFF 1px 1px 0px;

         padding: 0px 0px;
         transition: 0.3s;
}

#cdi .cdi-info a:hover { color: #ff5400; }

#cdi .cdi-button form { margin: 0px; padding: 0px; }

#cdi .cdi-button input[type="button"] {
         display: block;
         float: left;
         width: calc(50% - 20px);
         transition: 0.3s;
         cursor: pointer;

         background: #FFDF00;

         font-size: 1.1em;
         color: #2F2F2F;
         font-weight: normal;
         text-shadow: #FFFF00 1px 1px 0px;
         text-decoration: none;
         text-align: center;

         padding: 7px 0px;
         margin: 0px 0px;

         border: 1px #FFBF00 solid;
         -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;

         -webkit-box-shadow: inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25);
        -moz-box-shadow:    inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25);
        box-shadow:         inset 0px 1px 1px 0px rgba(255, 255, 255, 0.25);
}
#cdi .cdi-button input[type="button"][name="cookie_all"] { float: right; font-weight: bold;  }
#cdi .cdi-button input[type="button"][name="cookie_ok"] { background: #CFCFCF; color: #000000; text-shadow: rgba(255,255,255,0.5) 1px 1px 0px; border: 1px #BFBFBF solid; }
#cdi .cdi-button input[type="button"]:hover { background: #5F5F5F !important; color: #FFFFFF; text-shadow: rgba(0,0,0,0.5) 1px 1px 0px; border: 1px #1F1F1F solid; }

#cdi-shadow {
         display: block;
         position: fixed;
         z-index: 50000;
         top: 0px;
         left: 0px;
         right: 0px;
         bottom: 0px;

         background-color: rgba(0, 0, 0, 0.7);
         width: 100%;
         height: 100%;
}

@media (max-width: 800px) {
         #cdi { font-size: 0.9em; }
         #cdi .cdi-info, #cdi .cdi-button { width: calc(100% - 20px); padding: 10px 10px 10px 10px; }
         #cdi .cdi-button input[type="button"] { font-size: 1.0em; width: calc(50% - 10px); }
         #cdi .cdi-l { float: left; display: block; width: 90px; height: 80px; margin: 0px; }
         #cdi .cdi-r { float: none; display: inline; width: calc(100% - 0px); }
}