@charset "utf-8";
/* CSS Document */

body {
	font-size:16px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, sans-serif;
	background:#0662c9;
}

.content {
	width:80%;
	position:absolute;
	left:10%;
	top:0px;
	background:#FFF;
	min-height:100%;
}

.row {
	width:90%;
	float:left;
	position:relative;
	margin-left:5%;
}

.mt  { margin-top:30px; }
.mt2 { margin-top:15px; }
.pl  { padding-left:30px; }
	#header .row #logo {
		background:url("../images/logo.png");
		background-size:contain;
		background-position:left;
		background-repeat:no-repeat;
		width:400px;
		height:109px;
		margin-top:10px;
		margin-bottom:20px;
	}
	
	#header .row #banner {
		width:100%;
		height:300px;
		background:url("http://promo.topsoftxe.be/Bestanden/boekenbeurs.jpg");
		background-size:cover;
		background-position:left;
		background-repeat:no-repeat;
	}

#details {
	margin-top:20px;
	display:block;
	width:100%;
	float:left;
	position:relative;
}

	#details .row #titel {
		font-weight:bold;
		font-size:30px;
		margin-top:40px;
		height:28px;
		line-height:28px;
		vertical-align:middle;
		float:left;
	}

	#details .row #datum {
		font-size:24px;
		color:#999;
		float:left;
	}

	#details .row .col_container {
		width:70%;
		margin-left:5%;
		margin-top:5px;
	}

		#details .row .col_container .col {
			width:45%;
			display:inline-block;
		}

.choise {
	width:100%;
	float:left;	
	height:30px;
	line-height:30px;
	vertical-align:middle;
}
	.choise input {
		width:25px;
		height:25px;
		float:left;
	}
	
	.choise label {
		padding-left:30px;
		height:30px;
		line-height:30px;
		vertical-align:middle;
		margin-top:0px;
		float:left;
	}

#loc_keuze3 { 
	width:80%; 
	margin-left:4%; 
	float:left;
	margin-top:10px;
}
	#loc_keuze3 .location {
		padding-left:2%;
		width:30%;
		float:left;
		height:30px;
		line-height:30px;
		vertical-align:middle;
	}
		#loc_keuze3 .location input {
			width:25px;
			height:25px;
			float:left;
		}
		
		#loc_keuze3 .location label {
			padding-left:15px;
			float:left;
		}

#form {
	width:100%;
	position:relative;
	float:left;
	margin-bottom:50px;
	padding-bottom:100px;
}

#form .row {
	height:50px;
	line-height:50px;
	text-align:left;
	vertical-align:middle;
	font-weight:bold;
	float:left;
	width:100%;
	margin-left:0px;
	margin-top:10px;
}
	#form .row label {	
		float:left;
		width:15%;
	}
	
	#form .row input {
		height:50px;
		line-height:50px;
		text-align:left;
		vertical-align:middle;
		float:left;
		margin-left:10px;
		padding-left:8px;
		border-radius:8px;
		background:#CCC;
		color:#000;
		width:80%;
		border:none;
		font-size:18px;
	}
	
#form .button {
	width:20%;
	height:50px;
	line-height:50px;
	border-radius:8px;
	text-align:center;
	vertical-align:middle;
	background:#0662c9;
	color:#FFF;
	border:1px solid #0662c9;
	position:absolute;
	bottom:0px;
	left:0px;
	font-size:24px;
	left:50%;
	margin-left:-10%;
}

	#form .button:hover {
		cursor:pointer;
		color:#0662c9;
		background:#FFF;
	}
	
#spinner {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 255, 255, 255, .8 ) 
                url('../images/ajax-loader.gif') 
                50% 50% 
                no-repeat;
}

#response { margin-top:20px; float:left; width:100%; display:none; text-align:center; }
#response #confirm {
	width:100%;
	height:250px;
	background:url("../images/confirm.png");
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	margin-left:0px;
	padding-left:0px;
}

.dialog-error .ui-dialog-titlebar {
	background: #ed1c24	;
}

.ui-dialog-titlebar-close {display: none }


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  { /* STYLES GO HERE */
/* IPAD landscape and portrait */
	#loc_keuze3 .location {
		width:100%;
	}
	
	#form .row input {
		width:70%;
		margin-left:30px;
	}
	
	#form .row {
		margin-bottom:10px;
	}
	
	#header .row #logo { margin-bottom:5px; }
	
	#details, #response { margin-top:0px; }
}

@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) { /* STYLES GO HERE */
/* IPHONE 6 */
	#loc_keuze3 .location {
		width:100%;
	}
	
	#form .row input {
		width:70%;
		margin-left:30px;
	}
	
	#form .row {
		margin-bottom:10px;
	}
	
	#header .row #logo { margin-bottom:5px; }
	
	#details, #response { margin-top:0px; }
}

@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) { /* STYLES GO HERE */
/* IPHONE 6 Plus */
	#loc_keuze3 .location {
		width:100%;
	}
	
	#form .row input {
		width:70%;
		margin-left:30px;
	}
	
	#form .row {
		margin-bottom:10px;
	}
	
	#header .row #logo { margin-bottom:5px; }
	
	#details, #response { margin-top:0px; }
}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) { /* STYLES GO HERE */
/* IPHONE 5 */
	#loc_keuze3 .location {
		width:100%;
	}
	
	#form .row input {
		width:70%;
		margin-left:30px;
	}
	
	#form .row {
		margin-bottom:10px;
	}
	
	#header .row #logo { margin-bottom:5px; }
	
	#details, #response { margin-top:0px; }
}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) { /* STYLES GO HERE */
/* IPHONE 5 */
	#loc_keuze3 .location {
		width:100%;
	}
	
	#form .row input {
		width:70%;
		margin-left:30px;
	}
	
	#form .row {
		margin-bottom:10px;
	}
	
	#header .row #logo { margin-bottom:5px; }
	
	#details, #response { margin-top:0px; }
}