#age-verify {
  position :fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background: url("../images/feuilles_de_chanvre.png");
  /* background-color : rgba(0,0,0,0.9); */
  z-index:20;
}

#age-verify .window {
    position : absolute;
    top : 50%;
    left : 50%;
    width : 40vw;
    height : 25vh;
    font-family:Arial, Verdana, sans-serif;
    color:darkgreen;
    overflow : hidden ;
    padding : 40px ;
    transform: translate(-50%, -50%);
    background-color : rgba(255,255,255,0.9);
    /* border :6px solid rgba(128,128,0,0.8) ; */
    box-sizing : border-box ;
    box-shadow : 0 20px 60px #999;
    transition: all 2s;
    border-radius: 30px;
}

#age-verify span {
    display : block ;
    text-align : center ;
    margin-bottom : 10px ;
}
#age-verify .title {
    font-size : 24px ;
    }


#age-verify button {
  border : 0 ;
  margin : 0 ;
  padding : 0 ;
  width :48% ;
  height :60px ;
  color :#FFF ;
  font-size : 18px ;
  background-color : rgba(0,100,0,0.8);
  margin-top :20px ;
  font-family : $font-stack ;
  transform :scale(1);
  transition : .2s ;
}

#age-verify button:hover {
        transform :scale(1.1);
        box-shadow : 0 20px 60px rgba(#000,0.2);
        background-color : darkgreen;
      }

#age-verify button .back {
        display :block ;
        float :none ;
        margin :auto ;
        background-color : #fff ;
        color :$button-color !important ;
        margin-top :20px ;
      }

#age-verify button .yes {
        float :left ;
      }

#age-verify button .no {
        float :right ;
      }

.underBox {
      position :absolute ;
      width : 100%;
      height : 100vh ;
      padding : 40px ;
      top :100% ;
      left :0 ;
      right :0 ;
      background-color : #333 ;
      box-sizing :border-box ;
      text-align: center;
      transition : .2s ;
}

 .underBox * {
        color :#FFF !important ;
      }

.hidden {
    opacity: 0;
    display: none;
    transition : .5s ;
  }
.hidden .window {
    transform :scale(0.5);
  }

.under .window .underBox {
      top :0% ;
    }

    #cookie-banner {
      position :fixed;
      height:10vh;
      bottom:0;
      left:0;
      right:0;
      background-color : #aaf1aa;
    	border-top: 2px solid #555;
      z-index:20;
    }

    #cookie-banner span {
    		width:60vw;
        display : block;
        font-family:Arial, Verdana, sans-serif;
        color:darkgreen;
        text-align : left;
        margin-bottom : 10px;
    		box-sizing: border-box;
    		padding-left:5%;
    		padding-top:20px;
    		float: left;
    }

    #cookie-banner button {
      border : 0 ;
      margin : 0 ;
      padding : 0 ;
      width :15% ;
      height :60px ;
      color :#FFF ;
      font-size : 18px ;
      background-color : rgba(0,0,0,0.8);
      margin-top :20px ;
      transform :scale(1);
      transition : .2s ;
      border-radius: 30px;
    }

    #cookie-banner button:hover {
            transform :scale(1.1);
            box-shadow : 0 20px 60px rgba(#000,0.2);
            background-color : black;
            border-radius: 30px;
          }

    #cookie-banner button .accept-cookie {
            float :right ;
          }

    #cookie-banner button .refuse-cookie {
    	margin-right:-20px;
            float :right ;
          }


@media screen and (max-width: 992px) {
  #age-verify { background-position-x: left -500px; background-position-y: center; }
  #age-verify .window { width:45vw; height:60vh; }
  #age-verify .title { font-size : 22px; }
  #cookie-banner { height: 27vh; }
  #cookie-banner button { margin-left:2vw; }
}

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

  #age-verify .window { width:96vw; height:30vh; }
  #cookie-banner span { width:100vw; }
  #cookie-banner button { margin-left:5vw; width:40vw; }

}