.button {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 3px 16px;
    border: 1px solid #7c6b6d;
    border-radius: 6px;
    background: #caaeb1;
    background: -webkit-gradient(linear, left top, left bottom, from(#caaeb1), to(#7c6b6d));
    background: -moz-linear-gradient(top, #caaeb1, #7c6b6d);
    background: linear-gradient(to bottom, #caaeb1, #7c6b6d);
    -webkit-box-shadow: #baa1a3 0px 0px 6px 0px;
    -moz-box-shadow: #baa1a3 0px 0px 6px 0px;
    box-shadow: #baa1a3 0px 0px 6px 0px;
    text-shadow: #4e4344 -2px 2px 3px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}
.button:hover,
.button:focus {
    border: 1px solid ##9b8688;
    background: #f2d1d4;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2d1d4), to(#958083));
    background: -moz-linear-gradient(top, #f2d1d4, #958083);
    background: linear-gradient(to bottom, #f2d1d4, #958083);
    color: #ffffff;
    text-decoration: none;
}
.button:active {
    background: #7c6b6d;
    background: -webkit-gradient(linear, left top, left bottom, from(#7c6b6d), to(#7c6b6d));
    background: -moz-linear-gradient(top, #7c6b6d, #7c6b6d);
    background: linear-gradient(to bottom, #7c6b6d, #7c6b6d);
}

 .buttongreen {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 3px 16px;
    border: 1px solid #08b20d;
    border-radius: 6px;
    background: #0dff16;
    background: -webkit-gradient(linear, left top, left bottom, from(#0dff16), to(#08b20d));
    background: -moz-linear-gradient(top, #0dff16, #08b20d);
    background: linear-gradient(to bottom, #0dff16, #08b20d);
    -webkit-box-shadow: #0dff17 0px 0px 6px 0px;
    -moz-box-shadow: #0dff17 0px 0px 6px 0px;
    box-shadow: #0dff17 0px 0px 6px 0px;
    text-shadow: #067f0a -2px 2px 3px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}
.buttongreen:hover,
.buttongreen:focus {
    border: 1px solid ##0bfe13;
    background: #10ff1a;
    background: -webkit-gradient(linear, left top, left bottom, from(#10ff1a), to(#0ad610));
    background: -moz-linear-gradient(top, #10ff1a, #0ad610);
    background: linear-gradient(to bottom, #10ff1a, #0ad610);
    color: #ffffff;
    text-decoration: none;
}
.buttongreen:active {
    background: #08b20d;
    background: -webkit-gradient(linear, left top, left bottom, from(#08b20d), to(#08b20d));
    background: -moz-linear-gradient(top, #08b20d, #08b20d);
    background: linear-gradient(to bottom, #08b20d, #08b20d);
}

.buttonred {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 3px 16px;
    border: 1px solid #cc0f01;
    border-radius: 6px;
    background: #ff1d02;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff1d02), to(#cc0f01));
    background: -moz-linear-gradient(top, #ff1d02, #cc0f01);
    background: linear-gradient(to bottom, #ff1d02, #cc0f01);
    -webkit-box-shadow: #ff2302 0px 0px 6px 0px;
    -moz-box-shadow: #ff2302 0px 0px 6px 0px;
    box-shadow: #ff2302 0px 0px 6px 0px;
    text-shadow: #780901 -2px 2px 3px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}
.buttonred:hover,
.buttonred:focus {
    border: 1px solid ##f01201;
    background: #ff2302;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff2302), to(#f51201));
    background: -moz-linear-gradient(top, #ff2302, #f51201);
    background: linear-gradient(to bottom, #ff2302, #f51201);
    color: #ffffff;
    text-decoration: none;
}
.buttonred:active {
    background: #cc0f01;
    background: -webkit-gradient(linear, left top, left bottom, from(#cc0f01), to(#cc0f01));
    background: -moz-linear-gradient(top, #cc0f01, #cc0f01);
    background: linear-gradient(to bottom, #cc0f01, #cc0f01);
}
            
.flipbook-wrap {
  position: relative;
  margin: auto;
}

.sample-flipbook{
	width: 920px;
	height: 300px;
  margin-right: auto;
  margin-left: auto;
	-webkit-transition:margin-left 0.2s;
	-moz-transition:margin-left 0.2s;
	-ms-transition:margin-left 0.2s;
	-o-transition:margin-left 0.2s;
	transition:margin-left 0.2s;
}

.sample-flipbook .page{
	width:300px;
	height:300px;
	background-color:white;
	line-height:300px;
	font-size:20px;
  
  display: flex;
  justify-content: center;
  align-items: center;
}

.sample-flipbook .page-wrapper{
	-webkit-perspective:2000px;
	-moz-perspective:2000px;
	-ms-perspective:2000px;
	-o-perspective:2000px;
	perspective:2000px;
}

.sample-flipbook .hard{
	background:#fff !important;
	color:#333;
	-webkit-box-shadow:inset 0 0 5px #666;
	-moz-box-shadow:inset 0 0 5px #666;
	-o-box-shadow:inset 0 0 5px #666;
	-ms-box-shadow:inset 0 0 5px #666;
	box-shadow:inset 0 0 5px #666;
	font-weight:bold;
}

.sample-flipbook .odd{
	background:-webkit-gradient(linear, right top, left top, color-stop(0.95, #FFF), color-stop(1, #DADADA));
	background-image:-webkit-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
	background-image:-moz-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
	background-image:-ms-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
	background-image:-o-linear-gradient(right, #FFF 95%, #C4C4C4 100%);
	background-image:linear-gradient(right, #FFF 95%, #C4C4C4 100%);
	-webkit-box-shadow:inset 0 0 5px #666;
	-moz-box-shadow:inset 0 0 5px #666;
	-o-box-shadow:inset 0 0 5px #666;
	-ms-box-shadow:inset 0 0 5px #666;
	box-shadow:inset 0 0 5px #666;
	
}

.sample-flipbook .even{
	background:-webkit-gradient(linear, left top, right top, color-stop(0.95, #fff), color-stop(1, #dadada));
	background-image:-webkit-linear-gradient(left, #fff 95%, #dadada 100%);
	background-image:-moz-linear-gradient(left, #fff 95%, #dadada 100%);
	background-image:-ms-linear-gradient(left, #fff 95%, #dadada 100%);
	background-image:-o-linear-gradient(left, #fff 95%, #dadada 100%);
	background-image:linear-gradient(left, #fff 95%, #dadada 100%);
	-webkit-box-shadow:inset 0 0 5px #666;
	-moz-box-shadow:inset 0 0 5px #666;
	-o-box-shadow:inset 0 0 5px #666;
	-ms-box-shadow:inset 0 0 5px #666;
	box-shadow:inset 0 0 5px #666;
}

img {
  max-width: 96%;
}

.btnvorigevolgendebladzijde {
  font-size: 30px;
  color: black;
  text-decoration: none;
  position: absolute;
  top: 20px;
  transform: translateY(-50%)
}

.next {
  right: 10px;
    z-index: 2000;
}
            
.prev {
  left: 10px;
    z-index: 2000;
}