@font-face {
 font-family: "Futura Bold";
 src: url("fonts/Futura Bold.otf") format("woff"),
}


* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  box-sizing: border-box;
  font-size: 1em;
  text-decoration: none;
  scroll-behavior: smooth;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  font-family: Futura Bold, sans-serif;
}

body{
  width: 100vw;
  height: 100vh;
}



header{
  width: 100%;
  height: 20vh;
  background-color: none;
  text-align: center;

  z-index: 10;
}

header h1{
  padding-top: 10vh;
}


/*TITRE LITTORAL*/
header a{
  cursor: pointer;
  display: block;
  font-size: 1.8rem;
  font-weight: bold;
  transform: translateY(-1.25rem);
}


/*TEXTE LITTORAL*/
p {
  font-family: Times New Roman, serif;
}


/*LIENS LITTORAL*/
p a{
  font-family: Times New Roman, serif;
  font-weight: normal;
  color: black;
  text-decoration: none;
}

.main{
  height: 60vh;
  text-align: center;
}

.content{
  position: relative;
  height: 100%;
}

#slideshow_container {
  height: 100%;
  position: relative;
}

footer{
  height: 20vh;
  background-color: none;
}


/*SLIDER*/

.mySlides {
  display:none;
  height: 100%;
  margin: 0 auto;
}
.mySlides img {
  max-height:100%;
  max-width:92%;
  position: relative;
  top:50%;
  transform: translateY(-50%);
}
.mySlides .desc {
  color:transparent;
  pointer-events: none;
  display:none;
  position: absolute;
  width: 100%;
}
.noselection {
  -webkit-touch-callout: none; 
  -webkit-user-select: none; 
  -khtml-user-select: none;   
  -moz-user-select: none;    
  -ms-user-select: none;      
  user-select: none;        
}
.w3-center .w3-btn {
  background-color:#000;
}
.w3-center .w3-btn:hover {
  color:white;
}
.w3-xlarge .w3-left, .w3-xlarge .w3-right, .demo4 {cursor:pointer}
.demo4 {height:13px;width:13px;padding:0;background-color:transparent}
.demo5 {
  border:2px solid #f1f1f1 !important;cursor:pointer;transition:.3s;
}
.w3-border-red {
  border:2px solid #f44336 !important;
}
.w3-btn {
  box-shadow: none;
}
.w3-button {
  position: absolute;
  top:0%;
  height:100%;
  width:50%;
  background: none;
  font-size: 2em;
  color:#ccc;
  border:none;
  outline: none;
  z-index: 100;
  cursor:pointer;
}
button::-moz-focus-inner {
  border: 0;
}
.w3-button:hover {
  color:#999;
}
.w3-display-left {
  left:0px;
  text-align: left;
}
.w3-display-right {
  right:0px;
  text-align: right;
}




/*OVERLAY SP*/

.overlay {
  position: fixed;
  background: white;
  top: 19vh;
  left: 0;
  width: 100%;
 
  overflow: hidden;
  z-index: 200;

  opacity: 1;
  visibility: hidden;
  height: 0vh;

  overflow-y:scroll
}


.overlay{
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
    overflow: -moz-scrollbars-none;
    scrollbar-width: none;
}

.overlay::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}


.overlay.open {
  opacity: 1;
  visibility: visible;
  height: 80vh;
}

.overlay-content{
  position: relative;
 
  font-size: 0.9rem;
  text-align: center;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  cursor: ;
  height: auto;
  padding-bottom: 10rem;
}
/* Disable blue highlight */
button {
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a {
  -webkit-tap-highlight-color: transparent;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}