* {
  margin: 0;
  padding: 0;
}

body {
  text-align: center;
  overflow-x: hidden;
  height: 100%;
}

.loadingScreen {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 100vh;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-y: hidden;
}

.div-typing-loading {
  position: absolute;
  display: inline-block;
  margin: auto;
  width: 80%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  justify-content: center;
  align-items: center;
  background-color: none;
}


.Loader {
  display: block;
  
}


/* ---------------------------------- */
/* HEADER NAV */

.tail {
  width: 100%;
  margin: auto;  
}

.contact {
  display: block;
  position: fixed;
  margin: auto;
  width: 8%;
  min-width: 4.5em;
  top: 0%;
  left: 0%;
  transform: translate(30%, -147.8%);
  z-index: 20;
} 

/* ---------------------------------- */
/* HOMEPAGE */

section {
  z-index: -5;
  height: 100vh;
  background-color: none;
}

.svgScroll {
  position: absolute;
  display: none;
  margin: auto;
  width: 100%;
  top: 0%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.div-typing-text-wake {
    display: none;
}

.div-typing-text-visite {
    display: none;
}

.div-typing-text {
  position: absolute;
  display: inline-block;
  margin: auto;
  width: 80%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  justify-content: center;
  align-items: center;
  background-color: none;
}

.hello {
  display: none;
  z-index: -100;
  width: 0;
}

.Ooops {
  display: none;
  z-index: -100;
  width: 0;
}

.typing_text-heading {
  display: block;
}

.cursor{
    animation: cursorBlink 0.5s alternate infinite;
}

@keyframes cursorBlink {
  from {opacity: 0;}
  to {opacity: 100%;}
}

h1 {
  color: black;
  text-align: center;
  font-family: "Courier Prime", monospace;
  font-weight: 700;
  font-style: normal;
  font-size: 2.5vmin;
  line-height: 4vmin;
  margin: none;

}

.monkeykethek {
  z-index: 100;
  display: block;
  background: url("svg/monkeyNoEyes.svg") no-repeat scroll center center / 4vw 4vw; 
}

.EyesMonkeyDiv {
  display: block;
  position: fixed;
  width: 21%;
  min-width: 12em;
  margin: auto;
  z-index: 61;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -12%);
}

.imgHomeEyes{
  width: 100%;
  margin: auto;
}

.HomeMonkeyDiv {
  display: block;
  position: fixed;
  width: 21%;
  min-width: 12em;
  margin: auto;
  z-index: 60;
  top: 100%;
  left: 50%;
  transform: translate(-50%, -12%);
}

.imgHomeMonkey {
  width: 100%;
  margin: auto;
}
  
.monkey1 {
  /*background-color: blueviolet;*/
  z-index: 1;
   width: 20%;
   min-width: 13em;
   display: block;
   margin: auto;
}

.wrapper2 {
  /*background-color: aqua;*/
  z-index: -10;
  position: fixed;
  width: 100%;
  bottom: 0;
  margin: auto;
  margin-bottom: -10.3%;
  
}

/* ---------------------------------- */
/* UL MENU */
.menu-mobile {
  display: none;
}

.containermobile {
  display: none;
}

.container {
  /*background: #ff0000;*/
  display: block;
  width: fit-content;
  margin: auto;
  justify-content: center;
  align-items: center;
 /*padding-top: 40px;
  padding-bottom: 40px;*/
}

