@charset "utf-8";

	
@font-face {
  font-family: 'Playball';
  font-style: normal;
  font-weight: 400;
  src: url(font-playball/TK3gWksYAxQ7jbsKcg8Knep_Kg.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

	
@font-face {
  font-family: 'Playball';
  font-style: normal;
  font-weight: 400;
  src: url(font-playball/TK3gWksYAxQ7jbsKcg8Eneo.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, 
				U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }


 html {
	background: url(back/star-4.jpg)  ;
	background-size: cover ;
	color: black ; }

 body {
	background: url(back/hint-2.jpg) ;
    background-size: cover; 
	margin: 1em auto;
	max-width: 72em;
	font-family: sans-serif;
    border-radius: 2em ; 
	color: black ;	}


	 article  {
	font-size: 1.06em ; }	
	

	article h2 {
		color: #5d0505 ;
		font-family: Playball ;
		font-size: 1.8rem ;  }

	
	article em {
		font-size: 0.95em;  }	
		
	article small {
		font-size: 0.9em;  }	
		

  aside h3 {
	font-family: Playball;
	font-size: 1.64rem;	
	color: #6f3605 ; }

  aside {
	font-size: 1.1rem ; }	

	
  aside strong {
	font-size: 1.1rem ; 
	color:#6f3605 ;  
	font-family: serif ; }	
	
	
	aside h5 {
	font-size: 1rem;	
	color: black ;
	font-family: serif ; }



   a {
	color: #005500 ;	}

  a:hover {
	color: #339966 ; }

  a:focus {
	color: darkgreen ; }

	
	
	header h4 a, footer h4 a {
		font-size: 0.96rem ; }
	
	
	header {
	border-color: transparent; }



article img {
	width: 33%;
	float: right;
	margin-left: 0.2em;
}

	.galerie {
	text-align: center ; }


figure {
  display: inline-block;
  width: 30%;
  margin: 0.2em;
}

figure img {
  width: 100%;
}

figure figcaption {
  font-style: italic;
}


section {
  border-color: transparent;
}

article {
  border-color: transparent;
}

aside {
  border-color: transparent;
}

footer {
  border-color:transparent ;
  font-family: serif ;
}


 #styleswitcher  ul {
  list-style-type: none;
  margin-left: 0;
  padding-left: 0;
}


	nav a  {
	background: #5d0505 ;
	border: 1px solid; 
	border-color: #5d5050 ;
	border-left-color: saddlebrown ;
	color:  #f0d9a2 ;	}
 
	nav a:hover {
	color: #ccc ;
	background: brown ; }
	
	nav a:focus {
	color: #f0d9a2 ; }	
	

	nav a[aria-current=page] {
	color:orange;
	font-weight:bold;
	}

	nav a[aria-current=page]:hover {
	color: orange; }



	nav li:first-child  a{ border-radius: 1em 0 0 1em; }
	nav li:last-child  a{ border-radius: 0 1em 1em 0; }



body {
  display: flex;
  flex-flow: row wrap;
}


header, nav, article, section, aside, footer {
  border-radius: 0px 0.5em 0.5em;
  border: 1px none;
  padding: 0.5em;
  margin: 0.5em;
  flex: 1 100%;
}

header {
  display: flex;
  flex-flow: row wrap;
}
header * {
  flex: 1 1 0%;
}
header img {
  flex: 0 0 150px;
  margin-right: 20px;
}
header nav {
  flex: 1 1 100%;
}
nav, nav ul, nav li{
  margin: 0;
  padding: 0;
  border: none;
}
nav ul {
  display: flex;
  flex-direction: column;
  
}
nav li {
  list-style-type: none;
  margin: 1.3em 0;
  padding:0;
  flex: 1 1 100%;
}

nav a {
  display: inline-block;
  margin: 0;
  width: 96%;
  padding: 0.5em 2%;
  text-decoration: none;
  text-align: center;
}



footer {
  display: flex;
  flex-flow: row wrap;
}
footer * {
  flex: 1 1 0%;
  justify-content: space-between;
}
footer p:last-child {
  text-align: right;
}

@media all and (min-width: 35em) {
  header img {
    margin-right: 50px;
  }
  nav ul {
    flex-direction: row;
  }
  nav li {
    flex: 1 1 0%;
  }
  article {
    order: 2;
  }

  #news {
    flex: 1 auto;
    order: 3;
  }

  aside {
    
    flex: 1 auto;
    order: 4;
  }
  
  footer {
    order: 5;
  }
}

    
@media all and (min-width: 50em) {
  article {
    
    order: 3;
    flex: 5 1 0%;
  }
  
  aside {
    flex: 2 1 0%;
  }
  
  #news {
    flex: 2 1 0%;
    order: 2;
    align-self: center;
    height: 12em;
  }
}


caption {
	caption-side: bottom;
	padding-top: 2em;
	font-style: italic;
}