/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



/*******************************************************
*
- Farben Anfang
*
*******************************************************/

.container * {
	color: #22536b;
	cursor: default;
}

/*
a,  a:hover span, a:hover span+span u  {
 cursor: pointer !important;
}
*/

/*Hellblau */
#Landingpage .anker,  
body  section.container form,
 .copyright{
	background-color: #22536b;
}





/* Dunkelblau */
body  section.container #mainnav  li a span+span, #unterseite a ,
 .top,body,  section#Landingpage header,
 #subnav ul li a{
background-color: rgb(28, 48, 67);
}






/* weisses Hellblau */
body  section#Copyright #subnav ul li a, #unterseite a ,
#mainnav ul li a span u,
#subnav ul li a ,
#Landingpage header h1,
#Landingpage header h1 span,
#Landingpage header h2,
label.checkbox a,
.top span,
 .copyright, body  section.container form label, 
 body  section.container form  input[type=submit], 
 body  section.container form  input[type=reset] {
	color: rgb(235,241,255);	
}

body  section.container form  input[type=submit], 
body  section.container form  input[type=reset],

input[type=checkbox] ~ span {
	background-color: rgb(28, 48, 67);
} 



body  section.container form input,
body  section.container form textarea {
	background: rgb(235,241,255);
}

body  section.container form input[type=text]:focus,
body  section.container form textarea:focus {
	background: white;
}

#AboutMe, #Natur, #Kunst, #Reisen, #Kontakt  {
	  background-color: rgb(235,241,255);	  
}




.container  {
	border-top: 0.9375em solid #22536b;
	border-bottom: 0.9375em solid #22536b;
}


img {
	border: 0.125em solid rgb(0, 83, 130);
	}



/*Orange*/

#subnav ul li a,body  section.container form  input[type=submit], #unterseite a ,
body  section.container form  input[type=reset],
.checkbox a{ 
	text-decoration-color: #b26200 !important;
}

#mainnav ul li a span+span u{
	border-color: #b26200 !important;
}

#Landingpage header h1 span { 
color: #b26200;
}

/* Wichtig */



 


.js-enabled.AbMe-active .container #mainnav ul li a[href^="#AboutMe"] span:first-child ,
.js-enabled.nature-active .container #mainnav ul li a[href^="#Natur"] span:first-child ,
.js-enabled.reisen-active .container #mainnav ul li a[href^="#Reisen"] span:first-child,
.js-enabled.kunst-active .container #mainnav ul li a[href^="#Kunst"] span:first-child,
.js-enabled.contact-active .container #mainnav ul li a[href^="#Kontakt"] span:first-child,
body  section.container form  label.checkbox input[type=checkbox]:checked ~ span
{
background-color: rgb(59, 142, 184);
}

body  section#Landingpage div + div {
	background-color: rgba(34,83,107, 0.84);
}

/*******************************************************
*
- Farben Ende
*
*******************************************************/

.button u{
	display: block;
	padding: 15px;
	margin: 15px;
	text-align: center;
	color: white;
	background-color: rgb(28, 48, 67);
	text-decoration-color: #b26200 !important;
}

@font-face {
    font-family: 'charmonmanregular';
    src: url('../fonts/charmonman-regular-webfont.woff2') format('woff2'),
         url('../fonts/charmonman-regular-webfont.woff') format('woff'),
		 url('../Charmonman-Regular.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'niramitregular';
    src: url('../fonts/niramit-regular-webfont.woff2') format('woff2'),
         url('../fonts/niramit-regular-webfont.woff') format('woff'),
		  url('../fonts/niramit-regular-webfont.ttf') format('ttf');
    font-weight: normal;
    font-style: normal;
}


 

 
 
*{
  font-family: Helvetica, arial;
  outline: none;
  box-sizing: border-box !important;
}

body {
	font-family: 'niramitregular' !important;
	position: relative !important;
	min-height: 100vh ;
	}


@keyframes background {
	0% { opacity: 0;}
	100% { opacity: 1;}
	0% { transform: scale(1.5); width: 100%; height: 100%;}
	100% { transform: scale(1); width: 100%; height: 100%;}
}

@keyframes menu {
	0% { opacity: 0; position: relative; left: -50em;}
	100% { opacity: 1; position: relative; left: 0;}	
}



#Landingpage{
	padding: 0;	
	margin: 0;
	position: relative;
	border: none;
	overflow: hidden;
}



 #Landingpage header  {
	padding: 0.9375em;
 	position: relative;
	z-index: 98;
	text-align: center;
	padding: 1.5625em 0 1.25em 0;
}



#Landingpage header h1 { 
	text-align: center;
	font-size: 2.1875em;
	transform:matrix(1.00,-0.05,0.05,1.00,0,0);
-ms-transform:matrix(1.00,-0.05,0.05,1.00,0,0);
-webkit-transform:matrix(1.00,-0.05,0.05,1.00,0,0);
}

#Landingpage header h1 span { 
	font-size: 1.3em;
}

#Landingpage header h2 { 
	font-size: 1.4em;
	line-height: 1.5em;
	text-align: center;
	padding: 0.3125em 0 0 0;
	transform:matrix(1.00,-0.05,0.05,1.00,0,0);
-ms-transform:matrix(1.00,-0.05,0.05,1.00,0,0);
-webkit-transform:matrix(1.00,-0.05,0.05,1.00,0,0);
}
 


 .top { 
	position: fixed;
	right: 0.625em;
	bottom: 0.625em;
	z-index: 99;
	width: 3.4375em;
	height: 3.4375em;
	padding: 0.9375em 0 0.9375em 0;
	text-align: center;
	color: white;
	text-decoration: none;
	display: none;
	
	background-image:  url("../svg/up.svg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 2.8125em;
	
	-webkit-border-radius: 3.125em;
	-moz-border-radius: 3.125em;
	border-radius: 3.4375em;
	transition: 0.3s;
}

.top span {
	opacity: 0;
}

.js-enabled .top { 
	display: block;
}


body  section.container  {
padding: 3.125em 0.9375em 3.125em 0.9375em;
}

body  section#AboutMe  {
margin-top: 0;
}

