body, html{
  font-family: 'Montserrat';
  font-size: 12px;
  line-height: 1.5;
  padding:0;
  margin:0;
  height:100vh;
  width:100%;
  background-color:#E0E0E0;
  overflow:hidden;
}

::selection{
  background:lightgrey;
}

body::-webkit-scrollbar {
  display: none;
}

/* Global*/
header{
  position:sticky;
  top:0;
}

ul{
  list-style-type:none;
  margin:0;
  padding:10px;
  display:flex;
  flex-direction:row;
  background-color:#000;
  flex-wrap:wrap;
  color:white;
  align-items:center;
  justify-content:flex-start;
}

ul .flex1{
  margin:5px;
  margin-left:12%;
  margin-right:20px;
  color:white;
  font-size:18px;
  font-weight:bold;
}

ul .flex2 a{
  margin:5px;
  margin-left:10px;
  margin-right:10px;
  color:#D3CDBF;
  font-size:16px;
  text-decoration:none;
  padding:0;
}

ul .flex2 a:hover{
  margin:5px;
  margin-left:10px;
  margin-right:10px;
  color:white;
  font-size:16px;
  text-decoration:none;
}

ul .current a{
  margin:5px;
  margin-left:10px;
  margin-right:10px;
  font-weight:bold;
  color:white;
  font-size:16px;
  text-decoration:none;
  padding:0;
}

/* home */

.homecontainer{
  background: url('../img/home/voc.jpg')0 -100px;
  background-color:#000;
  height:100%;
  background-repeat: no-repeat;
  background-size:cover;
  color: #F4F4F4;
  text-align:center;
}

.homecontainer h1{
  font-size:72px;
  text-shadow:0 0 10px #000;
  margin:0;
  padding:100px;
  padding-bottom:0;
}

.homecontainer p{
  margin-left:25%;
  margin-right:25%;
  margin-bottom:50px;
  font-size:24px;
  text-shadow:5px 0 10px #000;
}

.button{
  color:#000;
  font-weight:bold;
  font-size:14px;
  padding: 10px 20px 10px 20px;
  width: 120px;
  height: 50px;
  border:0px;
  background-color:	#E0E0E0;
  box-shadow:5px 5px 20px #666;
  border-radius:25px;
  outline:none;
  cursor:pointer;
  font-family:'Montserrat';
}

.button:hover{
  box-shadow: inset 1px 1px 3px 1px #A9A9A9, inset -1px -2px 2px 1px 	#F8F8F8, inset 0px 0px 8px 1px #A9A9A9;
  cursor:pointer;
}

@media(max-width: 768px){
  ul{
    list-style-type:none;
    margin:0;
    padding:10px;
    display:flex;
    flex-direction:row;
    background-color:#000;
    flex-wrap:wrap;
    color:white;
    align-items:center;
    justify-content:center;
  }

  ul .flex1{
    margin:0px;
    color:white;
    font-size:0px;
    font-weight:bold;
    flex-basis:100%;
    text-align:center;
    padding:0px;
    visibility:hidden;
  }

  ul .flex2 a{
    margin:2px;
    margin-left:10px;
    margin-right:10px;
    color:#D3CDBF;
    font-size:14px;
    text-decoration:none;
  }

  ul .flex2 a:hover{
    margin:2px;
    margin-left:10px;
    margin-right:10px;
    color:white;
    font-size:14px;
    text-decoration:none;
  }

  ul .current a{
    margin:2px;
    margin-left:10px;
    margin-right:10px;
    font-weight:bold;
    color:white;
    font-size:14px;
    text-decoration:none;
    padding:0;
  }

  .homecontainer{
    background: url('../img/home/voc.jpg');
    background-color:#000;
    height:100%;
    background-repeat: no-repeat;
    background-size:cover;
    color: #F4F4F4;
    text-align:center;
  }

  .homecontainer h1{
    font-size:36px;
    text-shadow:0 0 10px #000;
    margin:0;
    padding:50px;
    padding-bottom:0;
  }

  .homecontainer p{
    margin-left:10%;
    margin-right:10%;
    margin-bottom:50px;
    font-size:20px;
    text-shadow:0px 0 10px #000;
  }

}