/* Enter Your Custom CSS Here */


/* MENU */

#responsive-menu-pro-container #responsive-menu-pro li.responsive-menu-pro-item.responsive-menu-pro-current-item > .responsive-menu-pro-item-link {
    color: #ffffff;
    border-color: transparent !important;
}

#responsive-menu-pro-container #responsive-menu-pro-wrapper {
  margin-top: 13%;}

@media only screen and (max-width: 600px) {
  #responsive-menu-pro-container #responsive-menu-pro li.responsive-menu-pro-item.responsive-menu-pro-current-item > .responsive-menu-pro-item-link {
    font-size: 10vw !important
  }
  
  #responsive-menu-pro-container #responsive-menu-pro li.responsive-menu-pro-item .responsive-menu-pro-item-link{
    font-size: 10vw !important}

  #responsive-menu-pro-container #responsive-menu-pro > li.responsive-menu-pro-item:first-child > a{
    font-size: 10vw !important;}
  
#responsive-menu-pro-container #responsive-menu-pro-wrapper {
  margin-top: 50%;
  }}


/* desktop 17 inch code */
.z-index-menu{
  z-index: 10;
}

.z-index-vlak{
 z-index: 6; 
}

.z-index-head{
z-index: 2 !important;
  max-height: 100vh !important;
  min-height: 100vh !important;
  height: 100vh !important;
}

.font-header{
 font-size: 10vw !important; 
  margin-top: -25% !important;
  margin-bottom: -25% !important;
  z-index: 8;
}

.font-text-header{
 font-size: 1.5vw !important; 
 line-height: 2.5vw!important;
  margin-top: 60% !important;
 z-index: 8;
}

.height-main{
 height: 100vh !important;
  min-height: 100vh !important;
}



/* main page */

.main-margin{
margin-top: -1px !important;
  z-index: 5 !important;
}

.main-title{
   font-size: 2.5vw !important; 
 line-height: 3vw!important;
 margin-bottom: 50px; 
  z-index: 7 !important;
}

.main-text{
  font-size: 1.1vw;
  line-height: 1.6vw;
  z-index: 7 !important;
  padding-left: 30%;
  padding-right: 30%;
}

.main-background{
 margin-top: 0px !important; 
}

/*button*/
.button {
  text-decoration: none;
  text-transform: inherit;
  color: #4b2981;
  letter-spacing: 1px;
  font-family: inherit;
  font-weight: 600;
  font-size: 20px;
  display: inline-block;
  padding: 15px 20px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.2, 1);
  border: 1px solid #4b2981;
}
.button:before, .button:after {
  position: absolute;
  content: "";
  display: block;
}
.button:before {
  top: -120px;
  left: 50px;
  z-index: -1;
  width: calc(100% + 140px);
  height: 100px;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.2, 1);
  -webkit-transform: skew(70deg);
          transform: skew(70deg);
  background: #8d75b6;
}
.button:after {
  top: 0;
  left: 0;
  z-index: -2;
  width: calc(100% - 0px);
  height: calc(100% - 0px);
  border: 0px solid #4b2981;
}
.button:hover:before {
  left: -50px;
  top: -20px;
}

/*buttonwhite*/
.button2 {
  text-decoration: none;
  text-transform: inherit;
  color: #ffffff;
  letter-spacing: 1px;
  font-family: inherit;
  font-weight: 600;
  font-size: 20px;
  display: inline-block;
  padding: 15px 20px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.2, 1);
  border: 1px solid #ffffff;
}
.button2:before, .button:after {
  position: absolute;
  content: "";
  display: block;
}
.button2:before {
  top: -120px;
  left: 50px;
  z-index: -1;
  width: calc(100% + 140px);
  height: 100px;
  transition: all 0.4s cubic-bezier(0.25, 0.1, 0.2, 1);
  -webkit-transform: skew(70deg);
          transform: skew(70deg);
  background: #4b2981;
}
.button2:after {
  top: 0;
  left: 0;
  z-index: -2;
  width: calc(100% - 0px);
  height: calc(100% - 0px);
  border: 1px solid #ffffff;
}
.button2:hover:before {
  left: -50px;
  top: -20px;
}

/*mobile z-index */

.z1{
  
  z-index: 1;
}

.z2 {
 z-index: 2; 
  margin-top: -3px !important;
}


/*background fade in */

.headload{
    width: 100%;
    height: 100%;
    background: url('https://justice42.com/wp-content/uploads/2018/09/Tekengebied-2background2-k3-2.png') no-repeat center center fixed;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    -webkit-animation: myfirst 5s ; /* Chrome, Safari, Opera */
    animation: myfirst 5s ;
  }

/* Chrome, Safari, Opera */
  @-webkit-keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }

  /* Standard syntax */
  @keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }


/*nieuws*/
#dslc-module-18d3971c200 .dslc-cpt-post-read-more a {
  float: right;
  margin-top:-25px;}


a.responsive-menu-pro-item-link:active {
font-weight: 700 !important; 
}

#responsive-menu-pro-container, #responsive-menu-pro-container:before, #responsive-menu-pro-container:after, #responsive-menu-pro-container *, #responsive-menu-pro-container *:before, #responsive-menu-pro-container *:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: #fff;
    padding-right: 5px !important;
    font-size: 30px;
}

#responsive-menu-pro-container, #responsive-menu-pro-container:before, #responsive-menu-pro-container:after, #responsive-menu-pro-container *, #responsive-menu-pro-container *:before, #responsive-menu-pro-container *:after {
    box-sizing: border-box;
    margin: 0;
    padding-right: 10px !important;
}