/*
#################################
##  Cookie / Datenschutz Info
#################################
*/

#cdi_layer {
         z-index: 101;
         left: calc(50% - 150px);
         top: 10%;
         position: fixed;

         width: 300px;
         min-height: 50px;

         background: #FFFFFF;
         border: 2px #FFFFFF solid;

         color: #1F1F1F;
         font-size: 14px;
         font-weight: normal;
         text-shadow: #FFFFFF 1px 1px 0px;
         text-align: left;

         -webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;

         -webkit-box-shadow: inset 0px 0px 20px 0px rgba(0, 0, 0, 0.15), 0px 0px 25px 0px rgba(0, 0, 0, 0.25);
	-moz-box-shadow:    inset 0px 0px 20px 0px rgba(0, 0, 0, 0.15), 0px 0px 25px 0px rgba(0, 0, 0, 0.25);
	box-shadow:         inset 0px 0px 20px 0px rgba(0, 0, 0, 0.15), 0px 0px 25px 0px rgba(0, 0, 0, 0.25);
}

#cdi_layer .cdi-clear { clear:both; line-height:0.0em; height: 0px; display: block; }
#cdi_layer .cdi-info { padding: 15px; text-align: justify; }
#cdi_layer .cdi-info b { display: block; text-align: center; font-size: 1.3em; margin-bottom: 10px; }

#cdi_layer .cdi-info a, #cdi_layer .cdi-info a:visited { color: #1F1F1F; font-weight: bold; text-decoration: underline; text-shadow: #FFFFFF 1px 1px 0px; padding: 0px 0px; }
#cdi_layer .cdi-info a:hover { color: #0b695c; }

#cdi_layer .cdi-button { display: block; width: calc(100% - 0px); margin: 10px 0px 10px 0px; text-align: center; }
#cdi_layer .cdi-button input {
	display: inline-block;
         cursor: pointer;

	background: #0f8c7a;

         font-size: 1.3em;
         color: #FFFFFF;
	font-weight: bold;
         text-shadow: rgba(0,0,0,0.2) 1px 1px 0px;
         text-decoration: none;
         text-align: center;

         width: 200px;
         height: 40px;
         margin: 0px 0px;
         padding: 0px;

         border: 1px #0f8c7a solid;
         -webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;

         -webkit-box-shadow: inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
	-moz-box-shadow:    inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
	box-shadow:         inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
}

#cdi_layer .cdi-button input:hover { background: #0b695c; color: #FFFFFF; border: 1px #0b695c solid; }
#cdi_layer .cdi-button input[type="submit"] { float: none; }
#cdi_layer .cdi-button input[type="button"], #cdi_layer .cdi-save input[type="button"] { background: #6F6F6F; width: 150px; height: 30px; margin: 5px 0px; padding: 0px; font-size: 1.1em; color: #FFFFFF; border: 1px #6F6F6F solid; opacity: 0.3; }
#cdi_layer .cdi-button input[type="button"]:hover { opacity: 1.0; }
#cdi_layer .cdi-save input[type="button"] { width: 30px; opacity: 0.5; margin: 0px 10px 0px 0px; padding: 0px; }

#cdi_layer .cdi-config {
	display: none;
         width: calc(100% - 30px);
         padding: 15px 15px 10px 15px;
         text-align: left;
         background: rgba(0,0,0,0.02);
         -webkit-box-shadow: inset 0px 0px 20px 0px rgba(0, 0, 0, 0.10);
	-moz-box-shadow:    inset 0px 0px 20px 0px rgba(0, 0, 0, 0.10);
	box-shadow:         inset 0px 0px 20px 0px rgba(0, 0, 0, 0.10);
}
#cdi_layer .cdi-config .item { display: block; width: 100%; padding: 5px 0px; border-bottom: 2px #BFBFBF dotted; }
#cdi_layer .cdi-config .item:last-child { border-bottom: 0px #BFBFBF dotted; }

#cdi_layer .cdi-config .item input[type="checkbox"] { display: none; }
#cdi_layer .cdi-config .item input[type="checkbox"] + label { position: relative; display: inline-flex; cursor: pointer; margin-top: 2px; font-family: sans-serif; font-size: 24px; line-height: 1.3em; }
#cdi_layer .cdi-config .item input[type="checkbox"] + label:before { width: 40px; height: 20px; border-radius: 20px; border: 2px solid #ddd; background-color: #EEE; content: ""; margin-right: 15px; transition: background-color 0.5s linear; }
#cdi_layer .cdi-config .item input[type="checkbox"] + label:after { width: 20px; height: 20px; border-radius: 20px; background-color: #fff; content: ""; transition: margin 0.1s linear; box-shadow: 0px 0px 5px #aaa; position: absolute; left: 2px; top: 2px; }
#cdi_layer .cdi-config .item input[type="checkbox"]:checked + label:before { background-color: #2b8718; }
#cdi_layer .cdi-config .item input[type="checkbox"]:checked + label:after { margin: 0 0 0 20px; }
#cdi_layer .cdi-config .item span { float: right; display: block; width: 210px; font-size: 0.9em; opacity: 0.5; }
#cdi_layer .cdi-config .item span b { display: block; }
#cdi_layer .cdi-config .item span.active { opacity: 1.0; }
#cdi_layer .cdi-config .item span.active b { color:#2b8718;  }

#cdi_layer .cdi-save { display: none; width: 100%; padding: 10px 0px; text-align: center; background: rgba(0,0,0,0.07); }
#cdi_layer .cdi-save input {
	display: inline-block;
         cursor: pointer;

	background: #0f8c7a;

         font-size: 1.0em;
         color: #FFFFFF;
	font-weight: normal;
         text-shadow: rgba(0,0,0,0.2) 1px 1px 0px;
         text-decoration: none;
         text-align: center;

         width: 200px;
         height: 30px;
         margin: 0px 0px;
         padding: 0px;

         border: 1px #0f8c7a solid;
         -webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;

         -webkit-box-shadow: inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
	-moz-box-shadow:    inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
	box-shadow:         inset 0px 2px 1px 0px rgba(255, 255, 255, 0.25);
}
#cdi_layer .cdi-save input:hover { background: #0b695c; color: #FFFFFF; border: 1px #0b695c solid; }

#cdi_layer .cdi-footer { display: block; margin-top: 15px; margin-bottom: 15px; text-align: center; }
#cdi_layer .cdi-footer a, #cdi_layer .cdi-footer a:visited { padding: 0px 0px; font-size: 0.8em; color: #6F6F6F; font-weight: normal; text-decoration: none; text-shadow: #FFFFFF 1px 1px 0px; }
#cdi_layer .cdi-footer a:hover { color: #0b695c; }

#cdi_layer a, #cdi_layer .cdi-info, #cdi_layer .cdi-button input, #cdi_layer .cdi-footer, #cdi_layer .cdi-config span, #cdi_layer input { font-family: "Roboto Condensed", Arial !important; }


/* MEDIA QUERRIES */
@media (max-width: 560px) {
	#cdi_layer { position: absolute; margin: 0px auto; }
         #cdi_layer .cdi-info { padding: 15px 15px 5px 15px; line-height: 1.0em; }
         #cdi_layer .cdi-config { width: calc(100% - 20px); padding: 8px 10px 5px 10px; }
         #cdi_layer .cdi-config .item { line-height: 1.0em; }
         #cdi_layer .cdi-config .item span { width: 220px; }
         #cdi_layer .cdi-button, #cdi_layer .cdi-footer { margin: 5px 0px 5px 0px;}
	#cdi_layer .cdi-button input, #cdi_layer .cdi-save input[type="button"] { height: 30px !important; }
}