body  section.container header{
	margin: 0 0 1.5625em 0;
}

body section.container header h1, body section.container header h2{
 font-family: 'charmonmanregular';
}

body  section.container  header h2 {
	font-size: 3.125em;
	margin: 1em 0 0.9375em 0;
	text-align: center;
}

body  section.container header p {
	line-height: 1.5625em;
	padding: 0.625em 0 0 0;
	text-align: center;
}



body section.container nav#mainnav, #subnav{
	position: relative;
	border: none;
	z-index: 99;
}


#mainnav ul li,  #subnav ul li a{
	margin: 0 0 0.125em 0;
}

#mainnav ul li:first-child{
	display: none;
}

#mainnav ul li:last-child, #subnav ul li:last-child a{
	margin: 0 0 0 0;
}

 #subnav ul li a{
	display:block;
	padding: 0.9375em 1.25em 0.9375em 1.25em;
}

#mainnav ul li a {	
	text-decoration: none !important;
}

#mainnav ul li a span{
	display: none;
}

.no-cssgrid #mainnav ul li a span  {
	display: block;
	text-align: center;
}

#mainnav ul li a span+span{
	display: grid;
	display: -ms-grid;
	padding: 0.125em 0 0.3125em 0;
	background-image:  url("../svg/arrowDown.svg");
	background-repeat: no-repeat;
	background-position: right center;
}



#mainnav ul li a span+span u{
text-decoration: none;
display: inline-block;
border-bottom: solid 0.1875em;
padding: 0 0 0.3125em 0;
margin: auto;
}


#mainnav   li a[href^="#AboutMe"] span:first-child+span {
	background-image:   url("../svg/arrowDown.svg"), url("../svg/me.svg");
	background-repeat: no-repeat, no-repeat;
	background-position: right center, 0.625em center;
	background-size: auto auto, 1.25em 1.25em;
}


#mainnav   li a span:first-child+span {
	background-position: right center, 0.625em center;
	background-size: auto auto, 0.9375em 0.9375em;
}

#mainnav   li a[href^="#Natur"] span:first-child+span {
	background-image:   url("../svg/arrowDown.svg"), url("../svg/nature.svg");
	background-repeat: no-repeat, no-repeat;
}

#mainnav   li a[href^="#Reisen"] span:first-child+span {
	background-image:   url("../svg/arrowDown.svg"), url("../svg/travel.svg");
	background-repeat: no-repeat, no-repeat;
}

#mainnav   li a[href^="#Kunst"] span:first-child+span {
	background-image:   url("../svg/arrowDown.svg"), url("../svg/art.svg");
	background-repeat: no-repeat, no-repeat;
}

#mainnav   li a[href^="#Kontakt"] span:first-child+span {
	background-image:   url("../svg/arrowDown.svg"), url("../svg/contact.svg");
	background-repeat: no-repeat, no-repeat;
}



.no-cssgrid .js-enabled  #mainnav  {
	display: none;
}

.js-enabled  #mainnav  li a span:first-child {
	background-image:  url("../svg/up.svg");
	}

.js-enabled  #mainnav   li a[href^="#AboutMe"] span:first-child {
	background-image:  url("../svg/me.svg");	
}

.js-enabled  #mainnav   li a[href^="#Natur"] span:first-child {
	background-image:  url("../svg/nature.svg");	
}

.js-enabled  #mainnav   li a[href^="#Reisen"] span:first-child {
	background-image:  url("../svg/travel.svg");	
}

.js-enabled  #mainnav   li a[href^="#Kunst"] span:first-child {
	background-image:  url("../svg/art.svg");	
}

.js-enabled  #mainnav   li a[href^="#Kontakt"] span:first-child {
	background-image:  url("../svg/contact.svg");	
}


#subnav ul li:first-child a {
	margin-top: 0.125em;
}

#subnav ul li a {
	background-image:  url("../svg/arrows.svg");
	background-repeat: no-repeat;
	background-position: right center;

}


body  section.container article{
	padding: 1.25em;
}

body  section.container  aside{
	margin: 0 1.25em 1.25em 0;
}

body  section.container  article h2, 
body  section.container  aside h2 {
	 font-size: 1.1875em;
	 text-align: center;
	 line-height: 1.5625em;
}




body  section.container  article p, 
body  section.container  aside p, 
body  section.container  article blockquote {
	font-size: 1.0625em; 
	line-height: 1.370em;
	line-height: 1.5625em;
	margin: 1.25em 0 0 0;
}




.sign{
	 text-align: center;
	 font-family: 'charmonmanregular' !important;
	 font-size: 1.875em !important;
	 margin-bottom: 1.25em;	 
}

body  section.container  article blockquote {
		font-size: 0.9375em;
		margin: 2.5em 2.5em 3.125em 2.5em;		
		border-left: solid 1px;
		padding-left: 0.5em	
}




body  section#AboutMe  figure a{
position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 66.67%; /* You define this doing height / width * 100% */
    position: relative;
}



.no-cssgrid body  section#AboutMe  figure a { 
  padding-bottom: 0;
}

body  section#AboutMe  figure+figure {
display: grid;
display: -ms-grid;
visibility: visible;
}

body  section#AboutMe  figure img{
	width: 100%;
    /*height: auto;*/
    position: absolute;
	-webkit-border-radius: 0.1875em;
	-moz-border-radius: 0.1875em;
	border-radius: 0.1875em;
}

.no-cssgrid body  section#AboutMe  figure img{
	position: static;
}

.no-cssgrid body  section#AboutMe  figure{
	max-width: 500px;
	margin: auto;
}

.no-cssgrid body  section.container .gallery {
display: flex;
display: -ms-grid !important;
}




body  section.container .gallery a {
	width: 100%;
    padding-bottom: 66.67%; /* You define this doing height / width * 100% */
    position: relative;
	cursor: zoom-in !important;
}



body  section.container .gallery a:first-child{
	display: block;
	margin-top: 0.9375em;
	opacity: 1;
}

