@import url("https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i");

.spip-admin-bloc, .spip-admin-float {z-index: 100000!important; right: 0!important;}


* {margin: 0; padding: 0;}
body {min-height: 100vh; display: flex; flex-direction: column; font-family: 'Roboto', sans-serif!important; font-weight: 400;}
html {scroll-behavior: smooth;}
.clear {clear: both;}
input, select {max-width: 100%;}
img {max-width: 100%; outline: 0;}
#toTop {z-index: 1000; right: 10px; bottom: 10px; display: none; position: fixed; cursor: pointer; background: #f85a40; color: white;}
footer {margin-top: auto; background: #151417;}
footer .silver-color:hover {color: white;}
.silver-color {color: silver;}
.primary-color {color: #f15d5b;}
.second-color {color: #004259;}
.primary-bg, .primary-bg:hover {background: #f15d5b; color: white;}
.second-bg, .second-bg:hover {background: #004259; color: white;}

/* Header */
header .row {height: 70px; display: flex; align-items: anchor-center;}
.header-col1 {width: 25%; text-align: left; float: left; }
.header-col2 {width: 60%; text-align: center; float: left;}
.header-col3 {width: 15%; text-align: right; float: left;}

header button:focus {border: 0; color: rgba(255,255,255,0);}
header a:hover {background: rgba(0,0,0,0.4);}
header .img-logo a:hover {background: none!important;}
.navbar-dark a.nav-link {color: white!important;}
.menu-default {background: rgba(0,0,0,0.4);}
.menu-fixed {background: #151417;}
header .dropdown:hover .dropdown-menu {display: block; margin-top: 0; background: rgba(0,0,0,0.8)!important; color: white;}
header .dropdown button {color: white;}
header .dropdown-item:focus, header .dropdown-item:hover, header .dropdown-item {color: white; background: none;}
header .dropdown button {background: none;}
header .dropdown-toggle::after {vertical-align: 0.155em;}
header button:focus {outline: 0; outline: 0px auto -webkit-focus-ring-color; color: white!important;}

#block1, #block2, #block3, #block4 {scroll-margin-top: 100px;}
.block {padding: 50px 0; text-align: center;}
.block h3 {font-size: 42px; line-height: 52px; font-weight: 600;}
.block h4 {font-size: 24px; line-height: 34px; font-weight: 400; margin-bottom: 40px;}
.block1 {background-image: url(../images/bg.jpg); padding-top: 300px; top:0; width: 100%; height:100vh; left:0; right:0; z-index:-1; background-position-x: center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-repeat: no-repeat;}
.block1 h2 {color: #f15d5b; font-size: 55px; line-height: 65px; text-transform: uppercase; font-weight: 400;}
.block1 h2 span {color: white;}
.block1 h1 {font-size: 30px; line-height: 40px; color: white; margin: 30px auto 15px auto; font-weight: 500;}
.block1 p {text-align: center; font-size: 20px; line-height: 30px; color: rgb(255 255 255 / 80%);}

.block2 {}
.block2 p {text-align: left; font-size: 20px; line-height: 30px;}

.block3 {padding: 20px 0;}
.block3-one1 {position: relative; max-width: 100%; overflow: hidden;}
img.rot {animation: 14s linear 0s normal none infinite running rot; -webkit-animation: 14s linear 0s normal none infinite running rot; width: 100%; max-width: 400px; z-index: 1; opacity: 0.4;}
@keyframes rot {0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}}@-webkit-keyframes rot {0% {transform: rotate(0deg);} 100% {transform: rotate(360deg);}}
img.logo-center {z-index: 10; position: absolute; left: 50%; top: 50%; margin-left: -160px; margin-top: -55px; width: 320px;}
img.logo-museum {margin-top: -37px;}

.block3-one2 {}
.block3-one2 h5 {font-size: 15px; line-height: 22px; text-transform: uppercase; font-weight: 600; margin-bottom: 20px;}
.block3-one2 h4 {color: #343434; font-size: 32px; line-height: 42px; text-transform: uppercase; font-weight: 600; margin-bottom: 20px;}
.block3-one2 p {color: #686868; margin-bottom: 25px;}
.block3-one2 div p {font-size: 14px; line-height: 22px; margin-bottom: 5px;}
.block3-one2 div p strong {font-size: 20px; line-height: 20px; margin-bottom: 0;}
.block3-one2 svg {margin-bottom: 30px;} 

img.logo1 {position: absolute; top: 0; left: 0; width: 200px; border: 8px solid white;}
img.logo2 {position: absolute; bottom: 0; left: 0; width: 200px; border: 8px solid white;}
img.logo3 {position: absolute; top: 0; right: 0; width: 200px; border: 8px solid white;}
img.logo4 {position: absolute; top: 0; right: 0; width: 200px; border: 8px solid white;}
img.logo5 {position: absolute; top: 0; left: 0; width: 200px; border: 8px solid white;}
img.logo6 {position: absolute; bottom: 0; right: 0; width: 200px; border: 8px solid white;}


img.logo4, img.logo5, img.logo6 {animation: moveUpDown 7s ease-in-out infinite;}
@keyframes moveUpDown {0% {top: 20%;} 50% {top: 0%;} 100% {top: 20%;}}
                                                                       
.block4 {background: rgba(193, 207, 213, .5); /*border-top: 1px solid rgba(0, 0, 0, .1); border-bottom: 1px solid rgba(0, 0, 0, .1); */}
.block4 p {text-align: left; font-size: 20px; line-height: 30px;}

.block5 {}
.block5 .ajax {width: 100%;}
.block5-left {background: linear-gradient(318deg, #222222 0%, #222222 100%); padding: 25px 20px; border-radius: 8px 8px 50px 8px; -webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03); box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05), 0 5px 15px rgba(0, 0, 0, 0.03); color: white;}
.block5 button[type=submit] {font-size: 20px; line-height: 30px; text-transform: uppercase; background: #f15d5b; border: 0; padding: 13px 40px; color: #fff; transition: 0.4s; border-radius: 6px 6px 30px 6px;}
.block5 input {border-radius: 6px 6px 20px 6px; padding: 6px 12px; font-size: 16px; line-height: 24px; color: #495057;  border: 1px solid #ced4da; margin-bottom: 15px;}
.block5 textarea {border-radius: 6px 6px 30px 6px; padding: 6px 12px; font-size: 16px; line-height: 24px; color: #495057;  border: 1px solid #ced4da; margin-bottom: 7px;}
.block5 .message_retour_defaut p {color: #004259; font-size: 18px; line-height: 24px; font-weight: 600;}
.block5 textarea:focus-visible, .block5 input:focus-visible, .block5 textarea:focus, .block5 input:focus, .block5 textarea:active, .block5 input:active {border: 1px solid #f15d5b!important; outline: 0;}

.waves-wraper{position: relative; margin-top: -137px; overflow: hidden;}
.waves {position:relative; width: 100%; height:15vh; margin-bottom:-7px; min-height: 150px; max-height: 150px;}
.parallax > use {animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;}
.parallax > use:nth-child(1) {animation-delay: -2s; animation-duration: 7s;}
.parallax > use:nth-child(2) {animation-delay: -3s; animation-duration: 10s;}
.parallax > use:nth-child(3) {animation-delay: -4s; animation-duration: 13s;}
.parallax > use:nth-child(4) {animation-delay: -5s; animation-duration: 20s;
}
@keyframes move-forever {
  0% {
   transform: translate3d(-90px,0,0);
  }
  100% { 
    transform: translate3d(85px,0,0);
  }
}

/*   360 - 480 */
@media only screen and (min-width: 0) and (max-width: 480px) {
.waves {height: 150px; min-height: 150px;}
.block1 {padding-top: 250px; height:110vh;}
.block1 h2 {font-size: 45px; line-height: 55px;}
.block1 h1 {font-size: 24px; line-height: 34px; margin: 15px auto;}
.block1 p {font-size: 18px; line-height: 28px;}
.block3-one2 svg {float: none!important; margin-bottom: 5px!important;}
.header-col1 {width: 50%; padding: 0 10px;}
.header-col2 {width: 10%;}
.header-col3 {width: 40%; padding: 0 10px;}
.block3-one1 {padding: 0 !important; margin-bottom: 30px;}
}

/*   481 - 767 */
@media only screen and (min-width: 481px) and (max-width: 767px) {
.waves {height: 150px; min-height: 150px;}
.block1 {padding-top: 250px; height:110vh;}
.block1 h1 {margin: 20px auto;}
.block3-one2 svg {float: none!important; margin-bottom: 5px!important;}
.header-col1 {width: 45%; padding: 0 10px;}
.header-col2 {width: 25%;}
.header-col3 {width: 30%; padding: 0 10px;}
.block3-one1 {padding: 0!important; margin: 30px 0;}
}

/*   768 -  1023 */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
.block1 {padding-top: 200px; height:110vh;}
.header-col1 {width: 40%; padding: 0 10px;}
.header-col2 {width: 35%;}
.header-col3 {width: 25%; padding: 0 10px;}
}

 /*   0 - 991 */
@media only screen and (min-width: 0) and (max-width: 991px) {
header .navbar {position: initial;}
header .navbar-collapse {position: absolute; left: 0; top: 0; width: 50%; min-width: 310px; height: 100vh;  overflow-y: scroll; padding: 0!important; z-index: 10; background: #151417; color: white;}    
header .navbar-collapse li {border-bottom: 1px solid #434343; padding: 4px 6px;}
header .navbar-collapse a {font-size: 16px; color: white;} 
header .navbar-collapse p, header .navbar-collapse p a {font-size: 14px; color: white;}

} 
  
 /*  > 992 */
@media only screen and (min-width: 991px) and (max-width: 100000000000000px) {
header .navbar-collapse {background: none!important;}
.navbar-info {display: none;}
}