body {
	font: normal 1em Arial, sans-serif;
}


button {
	margin: 0 2em;
	padding: .2em .5em;
}

#btn_fpemailing {
	padding: .3em;
}


#btn_fpemailing span {
	background-image: url(mail.png);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 1.85em;
}

#btn_fpereset {
	padding: .3em;
}

#btn_fpereset span {
	background-image: url(reset.png);
	background-position: left center;
	background-repeat: no-repeat;
	padding-left: 1.85em;
}






.bonbon {
	width: 250px;
	height: 60px;
	background: green;
	/*margin-left: 16em;*/
	/* old browsers */
	
	background: linear-gradient(to bottom, white, green);
	box-shadow: inset 0px 0px 2px #fff, inset 0px -1px 2px #fff;
	border: 1px solid #5ea617;
	border-radius: 0.8em;
	margin: 1em;
}

.bonbon.rot {
	background: linear-gradient(to bottom, white, red);
	color: #000000;
}

.bonbon.gruen {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, greenyellow), color-stop(70%, lime));
	/* webkit */
	
	background: linear-gradient(to bottom, lime, green);
	color: #ffffff;
	font-size: 0.99em;
}




.bonbon.violett {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, greenyellow), color-stop(70%, lime));
	/* webkit */
	position: center;
	background: linear-gradient(to bottom, #E8A9F8, #AD77BB);
	color: #ffffff;
	font-size: 1.22em;
}


.bonbon.violett.kl {
	width: 210px;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, greenyellow), color-stop(70%, lime));
	/* webkit */
	position: center;
	background: linear-gradient(to bottom, #E8A9F8, #AD77BB);
	color: #ffffff;
	font-size: 1.11em;
}



.bonbon:hover,
.bonbon:focus {
	box-shadow: rgba(0, 0, 0, 0.7) 0px 5px 15px, inset rgba(0, 0, 0, 0.15) 0px -10px 20px;
}




#logo {
	width: 25%;
	/*height: auto;*/
	margin-right: 170px;
	float: right;
	/*background-image: url("MoggeSolutions_Banner_Trans_200.png");*/
}
























































/*
body {
  margin: 0;
  padding: 0;
  font-family: 'PT Sans', sans-serif;
  font-size: 1.3em;
  font-weight: bold;
  color: #fff;
}
#first {
  background-color: #4B4D65;
}
#second {
  background-color: #FF8A66;
}
*/
.section {
  padding: 5px;
  padding-left: 40px;
}

.section input[type="checkbox"]{
  display: none;
}
.container {
  margin-bottom: 10px;

}
.container label {
  position: relative;

}




/* Base styles for spans */

.container span::before,
.container span::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}



/* Check-boxes */
.container span.csscheckbox::before {
  width: 27px;
  height: 27px;
  background-color: #fff;
  left: -40px;
 /* box-sizing: border-box;
  border: 3px solid transparent;*/
  transition: border-color .2s;

  
  
    
  border-radius: 5px;
	border-style: solid;
	border-width: 5px;
	border-color: #AD77BB;
	height: 22px;
	width: 22px;
}
/*.container span.csscheckbox:hover::before {
  border: 3px solid #F0FF76;

}*/
.container span.csscheckbox::after {
 
 /* font-family: 'FontAwesome';*/
    
  left: -34px;
  top: -3px;
  color: transparent;
  transition: color .2s;*/
  
}
input[type="checkbox"]:checked + label span.csscheckbox::after {
  color: #62AFFF;
     content: url("Checkboxkreuz.png");
	/*content: "X";*/
	margin: auto;
}