body  section.container .gallery a img{
    width: 100%;
    height: 100%;
    position: absolute;
	-webkit-border-radius: 0.1875em;
	-moz-border-radius: 0.1875em;
	border-radius: 0.1875em;
}


.no-cssgrid body  section.container .gallery a img{
    position: static;
}

body  section.container .gallery a:before, body  section.container figure a:before{
	content:"";
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0);
	display: block;
	position: absolute;
	z-index: 99;
	left: 0;
	top: 0;
	background-image:  url("../svg/zoom1.svg");
	background-repeat: no-repeat;
	background-position: bottom right;
	background-position: bottom center;
	transition: 0.5s;
}

 body  section#AboutMe figure.bild a:before{
	 padding-bottom: 66.67%;
}

.no-cssgrid  body  section.container .gallery a:before, .no-cssgrid body  section.container figure a:before{
	 display: none;
	 
}

body  section.container  aside h2{
	margin: 1.25em 0 0 0;
	font-weight: bold;
}



body  section.container div.kontakt{
	padding: 3.125em 0 6.25em 0;
	margin: auto;
}


body  section.container div.kontakt p a{
	font-size: 2.5em !important;
	 transition: 0.3s;
}


body  section.container form {
	 padding: 0.9375em;
	 padding-bottom: 1.25em;
	 margin-top: 1.25em;
	 -webkit-border-radius: 0.1875em;
	 -moz-border-radius: 0.1875em;
	 border-radius: 0.1875em;
	}

body  section.container form label {
	display: block;
	padding: 0.9375em 0.3125em 0.3125em 0.3125em;
	position: relative;
	-webkit-border-radius: 0.1875em;
	-moz-border-radius: 0.1875em;
	border-radius: 0.1875em;
}

body  section.container form input{
	cursor: auto;
} 
 
 
body  section.container form textarea {
	min-height: 15.625em;
	cursor: auto;

}	


body  section.container form input, body  section.container form textarea {
	display: block;
	width: 100%;
	padding: 0.625em;
	font-size: 0.875em;
	border: none;	
	-webkit-border-radius: 0.1875em;
	-moz-border-radius: 0.1875em;
	border-radius: 0.1875em;
}


body  section.container form label.checkbox {
	margin: 0.625em 0 0.625em 0;
	padding: 0.625em;
	font-size: 0.8125em;
	line-height: 1.5625em;
	text-align: center;
}


body  section.container form  div{
	position: relative !important;
	margin: 0.9375em;
	border: solid 2px #0080FF;
}



body  section.container form  input[type=checkbox] {
	position: relative;
	bottom: 0.9375em;
	z-index: 99;
	display: block;
	height: 1.875em;
	width: 1.875em;
	opacity: 0;
	cursor: pointer;
	margin: auto;
}

body  section.container form  input[type=submit] {
	padding: 1.25em;
}


body  section.container form  input[type=checkbox] ~ span{
	position: absolute;
	bottom: 0.9375em;
	left: 50%;
	margin-left: -15px;
	height: 1.875em;
	width: 1.875em;
	-webkit-border-radius: 0.1875em;
	-moz-border-radius: 0.1875em;
	border-radius: 0.1875em;
    transition: 0.5s;
	border: solid 1px #0080FF;
}


body  section.container form input[type=checkbox]:checked ~ span{	 
-webkit-border-radius: 0.625em;
-moz-border-radius: 0.625em;
border-radius: 0.625em;

}


body  section.container form input[type=checkbox] ~ span:after{	 
   content: "";
  position: relative;
  display: none;
  transition: 0.5s;
}

body  section.container form   input[type=checkbox]:checked ~ span:after{
display: block;

}


body  section.container form  input[type=checkbox] ~ span:after{	 
  left: 0.4375em;
  top: 0.25em;
  width: 0.8125em;
  height: 0.875em;
  border: solid white;
  border-width: 0 0.1875em 0.1875em 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);  
}


body  section.container form  input[type=submit], 
body  section.container form  input[type=reset] {
   border: none;
   margin: 0.3125em 0 0 0;
   width: 100%;
   text-decoration: underline;
   cursor: pointer;
}


body  section.container form .rechnen  {
	padding: 1em;
	display: grid;
	display: -ms-grid;
	text-align: center;
}


body  section.container form .rechnen p {
	font-size: 1em;
	color: white;
	-ms-flex-item-align: middle;
	 -ms-grid-row-align: middle;
	align-self: middle;
	margin: auto ;
	line-height: 1.5625em;
}

.pflichtfeld {
	color: white;
	text-align: center;
	font-size: 0.875em;
	padding: 0.3125em;
	border: none !important;
	
}


body  section.container form .rechnen input {
	width: 5em;
	display:inline-block;
	margin-top: 0.3125em;
}

input[type='number'] {
    -moz-appearance:textfield;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

body  .copyright  {
	padding: 1.25em;
	text-align: center;
	margin: 0 0 5em 0;
}

 

 

	   @media only screen and (max-width: 48em) and (orientation : landscape), only screen and (orientation : portrait)
 {
	 
	 	 body  section.container     { 		 
		 	background-color: rgb(34,83,107)
		 }
		 
		 
		 
	 
	
	 .headback {
	background: url("../Picture/Landingpage/Hochgrat.jpg"); 
	background-size: 100% auto;
	background-position: bottom center;

	background-repeat: no-repeat;
	position: static;
	width: 100% !important;
	height: 12.5em !important;
	display: block;
 }
	 
	 body  section.container #mainnav    { 
	 margin: auto;
	 padding: 0.3125em;
	 max-width: 25em;
}

	 body  section.container #mainnav  li  a{ 
	 position: relative;
	 }
	 body  section.container #mainnav  li  a span{ 
	 -webkit-border-radius: 0.3125em;
	 -moz-border-radius: 0.3125em;
	 border-radius: 0.3125em;
}

	body  section.container #mainnav  li a span:first-child{ 
	display: block;
	position: absolute;
	top: 0;
	z-index: 99;
}

body  section.container #mainnav  li a span+span, #subnav ul li a{
	padding: 1.25em
}


#subnav  {
	margin: auto;
	margin-top: 1.25em;
	padding: 0.3125em;
	max-width: 25em;
	 }

