@charset "utf-8";
body, html { height:100%; width:100%;}
body {
	background-color: #000000;
	background-image:url(images/background.jpg);
	background-attachment:fixed;
	background-repeat:repeat-x;
	padding:0;
	margin:0;
	color:#FFFFFF;
	font-family:Tahoma, Arial, Helvetica, sans-serif
}
.seo	{display:none;}
.clearleft{ clear:left;}
.floatright{ float:right; margin-right:0 !important}
img { border:0;}
.btns{ text-align:right; padding-right:10px;}
.opperdiv{ width:100%; max-width:1000px; margin:0 auto; min-height:100%; position:relative; z-index:1;}
.background_meisje{background-image: url(images/meisje.png); background-repeat:no-repeat; background-position:0px; position:fixed; z-index:2; top:0; margin-left:50%; left:-636px; width:390px; height:984px;}
.content{ width:100%; position:relative; z-index:2; background:url(images/illustratie.png) no-repeat 525px 0px;}

.boxholder{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;}
.boxje{
	border-radius: 0.7em;
    width: 31.33%;
	margin: 0 1% 2%;
    background-image: url(../images/box.png);
    background-repeat: no-repeat;
    background-position: right top;
    padding: 0 0.5em 0.5em;
    border: 2px solid #fff;
    position: relative;
	box-sizing: border-box;
}
.boxje_name{ color:#ff5800; font-size:15px; text-transform:uppercase; text-align:left; font-weight:bold; height:25px; padding-top:4px;}
.boxje_profile{ float:right; width:24px; height:22px; margin-top: 6px; cursor:pointer;}

.boxje .description {
    background: #000000;
    border-radius: 6px;
    font-size: 12px;
    margin-bottom: 0.8em;
    padding: 0.7em 0 0.7em 0.7em;
	display: flex;
    flex-direction: row;
    flex-wrap: wrap;	
}
.boxje_thumb{ width:110px; height:151px; overflow:hidden; margin-right: 10px;}
.boxje_thumb img{width: 100%; object-fit: cover; height: 100%;}
.boxje_description{ margin-bottom:0; font-size:11px; box-sizing: border-box; flex: 1; }
.boxje_description > a{height:119px; margin-bottom: 2px; overflow:auto; display: inline-block;  padding-right:12px; word-break: break-word;}
.boxje_menu{ background: #000000; border-radius: 6px; font-size: 14px; padding: 0 0.7em;}
.line1{ padding:4px 0 10px 0; text-transform:uppercase; font-size:12px; float:none !important; cursor:auto !important; text-align: center;}
.line1 img{ vertical-align:middle; margin-right:6px; }
.pink{ font-size:16px; color:#ff5800; font-weight:bold;}
.small{ font-size:10px; text-transform:lowercase;}
.luisterbutton img{vertical-align: -6px; margin-right: 5px;}

.voorwaarden {
	clear: both;
	margin: 0;
	padding: 0;
	padding-bottom: 10px;
	color: #ffffff;
	font-size: 13px;
	text-align:center;
}
.voorwaarden a{ color:#FFFFFF;}

/* layover*/
.layover{ width:100%; height:100%; background-image:url(images/trans.png); background-repeat:repeat; z-index:100; position:fixed; left:0; top:0; display:none;}
.layover_window{ width:94%; max-width:700px; position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); background-color:#fff; border-radius:8px; }
.layover_window_top{ color:#2c3500; font-size:15px; text-transform:uppercase; text-align:left; padding:7px 7px 7px 16px; height:30px; }
.layover_window_top img { cursor:pointer;}
.layover_window_top div { margin-top:6px;}
.layover_window_bottom{ background-color:#000000; margin:0 8px; border-radius:7px; padding:15px; margin-bottom:5px;}
.screenshot_holder{ float:left; width:49%; position:relative; margin-right:10px; max-height: 330px; overflow: auto;}
.screenshot_holder a{width: 33%; height: 0px; display: inline-block;padding-top: 25%; position: relative;}
.screenshots { object-fit: cover; width: 100%;height: 100%; position: absolute; top: 0; border: 2px solid #000; box-sizing: border-box;}
.name {color:#ff5800; font-size:15px; text-transform:uppercase; text-align:left; font-weight:bold;}
.omschrijvingholder{color:#ffffff; font-size:12px; float:left; width:49%;}
.omschrijving { margin-bottom:20px;}
.omschrijving p{margin-top: 0;}
.icons > div {display: table; width: 100%; line-height: 1.6em;}
.icons > div .key {display: table-cell; width:50%; font-weight: bold;}
.icons > div .icon {display: none;}
.icons > div .value {display: table-cell; width:50%;}
.specs{margin-bottom: 20px;}
.specs > span{ display: inline-block; width:50%;line-height: 1.6em;}
.specs > span:nth-of-type(2n+1){font-weight:bold;}
.nummer {color:#ffffff; font-size:12px; float:left; width:320px;}
.no_padding { padding:0 !important;}
.layover_window_contact_btns td a:hover{ color:#d5ff00; text-decoration:underline}
.layoversms {display:none; position:absolute; top:0px; left:0px; width:100%; height:100%; color:#ffffff; text-align:center; font-size:14px; font-weight:bold; text-shadow: 0.1em 0.1em #000; background-image:url(images/trans.png); background-repeat:repeat;}
.clearleft0{ clear:left; height:0;}

@media only screen and (max-width : 1024px) {
	.background_meisje{display: none;}
}
@media only screen and (max-width : 1023px) {
	.boxje{ width:48%;}
}
@media only screen and (max-width : 860px) {
	.content{background: none;}
	.boxje{ width:100%; max-width: 500px;}
	.logo{text-align: center;}
	.logo img{max-width:100%;margin-left: -10%;}
}
@media only screen and (max-width : 768px) {
	.screenshot_holder, .omschrijvingholder{width:100%; margin-bottom: 20px;}
	.screenshot_holder{min-height: inherit; margin-right: 0;}
	.screenshot_holder a{width:20%; padding-top: 15%;}
	.layover{overflow: auto;}
	.layover_window{top: 2%; transform: translate(-50%, 0%);}
}
@media only screen and (max-width : 480px) {
	.screenshot_holder a{width:33%; padding-top: 25%;}
}


/* Preload images */
body:after {
  content: url(../images/profiellayover/close.png) url(../images/profiellayover/loading.gif) url(../images/profiellayover/prev.png) url(../images/profiellayover/next.png);
  display: none;
}

body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
  outline: none; 	
}

.lightbox {
  position: fixed;
  top: 100px !important;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
  outline: none; 
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;

  /* Image border */
  border: 4px solid white;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;

  /* Background color behind image.
     This is visible during transitions. */
  background-color: white;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(../images/profiellayover/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(../images/profiellayover/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(../images/profiellayover/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 15px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-caption a {
  color: #4ae;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(../images/profiellayover/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.9;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
  position: fixed;
  right: 20px;
  top: 20px; 
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
.lb-data .lb-close::before {
  	content: "Sluiten";
	line-height: 1.7em;
    position: absolute;
    left: -3.6em;
    color: red;
    font-weight: bold;
    font-size: 1.4em;
}

/*custom lightbox*/
.lightbox .lb-image {display: block; max-width: inherit;max-height: none;border-radius: 3px;	width: 640px !important;height: 640px !important;background-repeat: no-repeat;	background-position: center center;	border: none;background-color: #313131;} 
.lb-data .lb-close{background: url(../images/closeblack.png) top right no-repeat; width: 32px; height: 32px; position: absolute; top: -12px; right: auto; left:50%; margin-left:302px; z-index:999; } 
.lb-data .lb-close::before{content:""} 

@media only screen and (max-height : 800px) {
	.lb-outerContainer{width: 600px !important; height: 600px !important;}
	.lightbox .lb-image{width: 600px !important; height: 600px !important;}
	.lb-data .lb-close{margin-left:282px}
}
@media only screen and (max-height : 700px) {
	.lb-outerContainer{width: 500px !important; height: 500px !important;}
	.lightbox .lb-image{width: 500px !important; height: 500px !important;}
	.lb-data .lb-close{margin-left:232px;}
}
@media only screen and (max-width : 600px) {
	.lb-outerContainer{width: 400px !important; height: 400px !important;}
	.lightbox .lb-image{width: 400px !important; height: 400px !important;}
	.lb-data .lb-close{margin-left:182px;}
	/*.lb-nav a.lb-next{display: block !important; opacity: 1 !important;}*/
}
@media only screen and (max-width : 500px) {
	.lb-outerContainer{width: 300px !important; height: 300px !important;}
	.lightbox .lb-image{width: 300px !important; height: 300px !important;}
	.lb-data .lb-close{margin-left:132px;}
}

.lastonline.now{color:green; font-weight:bold;}