.html {
	border: 0em;
	padding: 0em;
	margin: 0em;	
	background-color: #000;
}
.body {
	color: #F00;
	border: 0em;
	padding: 0em;
	margin: 0em;	
	font-size: 100%;
	font-family: arial;
	background-color: #000;
}

 /* unvisited link */
a:link {
  color: #fff;
  text-decoration: none;
}

/* visited link */
a:visited {
  color: #eee;
}

/* mouse over link */
a:hover {
  color: #88f;
}

/* selected link */
a:active {
  color: #0f0;
} 

* {
/**	box-sizing: border-box; **/
	/*! color: #010066; */
/**	font-size: 100%; ***/
	/*! align-items: center; */
	margin-left: 1em;
	margin-right: 1em;
	text-align: center;
	/*! align-self: last baseline; */
	/*! display: inherit; */
	margin: 0em;
	font-family: sans-serif;
	/*! font-size: 16px; */
	/*! background-color: #def; */
	background-color: #000;
}


/*** Settings for Header ***/
.header {
		grid-area: header;
/*****        display: grid;***/
}
.headerMain {
		grid-area: headerMain;
        display: grid;
		grid-gap: 0em;
        grid-template-rows: auto /*** auto  **/; 
		grid-template-areas:
            "headerLogo"
/***			"headerNavEmpty"   ***/
/***			"headerNav";	**/	;	
  	/*! padding: 0.12em; */
		margin-bottom: 0;
		
				/*! background-color: #0ff; */

}



.headerMain > * {
	color: #010066;
	/*! padding: 0.125em; */
	font-size: 100%;
	margin-bottom: 0em;
	
	/*!		background-color: #fff; */

}



.headerLogo {
			grid-area: headerLogo;
	/*! padding: 0.24em; */
	margin: 0rem;
	width: 50%;
	/*! display: grid; */
  margin-left: auto;
  margin-right: auto;
}

.centered{
	align-items: center;
}

.content {
		grid-area: content;
}

.contentItem {
	/*! padding: 0.000003em; */
  margin-bottom: 0em;
	/*! margin-left:  0.4em; */
	/*! margin-right: 0.4em; */	
	color: #f00;
	
	border-width:4;
	border-color:#FFF;
	}

.contentItem1 {
  grid-area: contentBilder;
	/*! padding: 0.000003em; */
  margin-bottom: 0em;
	margin-left:  0.4em;
	margin-right: 0.4em;	
	color: #fff;
	
	border-width:4px;
	border-color:#00f;
  padding: 3px;
	}

.contentItem2 {
  grid-area: contentCopyright;
	/*! padding: 0.000003em; */
  margin-bottom: 0em;
	/*! margin-left:  0.4em; */
	/*! margin-right: 0.4em; */	
	color: #fff;
	
	/*! border-width:4; */
	border-color:#0f0;
	border-width: medium;
	}

.contentItem3 {
  grid-area: contentKontakte;
	/*! padding: 0.000003em; */
  margin-bottom: 0em;
	/*! margin-left:  0.4em; */
	/*! margin-right: 0.4em; */	
	color: #fff;
	
	border-width:4;
	border-color:#f00;
	}



.contentMain{
/*!	background-color: #eeffbb; */
	
}


	h1 {
color: #010066;
	font-size: 100%;
	text-align: center;
background-color: #ccc;
	}

	h2 {
color: #010066;
	font-size: 80%;
	text-align: center;
	}

	p {
color: #fff;
	font-size: 84%;
	margin-left: 1em;
	margin-right: 1em;
	text-align: center;
    /*! background-color: #4f4; */
	color: #bebebe;
	}

.pikdo {
	/*! margin-left: 5em; */
	/*! margin-right: 5em; */
	text-align: center;
    /*! background-color: #cfc; */
	color: #fff;
	}

.instagram {
	/*! margin-left: 5em; */
	/*! margin-right: 5em; */
	text-align: center;
    /*! background-color: #cfc; */
	color: #fff;
	}
.a {
text-decoration: none;
}

.e-mail {
	margin-left: 1em;
	margin-right: 1em;
	text-align: center;
    /*! background-color: #cfc; */
	}


.copyright {
	margin: 2vh;
	text-align: justify;
    /*! background-color: #08c; */
	color: #bebebe;
}

.contentContainerMain3{
		grid-area: contentContainerMain3;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

		grid-template-areas:
            "contentBilder" 
            "contentCopyright" 
            "contentKontakte";


/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 25vw 50vw 25vw ; */
/*	grid-template-columns: 100%;*/
	grid-template-rows: auto auto auto;
}

