/* FONTS */
@font-face { font-family: 'font';   	src: url("Ozium-Regular.ttf") format('truetype');;}
@font-face { font-family: 'font'; 		src: url("Ozium-Regular.eot") }	
@font-face { font-family: 'font'; 		src: url("Ozium-Regular.woff") }
@font-face { font-family: 'font'; 		src: url("Ozium-Regular.otf") }

/* The animation code */
@keyframes example {
    from {background-color: white;}
    to {background-color: crimson;}
}



a { text-decoration:none; color:inherit; margin:0;padding:0}
nav ul{ list-style:none; margin:0 auto}
.dummy{display:block;}
ul{
	-webkit-margin-before:0;
	-webkit-margin-after:0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    -webkit-padding-start: 0;

}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;

}
body{position:relative}
section{
	position:relative;
	z-index:200;
	width:100%;
}
main{ 
    position:relative;
    width:100%;background-color:white;
}


@media screen and (max-width: 400px) {
	.slide_title{		font-size:38px;	}
	.slide_sub{font-size:28px;}
    .navLink_wrap {        width:98%;    }
	.navLink{font-size:1.3em;height:1.8em; line-height:1.8em;}
	.navLink_wrap{		display:none;	}
	.menu_hid_wrap{		color:white;		cursor:pointer;		height:1.8em; font-size:1.3em;	}
	.contact_elem{		width:100%;	}
	.contact_el_text{		font-size:1.5em;	}
	#zia_cv_bio{		width:95%;	}
	.cv_testo_2{font-size:1.6em;}
}
@media screen and (min-width: 401px) {
	.slide_title{font-size:44px;}
	.slide_sub{font-size:30px;}
    .navLink_wrap{width:100%;}
	.navLink{font-size:1.5em;height:1.8em; line-height:1.8em;}
	.navLink_wrap{		display:none;	}
	.menu_hid_wrap{		color:white;		cursor:pointer;		height:1.8em; font-size:1.3em;	}
	.contact_elem{		width:100%;	}
	.contact_el_text{		font-size:1.5em;	}
	#zia_cv_bio{		width:80%;	}
	.cv_testo_2{font-size:1.8em;}
}
@media screen and (min-width: 800px) {
	.slide_title{font-size:48px;}
	.slide_sub{font-size:32px;}
    .navLink_wrap {width:15%;display:inline-block;}
	.menu_hid_wrap{		display:none; width:0; margin:0; padding:0;	}
	.menu_hid{		display:none; width:0; margin:0; padding:0;	}
	.socialbutton{		width:100%;	}
	.navLink{font-size:1.2rem;height:2.5rem;overflow:hidden;}
	.contact_elem{		width:49%;	}
	.contact_el_text{		font-size:1.3em;	}
	.ref_elem_list{		width:26%;		display:inline-block;		height:100%;		margin-left:5%;margin-left:5%;	}
	#zia_cv_bio{		width:80%;	}
	.cv_testo_2{font-size:2em;	}
}

body{    position:relative;}
    body::after {
      content: "";
      background-color:white;
      opacity: 0.92;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      position: absolute;
      z-index: -1;   
    }
main{
    position:relative;
    z-index:5;    
}
/* BLOCCHI GENERICI */
.nome{	color:crimson}

/* caratteristiche di base per titoli e sottotitoli */
.titolo{font-family: font;	font-weight:bold;	text-align:center;}

/* formato del testo base */
.txt_justified{font-family: 'Raleway', sans-serif; text-align:justify;text-shadow:1px 1px 1px lightgrey;}

/* formato dei link */
.link2contacts{text-decoration:underline;font-weight:bold;}
.nomeBlocco{font-family: 'Raleway', sans-serif;}
.profile_pic{background-position:center center;background-repeat:no-repeat;background-size:cover}

/* BLOCCHI SPECIFICI */
header { 
	background-color:#283747;
	position: fixed;
	width: 100%;
    opacity:0.95;
	/*font-family:font;*/
	font-family: 'Merriweather', serif;
	z-index:1000;
}
	#navBar {
		position:relative;
		width:100%; 
		text-align:center;
	}
	#navBar ul{
	}
			#navBar  ul  li {
				margin:0;padding:0;
				/*display: inline-block;*/
				vertical-align:middle;
				text-align:center;
			}
			.navLink{
				color: white;text-align:center;
				display:block;
				vertical-align:middle;
				padding:2px;
			}

#map_wrapper{
	/* da sistemare le dimensioni di questo elemento in maniera che non usi i vw e vh*/
	position:relative; 
    width:98%; margin:0 auto;
    z-index:2;
}
#map {
    width: 100%;
    padding-top:-5%;
}
#scroll{
    text-align:center; font-family:font; 
    padding:2%; 
}
    #scroll p{
        text-shadow:1px 1px 2px grey;   
    }
    #arrow_bottom{
        position:relative;
        width:10%;min-width:40px;max-width:100px;margin-left:auto;margin-right:auto; padding:2%;
    }    
.slide_title{
    font-family:font;
	width:90%; margin:0 auto;
	text-align:center;
	text-shadow:1px 1px 3px lightgrey;
	margin-bottom:10px;
	border-bottom:2px solid lightgrey;
}

#coordinate{
	z-index:50; width:100%;
	padding-top:5%;padding-bottom:5%;
}

