@font-face {
  font-family: 'EuclidEnercity';
  src: url('../fonts_euclid/EuclidEnercity-Regular-WebS.eot');
  src: url('../fonts_euclid/EuclidEnercity-Regular-WebS.eot?') format('embedded-opentype'),
  url('../fonts_euclid/EuclidEnercity-Regular-WebS.woff') format('woff'),
  url('../fonts_euclid/EuclidEnercity-Regular-WebS.ttf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'EuclidEnercity Light';
  src: url('../fonts_euclid/EuclidEnercity-Light-WebS.eot');
  src: url('../fonts_euclid/EuclidEnercity-Light-WebS.eot?') format('embedded-opentype'),
  url('../fonts_euclid/EuclidEnercity-Light-WebS.woff') format('woff'),
  url('../fonts_euclid/EuclidEnercity-Light-WebS.ttf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'EuclidEnercity Bold';
  src: url('../fonts_euclid/EuclidEnercity-Medium-WebS.eot');
  src: url('../fonts_euclid/EuclidEnercity-Medium-WebS.eot?') format('embedded-opentype'),
  url('../fonts_euclid/EuclidEnercity-Medium-WebS.woff') format('woff'),
  url('../fonts_euclid/EuclidEnercity-Medium-WebS.ttf') format('opentype');
  font-weight: bold;
  font-style: normal;
}

body { margin:0; font-family:"EuclidEnercity", Arial, Verdana, san-serif; font-size:15px; line-height:140%; color:#000000; }

.clear { clear:both; }
a { text-decoration:none; border:none; color:#c60a56; }
img { outline:none; border:none; }

input{color:#000!important;}

.font_bold { font-family: 'EuclidEnercity Bold', Arial, Verdana, sans-serif; }

#siteWrapper { width:980px; margin:0 auto; position:relative; }
#siteWrapper::after {
  content: '';
  display: block;
  clear: both;
  float: none;
}

#arrowScrollDown { position:absolute; z-index:100; left:449px; top:404px; width:82px; height:82px; background:url(../images/arrowScrollDown.svg) no-repeat left top; background-size: contain; }

#header { height:338px; width:100%; background: #faf2fa; }
	#header h1,
	#weinachtsgrussErstellen { position:absolute; margin:0; padding:0; }
  #weinachtsgrussErstellen { top:213px; left:71px; width: 248px; height:37px; display: block; background: transparent url("../images/button_weihnachtsgruss-erstellen.svg") center center no-repeat; background-size: contain; }
  #header h1 {
    top: 82px;
    left: 66px;
    color: #c60a56;
    -webkit-text-fill-color: transparent;
    background: -webkit-linear-gradient(left, #c60a56 0%,#F06B10 54%);
    background: -o-linear-gradient(left, #c60a56 0%,#F06B10 54%);
    -webkit-background-clip: text;
    text-decoration: none;
    width: 400px;
    font-size: 50px;
    line-height: 115%;
    font-weight: normal;
    font-family: "EuclidEnercity Light";
  }

  #special-text {
    display:none;
    padding: 1rem 0;
    float: left;
    position: absolute;
    top: 265px;
    left: 71px;
    width: 490px;
  }
  #special-text h2 {
    color: #c60a56;
    margin: 0 0 1rem 0;
  }
  #special-text b {
    font-family: 'EuclidEnercity Bold', Arial, Verdana, san-serif;
    font-weight: normal;
  }

  #schritt1 {
    width: 316px;
    height: 78px;
    background: transparent url("../images/schrift_Verfassen-Sie-einen-Weihnachtsgruss.svg") left top no-repeat;
    background-size: contain;
    text-indent: -9999999em;
    overflow: hidden;

  }
  #schritt2 {
    width: 295px;
    height: 78px;
    background: transparent url("../images/schrift_Absender-_Empfaengerdaten.svg") left top no-repeat;
    background-size: contain;
    text-indent: -9999999em;
    overflow: hidden;
  }

  #schritt1 h2, #schritt2 h2 {font-weight: normal;
    font-family: "EuclidEnercity";}

  #weitere-karten-versenden {
    width: 249px;
    height: 36px;
    display: inline-block;
    background: transparent url("../images/button_weitere-karten-versenden.svg") center center no-repeat;
    background-size: contain;
    text-indent: -9999999em;
    overflow: hidden;
  }

	#header #vignette { position:absolute; top:152px; right:113px; width:193px; height:193px; transform: rotate(-5deg) scale(0.8); }
#logo {
  position: absolute;
  top: 22px;
  right: 30px;
}

.schneeflocke {
  position: absolute;
  width: 10px;
  height: 10px;
  display: block;
  background: transparent url("../images/schneeflocke.svg") center center no-repeat;
  background-size: contain;
  text-indent: -9999999em;
  overflow: hidden;
}
.schneeflocke-netz {
  background-image: url("../images/schneeflocke-netz.svg");
}
#schneeflocke1 {
  top: 238px;
  left: 25px;
  width: 30px;
  height: 30px;
}

#schneeflocke2 {
  top: 52px;
  left: 610px;
  width: 28px;
  height: 28px;
}

#schneeflocke3 {
  top: 169px;
  left: 547px;
  width: 30px;
  height: 30px;
}

#schneeflocke4 {
  top: 199px;
  left: 584px;
  width: 30px;
  height: 30px;
}

