/***************************************************/
/* Prepare for @font-face                          */
/***************************************************/

@font-face {
	font-family: 'BotonLight';
	src: url('../files/boton_light-webfont.eot');
	src: local('☺'), url('../files/boton_light-webfont.woff') format('woff'), url('../files/boton_light-webfont.ttf') format('truetype'), url('../files/boton_light-webfont.svg#webfontdz8N0jW8') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'BotonProRegular';
	src: url('../files/botonreg-webfont.eot');
	src: local('☺'), url('../files/botonreg-webfont.woff') format('woff'), url('../files/botonreg-webfont.ttf') format('truetype'), url('../files/botonreg-webfont.svg#webfont2ELBIQBQ') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'BotonProMedium';
	src: url('../files/botonmed-webfont.eot');
	src: local('☺'), url('../files/botonmed-webfont.woff') format('woff'), url('../files/botonmed-webfont.ttf') format('truetype'), url('../files/botonmed-webfont.svg#webfonteCvslOu3') format('svg');
	font-weight: bold;
	font-style: bold;
}

/***************************************************/
/* CSS Reset                                       */
/* http://meyerweb.com/eric/tools/css/reset/       */
/***************************************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
select {
	padding:0;
	margin:0;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
} 

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
label {
	cursor: pointer;
}



/***************************************************/
/* HTML5-specific CSS setup                        */
/***************************************************/

article, aside, figure, footer, header, hgroup, nav, section {
	display:block;
}

/***************************************************/
/* Set generic styles                              */
/***************************************************/

html, body {
	background:#000;
}

#mainheader {
	Width:960px;
	height:64px;
	margin:0 auto;
}

#wrapper {
	width:100%;
	background:transparent url(../img/bg-main.png) top left repeat-x;
}

h1#logo-zakelijk {
    /* background:transparent url(../img/logo-zakelijk.png) top left no-repeat; */
    margin:10px 0 0 0;
    float:left;
}

h1#logo-zakelijk a {
    width:176px;
    height:44px;
    display:block;
}

h1#logo-zakelijk span {
    display: block;
    width: 0;
    height: 0;
    overflow: hidden;
}

h1#logo {
    background:transparent url(../img/logo-wholesale.png) top left no-repeat;
    margin:10px 0 0 0;
    float:left;
}

h1#logo a {
    width:176px;
    height:44px;
    display:block;
}

h1#logo span {
    display: block;
    width: 0;
    height: 0;
    overflow: hidden;
}

#mainsection {
	background:#fff;
	width:920px;
	margin:30px auto 10px auto;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0 0 5px 2px #000;
	-webkit-box-shadow: 0 0 5px 2px #000;
	box-shadow: 0 0 5px 2px #000;
	padding:10px;
	font-family:"helvetica neue", arial, verdana, sans-serif;
	font-size:14px;
}

#mainsection h2 {
	font-size:24px;
	line-height:24pt;
	color:#000;
	font-family:BotonProRegular, serif;
	font-weight:normal;
	border-bottom:1px solid #000;
}

#mainsection h3 { 
    border-bottom: 1px solid #000;
    color: #000000; 
    font-family: BotonProRegular,serif; 
    font-size: 18px; 
    font-weight: normal; 
    line-height: 24pt; 
} 

#pc-check {
	margin:20px 0;
}

#pc-check input[type=submit] {
	display:block;
	margin-top:10px;
	-webkit-border-radius: 64px;
	-moz-border-radius: 64px;
	border-radius: 64px;
	-webkit-box-shadow: inset 2px 2px 2px 0px #80aaff;
	-moz-box-shadow: inset 2px 2px 2px 0px #80aaff;
	box-shadow: inset 2px 2px 2px 0px #80aaff;
	padding:10px 30px;
	border:1px solid #2C72FF;
	color:#fff;
	font-weight:bold;
	text-shadow: 1px 1px 1px #80aaff;
	background:#2C72FF;
	font-size:14px;
	cursor:pointer;
}

#pc-check label {
	line-height:15pt;
}

.full-line {
	margin-top:10px;
	display:bock;
	clear:both;
	height:60px;
}

.full-line input[type=text] {
	display:block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: inset 2px 2px 2px 0px #eee;
	-moz-box-shadow: inset 2px 2px 2px 0px #eee;
	box-shadow: inset 2px 2px 2px 0px #eee;
	padding:10px 8px;
	border:1px solid #98a2b2;
	width:204px;
}

.full-line div input[type=text] {
	width:88px;
}

.full-line div input[type=image] {
	margin-left: 250px;
}

.full-multi-line {
	margin-top:10px;
	display:bock;
	height:415px;
}

.full-multi-line div input[type=textarea] {
	width:88px;
}

.full-multi-line input[type=textarea] {
	display:block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: inset 2px 2px 2px 0px #eee;
	-moz-box-shadow: inset 2px 2px 2px 0px #eee;
	box-shadow: inset 2px 2px 2px 0px #eee;
	padding:10px 8px;
	border:1px solid #98a2b2;
	width:204px;
}

.full-radio-line-ext {
	margin-top:10px;
	display:bock;
	clear:both;
	height:100px;
}

.full-radio-line {
	margin-top:10px;
	display:bock;
	clear:both;
	height:80px;
}

.full-radio-line div input[type=text] {
	width:88px;
}

.full-multi-line-results {
	margin-top:10px;
	display:bock;
	clear:both;
	height:415px;
}