#subnav ul li a {
	text-align: center;
}


body section.container nav#mainnav, #subnav {
	background-color: rgb(34,83,107);
}


 div.back {
background: none !important; 
background-color: rgb(28, 48, 67);
height: 6.25em;
width: 100%;
}


body  section.container header{
	padding-top: 1.5625em;
	border-left: 1px solid;
	border-top: 1px solid;
	border-right: 1px solid;
}


body  section.container  header h2 {
	font-size: 2em;
	margin: 0 0 0.9375em 0;
	text-align: center;
}

body  section.container article{
	margin-top: 3.125em;
	margin: 0 1.25em 1.25em 1.25em;
}

body  section#AboutMe   {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto auto auto;
}

body  section#AboutMe  header {
	grid-column: 1;
	grid-row: 1;
}

body  section#AboutMe  article {
	grid-column: 1;
	grid-row: 2;
}

body  section#AboutMe  figure {
	grid-column: 1;
	grid-row: 3;
	visibility: hidden;
	padding: 40px;
}




body  section aside {
	padding: 0 1.2em 0 1.2em;
}


body  section.container header p {
	padding: 0;
	font-size: 1.1em;
 }  
 
#unterseite a {
	margin: 1.25em;
	padding: 1.25em;
	text-align: center;
	display: block;
	background-image:  url("../svg/left.svg");
	background-repeat: no-repeat;
	background-size: 2.5em 2.5em;
	background-position: 0.4375em ;
}


body  section.container .gallery {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	padding: 40px;
}

body  section.container .gallery a {
	grid-column: 1;
	grid-row: 1;
	opacity: 0;
}
 }
 
 


/*******************************************************
*
- Grid wird aktiviert, 4 Spalten
- Über mich: Text oben, Bilder unten
- Bildgalerie, nur vier Bilder
- Kontaktdaten oben, Formular unterhalb
*
*******************************************************/
 

   @media only screen and (min-width: 48em) and (orientation : landscape)
 {
	 
.brake {
display: none;	
}

	 
	/* Dunkelblau */
.js-enabled .container #mainnav  li a span:first-child, 
.js-enabled .container #mainnav
{
background-color: rgb(28, 48, 67);
} 
	 
	 
	 
	 
	 
	 
	 #AboutMe, #Natur, #Kunst, #Reisen{
	  background-image:  url("../background/camera.jpg");
	  background-repeat: no-repeat;
	  background-position:  right center; 
	  background-size:  80%;
}

	 #Kontakt{
	  background-image:  url("../background/camera1.jpg");
	  background-repeat:  no-repeat;
	  background-position: right center; 
	  background-size:  80%;
}

 .headback {
	background: url("../Picture/Landingpage/Hochgrat.jpg"); 
	background-size: cover;
	background-position: bottom center;
	background-attachment: scroll;
	background-repeat: no-repeat;
	opacity: 1;
	animation-name: background;
    animation-duration: 6s;
	 position: absolute;
	 top: 0;
	 width: 100%;
	 min-height: 100vh ;
	 z-index: -1;
 }	

 
 div.back {
	/*background: url("../background/shadowLeft.png"), url("../background/shadowRight.png"), url("../Picture/Themen/Natur/Redstripe.jpg");*/
	background-size: 25px, 25px, cover;
	background-attachment: scroll, scroll, scroll;
	background-repeat: repeat-y, repeat-y, no-repeat;
	background-position: left, right, center;
	height: 25em;
	width: 100%;
	display: block;
	max-width: 125em;
	margin: auto;
}


	 
body  section.container {
	display: grid;
	display: -ms-grid;
	grid-template-columns: 6.875em 1fr 2fr 1fr 6.875em;
	-ms-grid-columns: 6.875em 1fr 2fr 1fr 6.875em;
	grid-template-rows: auto auto auto auto auto;
	max-width: 125em;
	margin: auto;
	padding: 1.875em 0 1.875em 0;
}

body  section#Landingpage {
	display: grid;
	display: -ms-grid;
	-ms-grid-rows: auto 2fr auto;
	grid-template-rows: auto 2fr auto;
	max-width: 125em;
	margin: auto;
	}


#Landingpage:before{ 
	content:"";
	display: block;
	grid-column:  4 / -1;
	-ms-grid-column: 4;
	grid-row: 1/3;
	-ms-grid-row: 1;
	-ms-grid-row-span: 3;
	-ms-grid-column-span: 5;
	z-index: 99;
	background-image:  url("../svg/Stefan1.svg");
	background-size: 80% auto; 
	background-repeat: no-repeat;
	background-position: bottom right;	
}


body  section#Landingpage div + div {
	-ms-grid-columns: 1fr;
	grid-template-columns: auto;
	grid-template-rows: auto 2fr auto;
	-ms-grid-rows: auto 2fr auto;
	-ms-grid-column: 2;
	grid-column: 2 / 3;
	grid-row: 1 / -1;
	-ms-grid-row: 1;
	-ms-grid-row-span: 3;
	z-index: 2;
	display: grid;
	display: -ms-grid;
	min-width: 21.875em;
	-webkit-animation-name: menu;
	        animation-name: menu;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
	border-right: 1.5625em solid rgba(28, 48, 67, 0.6) !important;

}


body  section#Landingpage header{
	grid-column: 1 / -1;	
	grid-row: 1;
	-ms-grid-column: 1;
	-ms-grid-column-span: -1;
	margin: 1.25em -10px 0 -10px;
	border: none;
	border-radius: 10px;
-webkit-box-shadow: 0.3125em 0.3125em 1em 0em rgba(0,0,0,0.75);
-moz-box-shadow: 0.3125em 0.3125em 1em 0em rgba(0,0,0,0.75);
box-shadow: 0.3125em 0.3125em 1em 0em rgba(0,0,0,0.75);	
}

#Landingpage header h1 { 
	font-size: 3.5em;
	margin: auto;
}

#Landingpage header h1 span { 
font-size: 1.1em;

}

#Landingpage header h2 {
	font-size: 1.5625em;

}