#schneeflocke5 {
  top: 249px;
  left: 552px;
  width: 81px;
  height: 90px;
}

#callback { height:500px; }
#callback,
#cardContainer { width:100%; background:#faf2fa; float:left; margin-bottom:14px; position:relative; padding-bottom: 20px; }
	#cardContainer #cardPreview { width:600px; height:894px; margin:12px 18px; background:#FFFFFF; float:left; overflow:hidden; }

#callback_container { padding:75px 38px 20px 38px; font-size:24px; }
#clearAll { padding-top:40px; }

.error { color:#F71420 !important; }


.expl { padding:0 24px 13px 20px; }
.expl span { font-family: 'EuclidEnercity Bold', Arial, Verdana, san-serif; }
#absendercontainer .expl,
#empfaengercontainer .expl { font-size:13px; padding-bottom:5px; padding-left:12px; } /* padding-left: 12px; */
.label { padding:0 0 8px 0; }
input.inputfield,
textarea {width:298px; border:none; outline:none; height:36px; padding:0 0 0 12px; font-size:18px; line-height:20px; color:#000000; margin-bottom:12px; font-family:"EuclidEnercity", Arial, Verdana, san-serif; }
textarea { height:68px; padding-top:6px; }


#eingabemaske { position:relative; float:left; width:318px; } /* height:918px; */
	#textcontainer,
  #infocontainer { width:318px; padding:10px 0 0 0; z-index:10; background:#faf2fa; } /* height:898px; */
  #textcontainer.hide { display: none; }
  #infocontainer { height: auto; padding:10px 0 170px 0; display: none; }
  #infocontainer.show { display: block; }
		#textcontainer h2,
		#infocontainer h2 { padding:0; margin:0 0 20px 0; }
		#textcontainer_inner,
		#infocontainer_inner { padding:0 0 0 8px; } /* height:765px; */
		#textcontainer #textarea_container { position:relative; width:310px; height:590px; margin-bottom:18px; background: #FFFFFF; }
    #textcontainer #textarea_container .input-flex { fill: #faf2fa; width: 102%; margin:-1px 0 0 -1%; height: 25px; }
		#textcontainer #textarea { padding:30px 10px 40px 24px; width:276px; height:500px; }
		#textcontainer #counter { position:absolute; height:20px; width:286px; bottom:15px; left:24px; color:#000000; font-size:14px; }

	#infocontainer { z-index:5;}

		input#absenden,
		#clickBeforeSend { background:url("../images/button_weihnachtsgruss-versenden.svg") center center no-repeat; background-size: contain; height:35px; width:255px; border:0; outline:none; position:absolute; bottom:40px; left:38px; cursor:pointer; }

		#text_bottom { position:absolute; bottom:80px; padding: 0 24px 13px 20px; }

		#weiter,
		#zurueck { position:absolute; bottom:2px; cursor:pointer; width:82px; height:25px; }

		#weiter { right:0; background:url(../images/button_weiter.svg) no-repeat; }
		#zurueck { left:14px; background:url(../images/button_zurueck.svg) no-repeat; }

		.seitenzahl { position:absolute; bottom:4px; text-align:center; font-size:16px; font-weight:bold; color:#000000; left: 50%; transform: translate(-50%,0); }

		.update,
		#new { font-size:13px; line-height:13px; font-weight:bold; text-align:right; color:#c60a56; cursor:pointer; }

		.update { float:left; background:url(../images/vorschau_aktualisieren.png) no-repeat right center; padding:0 30px 0 0; }
		#new { float:right; background:url(../images/weitere_hinzufuegen.png) no-repeat right center; padding:0 20px 0 0; }



		#empfaengercontainer { padding:12px 0 0 0; }

    #empfaenger_counter { clear:both; padding:25px 0 0 0; }
    .privacy-policy {
      margin: 0 0 1rem 0;
      padding: 0 24px 0 12px;
    }
		#empfaenger {  font-size:17px; color:#000000; overflow:auto; height:91px; }

		.empfaengerItem { height:21px; cursor:default; }
			.deleteEmpfaengerItem { float:left; width:9px; height:17px; padding-top:3px; margin-right:10px; line-height:21px; cursor:pointer; }

.popUp { width:100%; height:100%; display:none; position:absolute; top:0; z-index: 90; background:#faf2fa; overflow: auto; }
	.impressum_popUp_content_container { width:980px; margin:0 auto;padding:40px 0 0 0;/* background:url(../images/gewinnspiel_popup_bottom.png) center bottom no-repeat;*/ }
		.impressum_popUp_content  { padding:0 28px 0 43px; background:#faf2fa; }
			.impressum_popUp_content p { padding:4px 0 12px 0; width:790px; }
	.btn_close { cursor: pointer; font-size: 13px; color: #c60a56; background: url(../images/popup_close.png) right center no-repeat; padding-right: 20px; float: right; }



#footer_container  { height:81px; background:#faf2fa; width:100%; padding-top:16px; z-index:100; text-align:center; }
	#footer { width:944px; margin:0 auto; padding:14px; }
	#footer_container #footer .left { float:left; }
	#footer_container #footer .right { float:right; }
	#footer_container #footer a { color:#000000; }
	#footer_container #footer .left a { font-size:12px; padding-right:25px; color:#000000; float:left; cursor:pointer; }
	#footer_container #footer .right a { font-size:15px; }
