/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//
//	Das Dokument "style.css" bindet alle cssDateien ein und beinhaltet das Farbverzeichnis der Website.
//  
//  	Inhalt:
//			- CSS-Importe
//			- Font-Importe
//			- Browser-Settings-Reset
//			- Primary Fontsetting
//			- Globale Einstellungen
//			- Overlay
//			- Registrations Formular
//			- Media-Querrys
//			- Special_Settings for Firefox
//			- Special_Settings for InternetExplorer
//
//		Farbverzeichnis:
//			- DarkBlue:		#324977;
//			- MiddleBlue:	#3B5998;
//			- LightBlue:	#9EBDFF;
//			- GreyBlue:		#E2E9EF;
//			- Grey:			#aaa;
//  
//  INFO: 
//
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	CSS-Importe
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

@import url("css/header.css");
@import url("css/index.css");
@import url("css/footer.css");
@import url("css/suche.css");
@import url("css/setcard.css");
@import url("signup/css/signup.css");
@import url("search/css/suche.css");

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Font-Importe
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Browser-Settings-Reset
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

html {
	-webkit-font-smoothing: subpixel-antialiased;
} 

* {
    margin: 0em;
    padding: 0em;
	list-style: none;
    border: 0em;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 1em;
	line-height: 1em;
    font-family: inherit;
    background-repeat: no-repeat;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0;
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Primary Fontsetting
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

h1, h2, h3, h4, p, a, li, label, input, select {
    font-family: Arial, Gotham, "Helvetica Neue", Helvetica, sans-serif;
	text-shadow: 1px 1px 1px rgba(0,0,0,.25);
}

h1 {
	color: #324977;
	font-size: 1.5em;
	font-weight: bold;
}

h2 {
	font-size: 1.5em;
}

h3 {
	font-size: 1em;
}

a {
	color: #aaa;
	text-decoration: none;
}

a:hover, a:active {
	color: #000;
	cursor: pointer;
}

p, a {
	font-size: 1em;
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Globale Einstellungen
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

body{
	background-color: #fff;
}

#base {
	margin: 0 auto;
	max-width: 1920px;
	text-align: center;
	background-color: #fff;
}

.button, .btn_anmelden {
	width: 100%;
	height: 48px;
	color: #fff;
	background-color: #3B5998;
	border-radius: 5px;
}

.button:hover, .button:active, .btn_anmelden:hover, .btn_anmelden:active {
	background-color: #64A752;
	cursor: pointer;
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Overlay
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/ 

#overlay {
	  position: fixed;
	  z-index: 2;
	  top: 0;
	  background-color: rgba(30,104,160,0.25);
	  width: 100%;
	  height: 100vh;
	  text-align: center;
}

#overlay .formBox {
	display: block;
	margin: 24px auto;
	width: calc(95% - 48px);
}

#overlay .formBox h2 {
	margin-bottom: 24px;
}

#exit {
	margin-left: calc(100% - 30px);
	margin-bottom: 12px;
	width: 30px;
	height: 30px;
	background-image:  url("img/icons/exit.png");
	background-image:  url("img/icons/exit.svg");
	background-position: 100% 0;
	background-size: auto 100%;
}

#exit:hover {
	cursor: pointer;
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
	
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Overlay Form
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

.registerContainer {
	background-color: #fff;
}

.label, .input {
	display: inline-block;
	margin-bottom: 12px;
}

.label {
	padding: 12px 12px 12px 0;
	width: 72px;
}

.label small {
	display: none;
}

.input {
	padding: 12px;
	width: calc(100% - 116px);
	border: 1px solid #324977;
	border-radius: 5px;
}

.feld7 { /*AGB Text*/
	margin-top: 12px;
	margin-bottom: 24px;
}

.lbl_signup_error {
	color: red;
	font-size: 0.5em;
	margin: -24px 0 12px 96px;
}

.feld7 .lbl_signup_error{ /*AGB Text*/
	margin: -18px 0 8px 129px;
}

#agb, .checkbox { /*Checkbox*/
	display: block;
	margin: 12px auto 24px auto;
	width: 24px;
	height: 24px;
	border: 1px solid #666;
	border-radius: 5px;
	vertical-align: middle;
}

#agb:hover, .checkbox:hover { /*Checkbox*/
	cursor: pointer;
}

#agb:checked, .checkbox:checked { /*Checkbox*/
	background-image: url(img/icons/hook.svg);
	background-position: 50%;
	background-size: 75%;
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	Registrations Formular
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

iframe {
	width: 100%;
	max-width: 480px;
	height: 390px;
}

.feld5, .feld6, #overlay {
	display: none;
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Media-Querrys
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

@media screen and (min-width: 800px) { 

}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
//	FireFox-Extrawurst
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

@-moz-document url-prefix() {

.input {
	padding: 9px;
	width: calc(100% - 116px);
	border: 1px solid #324977;
	border-radius: 5px;
}
	
}

/*
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
// Internetexplorer-Extrawurst
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
*/

@media screen\0 {
	
}