/* CSS Document */

body {
	margin:0;
	padding:0;
	font-family: Arial, Helvetica, sans-serif;
	-webkit-animation:fadein 1s;
	color: #333;
	background-color: #fff;
}
@-webkit-keyframes fadein{
	0%{opacity:0;}
	100%{opacity:1;}
}
@font-face {
	font-family: Racer;
	src: url(../../fonts/NEURPOLI.TTF);
 }
 
main {
	max-width: 800px;
	margin:0 auto;
	padding: 1em;
}
 
header a{
	text-decoration:none;
}


section {
	background: #fafafa;
	border-radius:5px;
	padding: 1em;
	margin:0 auto 1em auto;
}
section, footer {
	position:relative;
}


h1 {
	font-family: Racer;
	font-weight:normal;
	color: #fff;
	font-size:2em;
	text-align:right;
	text-shadow: 0 0 0.2em #9cc, 0 0 1em #9cf;
	background-color: #111;
	background: linear-gradient(to bottom right, #666, #000);
	margin:0;
	padding: 0.5em 1em;
}
h2 {
	margin: 0;
	padding: 0;
	font-weight:normal;
	font-family: Racer;
	color: #333;
}
h3 {
	margin: 0;
	padding: 0;
	font-weight:normal;
	font-family: Racer;
	color: #666;
}

p {
	margin:1em 0;
}

nav {
	float:left;
	margin: 0.5em 1em;
	font-weight:bold;
	padding:0.25em;
}
nav ul {
	margin:0;
	padding:0;
}
nav li {
	display:inline;
	list-style-type: none;
	transition: opacity 0.3s;
}
nav li:hover{
}

nav img{
	width:2em;
	height:2em;
	padding:0.25em;
	background: linear-gradient(to bottom right, #fff, #aaa);
	border-radius:50%;
	box-shadow: 0 0 0.25em #333;
	transition:box-shadow 0.5s;
}

nav img:hover{
	box-shadow: 0 0 0.5em #fff;
}





ul.sitemap  {
	position:relative;
	margin:0 0 2em 0;
	padding:0;
	width:100%;
	max-width:35em;
}
.sitemap li {
	list-style-type: none;
	margin: 0.2em 0;
	padding:0;
}
.sitemap li li{
	margin:0.2em 0 0 4em;
}
.sitemap h3, #sitemap p {
	margin:0;
	padding:0;
}
.sitemap img {
	float:left;
	margin: 0 1em 0 0;
	height:3em;
	width:auto;
	border-radius: 4px;
}
.sitemap a {
	display: block;
	text-decoration:none;
	padding:0.5em;
	border-radius:0.5em;
	min-height:3em;
	background: linear-gradient(120deg, rgba(245,245,245, 0.5), rgba(195,195,205, 0.5));
	opacity:0.9;
	transition: opacity 0.8s, box-shadow 0.5s;
	box-shadow: inset 0 0 1px #999;
}
.sitemap a:hover {
	opacity:1;
	box-shadow: inset 0 0 1px #000, 0 0 0.5em #ccc;
	background: linear-gradient(120deg, rgba(245,245,245, 0.7), rgba(195,195,205, 0.7));
}

aside {
	position:relative;
	left:-2em;
	width:4.2em;
	color:#fff;
	background-color:#ccc;
	padding: 1.2em 1em;
	margin:0 0 1em 0;
	border-radius:0 50% 50% 50%;
	text-align:center;
}
aside p, aside h4 {
	margin:0;
	padding:0;
}
aside h4 {	
	font-family: Farlo;
	font-weight:normal;
	font-size:1.6em;
}
figure {
	margin: 0;
	padding: 0;
}
figcaption {
	font-weight:bold;
	font-size:0.8em;
	color: #fff;
	background-color: #333;
	margin:0 0 2em 0;
	padding: 0.5em 1em;
}
.caption {
	position:absolute;
	bottom:0;
	font-weight:bold;
	color: #fff;
	margin: 0;
	padding: 0.5em;
	display:block;
	width:100%;
	background:rgba(0, 0, 0, 0.5);
}
.basic li {
	margin: 0.5em 2em;
	padding:0;
}
.w100 {
	width:100%;
	height:auto;
}
.left {
	float: left;
	margin: 0 1em 1em 0;
}
img {
	max-width:100%;
	height:auto;
}

/* SLIDES */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  opacity:1;
  border: 0;
  }
* {
  margin: 0;
  padding: 0;
}


/* Callback example */

.events {
  list-style: none;
  }
  
.callbacks_nav {
  position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 50%;
  left: 0;
  z-index: 100;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 3em;
  width: 3em;
  margin: -1.5em 0 0 0;
  border-radius:50%;
	background: linear-gradient(to bottom right, #666, #000);
	border: solid 1px #ccc;
  }

.callbacks_nav:hover {
  background: #000;
}
.callbacks_nav.prev {
  left: -1em;
  }
.callbacks_nav.next {
	left:auto;
	right:-1em;
  }
.callbacks_nav.prev:before {
	content:" ";
	width:0;
	height:0;
	position:absolute;
	top:0.75em;
	left:1em;
	border-right: 0.75em solid #fff; 
	border-top: 0.75em solid transparent; 
	border-bottom: 0.75em solid transparent; 
  }
  
.callbacks_nav.next:before {
	content:" ";
	width:0;
	height:0;
	position:absolute;
	top:0.75em;
	right:1em;
	border-left: 0.75em solid #fff; 
	border-top: 0.75em solid transparent; 
	border-bottom: 0.75em solid transparent; 
  }



@media (min-width: 500px) {
.logo {
	display:inline;
}
      }

@media (min-width: 800px) {
main {
	width: 70%;
}
      }
@media (min-width: 1000px) {
nav {
	
}
      }