body  section.container header{
	-ms-grid-column: 2;
	-ms-grid-column-span: 3;
	grid-column: 2 / 5;
	border-left: solid 1.5px;
	border-top: solid 1.5px;
	padding-top: 1.25em;
	padding-left: 3.125em;
	padding-bottom: 1.25em
}

body  section.container header p{
	font-size: 1.25em;
	margin-top: 1.5625em;
}


body  section.container #mainnav  li a span+span {
	background-color: rgba(28, 48, 67, 0.9);
}


body section.container nav#mainnav{
	-ms-grid-column: 1;
	-ms-grid-column-span: 6;
	-ms-grid-row: 2;	
	grid-row: 2;
	-ms-grid-columns: 1fr;
	-ms-grid-rows: 1fr;
	display: -ms-grid;
	display: grid;
	padding: 0.9375em 0.625em 0.3125em 0.625em;
	}
	
body section.container nav#mainnav ul{
	display: -ms-grid;
	display: grid;
	-ms-grid-row: 1;
	-ms-grid-row-span: 3;
	-ms-grid-columns: 1fr 1fr 1fr;
	 grid-template-columns: auto auto auto;
	-ms-grid-rows: 2fr 2fr 6.875em;
	 grid-template-rows: 2fr 2fr 6.875em;
	 grid-template-rows: 2fr 2fr 1fr;
	}
	
	
	
body section.container nav#mainnav ul li {
	display: -ms-grid;
	-ms-grid-rows: 100%;
	-ms-grid-columns: 100%;
	display: grid;
	margin: 1.25em 0 0 0;
	position: relative;
}

body  section.container #mainnav  li a{ 
	display: -ms-grid; 
	display: grid;
	-ms-grid-columns: 100%;
	-ms-grid-rows: 100%;
	 grid-template-rows: 1fr auto;
	 -ms-grid-row: 1;
	-ms-grid-row-span: 1;
	-ms-grid-column: 1;
	-ms-grid-column-span: 5;
	position: relative;
	margin: 0;
	background-size: cover;
	background-position: top center;
	background-repeat: no-repeat;
	/* max-height: 15.625em !important; */
	}
	
	body  section.container #mainnav  li a:after{ 
	content:"";
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0);
	position: absolute;
	top: 0;
	left: 0;
	z-index: 50;
	}
	
	

	body  section.container #mainnav  li:first-child+li a{ 
	background-image:  url("../Picture/Themen/Ueber_mich/Stefan_Fritz_3.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li a{ 
	background-image:  url("../Picture/Themen/Natur/Allee.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li a{ 
	background-image:  url("../Picture/Themen/Reisen/Armut.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li+li a{ 
	background-image:  url("../Picture/Themen/Kunst/Explosion.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li+li+li a{ 
	background-image:  url("../Picture/Kontakt/Post_klein.jpg");
	}
 
 
 

body  section.container #mainnav ul li:first-child  {
	display: none;
}
	
	
	
	
	
body  section.container #mainnav ul li:first-child+li  {
	grid-column: 1 / -1;
	-ms-grid-column: 1;
	-ms-grid-column-span: 5;
	-ms-grid-row: 1;
	grid-row: 1;
	}
	
	

body  section.container #mainnav ul li:first-child+li+li  {
	-ms-grid-column: 1;
	grid-column: 1;
	-ms-grid-row: 2;
	grid-row: 2;
	margin-right: 0.3125em;
}

body  section.container #mainnav ul li:first-child+li+li+li  {
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	grid-row: 2;
	margin-right: 0.3125em;
}

body  section.container #mainnav ul li:first-child+li+li+li+li  {
	-ms-grid-column: 3;
	grid-column: 3;
	-ms-grid-row: 2;
	grid-row: 2;
}

	
	
	

/* Kontakt */
body  section.container #mainnav ul li:first-child+li+li+li+li+li  {
	grid-column: 1 / -1;
	-ms-grid-column: 1;
	-ms-grid-column-span: 3;
	-ms-grid-row: 3;
	grid-row: 3;
}	
	
body  section.container #mainnav  li a span:first-child{ 
	background-size: 1.875em 1.875em;
	background-color: transparent;
	width: 2.1875em;
	height: 2.1875em;
	background-repeat: no-repeat;
	background-position: center center;
	padding: 0;
	position: absolute;
	top: 0.3125em;
	left: 0.3125em;
	z-index: 99;
}



	
body  section.container #mainnav  li a span+span{ 
	-ms-flex-item-align: end; 
	-ms-grid-row-align: end;
	display: -ms-grid;
	-ms-grid-columns: 100%;	
	align-self: end;
	position: relative;
	z-index: 99;
}

body  section.container #mainnav  li a span+span u {
	-ms-grid-column-align: center;
	justify-self: center;
	margin: 0.3125em auto 0.3125em auto;
}


	

.js-enabled section.container #mainnav  li a span+span u  {
	text-align: left;
}


.js-enabled .container #mainnav ul li {
	display: block;
	margin: 0;
	min-height: auto;
}
 
.js-enabled .container #mainnav ul li a{
	color: black;
	text-decoration: none;
	padding: 0 0 0 0 !important;
	margin: 0.3125em 0 0 0;
	font-size: 1em;
	text-align: left;
	width: 5em !important;
}



.js-enabled .container #mainnav ul li a span{
	padding: 1.25em 0 0 0.625em;
	position: normal;
}


.js-enabled .container #mainnav  li a span:first-child {
	display: block;
	width: 2.9375em;
	height: 2.9375em;
	padding: 0.1875em;
	margin: 0;
	background-size: 2.5em 2.5em;
	background-repeat: no-repeat;
	background-position: center center;
	position: static;
}

.js-enabled .container #mainnav    {	
position: fixed;
left: 0px;
top: 0px;
bottom: 0px;
background-color: transparent;
min-width: auto;
width: 6.25em;
margin: 0;
z-index: 99;
border: none !important;
animation-duration: 0s;
display: -ms-grid;
}

.js-enabled .container #mainnav   ul {
	background-color: transparent;	
	align-self: center;
	display: block !important;
	-ms-grid-column-align: center;
	-ms-flex-item-align: center;
	-ms-grid-row-align: center;
}