.full-multi-line-results div input[type=textarea] {
	width:88px;
}

.full-multi-line-results input[type=textarea] {
	display:block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: inset 2px 2px 2px 0px #eee;
	-moz-box-shadow: inset 2px 2px 2px 0px #eee;
	box-shadow: inset 2px 2px 2px 0px #eee;
	padding:10px 8px;
	border:1px solid #98a2b2;
	width:88px;
}

.sl-radio {
	margin-top:10px;
	height:30px;
	
}

.full-line select {
	display:block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow: inset 2px 2px 2px 0px #eee;
	-moz-box-shadow: inset 2px 2px 2px 0px #eee;
	box-shadow: inset 2px 2px 2px 0px #eee;
	padding:10px 8px;
	border:1px solid #98a2b2;
	width:204px;
}

.full-line div select {
	width:88px;
}

.full-line div {
	float:left;
	margin-right:10px;
}

#results {
	background:#fff;
	padding:20px 10px;
	color:#000;
	line-height:14pt;
}

.gmaps-iframe { 
    background: none repeat scroll 0 0 transparent; 
    float: right; 
    height: 200px; 
    width: 310px; 
}
 
.info { 
    background: url("../img/maps-logo.png") no-repeat scroll left top transparent; 
    display: block; 
    float: left; 
    padding-left: 55px; 
    width: 260px; 
} 

.highlight {
	background:#b5deff;
	padding:3px;
}

.koperafstand {
	margin:10px 0;
}

.infotable {
	margin:30px 0 0 0 !important;
	clear:both;
	font-size:12px;
	line-height:12pt;
	border:1px solid #000;
	width:100%;
	-moz-box-shadow: 0 0 5px 2px #fff;
	-webkit-box-shadow: 0 0 5px 2px #fff;
	box-shadow: 0 0 5px 2px #fff;
}

.infotable th {
	background:#000;
	color:#fff;
	font-weight:normal;
	padding:7px 4px;
	text-align:left;
}

.infotable td {
	padding:7px 4px;
	color:#000;
}

.infotable td img {
	vertical-align:middle;
}

.infotable tr {
	background:#fff !important;
	border-bottom:1px solid #000;
}

.infotable tr.even td {
	background:#fff !important;
}

.available-services {
	display:block;
	clear:both;
	position:relative;
	top:20px;
}

.alertmessage {
	width:80%;
	background:#fcf7c1 url(../img/alerticon.png) center left no-repeat;
	border:1px solid #fad426;
	padding:5px 5px 5px 25px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#494949;
	margin-top:15px;
}

.form-errors, .errormessage {
	width:80%;
	background:#ffb6b6 url(../img/erroricon.png) center left no-repeat;
	border:1px solid #c00;
	padding:5px 5px 5px 25px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#850000;
	margin-top:15px;
}

.all-capital {
	text-transform:uppercase !important;
}

.aligncenter {
	text-align:center !important;
}


/***************************************************/
/* External style reset                            */
/***************************************************/

.external {
	background:#fff;
}

.external body {
	background:#fff;
}

.external #mainheader {
	display:none;
}

.external #wrapper {
	width:100%;
	background:#fff;
}

.external h1#logo-zakelijk, .external h1#logo {
    display:none;
}

.external #mainsection {
	background:#fff;
	width:720px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	-moz-box-shadow: 0 0 0 0 #000;
	-webkit-box-shadow: 0 0 0 0 #000;
	box-shadow: 0 0 0 0 #000;
	padding:10px;
	font-family:"helvetica neue", arial, verdana, sans-serif;
	font-size:12px;
}

/* .external .tablescroll {
	width:100%;
	overflow:scroll;
} */

/***************************************************/
/* Responsive                                      */
/***************************************************/

@media all and (max-width: 1024px){
	#mainheader {
		Width:100%;
		height:64px;
		margin:0 auto;
	}
	#mainsection {
		width:90%;
	}
	h1#logo {
		margin:10px 0 0 10px;
	}
}

@media all and (max-width: 780px){
	#mainheader {
		Width:100%;
		height:64px;
		margin:0 auto;
	}
	#mainsection {
		width:90%;
	}
}
@media all and (max-width: 504px){
	#mainsection {
		font-size:12px;
	}
	.infotable {
		margin:20px 0 !important;
		clear:both;
		font-size:9px;
		line-height:9pt;
		width:300px !important;
	}
	#mainsection h2 {
		font-size:18px;
		line-height:18pt;
	}
	.info {
		width:90%;
		display:block;
		float:left;
		padding-left:55px;
		background:transparent url(../img/maps-logo.png) top left no-repeat;
	}
	.gmaps-iframe {
		display:none;
	}
}
@media all and (max-width: 320px){
	#mainsection {
		font-size:12px;
	}
	.infotable {
		margin:10px 0 !important;
		clear:both;
		font-size:9px;
		line-height:9pt;
		width:300px !important;
	}
	#mainsection h2 {
		font-size:18px;
		line-height:18pt;
	}
	.info {
		width:90%;
		display:block;
		float:left;
		padding-left:55px;
		background:transparent url(../img/maps-logo.png) top left no-repeat;
	}
	.full-line input[type=text] {
		font-size:12px;
	}
	.full-line select {
		font-size:12px;
	}
	#pc-check input[type=submit] {
		margin-top:70px;
		font-size:12px;
	}
	.gmaps-iframe {
		display:none;
	}
}