/* ################################################################ */
/* HTML Standart Tags */
/* ################################################################ */

body, html { margin:0; padding:0; width:100%; height:100%;}

@media screen and (max-width: 900px) { 
	body, html { margin:0; padding:0; width:100%; height:100%;}
}


h1 { text-transform: uppercase;text-align: center; margin: 140px auto 0 auto; font-size: 70px; color: #E3FFF9}

@media screen and (max-width: 900px) {
	h1 { text-transform: uppercase;text-align: center; margin: 140px auto 0 auto; font-size: 60px;}
}

@media screen and (max-width: 700px) {
	h1 { text-transform: uppercase;text-align: center; margin: 140px auto 0 auto; font-size: 50px;}
}

@media screen and (max-width: 600px) {
	h1 { text-transform: uppercase;text-align: center; margin: 140px auto 0 auto; font-size: 40px;}
}


h2 { text-transform: uppercase;text-align: center; margin: 100px auto 0 auto; font-size: 60px; color: #E3FFF9}

@media screen and (max-width: 900px) {
	h2 { text-transform: uppercase;text-align: center; margin: 100px auto 0 auto; font-size: 50px;}
}

@media screen and (max-width: 700px) {
	h2 { text-transform: uppercase;text-align: center; margin: 100px auto 0 auto; font-size: 40px;}
}

@media screen and (max-width: 600px) {
	h2 { text-transform: uppercase;text-align: center; margin: 100px auto 0 auto; font-size: 32px;}
}

@media screen and (max-width: 400px) {
	h2 { text-transform: uppercase;text-align: center; margin: 100px auto 0 auto; font-size: 24px;}
}


.ud_h2_Strich { margin: 0 auto 10px auto; height: 5px; width: 80px;}

.ud_h3_Strich { margin: 0 auto 10px auto; height: 5px; width: 80px;}

.ud_button { text-transform: uppercase; padding: 10px 30px 10px 30px; display: inline-block; margin: 10px 0 20px 0;}

a { text-decoration:none;}

/* ################################################################ */
/* Zusammengefasste Klassen */
/* ################################################################ */

footer
{background: #BBCDCF}

#Download .ud_h2_Strich
{background: #FF503F;}

footer, footer a
{color: #454545}

.ud_page
{background: #444444}

P, a, header #ud_social_media .ud_social_media
{color: #999}

header .nav ul li a:hover, header #ud_social_media .ud_social_media:hover
{color: #ff5655}

header .nav ul li a
{color: #ffffff; font-family: patrick-hand; font-style: normal; text-decoration: none;}

p
{font-family: raleway}

h1
{ font-family: chewy; font-style: normal; font-weight: 1000; letter-spacing: 20px; font-weight: 900;}

@media screen and (max-width: 900px) {
	h1 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 15px; font-weight: 900;}
}

@media screen and (max-width: 600px) {
	h1 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 10px; font-weight: 900;}
}

h2
{ font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 20px; font-weight: 900;}

@media screen and (max-width: 900px) {
	h2 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 15px; font-weight: 900;}
}

@media screen and (max-width: 700px) {
	h2 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 12px; font-weight: 900;}
}

@media screen and (max-width: 600px) {
	h2 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 8px; font-weight: 900;}
}

@media screen and (max-width: 400px) {
	h2 { font-family: architects-daughter; font-style: normal; font-weight: 1000; letter-spacing: 3px; font-weight: 900;}
}

header, header #ud_social_media, #ud_social_media, .ud_social_media, header .nav ul li a, header #ud_logo, header #ud_social_media .ud_social_media span
{transition: all 300ms; -moz-transition:all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms, -transition:all 300ms;}


/* ################################################################ */
/* Umfassende Objekte und Klassen */
/* ################################################################ */

.ud_page { width: 100%; min-height: 100%; overflow: hidden; float: left;}


/* ################################################################ */
/* Header */
/* ################################################################ */

	/* Header Klassen Style */

header {background: #234D50}

header { position:fixed; z-index:99; top:0; left:0; right:0; width:100%; height:40px; border:1px solid #DFDFDF;}

header #ud_logo { float: left; width: 45px; margin-top: 1px; margin-right: 0; margin-left: 16px; margin-bottom: 0; padding: 0 0 0 10p;}
header #ud_logo img { width:100%; height:auto;}


header { display:block; margin:15px 0 0 15px; cursor:pointer;}

header .menu { float:right; height:40px; margin:0; padding:0}
header .menu ul { margin:10px 8px 0 0; padding:0;}
header .menu ul li {margin:0 10px 0 0; padding:0; list-style:none; float:left;}
header .menu ul li:last-child {margin:0 20px 0 0;}
header .menu ul li a {text-transform:uppercase; font-size:15px; text-decoration: none;}


label { margin: 0 40px 0 0; font-size: 26px; line-height: 40px; display: none; width: 26px; float: right;}
#toggle {display: none}


	/* ###### Hover ######*/

	/*

header:hover { height: 70px}

header:hover > #ud_logo { width: 82px; margin-top: 1px; margin-right: 0; margin-left: 20px; margin-bottom: 0;}

header:hover > .nav ul { margin: 26px 20px 0 0;}
header:hover > .nav ul li a { font-size: 19px;}
 */

@media screen and (max-width: 900px ) {
label { margin: 0 20px 0 0; font-size: 22px; line-height: 40px; display: none; width: 26px;float: right;}
header .nav { float:right; height:40px; margin:0; padding:0}
header .nav ul { margin:9px 8px 0 0; padding:0;}
header .nav ul li {margin:0 10px 0 0; padding:0; list-style:none; float:left;}
header .nav ul li:last-child {margin:0 10px 0 0;}
header .nav ul li a {text-transform:uppercase; font-size:13px; text-decoration: none;}
	
	
	header:hover { height: 50px}

	header:hover > #ud_logo { width: 60px; margin-top: 0px; margin-right: 0; margin-left: 18px; margin-bottom: 0;}

	header:hover > .nav ul { margin: 15px 15px 0 0;}
	header:hover > .nav ul li a { font-size: 15px;}
	
    }

@media screen and ( max-width : 600px ){

	label {display: block; cursor: pointer;}
	.menu {text-align: center; width: 100%; display: none; }
    .menu a {display: block; border-bottom: 1px solid #EAEAEB; text-decoration: none;}
	#toggle:checked + .menu {display:block; margin-top: 20px;}

	
	header:hover { height: 40px}

	header:hover > #ud_logo { width: 45px; margin-right: 0; margin-left: 16px; margin-bottom: 0; margin-top: 1px;}

	header:hover > .nav ul { margin: 9px 8px 0px 0px; padding: 0 0 0 0 }
	header:hover > .nav ul li a {font-size: 15px}
    }


	/* ################################################################ */
	/* Login Template */
	/* ################################################################ */

.ud_Login_temp {
  height: 40px;
  margin: 40px 0 0 -1px;
  display: flex;
  position: fixed;
  border:1px solid #DFDFDF;
  background: #234D50;
  cursor: pointer;
}

.ud_Login_temp form {
  height: 50%;
  margin: 10px 5px 0 0;
}


.ud_Login_temp form input {
  height: 100%;
  width: 160px;
  padding: 0 15px;
  border: none;
  border-radius: 4px;
  background-color: #F6F6F6;
  float: left;
  margin-left: 8px;
  font-family: arial;
}

.ud_Login_temp form button {
  height: 100%;
  padding: 0 10px;
  border: none;
  border-radius: 4px;
  background-color: #333;
  margin-left: 8px;
  font-family: arial;
  font-size: 13px;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
}

.header-signup {
    height: 100%;
    width: 70px;
    padding: 0 1px;
    margin: 3px 0 0 0px;
    font-family: arial;
    font-size: 13px;
    line-height: 36px;
    color: #111;
    text-transform: uppercase;
    text-align: center;
}


@media screen and (max-width: 560px) {

.ud_Login_temp {	
  height: 40px;
  margin: 40px 0 0 -1px;
  display: flex;
  position: fixed;
  border:1px solid #DFDFDF;
  background: #234D50;
  cursor: pointer;
}
	
.ud_Login_temp form {
  height: 50%;
  margin: 10px 5px 0 0;	
}

.ud_Login_temp form input {
height: 100%;
    width: 110px;
    border: none;
    border-radius: 4px;
    background-color: #F6F6F6;
    float: left;
    margin-left: 8px;
    font-family: arial;
}
	.ud_Login_temp form button {
  height: 100%;
  padding: 0 10px;
  border: none;
  border-radius: 4px;
  background-color: #333;
  margin-left: 8px;
  font-family: arial;
  font-size: 13px;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
}

.header-signup {
    height: 80%;
    width: 30px;
    padding: 0px 6px 0 1px;
    margin: 3px 0 0 0px;
    font-family: arial;
    font-size: 13px;
    line-height: 36px;
    color: #111;
    text-transform: uppercase;
    text-align: center;
}

}


@media screen and (max-width: 425px) {

.ud_Login_temp {	
  height: 66px;
  margin: 40px 0 0 -1px;
  display: flex;
  position: fixed;
  border:1px solid #DFDFDF;
  background: #234D50;
  cursor: pointer;
}
	
.ud_Login_temp form {
  height: 50%;
  margin: 10px 5px 0 0;	
	width: 275px;
}

.ud_Login_temp form input {
    height: 80%;
    width: 170px;
    border: none;
    border-radius: 4px;
    background-color: #F6F6F6;
    float: left;
    margin: -5px 0 8px 5px;
    font-family: arial;
}
	.ud_Login_temp form button {
  height: 80%;
  padding: 0 10px;
  border: none;
  border-radius: 4px;
  background-color: #333;
  margin: 10px 0 0 6px; 
  font-family: arial;
  font-size: 13px;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
}

.header-signup {
 height: 50%;
    width: 30px;
    margin: 16px 0 0 -3px;
    font-family: arial;
    font-size: 13px;
    line-height: 36px;
    color: #111;
    text-transform: uppercase;
    text-align: center;
}

}


	/* ################################################################ */
	/* Login Status */
	/* ################################################################ */

#LogStatus {
    position: fixed;
    top: 90%;
    left: -1px;
    right: 0;
    width: 100px;
    height: 45px;
    border: 1px solid #DFDFDF;
	background: #666666;
	text-align: center;
}

#LogStatus .Log_Anzeige {align-content: center center; padding: 0px auto 10px 0;}

#LogStatus .Log_Anzeige p {margin: 3px 0 0 0;}

	/* ################################################################ */
	/* Picture Galllery */
	/* ################################################################ */


	#PictureGallery .ud_picture_gallery { margin: 50px 0 0 0;}
	#PictureGallery .ud_picture_gallery #Spark { width: 45%; height: 100%; margin-top: 70px; margin-left: auto; margin-right: auto; margin-bottom: 50px; display: block; border-radius: 25px; object-fit: cover; background-attachment: scroll;}

	#PictureGallery .ud_picture_gallery p {font-size: 18px; text-align: center;}

@media screen and (max-width: 470px) {
	
	#PictureGallery .ud_picture_gallery #Spark { width: 90%; height: 100%; margin-top: 70px; margin-left: auto; margin-right: auto; margin-bottom: 50px; display: block; border-radius: 25px; object-fit: cover; background-attachment: scroll;}
	
}

	/* ################################################################ */
	/* Download */
	/* ################################################################ */

#Download { width: 100%; min-height: 80%; overflow: hidden; float: left;}

#Download .ud_Downloadarea {margin-top: 70px; text-align: center}
#Download .ud_Downloadarea p {font-size: 18px; margin: 18px 40px 18px 40px; }

#Download .ud_Downloadarea ul {margin: 45px 0 0 0;}
#Download .ud_Downloadarea ul li {list-style: none; margin: 20px 0;}
#Download .ud_Downloadarea ul li p {margin: 0px 25px 0 0;}
#Download .ud_Downloadarea .ud_button { border: 2px solid #3B4F50; font-family: gochi-hand; font-style: normal; font-weight: 400; color: #D40003; background-color: #CCCCCC; font-size: 20px; margin: 8px 20px 10px 0;}

#Download .ud_Downloadarea ul li:last-child { margin:20px 0 100px 0;}


	/* ################################################################ */
	/* Download */
	/* ################################################################ */

#Locked_Screen {width: 100%; min-height: 100%; overflow: hidden; float: left; }
#Locked_Screen h2 {margin-top: 150px;}
#Locked_Screen .Locked_Screen_imp {margin-top: 70px; text-align: center;}
#Locked_Screen .Locked_Screen_imp p {font-size: 20px; margin: 0 0 20% 0;}


	/* ################################################################ */
	/* Signup Page */
	/* ################################################################ */

/* signup.php */

.section-default h1 {text-align: center; font-size: 25px; padding-top: 70px;}

.section-default {
  width: 100%;
  height: 100%;
  min-height: 100%; 
  margin: 0;
  padding: 0 0 310px 0;
  float: left;
  background-color:#444444;
}

.form-signup {
  margin: 0 auto;
  padding: 30px;
  width: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 6px;
  background-color:#6effff;
}

.form-signup input {
  width: calc(100% - 30px);
  height: 30px;
  padding: 0 15px;
  margin-bottom: 6px;
  border: 1px solid #CCC;
  border-radius: 4px;
  background-color: #F6F6F6;
  float: left;
  font-family: arial;
}

.form-signup button {
  display: block;
  height: 40px;
  padding: 0 10px;
  margin: 0 auto;
  border: none;
  border-radius: 4px;
  background-color: #333;
  font-family: arial;
  font-size: 13px;
  color: #FFF;
  text-transform: uppercase;
  text-align: center;
}
.signuperror {
  padding-top: 14px;
  font-family: arial;
  font-size: 16px;
  color: red;
  text-align: center;
}

.signupsuccess {
  padding-top: 14px;
  font-family: arial;
  font-size: 16px;
  color: green;
  text-align: center;
}



	/* ################################################################ */
	/* Footer */
	/* ################################################################ */

footer { background-color: #000000; position: relative; height: 250px; margin-top: -250%; clear: left; padding: 50px 0 0 0; font-size: 15px; text-align: center;}

footer .ud_logo { width: 100%}
footer .ud_logo img { width: 130px; height: auto}

footer #ud_meta_nav { margin: 20px 0 0 0;}
footer #ud_meta_nav ul { margin: 0; padding: 0;}
footer #ud_meta_nav ul li { margin: 0; padding: 0 4px 0 4px; list-style: none; display: inline; font-size: 20px; font-family: patrick-hand; font-style: normal; font-weight: 400;}
footer #ud_meta_nav ul li:last-child {border: none;}

#ud_copyright { margin: 10px 0 30px 0; font-size: 15px; font-family: chewy; font-style: normal; font-weight: 400;}


@media screen and ( max-width: 900px) {
	footer { background-color: #000000; position: relative; height: 150px; margin-top: -150%; clear: left; padding: 15px 0 15px 0; font-size: 15px; text-align: center;}
	
	
	footer .ud_logo { width: 100%}
	footer .ud_logo img { width: 80px; height: auto}

	footer #ud_meta_nav { margin: 10px 0 0 0;}
	footer #ud_meta_nav ul { margin: 0; padding: 0;}
	footer #ud_meta_nav ul li { margin: 0; padding: 0 4px 0 4px; list-style: none; display: inline; font-size: 20px; font-family: patrick-hand; font-style: normal; font-weight: 400;}
	#Download footer #ud_meta_nav ul li:last-child {border: none;}

	#ud_copyright { margin: 10px 0 30px 0; font-size: 15px; font-family: chewy; font-style: normal; font-weight: 400;}
}


@media screen and ( max-width: 350px) {
	footer { background-color: #000000; position: relative; height: 200px; margin-top: -200%; clear: left; padding: 15px 0 0 0; font-size: 15px; text-align: center;}
	
	
	footer .ud_logo { width: 100%}
	footer .ud_logo img { width: 80px; height: auto}

	footer #ud_meta_nav { margin: 10px 0 0 0;}
	footer #ud_meta_nav ul { margin: 0; padding: 0;}
	footer #ud_meta_nav ul li { margin: 0; padding: 0 4px 0 4px; list-style: none; display: inline; font-size: 20px; font-family: patrick-hand; font-style: normal; font-weight: 400;}
	footer #ud_meta_nav ul li:last-child {border: none;}

	#ud_copyright { margin: 10px 0 30px 0; font-size: 15px; font-family: chewy; font-style: normal; font-weight: 400;}
}