/* ubuntu-regular - latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/ubuntu-v20-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('./fonts/ubuntu-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('./fonts/ubuntu-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('./fonts/ubuntu-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('./fonts/ubuntu-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('./fonts/ubuntu-v20-latin-regular.svg#Ubuntu') format('svg'); /* Legacy iOS */
  }
/* russo-one-regular - latin */
@font-face {
    font-family: 'Russo One';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/russo-one-v14-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('./fonts/russo-one-v14-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('./fonts/russo-one-v14-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('./fonts/russo-one-v14-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('./fonts/russo-one-v14-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('./fonts/russo-one-v14-latin-regular.svg#RussoOne') format('svg'); /* Legacy iOS */
}
:root {
	--lightest:#fff;
	--light:#e9eefa;
	--grey:#cccccc;
	--dark: #101217;
	--darkest: #000;
	--green: #d9fb96;
	--greenFont:#9bb36b;
	--greenFontHighlight:#58663d;
	--orange:#fbd196;
	--orangeFont:#b3956b;
	--orangeFontHighlight:#806a4d;
	--red:#fb9697;
	--redFont:#cc6666;
	--redFontHighlight:#b32424;
}
.cryptedmail:after {
  content: attr(data-name) "@" attr(data-domain) "." attr(data-tld); 
}
html, body { margin:0;padding:0;color:var(--grey);background-color:var(--darkest);font-family:"Ubuntu";font-size:14px;line-height:20px; }
h2 { margin-top:0px;color:var(--lightest);}
h1 { margin:0;margin-bottom:20px;font-family:"Russo One";font-size:30px;text-transform:uppercase;letter-spacing:3px;line-height:31px;color:var(--lightest); }
a { color:#d9fb96;text-decoration:none !important ;}
b { color:var(--lightest); }
.logo { background:url(logo.svg?v=1) center center no-repeat transparent; background-size:cover;max-width:500px;width:100%;left:50%;z-index:1;position:absolute;top: 50%;transform:translateX(-50%) translateY(-50%); }
.logo::after { content:" ";display:block;position:relative;padding-bottom:33%; }
section { width:100%; }
section.header { background:url(efcc.jpg) center center no-repeat transparent;background-size:cover;position: relative; }
section.header::before { content:" ";position:absolute;left:0;right:0;top:0;bottom:0;background-color:rgba(0,0,0,0.3); }
section.header::after { content:" ";position:relative;padding-bottom:25%;display:block; }
section.main { background-color:var(--dark);padding: 50px 0px; }
.nav {  }
.nav .maincontainer { position:relative; }
.nav ul { list-style:none;margin:0;padding:0;display:flex;position:absolute;transform:translateY(-100%);z-index:1;width:100%; }
.nav ul li { position:relative;background-color:var(--darkest);border-top-left-radius:10px;border-top-right-radius:10px; }
.nav ul li a,
.nav ul li font { padding:10px 20px;display:inline-block;color:var(--grey); }
.nav ul li font { color:var(--green); }
.nav ul li.aktiv { background-color:var(--dark); }
.maincontainer{ margin:0 auto;max-width:1100px;width:100%;padding:0 20px;box-sizing:border-box; }
.maincontainerTiny { margin:0 auto;max-width:600px;width:100%;padding:0 20px;box-sizing:border-box; }
.cnt { display:flex; }
.cnt .left { width:62.8%;padding-right:50px; }
.cnt .right { width:38.2%; }
section.footer { padding:30px 0px; }
section.footer a { padding-right:50px;}
.box { padding:20px;border-radius:5px; }
.light { background-color:rgba(255,255,255,0.1); }

textarea,
input[type="text"],
input[type="password"] { font-family:"Ubuntu";width:100%;background-color:rgba(0,0,0,0.7);border-radius:5px;font-size:16px;padding:10px;box-sizing:border-box;margin-bottom:10px;border:0px;outline:0px;color:#fff;font-weight:bold; }
textarea { font-weight:100; }
input[type="password"] { background-image:url("./images/key.svg");background-position:center left 10px;background-repeat:no-repeat;padding-left:40px;background-size:auto 40% ; }
a.buttonLink, input[type="submit"] { width:auto;font-family:"Ubuntu";cursor:pointer;color:var(--lightest);border-radius:5px;border:3px solid var(--lightest);background-color:transparent;font-size:16px;padding:10px 20px;box-sizing:border-box;margin-bottom:10px;outline:0px;font-weight:bold; }
a.buttonLink:hover, input[type="submit"]:hover { background-color:rgba(0,0,0,0.2); }
input[type="text"]::placeholder {color: rgba(255,255,255,0.6);}
input[type="text"]:-ms-input-placeholder {color: rgba(255,255,255,0.6);}
input[type="text"]::-ms-input-placeholder { color: rgba(255,255,255,0.6);}
.popUp { position:absolute;max-width:400px;width:100%;left:50%;top:50%;position:fixed;z-index:99;transform:translateX(-50%) translateY(-50%) scale(0);padding:30px;border-radius:10px;transition: all 0.2s cubic-bezier(.55,1.59,.83,.67);opacity:0; }
.popUp input[type='submit'] { margin-bottom:0px; }
.popUp.show { opacity:1;transform:translateX(-50%) translateY(-50%)  scale(1); }
.popUp.hidden { display:none; }


.hinweis { background-color:var(--orange);color:var(--orangeFontHighlight); }
.hinweis h1, .hinweis b, .hinweis h2 { color:var(--orangeFontHighlight); }
.hinweis input[type="submit"] { border-color:var(--orangeFontHighlight);color:var(--orangeFontHighlight); }
.error { background-color:var(--red);color:var(--redFontHighlight); }
.error h1, .error b, .error h2 { color:var(--redFontHighlight); }
.error input[type="submit"] { border-color:var(--redFontHighlight);color:var(--redFontHighlight); }
.done { background-color:var(--green);color:var(--greenFontHighlight); }
.done h1, .done b, .done h2 { color:var(--greenFontHighlight); }
.done input[type="submit"] { border-color:var(--greenFontHighlight);color:var(--greenFontHighlight); }

.container {display: block;padding-left: 35px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.container input {position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.checkmark {position: absolute;right: 10px;top:50%;height: 25px;transform:translateY(-50%);width: 25px;background-color: var(--dark);}
.container:hover input ~ .checkmark {background-color: var(--darkest);}
.container input:checked ~ .checkmark {background-color: var(--green);}
.checkmark:after {  content: "";  position: absolute;  display: none;}
.container input:checked ~ .checkmark:after {  display: block;}
.container .checkmark:after {left: 9px;top: 5px;width: 5px;height: 10px;border: solid var(--greenFontHighlight);border-width: 0 3px 3px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);} 

/** Instagram Seite **/
ul.numlist { margin:0;padding:0;list-style:none; } 
ul.numlist li { counter-increment: inst;position:relative;padding:20px;background-color:rgba(255,255,255,0.1);border-top-right-radius:10px;border-bottom-right-radius:10px;margin-bottom:10px; }
ul.numlist li::before {
transform:translateX(-50%) translateY(0%);content: counter(inst);background:var(--green);line-height:45px;text-align: center;font-family:"Russo One";font-size:30px;left:-20px;top:0;height:100%;width:45px;position: absolute;transition: all 0.2s ease-in-out;z-index: 1;border-top-left-radius:10px;border-bottom-left-radius:10px;color:var(--greenFontHighlight); }





.steps:not([step="1"]) [step="1"],
.steps:not([step="2"]) [step="2"],
.steps:not([step="4"]) [step="4"],
.steps:not([step="3"]) [step="3"] { display:none; } 
ul.fbPagesList { margin:0;padding:0;list-style:none; }
ul.fbPagesList li { cursor:pointer;margin-bottom:10px;padding:15px;border-radius:10px;background-color:rgba(255,255,255,0.1);font-weight:bold;color:#fff; }
ul.fbPagesList li:hover { background-color:rgba(255,255,255,0.2); }
ul.apikeys { list-style:none;margin:0;padding:0; }
ul.apikeys li { background-color:rgba(255,255,255,0.2);padding:10px;border-radius:10px;margin-bottom:10px;position:relative; }
 /* Customize the label (the container) */
