.container img.swipeimage {
  position: fixed;
  top: 0;
  left: 0;
  width: 33%;
  min-width: 5.6em;
  object-fit: cover;
  z-index: 9;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

ul {
  z-index: 5;
  font-family: 'Montserrat', sans-serif;
  font-size: 7vw;
  font-weight: 900;
  line-height: 5.3vw;
  list-style-type: none;/* Remove bullets */
  padding: 0; /* Remove padding */
}

.deskstop li a {
  text-decoration: none;
  color: #000;
}

.deskstop li a:hover {
  z-index: 60;
  color: rgb(255, 255, 255);
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
  transition: all 0.1s ease-out;
}

/* ---------------------------------- */
/* FOOTER */

footer {
  display: block;
  height: 100vh;
  justify-content: center;
  align-items: center;
}

.EyesDivR {
  display: block;
  position: fixed;
  width: 21%;
  min-width: 12em;
  margin: auto;
  z-index: 61;
  top: 0%;
  left: 50%;
  transform: translate(-50%, -100%);
}

.imgEyesreverse {
  width: 100%;
  margin: auto;
}

.MonkeyDivR {
  display: block;
  position: fixed;
  width: 21%;
  min-width: 12em;
  margin: auto;
  z-index: 60;
  top: 0%;
  left: 50%;
  transform: translate(-50%, -100%);
}

.imgMonkeyreverse {
  width: 100%;
  margin: auto;
}

.div-typing-text-reste {
  position: relative;
  display: block;
  margin: auto;
  width: 80%;
  top: 50%;
  left: 0%;
  
  margin-bottom: .4%;
  
  background-color: none;
}

.reste {
  display: none;
  z-index: 1;
  width: 0;
}

.codebarre {
  width: 100%;
    position: relative;
  display: block;
  margin: auto;
  width: 80%;
  top: 50%;
  left: 0%;
  transform: translate(0%, -50%);
    z-index: 2;
}

.noselect {
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
		-webkit-tap-highlight-color: transparent;
}

button {
 
	cursor: pointer;
	font-family: 'Libre Barcode 39 Text', cursive;
	font-size: 4.5vmin;
	background: none;
	border: none;
  color: black;
}

button:hover {
	animation: blink 500ms 50ms;
}

@keyframes blink {
	from {color: #eee;}
	to {color: black;}
}

button:focus {
	outline: none;
}

.features_card-canvas {
        position: absolute;
        display: block;
        margin: auto;
        align-items: center;
       
        justify-content: center;
        width: 100% !important;
        height: 100vh;
        
        background-color: none;

        overflow: hidden;
        z-index: 0;
}

.copyrightfull {
  width: 100%;
  position: relative;
  display: block;
  margin: auto;
  top: 86%;
  left: 0%;
  z-index: -20;
}

h4 {
  color: black;
  text-align: center;
  font-family: 'Montserrat', sans-serif;
  font-weight: 200;
  text-transform: uppercase;
  font-size: .8vmin;
}
 
.mobilefooter {
  display: none;
}



/* ---------------------------------- */
/*MOBILE*/

@media only screen and (max-width: 600px) {

  body {
    background-color: white;
  }

  h1 {
    color: black;
    text-align: left;
    align-items: center;
    font-family: "Courier Prime", monospace;
    font-weight: 700;
    font-style: normal;
    font-size: 1.3em;
    line-height: 1.1em;
    margin: none;
  }

  h3 {
    font-size: 11vw;
    font-weight: 900;
    line-height: 8.4vw;
  }

  h4 {
    color: black;
    font-size: 1.5vmin;
  } 

  .contact {
    min-width: 4.5em;
    top: 0%;
    left: 0%;
    transform: translate(30%, -147.8%);
    z-index: 20;
} 

/* ---------------------------------- */
/*MOBILE HOMEPAGE */

  .HomeMonkey {
    display: none;
  }

  .div-typing-text{
    display: none;
  }

  .div-typing-text-wake {
    display: flex;
    position: absolute;
    width: fit-content;
    top: 33%;
    left: 8%;
    justify-content: left;
    text-align: left;
    transform: translate(-0%, -0%);
  }

  .div-typing-text-visite {
    display: block;
    position: absolute;
    width: 50%;
    top: 68%;
    right: 0%;
    margin-right: 0%;
    justify-content: left;
    text-align: left;
    transform: translate(-0%, -0%);
  }

  .typing_text-heading {
    display: none;
  }

.typing_text-heading-mobile {
    display: block;
  }

.hello-m {
  display: none;
  z-index: -100;
  width: 0;
}

.kethek-m {
  display: none;
  z-index: -100;
  width: 0;
}

.Ooops-m {
  display: none;
  z-index: -100;
  width: 0;
}

.visite-m {
  display: none;
  z-index: -100;
  width: 0;
}




  
/* ---------------------------------- */
/* MOBILE MENU */

  .container {
    display: none;
  }

  .menu-mobile {
    display: contents;
  }

  .containermobile {
    width: 100%;
    margin-bottom: 8%;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
    
  }

  .title {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
  }

  .swipeimage {
    width: 84%;
    margin: auto;
    display: flex;
  }

  .menu-mobile li a img {
    opacity: 1;
    transition: opacity 0.1s;
  }

  .menu-mobile li a:hover img {
    opacity: 0;
  }

  .menu-mobile li a .title {
    visibility: hidden;
  }

  .menu-mobile li a:hover .title {
    visibility: visible;
  }

  li a:hover {
    z-index: 0;
    color: black;
    text-shadow: none;
    transition: all 0s ease-out;
  }
/* ---------------------------------- */
/* MOBILE FOOTER */

  .features_card-canvas {
    display: none;
  }

  .codebarre {
    display:none;
  }

  .mobilefooter {
    height: 100vh;
    position: relative;
    display: block;
    margin: auto;
    z-index: 10;
  }

  .div-typing-text-reste-m {
    display: block;
    position: absolute;
    width: fit-content;
    top: 23%;
    left: 8%;
    justify-content: left;
    text-align: left;
    transform: translate(-0%, -0%);
  }

  .EyesDivR {
    min-width: 12em;
    top: 0%;
    left: 50%;
    transform: translate(-50%, -100%);
}

  .MonkeyDivR {
    min-width: 12em;
    top: 0%;
    left: 50%;
    transform: translate(-50%, -100%);
}


  ul.menu-contact {
    color: white;
    text-align: left;
    font-family: "Courier Prime", monospace;
    font-weight: 700;
    font-style: normal;
    font-size: 1.3em;
    line-height: 2.8em;
    margin: auto;
    list-style-type: none;/* Remove bullets */
    padding: 0; /* Remove padding */
  }

  .menu-contact li a {
    color: black;
    background-color: none;
    text-decoration: underline;
    text-decoration-thickness: 4px;
    text-underline-offset: 6px;
  }

  .menu-contact {
    position: absolute;
    display: block;
    margin: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .reste-m {
    display: none;
    z-index: -100;
    width: 0;
  }

  .contact-m {
    display: none;
    z-index: -100;
    width: 0;
  }

  .copyrightfull {
    width: 100%;
    position: relative;
    display: block;
    margin: auto;
    top: -6%;
    z-index: -20; 
  }


}