@media (min-width: 480px) { /* <= see, grid only for mobile screens */
.contentContainerMain3{
		grid-area: contentContainerMain3;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0.2100021em;
		grid-gap: 0.0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 0vw auto 0vw;	*/
	grid-template-rows: 0em auto auto;
	
}

p {
	font-size: 100%;
/*!		margin-left: 6vh;*/
}

.pikdo {
/*!	margin-left: 20vh; */
}

.instagram {
/*!		margin-left: 12vh;*/
}


.copyright {
	/*! margin-left: 11vh; */
}

.headerLogo {
	width: 35%;
}
	h1 {
	font-size: 120%;
	text-align: center;
	}

	h2 {
	font-size: 100%;
	text-align: center;
	}
	p {
	/*! font-size: 80%; */
	/*text-align: center;*/
	}
}
@media (min-width: 600px) { /* <= see, grid only for PAD screens */
.contentContainerMain3{
		grid-area: contentContainerMain3;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0.2100021em;
		grid-gap: 0.0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 0vw auto 0vw;	*/
	grid-template-rows: 0em auto auto;
	
}

p {
	font-size: 97%;
/*!		margin-left: 8vh;*/
}

.pikdo {
/*!		margin-left: 25vh;*/
}

.instagram {
/*!		margin-left: 16vh;*/
}

.copyright {
	/*! margin-left: 11vh; */
}

.headerLogo {
	width: 40%;
}
	h1 {
	font-size: 140%;
	text-align: center;
	}

	h2 {
	font-size: 120%;
	text-align: center;
	}
	p {
	/*! font-size: 100%; */
	/*text-align: center;*/
	}
}
@media (min-width: 800px) { /* <= see, grid only for PAD screens */
.contentContainerMain3{
		grid-area: contentContainerMain3;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0.2100021em;
		grid-gap: 0.0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 0vw auto 0vw;	*/
	grid-template-rows: 0em auto auto;
	
}

p {
	font-size: 131%;
/*!		margin-left: 9vh;*/
}

.pikdo {
/*!		margin-left: 28vh;*/
}

.instagram {
/*!		margin-left: 18vh;*/
}


.copyright {
	/*! margin-left: 11vh; */
}

.headerLogo {
	width: 55%;
}
	h1 {
	font-size: 160%;
	text-align: center;
	}

	h2 {
	font-size: 140%;
	text-align: center;
	}
	p {
	/*! font-size: 120%; */
	/*text-align: center;*/
	}
}

@media (min-width: 1000px) { /* <= seedisplay:block, grid only for PC screens */
	.headerMain > * {  	/*! background-color: #FFF;*/}/*	background-color: #333;*/
	.headerMain  {  	/*! background-color: #FFF; */}/*	background-color: #333;*/
	.screenMobile  { display:none; }
	.screenTab     { display:none; }
	.screenPC      { display:block; }
	
	.headerText    { display:none; }

	.headerMain {
		display: grid;
		grid-area: header;
		grid-gap: 0.50009002421rem;
		grid-template-columns: auto; 
		/***
		grid-template-rows: auto auto; 
		***/
		grid-template-areas:
            "headerLogo"   
			/**"headerNav"**/;			
		padding: 0.000000000000000000000012em;
		margin-bottom: 0;
	}
		
.contentContainerMain3{
		grid-area: contentContainerMain2;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0.0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 0vw auto 0vw;	*/
	grid-template-rows: 0em auto auto;
	
}		


p {
	font-size: 162%;
/*!		margin-left: 5em;*/
}

.pikdo {
/*!		margin-left: 5em;*/
}

.instagram {
/*!		margin-left: 5em;*/
}

.copyright {
	/*! margin-left: 11vh; */
}


.headerLogo {
	width: 50%;
}
				
	h1 {
	font-size: 200%;
	text-align: center;
	}

	h2 {
	font-size: 180%;
	text-align: center;
	}
	p {
	/*! font-size: 150%; */
	/*text-align: center;*/
	}
}




@media (min-width: 1900px) { /* <= seedisplay:block, grid only for PC screens */
		
.contentContainerMain3{
		grid-area: contentContainerMain2;
		/*! background-color: #77F; */
        display: grid;
		grid-gap: 0.0em;
		margin-bottom: 0em;
		margin-left:   0em;
		margin-right:  0em;

/*        grid-template-columns: 26vw 50vw 22vw ; */
/*		grid-template-columns: 0vw auto 0vw;	*/
	grid-template-rows: 0em auto auto;
	
}		


p {
	font-size: 317%;
/*!		margin-left: 5em;*/
}

.pikdo {
/*!		margin-left: 9em; */
}

.instagram {
/*!		margin-left: 6em; */
}

.copyright {
	/*! margin-left: 11vh; */
}


.headerLogo {
	width: 50%;
}
				
	h1 {
	font-size: 200%;
	text-align: center;
	}

	h2 {
	font-size: 180%;
	text-align: center;
	}
	p {
	/*! font-size: 150%; */
	/*text-align: center;*/
	}
}






