.js-enabled .container #mainnav ul li a span+span u{
	padding: 0 !important;
	margin: 0 !important;
}

.js-enabled .container #mainnav   ul li{
background-color: transparent;
}

.js-enabled .container #mainnav   ul a{
position: relative;
background-color: transparent !important;
background-image: none !important;
}

.js-enabled .container #mainnav   ul a:after{
content:"";
display: block;
width: 6.25em;
height: 3.75em;
background-color: blue;
position: absolute;
top: 0;
}


.js-enabled .container #mainnav   ul a:after{
	background-color: transparent !important;
}

.js-enabled .container #mainnav ul li:first-child {
	display: block;
}

body  section.container #mainnav  li a span+span{ 
	-ms-flex-item-align: end; 
	-ms-grid-row-align: end; 
	align-self: end;
	position: relative;
	z-index: 99;
}

 
 .js-enabled .container #mainnav  li a span:first-child {
width: 4.375em;
height: 4.375em;
padding: 0.3125em;
} 

.js-enabled .container #mainnav ul li a span+span {
position: relative;
height: 100%;
padding: 1.3125em 0 1.875em 1.875em;
min-width: 15.625em;
color: white;
font-size: 1,25em;
background-image: none;
text-align: left;
display: none;
position: absolute;
top: 0;
left: 5em;
z-index: 99;
}

.js-enabled .container #mainnav ul li a span+span u{
position: absolute;
top: 1.375em;
padding: 0.3125em !important;
}



 
.js-enabled.AbMe-active .container #mainnav ul li a[href^="#AboutMe"] span:first-child ,
.js-enabled.nature-active .container #mainnav ul li a[href^="#Natur"] span:first-child ,
.js-enabled.reisen-active .container #mainnav ul li a[href^="#Reisen"] span:first-child,
.js-enabled.kunst-active .container #mainnav ul li a[href^="#Kunst"] span:first-child,
.js-enabled.contact-active .container #mainnav ul li a[href^="#Kontakt"] span:first-child 
{
margin-left: 0.625em;
}
 
 /*zweiter span beim hovern weiter links */
.js-enabled.AbMe-active .container #mainnav ul li a[href^="#AboutMe"] span:first-child+span,
.js-enabled.nature-active .container #mainnav ul li a[href^="#Natur"] span:first-child+span,
.js-enabled.reisen-active .container #mainnav ul li a[href^="#Reisen"] span:first-child+span,
.js-enabled.kunst-active .container #mainnav ul li a[href^="#Kunst"] span:first-child+span,
.js-enabled.contact-active .container #mainnav ul li a[href^="#Kontakt"] span:first-child+span 
{
left: 5.625em;
}


#subnav {
	-ms-grid-column: 1;
	-ms-grid-column-span:6;
	-ms-grid-row: 3;
	}

#subnav ul {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 1fr 1fr;
	grid-template-columns: 1fr 1fr;
}

#subnav ul li {
display: -ms-grid;
-ms-grid-columns: 100%;
display: grid;
position: relative;
-ms-grid-column: 1;
}

#subnav ul li+li {
-ms-grid-column: 2;
}


#subnav ul li a{
margin: 0.9375em 0.3125em 0.3125em 0.3125em !important;
padding: 0.625em 0.3125em 0.75em 0.3125em !important;
text-align: center;
text-decoration: underline;
}


.js-enabled #subnav {
	-ms-flex-item-align: end;
	-ms-grid-row-align: end;
    align-self: end;
	z-index: 98;
}



body  section.container  header h2, 
body  section.container header p, 
body  section.container  article p:last-child,
body  section.container  article h2 {
	text-align: left;
}


body  section.container article{
	-ms-grid-column: 2;
	-ms-grid-column-span: 3;
	grid-column: 2 / 5;	
	-ms-grid-row: 3;	
	grid-row: 3;
	border-left: 1.5px solid;
	padding-left: 3.125em;
	padding-top: 0;
}


body  section#AboutMe  figure {
	-ms-grid-column: 2;
	grid-column: 2;	
	-ms-grid-row: 4;	
	grid-row: 4;
	display: -ms-grid;
	display: grid;
	position: relative;
	left: 6.25em;
	}

body  section#AboutMe  figure + figure{		
	-ms-grid-column: 3;		
	grid-column: 3;	
	-ms-grid-row: 4;	
	grid-row: 4;
	position: relative;
	left: 7.5em;

}

body  section#AboutMe  figure  a{
	-ms-flex-item-align: start;
	-ms-grid-row-align: start;
	align-self: start;
}

body  section#AboutMe  figure+figure  a{
		-ms-flex-item-align: end;
	    -ms-grid-row-align: end;
	    align-self: end;
		-ms-grid-row: 1;
		-ms-grid-row-span:2;
		
	
}

body  section#AboutMe  figure a  {
	cursor: zoom-in !important;	
}

body  section#Kontakt{
	-ms-grid-columns: 6.875em 1fr  1fr 6.875em;
	    grid-template-columns: 6.875em 1fr  1fr 6.875em;
	-ms-grid-rows: auto 6.25em 2fr auto;
	    grid-template-rows: auto auto 2fr auto;
}


body  section.container .gallery{
	display: -ms-grid;
	display: grid;
	-ms-grid-columns:  1fr 1fr ;
	    grid-template-columns:  1fr 1fr ;
	-ms-grid-rows:  1fr 1fr;
	    grid-template-rows:  1fr 1fr;
	-ms-grid-column: 2;
	-ms-grid-column-span: 3;
	grid-column: 2 / 5;
	-ms-grid-row: 3;
	grid-row: 3;
	grid-gap: 0.625em 0.625em;
	margin: 0 3.125em 0 3.125em;
	margin-bottom: 1.5625em;
 } 
 

 
 body  section.container .gallery a:before, body  section.container figure a:before{
	content:"";
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0);
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	background-image:  url("../svg/zoom.svg");
	background-size: 2.5em 2.5em;
	background-repeat: no-repeat;
	background-position: bottom right;
	transition: 0.5s;
}
 
 
 
 
 
