/*
	RED: de1d27
	WHITE: fff
	BLACK: 000
	GREY: 555
	LIGHT GREY: ddd
*/
#hamburger { display: none; }

* { margin: 0; padding: 0; }
::selection { background: #DE1D27; color: #fff; }
body { width: 100%; height: 100%; font: normal 16px/1.7em 'Roboto', Arial, Verdana, sans-serif; color: #333; background: #000; }
#wrapper { width: 100%; }

/* MAIN
*********************************************************************************/

/* links & hovers */
a { color: #ff2e00; text-decoration: none;
	-webkit-transition:
		color 0.2s ease,
		background 0.2s ease,
		opacity 0.2s ease;
	-moz-transition:
		color 0.2s ease,
		background 0.2s ease,
		opacity 0.2s ease;
	-ms-transition:
		color 0.2s ease,
		background 0.2s ease,
		opacity 0.2s ease;
	-o-transition:
		color 0.2s ease,
		background 0.2s ease,
		opacity 0.2s ease;
	transition:
		color 0.2s ease,
		background 0.2s ease,
		opacity 0.2s ease;
}
a:hover { color: #2a3035; }
a img, img { border: none; vertical-align: middle; }

p { margin: 0 0 15px 0; }

.clear { height: 1px; clear: both; }
.hide { display: none; }

/* form */
input { line-height: 30px; padding: 12px 20px; margin-bottom: 10px; outline: none; font: normal 16px/1.7em 'Roboto', Helvetica, Arial, Verdana, sans-serif; color: #333; }
textarea { width: 340px; height: 100px; outline: none; padding: 4px; font: normal 16px/1.7em 'Roboto', Helvetica, Arial, Verdana, sans-serif; color: #333; }
input, textarea { border: 1px #ddd solid; border-top: 2px #ddd solid; }

#mc_embed_signup input[type=text],input[type=email],select {
	width: 90%;
	padding: 5px;
}
#mc_embed_signup input[type=submit] {
	width:auto;
	padding: 8px 12px;
	margin-top: 10px;
}
#mc_embed_signup label { font-weight: bold;}
/* headings */
h1, h2, h3 { font-family: 'Exo 2', Arial, sans-serif; font-weight: 800; font-style: italic; text-transform: uppercase; }
h1 { font-size: 36px; line-height: 50px; }
h2 { font-size: 34px; line-height: 38px; }
h3 { font-size: 24px; }
h4 { font-size: 1em; }

iframe.youtube {  }

hr { height: 1px; border: none; border-top: 1px #ddd solid; clear: both; display: block; }

.button, button { width: 100%; background: #de1d27; color: #fff; float: left; display: block; padding: 16px 20px; border: none; text-align: left; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 1em; font-weight: bold; text-transform: uppercase; display: block; }
.button:hover, button:hover { background: #333; color: #fff; cursor: pointer; }

.clear { height: 1px; clear: both; }

small { color: #999; }

/* HEADER
*********************************************************************************/
#header { background: #fff; }
#top { background: #fff; padding: 10px 15px; }

#menu { background: #de1d27; border-bottom: 2px #fff solid; }

#menu ul {  }
#menu ul li { float: left; list-style: none; }
#menu ul li a { text-transform: uppercase; float: left; display: block; font: 800 18px 'Exo 2'; font-style: italic; color: #ddd; padding: 34px 0 27px 0; margin: 0 12px; border-bottom: 6px #de1d27 solid; }
#menu ul li a:hover, #menu ul li a:active, #menu ul li.current_page_item a { color: #fff; border-bottom: 6px #000 solid; }

#menu ul .page_item_has_children ul.children { height: 0; width: 0; opacity: 0; transition: opacity 0.5s ease, height 0.5s ease;
	overflow: hidden; }
#menu ul .page_item_has_children:hover ul.children { overflow: visible; width: 500px; height: auto; opacity: 1;
	position: absolute; top: 158px; }
#menu ul .page_item_has_children:hover ul.children li a { font: normal 14px 'Roboto', Arial, sans-serif !important; padding: 47px 0 35px 0; border-bottom: 6px #de1d27 solid; }
#menu ul .page_item_has_children:hover ul.children li a:hover { border-bottom-color: #000; }

#menu ul .page_item_has_children ul.children li { background: #000; margin-top: 8px; }

#heading { background: #fff; padding: 10px 15px 0px 15px; border-top: 5px #ddd solid; }
/* .page { padding-top: 0px; border: 1px solid white; } */

/* HOME
*********************************************************************************/
.home-heading { font-style: normal; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 16px; }

#slider { margin-top: 30px; }
#slider img { width: 100%; }

#shortcuts { margin-top: 30px; }
#shortcuts .shortcut { min-height: 115px; color: #fff; }
#shortcuts .shortcut .content { padding: 30px; text-transform: uppercase; font-weight: 800; }
#shortcuts .shortcut-highlight { color: #fff; }

.shortcut:hover { opacity: .90; }
.shortcut img { width: 100% !important; height: auto; }

#home-columns { margin-top: 30px; background: #fff url('img/home-columns.png') repeat-y center center; }

.home-column { padding-bottom: 30px; position: relative; }
.home-column .content {  }
.home-column-heading { display: block; overflow: hidden; padding: 0 30px; }
.home-column-heading h2 { margin-bottom: 10px; border-top: 5px #DE1D27 solid; float: left; padding: 10px 0; line-height: 1.8em; }
.home-column-content { padding: 0 0 30px 30px;  }

.home-column h3 { margin: 20px 0; }
.home-column h4 { margin: 20px 0; }

.home-column ul { margin: 10px 0; list-style: none; }
.home-column ul li { padding: 12px 0; }

.home-column hr { margin: 30px 0; }

#snapontv {  }
#nieuwsbrief {  }

.button-bottom { position: absolute; bottom: 0; left: 5%; right: 5%; width: 90%; }

/* SUBPAGES
*********************************************************************************/
#sub {  }

#sub h2 { margin: 30px 0; color: #de1d27; }
#sub h3 { margin: 20px 0; color: #555; }

.widget { margin-bottom: 30px !important; overflow: hidden; }

.page-heading { padding: 15px 0 20px 0; }

.page-content { background: #fff; padding: 30px; overflow: hidden; }
.page-sidebar { background: #333; color: #fff; padding: 30px; }

.page-content ul, .page-content ol { margin: 20px 25px; }

.page-sidebar h4 { padding: 10px; }
.page-sidebar h4 a { color: #fff; }
.page-sidebar ul { list-style: none; }
.page-sidebar ul li {  }
.page-sidebar ul li a { width: 100%; float: left; display: block; padding: 10px 20px; }
.page-sidebar ul li a:hover { background: #000; color: #fff; }
.page-sidebar ul li.current_page_item a { background: #de1d27; color: #fff; }

/* EVENTS */
.events-table { width: 100%; }
.events-table th { text-align: left;}

/* NEWS */
.news-item { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px #ddd solid; }
.news-item h2, .news-item-single h2 { font-size: 26px; line-height: 28px; }
.news-item img, .news-item-single img { /* width: 100%; height: auto; */ margin: 10px 0; }

/* img.wp-post-image { width: 150px; height: auto; float: left; margin: 10px; padding: 10px; } */

.video { margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px #ddd solid; }
.video p { margin-top: 20px; }

.product-overzicht-item { /*width: 30%;*/ margin-right: 1%; margin-bottom: 1%; float: left; }
.product-overzicht-item img { /* width: 100%; height: auto;  */}

.product-landing-item { width: 30%; margin-right: 3%; margin-bottom: 3%; float: left; border: 1px #ddd solid; padding: 0 5%; height: 350px;  }
.product-landing-item-img { text-align: center; }
.product-landing-item-img img { height: auto; width: auto; max-height: 200px; max-width: 200px; }

.product-detail-left { width: 50%; margin-right: 5%; float: left; }
.product-detail-right { width: 45%; margin-right: 0; float: left; text-align: center; }

#copyright { margin: 20px 0; color: #555; }
#copyright img { max-width: 150px; margin-right: 10px; }

.social-icons { float: right; font-size: 24px; }
.social-icons .login { padding: 3px 5px; font-size: 12px; border-radius: 3px; color: #fff; background-color: #de1d27; border-color: #de1d27; font-weight: bold; text-transform: uppercase; margin-left: 50px; }
.social-icons img { margin-top: -3px;}
.social-icons a { color: #fff; }
.social-icons a:hover { color: #bbb; }

.tip-item { margin-bottom: 20px; box-shadow: 0 0 20px #bbb; padding: 20px; overflow: hidden; }
.tip-item img { float: right; width: auto; }

.downloads-item { padding: 5%; background: #eee; width: 90%; float: left; display: block; }
.downloads-item span { color: #000; }

.downloads-item-detail { background: #fff; padding: 20px; box-shadow: 0 0 10px #ddd; margin-bottom: 20px; overflow: hidden; }
.downloads-item-left { width: 70%; float: left; }
.downloads-item-right { width: 25%; float: right; margin-left: 5%; text-align: center; }
.downloads-item-right img { max-width: 100%; height: auto; }

@media only screen and (max-width: 991px) {

	#menu ul li a { font-size: 14px; margin: 0 6px; }

	#shortcuts .col-1-4 { width: 50% !important; margin-bottom: 20px; display: block; float: left; }

}

@media (max-width: 767px) {

	h1 { font-size: 32px; }
	h2 { font-size: 28px; }
	h3 { font-size: 20px; }

	.page-grid { margin: 0; padding: 0; }
	.page-heading { padding: 0 0 5px 0; }

	/* HAMBURGER MENU */
	#hamburger { display: block; float: right; }
	#top, #heading { padding: 10px 0; }
	#mobile-logo { width: 50%; float: left; }
	#mobile-logo img { max-width: 120px; }
	#mobile-menu { width: 50%; float: right; text-align: right; }

	/* MENU STYLING */
	#top { border-bottom: 5px #de1d27 solid; }
	#menu { display: none; padding-bottom: 30px; }
	#menu ul li { width: 100%; display: block; }
	#menu ul li a { padding: 24px 0 17px 0; margin: 0 12px; border-bottom: none; }
	#menu ul li a:hover { border-bottom: none; }
	#menu ul li.current_page_item a { color: #000; }

	#menu ul li a:hover, #menu ul li a:active, #menu ul li.current_page_item a {  }
	#menu ul .page_item_has_children ul.children {  }
	#menu ul .page_item_has_children:hover ul.children {  }
	#menu ul .page_item_has_children:hover ul.children li { margin-bottom: 0; margin-top: 0; padding: 5px 0; }
	#menu ul .page_item_has_children:hover ul.children li a { padding: 12px 0; border-bottom: none; }

	/* FIXES */
	#slider, #slider .col-1-1 { margin: 0; padding: 0; }

	#shortcuts { margin-top: 10px; }
	#shortcuts .shortcut, #shortcuts .shortcut-higlight { background: #000; color: #ddd; }
	#shortcuts .shortcut:hover, #shortcuts .shortcut-highlight:hover { color: #fff; }
	#shortcuts .shortcut .content { padding: 0 0 10px 0; width: 100%; border-bottom: 1px #555 solid; min-height: 140px !important; height: auto !important; }

    #shortcuts .col-1-4 { width: 50% !important; margin-bottom: 20px; overflow: hidden; }

	#home-columns { background: #fff; padding: 0; }
	.home-column { margin: 0; padding: 0 20px 0 0; border-bottom: 10px #000 solid !important; overflow: hidden; }

	.product-overzicht-item { width: 100%; margin-right: 0; }
	.product-landing-item { width: 100%; margin-right: 0; }

	.product-detail-left { width: 100%; margin-right: 0%; }
	.product-detail-right { width: 100%; margin-right: 0; }

	.tip-item img { float: left; width: 100%; height: auto; }

	.social-icons { float: left; }
	.social-icons a { float: left; margin-right: 5px; }
	.social-icons .login { margin-top: 5px; margin-left: 0; padding: 3px 5px; font-size: 10px; border-radius: 3px; color: #fff; background-color: #de1d27; border-color: #de1d27; font-weight: bold; text-transform: uppercase; height: 22px; line-height: 1.5; }
	.social-icons img { float: left; margin-top: 2px !important; height: 22px !important; width: 22px !important; }

	#menu ul .page_item_has_children:hover ul.children { display: block; position: static; top: 0; }

	.news-item img, .news-item-single img { width: 100%; height: auto; margin: 10px 0; }

	/* Afbeeldingen in pages aanpassen voor mobiel */
	.content img { width: 100%; height: auto; margin: 10px 0; }

}

@media (max-width: 480px) {

	#shortcuts .col-1-4 { width: 100% !important; margin-bottom: 20px; }

}
@media only screen and (min-device-width: 320px)
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait)
{
	.home-heading { font-style: normal; font-family: 'Roboto', Arial, Verdana, sans-serif; font-size: 12px !important; }
}
@media only screen and (max-width: 960px) {

	.shortcut { font-size: 14px; line-height: 1.3em; }

}

img.alignright { float: right; margin: 0 0 1em 1em; }
img.alignleft { float: left; margin: 0 1em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.medium { width: 100% !important; }
.medium:focus { box-shadow: 0 0 10px #ddd; }