#coordinate ul li p{
	font-family: 'Raleway', sans-serif; text-shadow:1px 1px 2px lightgrey;
}
.contact_elem{
	text-align:center;
	list-style:none;
	display:inline-block;
	vertical-align:top;
}
.contact_title{
	text-shadow:1px 1px 2px lightgrey;font-family:font;
}
.contact_el_text{
	padding-top:20px;padding-bottom:20px;
}
 #persone{
	z-index:50;
	width:100%;
	position:relative;
    padding-top:50px; padding-bottom:10px;
 }
	#ref_list{
		width:100%;height:100%; position:inherit;
	}
		.ref_elem_list{             
            border-radius:5px; vertical-align:top;
			margin-bottom:10px;margin-top:10px;

		}
			.foto_wrapper{
				margin-left:auto;margin-right:auto;
			}
			.reference{
				width:80%; margin-left:auto; margin-right:auto;
				z-index:100;
				margin-top:15px;margin-bottom:15px;
				/*box-shadow:1px 1px 4px black;*/
				border-radius:50%;
				border:10px solid black;
			}
            #zia{			
				background-image:url('../assets/viso.png');
				background-size:70%;
            }
			.cv_block{
				margin-left:auto;margin-right:auto;	
			}
				.cv_title{
					font-size:2.1em;
				}
                .cv_subtitle{
					font-size:1.8em;
                }
				.cv_testo{
					width:90%; margin:0 auto;
					font-size:1.3em;
					padding:0;
					font-family: 'Raleway', sans-serif;padding:5px; text-align:justify;
					min-height:100px; 
				}
				.cv_testo_2{
					margin:0 auto;	padding:0;
					font-family: 'Raleway', sans-serif; text-align:justify;
					padding-top:20px;padding-bottom:50px;
				}
				#zia_cv_bio_mostra_wrap{					
					margin-bottom:50px;margin-top:20px; margin-left:auto;margin-right:auto;padding:10px;text-align:center;
				}
				#zia_cv_bio_mostra{
                    width:100%;font-family: 'Raleway', sans-serif;font-weight:bold;
					padding:10px;cursor:pointer;
					border:1px solid lightgrey;
                      			transition-property: all;
                      			transition-duration: 0.2s;
                      			transition-timing-function: linear;
				}
				#zia_cv_bio_hid{
					font-size:1.3em;
					width:30%;
					padding:20px;cursor:pointer; margin-left:auto;margin-right:auto; margin-top:50px;
					border:1px solid lightgrey;
					display:block;
				}
				#zia_cv_bio {
					transform: scale(0.8);
				}
                #zia_cv_bio{
                    text-align:justify;font-family:font; 
					margin-left:auto;margin-right:auto;
                }
            #leon{
				background-image:url('../assets/leon.jpg');
            }
			#tobia{
				background-image:url('../assets/tobia.jpg');
            }

/* PARALLAX */

.back_parallax{
    /*height:60vh;*/ width:100%; position:relative; z-index:50;
}


#back1{
    position:relative;
	width:100%; /*height:100vh;*/
    background-image:url('../assets/palestra2.jpg');
    background-size:cover;
    background-position:center center;
}
#back2{
	position:relative;
    background-image:url('../assets/buddha2.jpg');
    background-size:cover;
    background-position:center center
}
#back3{
	position:relative;
    background-image:url('../assets/ombrello4.jpg');
    background-size:cover;
    background-position:center center
}
	.note{
        position:absolute;top:50%;
        z-index:10;
		width:80%;min-width:280px; margin-left:auto;margin-right:auto; padding:8px;display:block;
		color:black; font-family: 'Raleway', sans-serif;  text-align:center;
	}
    .note::after {
      content: "";
      background-color:white;
      opacity: 0.9;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      position: absolute;
      z-index: -1;   
    }
#contacts {
	position:relative;
	/*background-color:whitesmoke;*/ 
	font-family: 'Merriweather', serif;
    margin-top:20px;margin-bottom:20px;
}
	#contact_descr{
		width:50%; min-width:260px;margin-left:auto;margin-right:auto;margin-top:20px;padding-bottom:20px;
		text-align:center;
        font-family: 'Raleway', sans-serif; font-size:1.3em;
	}
	#contact-form {
		width:100%;min-width:200px; max-width:600px;
		margin-left:auto;margin-right:auto;
		z-index:500;
	}
		.contact_label {
			width:90%; margin-left:auto;margin-right:auto;
			text-align:center;
			margin:0; padding:0; padding:5px 0px 5px 0px;
			font-size:1.1em;
		}
		#contact-form input[type="text"],
		#contact-form input[type="email"],
		#contact-form input[type="tel"],
		#contact-form input[type="url"],
		#contact-form input[type="number"],
		#contact-form textarea {
			font-family: 'Raleway', sans-serif; font-size:1.1em;
			width:90%; min-height:40px;
			margin-left:4%; margin-right:4%;padding:0;
			background:#FFF;
			border-radius:5px;
		}
		#contact-submit {
			padding:0;
			font-family: inherit;
			cursor:pointer;
			width:100%;min-height:40px;
			margin-bottom:50px;margin-top:50px; 
			border:none; border-radius:5px;
			background:crimson;
			color:#FFF;
		}

footer{
	position:relative;
	width:100%; 
    background-color:white;
    bottom:0;
    z-index:10;
    border-top:1px solid lightgrey;
}
	footer div{
		font-family: 'Raleway', sans-serif; font-size:0.9em; text-align:justify;line-height:1.2em;
		width:60%; min-width:280px;
        margin-left:auto; margin-right:auto;
		padding-top:2em; padding-bottom:2em;}