body  section.container .gallery a:first-child{
	-ms-grid-column: 1;
	grid-column: 1;
	-ms-grid-row: 1 ;
	grid-row: 1 ;
}

body  section.container .gallery a:first-child + a{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 1;
	grid-row: 1;
}

body  section.container .gallery a:first-child + a + a{
	-ms-grid-column: 1 ;
	grid-column: 1 ;
	-ms-grid-row: 2;
	grid-row: 2;
}

body  section.container .gallery a:first-child + a + a + a{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	grid-row: 2;
}

body  section.container .gallery a:first-child + a + a + a + a{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	grid-row: 2;
	opacity: 0;
}

body  section.container .gallery a {
	-ms-flex-item-align: stretch;
	-ms-grid-row-align: stretch;
	align-self: stretch;
	display: block;
	margin: 0 !important;	
}

.no-cssgrid section.container .gallery a {
	padding: 5px;
}

body  section.container aside{
	-ms-grid-column: 2;
	-ms-grid-column-span: 3;
	grid-column: 2 / 5;
	-ms-grid-row: 4;
	grid-row: 4;
	border-left: solid 1.5px;
	border-bottom: solid 1.5px;
	margin-top: 1.25em;
	padding-right: 0.625em;
	padding-left: 3.125em;
	}


body  section.container  aside h2{
	margin: 0;
	margin: 0 0 0.7em 0;
	text-align: left;
}

body  section.container  aside p{
	margin: 0 0 1.25em 0;
}

body  section#Kontakt div.kontakt{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2 / 4;
	-ms-grid-row: 3;
	grid-row: 3;
	-ms-flex-item-align: center;
	-ms-grid-row-align: center;
	 align-self: center;
}

body  section.container form{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2 / 4;
	-ms-grid-row: 4;
	grid-row: 4;
	margin-bottom: 3.125em;
	max-width: 43.75em;
	margin-left: 3.125em;
}

body  section.container form input, body  section.container form textarea {
	font-size: 1em;
}

body  section.container form  input[type=submit], body  section.container form  input[type=reset] {
   transition: 0.5s;
}

body section.container .copyright  {
	grid-column: 1 / -1;
	-ms-grid-row: 5;
	grid-row: 5;
	}
	 
body  .copyright  {
	margin-bottom: 0;
}

#unterseite a {
	-ms-grid-column: 1 ;
	grid-column: 1 ;
	-ms-grid-row: 1;
	grid-row: 1;
	margin: 1.25em;
	padding: 0.3125em;
	text-align: center;
	    -webkit-transition: 0.5s;
	    -o-transition: 0.5s;
	    transition: 0.5s;
}
 }
/* 48em Ende */





/*******************************************************
*
    - Grid schaltet auf 5 Spalten
	- Galerie schaltet auf 5 Bilder
	- Über mich, Bilder links, Text rechts
*
*******************************************************/

   @media only screen and (min-width: 68.75em) and (orientation : landscape)
 {
	 


body  section#AboutMe  figure {
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 3;
	grid-row: 3;
	margin-left: 3.125em;
	position: static;
}

body  section#AboutMe  figure + figure{	
	-ms-grid-column: 2;	
	grid-column: 2;	
	-ms-grid-row: 4;	
	grid-row: 4;	
	padding: 0;
	margin-left: 3.125em;
	position: static;
}


body  section#AboutMe  figure+figure  a{
	margin-top: 0.625em;
}

body  section.container  section h2,
body  section.container  article h2, 
body  section.container  aside h2{
	text-align: left;
}





body  section.container article{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3 / 5;
	-ms-grid-row: 3;
	-ms-grid-row-span: 2;
	grid-row: 3 / 5;
	border-left: none;
	padding-left: 1.25em;
	margin: 0;
}

body  section.container  article h2 {
	 font-size: 1.0625em;
	 margin: 0 0 0 1.25em;
}

body  section.container  article h2:first-letter {
	 font-size: 1.3em;
}

body  section.container  article p  {
	margin: 0.9375em 1.25em 0 1.25em;
}

body  section.container  article p:last-child  {
	margin: 0.9375em 1.25em 0 0.5em;
}



body  section.container .gallery {
	display: -ms-grid;
	display: grid;
	-ms-grid-columns:  2fr 1fr 1fr ;
	    grid-template-columns:  2fr 1fr 1fr ;
	-ms-grid-rows:  1fr 1fr;
	    grid-template-rows:  1fr 1fr; 
	grid-gap: 0.625em 0.625em;	
	-ms-grid-column: 2;	
	-ms-grid-column-span: 3;	
	grid-column: 2 / span 3;
	-ms-grid-row: 3;
	grid-row: 3;


}

body  section.container .gallery a:first-child{
	-ms-grid-column: 1;
	grid-column: 1;
	-ms-grid-row: 1;
	-ms-grid-row-span: 2;
	grid-row: 1 / 3;
	
}

body  section.container .gallery a:first-child + a{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 1;
	grid-row: 1;
}

body  section.container .gallery a:first-child + a + a{
	-ms-grid-column: 3;
	grid-column: 3;
	-ms-grid-row: 1;
	grid-row: 1;
}

body  section.container .gallery a:first-child + a + a + a{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	grid-row: 2;
}

body  section.container .gallery a:first-child + a + a + a + a{
	-ms-grid-column: 3;
	grid-column: 3;
	-ms-grid-row: 2;
	grid-row: 2;
	display: block;
	opacity: 1;
}

body  section.container .gallery a {
	-ms-flex-item-align: stretch;
	-ms-grid-row-align: stretch;
	 align-self: stretch;	
}



body  section.container  aside h3{
	font-size: 0.9375em;
	margin-top: 1.875em;
	font-weight: bold;
}
body  section.container  aside h3:after{
	content:":";
}


 body  section.container  aside p{
	margin: 0.3125em 0 1.25em 0;
}


body  section#Kontakt div.kontakt{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2 / 4;
	-ms-grid-row: 3;
	grid-row: 3;
}


body  section.container .top {
	-ms-grid-column:  5;
	grid-column:  5;
	-ms-grid-row: 4;
	grid-row: 4;
}
 }
