@charset "UTF-8";

/* Font */
@font-face {
	font-family: 'Parisienne';
  src: url('../fonts/Parisienne-Regular.ttf');
}

/* enable smooth scroll */
html {
  scroll-behavior: smooth;
}

/* links */
a:link, 
a:visited {
	transition: all 1000ms ease-out;
}
a:hover,
a:focus {
	outline: 0;
	transition: all 150ms ease-in;
}
a:active {
	color:#f00;
}

/* rss and atom feed links */
a img.rssfeed,
a img.atomfeed {
        margin-bottom: -2px;
        width: 16px;
}

/* body */
body {
  font-size: 100%;
	background: #f0f0f0 url(../img/noise.png) top left repeat;
	color: #202020;
  /*font-family: 'Parisienne', sans-serif;*/
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin: 0;
  padding: 0;
}

/* positioning */
.left { float: left; }
.right { float: right; }
.center { text-align: center; }
.middle { vertical-align: middle; }

/* header */
header {
	font-family: 'Parisienne', sans-serif;
}
header small {
  color: #7d7a7a;
}

header .right-header {
  text-align: right;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* footer */
footer {
  color: #7d7a7a;
}
footer .left,
footer .right {
  margin-top: 0px;
}

/* navigation */
nav {
	display: flex;
	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav ul li {
  float: left;
  margin: 0 5px 15px 0;
}
nav li a,
nav li a:link,
nav li a:visited {
  width: 100% !important;
  text-decoration: none;
  color: #7d7a7a;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 3px 14px;
  background: #eee;
}
nav li a:hover {
  background: #fafafa;
  color: #666;
}
nav li a.active {
  background: #fff;
  color: #000;
}


/* content */

.page-content {
  width: auto;
  margin: 0 7.4em 50px;
}

#content {
  border: 1px solid #ccc;
  background: #fff;
  margin: 0;
  padding: 0 15px 45px;
}

#content h1 {
	font-family: 'Parisienne', sans-serif;
}

#content .uppercase p::first-letter {
  text-transform: capitalize;
  font-weight: bold;
	font-size: x-large;
	font-family: 'Parisienne', sans-serif;
}

#content code {
  font-family: ui-monospace,monospace;
  background: #f6f8fa;
  padding: 3px 7px;
}
#content .code {
  font-family: ui-monospace,monospace;
  background: #f6f8fa;
  padding: 16px;
}

/*
Gallerie
*/

.gallerie {
	text-align: center;
	vertical-align: middle;
}

.gallerie img {
	max-width: 200px;
	max-height: 130px;
}

/*
Media Queries
*/

@media (max-width: 990px) {
  footer .left,
  footer .right { float: none;  margin-top: 10px; }
}

@media (max-width: 640px) {
  .page-content { margin: 0; }
	nav { margin: 0 0 15px; }
	nav ul { width: 100%; text-align: center; }
	nav li a, nav li a:link, nav li a:visited { width: 100%; display: block; padding: 15px 0; font-size: larger; }
  nav ul li { float: none; margin: 0 10px; padding: 3px 0; }
	#cookieConsent { display: contents !important; }
	#closeCookieConsent { margin: 0 !important; }
}