@charset "UTF-8";

*:focus
{
	outline: none !important;
}

html,
body
{
	height: 100%;
}

body
{
	background-attachment:fixed;
	background-image: url("../img/background.jpg");
	background-position: center;
	background-size: cover; 
	font-weight: bold;
}

body, h1, h2, h3
{
	font-family: "Lato", sans-serif;
}

video
{
	left: 0;
	position: fixed;
	min-height: 100%;
	min-width: 100%;
	top: 0;
	z-index: -100;
}

a
{
	color: #607d8b;
}

header
{
	height: 100%;
}

header h1
{
	width: 100%;
}

h1, h2, h3
{
	font-weight: bold;
}

article,
footer
{
	background-color: rgba(241, 241, 241, 0.9);
}

article header
{
	height: auto;
}

#blur
{
	 filter: blur(10px);
	-webkit-filter: blur(10px);
	-moz-filter: blur(10px);
	-o-filter: blur(10px);
	-ms-filter: blur(10px);
	
	height: 550px;
	margin-top: 10px;
	width: 100%;	
}

.separator
{
	height: 60%;
}

footer img
{
	margin: 0 40px;
}

#interreg
{
	height: 100px;
}

#data
{
	height: 65px;
}

#usmb
{
	height: 70px;
}

#listic
{
	height: 70px;
}

#ensa
{
	height: 120px;
}

#sngm
{
	height: 70px;
}

.w3-modal
{
	padding: 0;
}

.w3-modal-content
{
	height: 100%;
	padding: 2%;
	width: 100%;
}

.w3-modal-content img
{
	height: 100%;
}















#after_eight
{
	display: inline-block;
	margin-bottom: 64px;
	text-decoration: none;
}

#after_eight img
{
	margin-top: -36px;
}

.Text
{
	margin: auto;
	max-width: 70%;
}

.Text:nth-child(n+2)
{
	margin: 64px auto 0 auto;
}

.Text ul:first-child
{
	margin-top: 0;
}

.Text li
{
	padding-left: 16px;
}

strong
{
	color: #fae20a;
	padding: 0 4px;
	text-shadow: 0px 0px 4px black;
	text-transform: uppercase;
}

.OK
{
	color: #4CAF50;
}

.POK
{
	color: #ff9800;
}

.NOK
{
	color: #f44336;
	text-decoration: line-through;
}

.Video
{
	height: 0;
	margin: 32px auto 0 auto;
	max-width: 70%;
	overflow: hidden;
	padding-bottom: 56.25%;
	position: relative;
}

.Video:nth-child(2)
{
	margin: 64px auto 0 auto;
}

iframe.Youtube
{
	border: none;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

figure
{
	margin: 64px auto 0 auto;
	max-width: 70%;
	position: relative;
	text-align: center;
}

figure:nth-child(1)
{
	margin: 32px auto 0 auto;
}

figure img
{
	width: 100%
}

figcaption
{
	font-style: italic;
	padding-top: 0.5em;
}

.Layers
{
	height: 100%;
	position: absolute;
	top: 0;
	width: 100%;
}

.Layer
{
	border: 2px solid #f44336;
	border-radius: 20%;
	position: absolute;
}

.Layer:hover
{
	border-width: 4px;
}

.Red
{
	color: #f44336;
}

.Underline
{
	text-decoration: underline;
}




.Absolute
{
	position: absolute;
	z-index: 1;
}

.Absolute:hover
{
	z-index: 2;
}

.Map
{
	left: 0;
	top: 0;
	width: 100%;
}

.Cristal
{
	left: 62%;
	top: 10%;
	width: 10%;
}

.Cristal:hover
{
	border: 4px solid #f44336;
	width: 30%;
}

.Vigilance
{
	right: 5%;
	top: 10%;
	width: 20%;
}

.Vigilance:hover
{
	width: 60%;
}

.BERA_Indice
{
	right: 5%;
	top: 38%;
	width: 30%;
}

.BERA_Indice_2
{
	top: 34%;
}

.BERA_Indice_1
{
	top: 35%;
}

.BERA_Indice:hover
{
	border: 4px solid #f44336;
	width: 50%;
}

.BERA_Texte
{
	right: 5%;
	top: 53%;
	width: 35%;
}

.BERA_Texte_2
{
	top: 64%;
}

.BERA_Texte_1
{
	top: 66%;
}

.BERA_Texte:hover
{
	border: 4px solid #f44336;
	width: 60%;
}

.PFH
{
	right: 5%;
	bottom: 3%;
	width: 30%;
}

.PFH:hover
{
	border: 4px solid #f44336;
	width: 50%;
}

.Photo_1
{
	right: 5%;
	top: 10%;
	width: 20%;
}

.Photo_1:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 78%;
}

.Photo_2
{
	right: 5%;
	top: 37%;
	width: 20%;
}

.Photo_2:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 69%;
}

.Photo_3
{
	right: 5%;
	top: 68%;
	width: 20%;
}

.Photo_3:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 69%;
}

.Photo_4
{
	border: 2px solid black;
	right: 5%;
	top: 10%;
	width: 8%;
}

.Photo_4:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 30%;
}

.Photo_5
{
	right: 5%;
	top: 38%;
	width: 21%;
}

.Photo_5:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 74%;
}

.Photo_6
{
	right: 5%;
	top: 68%;
	width: 21%;
}

.Photo_6:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 74%;
}

.Photo_7
{
	border: 2px solid black;
	right: 5%;
	top: 10%;
	width: 8%;
}

.Photo_7:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 29%;
}

.Photo_8
{
	right: 5%;
	top: 39%;
	width: 22%;
}

.Photo_8:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 86%;
}

.Photo_9
{
	right: 5%;
	top: 68%;
	width: 22%;
}

.Photo_9:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 88%;
}

.BERA
{
	right: 5%;
	top: 10%;
	width: 30%;
}

.BERA:hover
{
	border: 4px solid #f44336;
	width: 61%;
}

.Photo_10
{
	right: 4%;
	top: 2%;
	width: 20%;
}

.Photo_10:hover
{
	border: 4px solid #f44336;
	width: 92%;
}

.Photo_11
{
	right: 4%;
	top: 25%;
	width: 20%;
}

.Photo_11:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 91%;
}

.Photo_12
{
	right: 4%;
	top: 48%;
	width: 20%;
}

.Photo_12:hover
{
	border: 4px solid #f44336;
	top: 2%;
	width: 91%;
}

.Photo_13
{
	border: 2px solid black;
	right: 4%;
	bottom: 3%;
	width: 15%;
}

.Photo_13:hover
{
	border: 4px solid #f44336;
	width: 40%;
}

.Data_Avalanche
{
	right: 50%;
	bottom: 5%;
	width: 20%;
}

.Data_Avalanche:hover
{
	border: 4px solid #f44336;
	width: 45%;
}