/*******************************************************
*
   Ende
*
*******************************************************/
 
 
 
 
 
 
 
 
 
 
 




 
 
 
 
 /*******************************************************
*
   Über mich: Text in der Mitte, Bilder links und rechts
   Galerie schaltet auf 5 Bilder 
   Kontaktformular links, Adresse rechts
   
*
*******************************************************/

   @media only screen and (min-width: 93.75em) and (orientation : landscape)
 {
	 
	 
	 
	 
#Landingpage{ 
	background-attachment: fixed;
}


body  section#AboutMe  figure {
	-ms-grid-column: 2;
	grid-column: 2;	
	-ms-grid-row: 3;	
	grid-row: 3;
	display: -ms-grid;
	display: grid;
}

body  section#AboutMe  figure + figure{
	-ms-grid-column: 4;
	grid-column: 4;
	-ms-grid-row: 3;
	grid-row: 3;
}

body  section#AboutMe  figure  a{
	-ms-flex-item-align: start;
	    -ms-grid-row-align: start;
	    align-self: start;

}

body  section#AboutMe  figure+figure  a{
	-ms-flex-item-align: end;
	-ms-grid-row-align: end;
	align-self: end;

}

body  section.container article{
	-ms-grid-column: 3;
	grid-column: 3;	
	-ms-grid-row: 3;
	grid-row: 3;
	
}


body  section#Kontakt div.kontakt{
	-ms-grid-column: 3 ;
	grid-column: 3 ;
	-ms-grid-row: 3;
	grid-row: 3;	
}


body  section.container form{
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 3;
	grid-row: 3;		


	 }
	
body  section.container .top {
	-ms-grid-column:  5;
	grid-column:  5;
	-ms-grid-row: 4;
	grid-row: 4;
}


 }
/*******************************************************
*
   Ende
*
*******************************************************/
 
 
 
 
 
 
 
 
 
/*******************************************************
*
   Anfang
*
*******************************************************/




   @media only screen and (max-height: 34.375em) and (min-width: 48em) 
 
 {	


body  section.container {
  min-height: 28.125em;
}

 .headback {
min-height: 34.375em ;
background-attachment: scroll;
 }
 

 
 .headback {
	 bottom: 0;
 }
 
 
body  section.container {
	-ms-grid-rows: auto 1.875em auto auto auto;
	    grid-template-rows: auto 1.875em auto auto auto;
}	 
	 

body  section#Kontakt {
	-ms-grid-rows: auto 0em 1fr auto;
	    grid-template-rows: auto 0em 1fr auto;
}

body section.container nav#mainnav ul{
	-ms-grid-rows: 1fr 1fr 1fr;
	    grid-template-rows: 1fr 1fr 1fr;
	}
	
body  section.container #mainnav  li a span+span{ 
	-ms-flex-item-align: auto; 
	    -ms-grid-row-align: auto; 
	    align-self: auto;
} 

body  section.container #mainnav  li a span+span u{ 
	-ms-flex-item-align: center; 
	    -ms-grid-row-align: center; 
	    align-self: center;
} 
	
 
 }
 
 
    @media only screen and (max-height: 43.75em) and (min-width: 48em), screen and (orientation: portrait) 

	{	
	


#Landingpage header h1 { 
	font-size: 2em;
	margin: auto;
}

#Landingpage header h1 span { 
font-size: 1.3em;

}

#Landingpage header h2 {
	font-size: 1em;


}
 

 
	body  section.container #mainnav  li:first-child+li a{ 
	background-image:  url("../Picture/Themen/Ueber_mich/Stefan_Fritz_3.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li a{ 
	background-image:  url("../Picture/Themen/Natur/Allee_small.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li a{ 
	background-image:  url("../Picture/Themen/Reisen/Armut_small.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li+li a{ 
	background-image:  url("../Picture/Themen/Kunst/Explosion_small.jpg");
	}
	
	body  section.container #mainnav  li:first-child+li+li+li+li+li a{ 
	background-image:  url("../Picture/Kontakt/Post_klein.jpg");
	}

}	
	

 }
 
 
 
 
 
 
 
     @media only screen and (max-height: 34.375em) and (min-width: 48em) and (orientation : landscape)
 {	 
 
body section.container nav#mainnav ul{
align-self: center;
}
 
 
 
body  section#Landingpage header{
	padding: 1.5625em 1.5625em 0 0.625em ;
}
 
 body section.container nav#mainnav ul li {
	margin: 0.3125em 0.3125em 0 0 !important;	
}



	
	
	
 body  section.container #mainnav  li a{ 
	background-color: none !important;
	
}
	
body  section.container #mainnav  li a span:first-child{ 
display: none;
}

body  section.container #mainnav  li a:after{ 
	background-color: transparent;
	
}

	
	
	
body  section.container #mainnav  li a span+span{ 
background-repeat: no-repeat;
background-size: 0.9375em 0.9375em;
background-position: 0.4375em ;

}		

}
 
 
 
 

 
 
     @media only screen  and (max-width: 48em)
 {
body  section.container, #Landingpage {
height: auto !important;

}

 .headback {
height: auto ;
background-attachment: scroll;
 } 

 }
 
	 
   @media only screen and (orientation: landscape) and (min-height: 34.375em)
 {
body  section.container {
  min-height: 100vh ;
}
 }
	 
 
	 

   @media only screen  and (min-width: 125em) 
 {
#Landingpage {
	height: auto !important;
	min-height: 62.5em !important;
	border-left: 0.0625em solid #22536b;
	border-right: 0.0625em solid #22536b;
}

body section.container {
	border-left: 0.0625em solid #22536b;
	border-right: 0.0625em solid #22536b;
	min-height: auto !important;
}

.js-enabled #mainnav ul{
		background-color: rgb(235,241,255) !important;
		padding-bottom: 0.625em;
		border: solid 0.125em;
}
 } 
 
 
 .hidden {
	-ms-grid-column: 2;
	grid-column: 2;
	-ms-grid-row: 2;
	grid-row: 2;
	opacity: 0;
 }