@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Asap|Ubuntu:400|Ubuntu:700&display=swap');

body {
	margin: 0;
	background-repeat: no-repeat;
	width: 100vw;
	height: 100vh;
	-webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	background-attachment: fixed;
	background-image: linear-gradient(339deg, rgba(30,26,92,1) 0%, rgba(57,91,194,1) 35%, rgba(131,200,254,1) 100%);
	overflow-x: hidden;
}/*Non toccare body*/
.bottomtable{
	text-align: center;
	z-index: 90;
	/* position: fixed; */
	bottom: 0.5vw;
	width: 100vw;
}
.labimg{
	margin: 1vw 0;
	width: 80%;
}
.commenti{
	width: 80%;
	border-radius: 4px;
}
.divcommenti {
	z-index: 2;
	width: 100vw;
	/* background: linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(34,34,156,0) 50%, rgba(0,0,0,0.1) 100%); */
	border-radius: 2px;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}
#mobileiframe{
	z-index: 1000;
	width: 100vw;
	height: 100vh;
	display: block;
	float: right;
	text-align: right;
	/* margin: 0 auto; */
}

#logo {
	z-index: 101;
	/* position: fixed; */
	/* display: table-cell; */
	width: 10vh;
	margin: 0 auto;
	/* top: 0.65vh; */
	/* left: 50vw; */
	/* transform: translateX(-53%); */
	/* text-align: center; */
	position: relative;
	top: .6vh;
}

#menu {
	z-index: 101;
	/* position: fixed; */
	/* display: table-cell; */
	width: 5vh;
	/* top: 3vh; */
	/* left: 10vw; */
	/* display: block; */
	/* margin: 0 auto; */
	/* transform: translateX(-53%); */
	/* text-align: center; */
	position: relative;
	left: 8vw;
	top: 0.6vh;
}
#menu_button{
	transition: all .2s ease-in-out;
}
#dropdown{
	z-index: 800;
	-webkit-transition: all 1s cubic-bezier(0.270, 0.560, 0.490, 1.000);
	-moz-transition: all 1s cubic-bezier(0.270, 0.560, 0.490, 1.000);
	-o-transition: all 1s cubic-bezier(0.270, 0.560, 0.490, 1.000);
	transition: all 1s cubic-bezier(0.270, 0.560, 0.490, 1.000);
	/* position: relative; */
	left: -100vh;
	position: fixed;
	opacity: 0;
	/* transition: all .5s ease-in-out; */
	background-color: rgba(57,90,150,0.7);
	backdrop-filter: blur(20px);
	height: 100vh;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
	/* pointer-events: none; */
}

#tabmenu{
	/* border-collapse: separate; */
	border: 0;
	/* position: fixed; */
}

#navbar {
	position: sticky;
	z-index: 10;
	width: 100vw;
	height: 15vh;
	top: 0;
	margin-top: 0;
	margin-top: 0;
	background-color: rgba(57,90,150,0.7);
	backdrop-filter: blur(20px);
	-webkit-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	-moz-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
}

table a {
	text-decoration: none;
}

.buttons {
	display: table-cell;
	width: 100vw;
	height: 2.2em;
	border-radius: 15px;
	color: #0E0E0E;
	font-family: 'Asap', sans-serif;
	font-weight: bold;
	font-size: 5vw;
	vertical-align: middle;
	text-align: left;
	background-color: #FDFDFD;
	transition: all .1s ease-in-out;
	cursor: pointer;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
	padding-left: 0.4em;
}

.buttons:active {
	border-radius: 13px;
	color: #E0E0E0;
	background-color: #4468D7;
	box-shadow: inset 1px 1px 1px rgba(150, 150, 150, .4), inset -1px -1px 1px rgba(0, 0, 0, .4);
}

.selected {
	display: table-cell;
	width: 100vw;
	height: 2.2em;
	border-radius: 15px;
	color: #E0E0E0;
	font-family: 'Asap', sans-serif;
	font-weight: bold;
	font-size: 5vw;
	vertical-align: middle;
	text-align: left;
	background-color: #4468D7;
	transition: all .1s ease-in-out;
	cursor: pointer;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
	padding-left: 0.4em;
}

.selected:active {
	border-radius: 13px;
	color: #E0E0E0;
	background-color: #4468D7;
	box-shadow: inset 1px 1px 1px rgba(150, 150, 150, .4), inset -1px -1px 1px rgba(0, 0, 0, .4);
}

table {
	table-layout: fixed;
	/*! margin: 0 auto; */
	height: 6.20em;
	padding: 0;
}

.box {
	z-index: 1;
	padding-top: 1.5vh;
	padding-bottom: 2vh;
	display: inline-flex;
	position: relative;
	height: auto;
	width: 100vw;
	left: auto;
}

.paragraph {
	z-index: 1;
	background-color: rgba(245,245,245, 0.6);
	display: inline-flex;
	position: relative;
	border-radius: 4px;
	height: auto;
	width: 100%;
	-webkit-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	-moz-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	
}
.mobileparagraph {
	z-index: 1;
	background-color: rgba(245,245,245, 0.6);
	display: inline-flex;
	position: relative;
	border-radius: 4px;
	height: auto;
	width: 100%;
	-webkit-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	-moz-box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	box-shadow: 2px 11px 22px -8px rgba(0,0,0,0.36);
	transition: all 0.3s cubic-bezier(.25,.8,.25,1);
	
}

.paragraph:hover {
	cursor: default;
	box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.illu {
	z-index: 2;
	width: 100vw;
	background: linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(34,34,156,0) 50%, rgba(0,0,0,0.1) 100%);
	border-radius: 2px;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}

.illu img{
	cursor: default;
	z-index: 2;
	max-height: 63.55vh;
	max-width: 100%;
	border-radius: 2px;
	display: block;
	margin: 0, auto;
}

.media {
	pointer-events: none;
	z-index: 4;
	position: absolute;
	display: table-cell;
	top: 50%;
	transform: translateY(-50%);
	margin-left: auto;
	margin-right: auto;
}

.controls img{
	cursor: pointer;
	pointer-events: all;
	padding: 10px;
	width: 1.5vw;
	opacity: 0.5;
}

.controls img:hover{
	width: 1.5vw;
	opacity: 1;
}

.full {
	pointer-events: none;
	z-index: 4;
	position: absolute;
	display: table-cell;
	top: 0%;
	margin-left: auto;
	margin-right: auto;
}

.full img {
	cursor: pointer;
	pointer-events: all;
	position: relative;
	padding: 10px;
	width: 1.6vw;
	opacity: 0.5;
}

.full img:hover {
	width: 1.6vw;
	opacity: 1;
}

h2 {
	text-align: left;
	color: #E6E6E6;
	margin-bottom: 0px;
	margin-left: 4.5vw;
	font-family: 'Ubuntu', sans-serif;
	font-weight: bolder;
	font-size: 4vh;
}

p {
	font-family: 'Ubuntu', sans-serif;
	font-size: 3vh;
	margin: 5% 5%;
}
