/*
Theme Name: 
Theme URI: 
Author: Mark van der Meij
Author URI: 
Description: 
Version: 1.0
*/

/* Reset style */
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }
html { overflow-y: scroll }
body { line-height: 1 }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:after, blockquote:before, q:after, q:before { content: ''; content: none }
table { border-collapse: collapse; border-spacing: 0 }

@font-face { font-family: 'assets/fonts/texgyreadventorregular'; src: url('assets/fonts/texgyreadventor-regular-webfont.woff2') format('woff2'), url('assets/fonts/texgyreadventor-regular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'assets/fonts/texgyreadventorbold'; src: url('assets/fonts/texgyreadventor-bold-webfont.woff2') format('woff2'), url('assets/fonts/texgyreadventor-bold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }

body { font-family: 'arial'; color: #6f6f6f; }
h1, h2, h3, h4, h5 { font-family: 'assets/fonts/texgyreadventorbold'; }h3 { font-size: 15px; line-height: 1.5em; color: #6f6f6f; }
h1 { font-size: 32px; line-height: 1.5; color: #005dab; letter-spacing: 0.3px; }
h2 { font-size: 18px; line-height: 1.5em; color: #005dab; }
h3 { font-size: 15px; line-height: 1.5em; color: #6f6f6f; }
h4 { color: #005dab; font-size: 14px; letter-spacing: 0.5px; }
h5 { font-size: 12.5px; letter-spacing: 0.5px; }
p { font-size: 14px; margin-top: 15px; line-height: 1.5; }
p a, p a:visited { font-weight: bold; color: #005dab; }
p a:hover { }
a { text-decoration: none; }
p em { }
p strong { }
p + form { margin-top: 20px; }
.text-bigger { font-size: 1.1em; }
ol { counter-reset: section; }
ul li, ol li { }
img { }
img + p { }
a, a:visited { color: inherit; }
.btn { cursor: pointer; }

/* De paragraph na een img een aparte marge geven */
blockquote { }
blockquote:before { content: 'â€œ'; }
aside { }
aside h3, aside p { }

.md-order-5 { order: 2; }
.clr { clear: both; }
.hamburger { display: none; }

.button { padding: 7px 30px 7px 15px; font-family: 'assets/fonts/texgyreadventorregular'; position: relative; cursor: pointer; }
.button:hover { text-decoration: none; }
.button:after { content: "\f105"; font: normal normal normal 17px FontAwesome; position: absolute; top: 11px; right: 15px; transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease; }
.button:hover:after { right: 12px; }
.button.blue { background: #005dab; color: white; }
.btn-primary { color: #fff !important; }

#header { position: fixed; z-index: 900; top: 0; width: 100%; padding: 12px 0; background: white; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); }
#header .topLinks { margin-bottom: 35px; }
#header .topLinks ul { float: right; }
#header .topLinks ul li { float: left; list-style: none; margin-left: 20px; position: relative; }
#header .topLinks ul li a { font-family: 'assets/fonts/texgyreadventorregular'; color: #6f6f6f; font-size: 12px; }
#header .topLinks ul li a:hover { color: #6f6f6f; }
#header .topLinks ul li.hasSubmenu ul { overflow: hidden; max-height: 0; transition: 450ms ease; -webkit-transition: 450ms ease; -moz-transition: 450ms ease; position: absolute; right: 0; top: 23px; margin-left: 0; z-index: 999; }
#header .topLinks ul li.hasSubmenu:hover ul { max-height: 100px; }
#header .topLinks ul li.hasSubmenu ul li { padding: 6px; margin: 0; background: #dde4ec; width: 100%; }
#header .topLinks ul li.hasSubmenu ul li a { display: block; }

#header .navigation { }
#header .navigation ul { display: inline-block; padding-top: 4px; }
#header .navigation ul li { float: left; margin: 0 15px; }
#header .navigation ul li:first-of-type { margin-left: 0; }
#header .navigation ul li a { font-family: 'assets/fonts/texgyreadventorbold'; color: #6f6f6f; font-size: 17px; transition: color 300ms ease; -webkit-transition: color 300ms ease; -moz-transition: color 300ms ease; }
#header .navigation ul li a:hover { text-decoration: none; color: #005dab; }
#header .navigation ul li.active a { color: #005dab; }

#header .searchInput { background: #a8b9c4; display: inline-block; padding: 3px; float: right; }
#header .searchInput input[type="search"] { border: none; background: transparent; color: white; font-size: 12px; padding: 3px; max-width: 100px; outline: none; }
#header .searchInput button { background: none; border: none; position: relative; color: white; cursor: pointer; }
#header .searchInput ::-webkit-input-placeholder { color: white; }
#header .searchInput ::-moz-placeholder { color: white; }
#header .searchInput :-ms-input-placeholder { color: white; }
#header .searchInput :-moz-placeholder { color: white; }

#breadcrumbs { font-size: 11px; padding: 20px; }
#breadcrumbs a { color: #6f6f6f; }
#breadcrumbs span span span:last-child a { font-weight: bold; }

#content { background: url('assets/img/fishing.jpg') no-repeat bottom left #fafafa; margin-top: 103px; }

#homeslider { background: #cfd9e2; height: 446px; width: 100%; }

#Heiploegcarousel { height: 100%; }
#Heiploegcarousel h2 { font-size: 30px; line-height: 1.5; color: #005dab; letter-spacing: 0.3px; font-family: 'assets/fonts/texgyreadventorregular'; padding-bottom: 60px; margin-top: 82px; }
#Heiploegcarousel .button { border: 4px solid rgb(224, 239, 255); }
#Heiploegcarousel .carousel-item { height: 446px; background-position: center center; }
#Heiploegcarousel .carousel-indicators li { width: 20px; height: 20px; background-color: #7195d9; border: solid 4px white; cursor: pointer; transition: 600ms ease; -webkit-transition: 600ms ease; -moz-transition: 600ms ease; }
#Heiploegcarousel .carousel-indicators li.active { background-color: #005dab; }
#Heiploegcarousel .carousel-control-next, #Heiploegcarousel .carousel-control-prev { height: 100px; width: 50px; background-color: #fff; color: #000; top: calc( 50% - 50px); }
#Heiploegcarousel .carousel-control-next { background: url(assets/img/arrow-right.png) center center no-repeat rgba(255,255,255,.5); }
#Heiploegcarousel .carousel-control-prev { background: url(assets/img/arrow-left.png) center center no-repeat rgba(255,255,255,.5); }
#Heiploegcarousel .carousel-indicators { position: relative; margin: 0; justify-content: left; bottom: 35px; }

#contentArea { padding: 0 0 45px 0; min-height: calc( 100vh - 358px); }
#contentArea.home, #contentArea.edit { padding: 45px 0; }

.subPage { background: white; }

.sidebar { padding: 15px; }
.sidebar .sideMenu { }
.sidebar .sideMenu li { padding: 15px 5px; }
.sidebar .sideMenu li a { display: block; font-weight: bold; color: #6f6f6f; font-size: 14px; font-family: 'assets/fonts/texgyreadventorbold'; }
.sidebar .sideMenu li a:hover { color: #005dab; text-decoration: none; }
.sidebar .sideMenu li.active a { color: #005dab; }
.sidebar .sideMenu .submenu { margin-left: 5px; display: none; }
.sidebar .sideMenu .active .submenu { display: block; }
.sidebar .sideMenu .submenu li a { font-size: 0.8em; }
.sidebar .sideMenu .active li a { color: #6f6f6f; }
.sidebar .sideMenu .active li a:hover { color: #005dab; }
.sidebar .sideMenu .submenu li:first-child { padding-top: 30px; }
.sidebar .sideMenu .submenu li:last-child { padding-bottom: 0; }

.content { border-left: 7px solid #f8f8f8; padding: 30px; font-size: 14px; line-height: 1.5; }
.content ul { padding-left: 20px; list-style: inherit; }
.content ol { padding-left: 7px; }
.content ol li:before { counter-increment: section; content: counters(section, ".") "."; padding-right: 7px; }
.content h2, .content h3 { margin-top: 15px; }
.content h2 + p, .content h3 + p { margin-top: 5px; }

.banner { background: #adcdf1; color: #005dab; padding: 30px 40px; font-size: 17px; margin-top: 45px; }
.banner span { font-size: 25px; font-family: Arial Narrow; font-weight: bold; }
.banner .buttonholder { text-align: right; }
.banner .button { display: inline-block; }
.banner .button:after { top: 8px; }

.visualLinks { }
.visualLink { margin-top: 30px; background: white; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.15); position: relative; cursor: pointer; }
.visualLink:after { content: "\f105"; font: normal normal normal 17px FontAwesome; position: absolute; right: 10px; bottom: 10px; color: #6f6f6f; }
.visualLink .vlImage { height: 160px; overflow: hidden; position: relative; }
.visualLink .vlImage .vlRead { position: absolute; text-align: center; background: rgba(255, 255, 255, 0.5); height: 100%; width: 100%; line-height: 160px; overflow: hidden; max-height: 0; transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease; }
.visualLink:hover .vlImage .vlRead { max-height: 160px; }
.visualLink .vlImage img { height: auto; width: auto; min-height: 100%; min-width: 100%; transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease; }
.visualLink .vlContent { padding: 20px 15px; font-family: 'assets/fonts/texgyreadventorregular'; color: #6f6f6f; font-size: 13px; line-height: 1.5; min-height: 99px; }

.fields { background: #ebebeb; padding: 20px; }
.fieldHolder { width: 100%; }
.fieldHolder .caption { display: inline-block; width: 150px; float: left; height: 100%; }
.fieldHolder .field { display: inline-block; width: calc(100% - 150px); float: left; margin: 3px 0; }
.fieldHolder .field span { display: block; }
.fieldHolder .field input, .fieldHolder .field textarea { width: 50%; }
.fieldHolder .field input[type="radio"], .fieldHolder .field input[type="checkbox"] { width: inherit; }
.fieldHolder .field input[type="submit"] { border: none; }
.fieldHolder .field label { margin-left: 10px; }

#footer { font-family: 'assets/fonts/texgyreadventorregular'; padding: 25px 0; }
#footer .about { line-height: 1.5; padding-bottom: 10px; padding-left: 78px; background: url('assets/img/ppgroup_logo.png') no-repeat left top white; }
#footer p { font-size: 12px; }
#footer .links { padding-top: 10px; margin-left: 78px; font-size: 12px; border-top: solid 1px #d2d2d2; line-height: 1.5; }
#footer .links .copyright a { color: #6f6f6f; margin-left: 6px; }
#footer .links .copyright a:hover { color: #6f6f6f; }
#footer .links .copyright a:before { content: ""; border-left: solid 1px #d2d2d2; margin-right: 10px; color: #d2d2d2; }
#footer .links .copyright a:hover:before { text-decoration: none; }
#footer .links .credits { padding-top: 10px; display: inline-block; }
#footer .links .credits a { color: #6f6f6f; }
#footer .logos a { margin-left: 30px; }

.dnnSortable { width: auto; }
.DNNEmptyPane { padding: 0 !important; height: 0 !important; min-height: 0; }

/* product module ------------------------------------------------------------------------------------  */
.categories { border-bottom: solid 2px #005dab;}
.categories div { padding: 0 5px;}
.categories div a { font-family: 'assets/fonts/texgyreadventorbold'; font-size: 17px; line-height: 1.3em; display: block; background: #fff; color: #005dab; padding: 14px 19px 19px; height: 100%; min-height: 81px; text-decoration: none; transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease; }
.categories div a:hover { background: #f2f4f7; }
.categories div a.active { background: #005dab; color: #fff; }
.categories div:last-child {}


.azProductFilterHolder{ background: #fff; padding: 20px 20px 0 20px;}
.azProductHolder{padding: 0 5px;}

.filter { background: #a8b9c4; display: block; padding: 13px 25px; margin-bottom: 20px;}
.filter li { display: inline-block; }
.filter li.title { font-size: 14pt; margin-right: 25px;  color: #fff;  font-family: 'assets/fonts/texgyreadventorbold';}
.filter li a { display: block; margin-right: 17px; color: #fff; font-size: 14px;}

.product-item { height: 220px; margin-bottom: 20px; padding: 0 10px;}
.product-item a { display: block; width: 100%; height: 100%; background: no-repeat center center; background-size: cover; position: relative;}
.product-item a .name{ position: absolute; background: rgba(0, 93, 171, 0.5); color: #fff; bottom: 0; width: 100%; padding: 14px; font-size: 18px; line-height: 1.3em; min-height: 74px;  font-family: 'assets/fonts/texgyreadventorbold';}
.product-item img { display: none; }

.product-detail{ padding-top: 45px; background: white;  font-family: 'assets/fonts/texgyreadventorregular';}
.product-detail h1{ margin-bottom: 20px; font-size: 28px;}
.product-detail hr{ border-color: #005dab;}
.product-detail .impression { width: 100%; position: relative; }
.product-detail .impression .icons-lb { position: absolute; left: 0; bottom: 0; padding: 10px; }
.product-detail .impression .icons-lb img{ margin-right: 5px; }
.product-detail .impression .icons-rt { position: absolute; right: 0; top: 0; width: 70px; }
.product-detail .impression .icons-rt img { width: 100%; margin-bottom: 5px; }
.product-detail .impression .picture img { width: 100%; }
.product-detail .impression .picture img.split { width: calc( 50% - 40px); margin-right: 5px; }

.product-detail .productDesc{padding: 30px 0 40px; }
.product-detail .productDesc .description{float: left; width: calc(100% - 145px);}
.product-detail .productDesc .description p:nth-child(1){ margin-top: 0; }

.product-detail .logos{ padding-bottom: 40px; }
.product-detail .logos img{ margin-right: 10px; }

.pdf .bttn{ float: right; font-size: 14px; color: white; background: url('assets/img/bgBtnDownload.png') no-repeat top left #005dab; display: inline-block; padding: 10px 10px 10px 33px; line-height: 1.3;  transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease;}
.pdf .bttn:hover{ text-decoration: none; background-color: #04355f;}
.pdf .bttn span{color: #92a7c3; display: block;}

.productpropertiesHolder{padding-bottom: 30px;}
.productpropertiesHolder:last-child{padding-bottom: 15px;}
.productpropertiesHolder h2{display: block; border-bottom: 1px solid #005dab; padding-bottom: 10px; font-size: 20px;}
.propHolder{display: block; padding: 10px 0; font-size: 10.4pt; line-height: 1.4;}
.propName{ color: #005dab; min-width: 220px; display: inline-block; vertical-align: top; font-family: 'assets/fonts/texgyreadventorbold';}
.propValue{ display: inline-block; width: calc( 100% - 230px);}

.species-products, .similar-products{ padding-bottom: 15px; }
.species-products h3, .similar-products h3{color: #005dab; margin: 20px 0;}
.species-products .speciesHolder, .similar-products .speciesHolder{ display: block; margin-bottom: 20px; background: url('assets/img/arrowGold.gif') no-repeat right center;}
.species-products .speciesHolder .image, .similar-products .speciesHolder .image{ width: 95px; float: left; margin-right: 20px;}
.species-products .speciesHolder .image img, .similar-products .speciesHolder .image img{ width: 100%;}
.species-products .speciesHolder .title, , .similar-products .speciesHolder .title{ margin-top: 10px; float: left; width: calc( 100% - 120px); height: auto;}
.species-products .button, .similar-products .button{ font-size: 13px; }

.locationWorld{ height: 655px; width: 100%; background: url('assets/img/heiploeg-world.png') center center no-repeat; background-size: cover;}



@media (min-width: 1200px) {
    .container { max-width: 960px; }
}

@media (max-width: 991px) {
    #header .navigation ul li { margin: 0 11px; }
    #header .navigation ul li:last-of-type { margin-right: 0; }
    #header .navigation ul li a { font-size: 15px; }
    #header .searchInput { display: none; }
    .fieldHolder .field input, .fieldHolder .field textarea { width: 100%; }
}

@media (max-width: 767px) {
    #header .topLinks { position: absolute; top: -80px; right: 0; }
    #header .navigation ul { padding-top: 17px; }

    .md-order-5 { order: -1; }
    #content { margin-top: 141px; }
    .content { border-bottom: 7px solid #f8f8f8; border-left: 0; }

    #footer .logos { text-align: center; margin: 20px 0 40px; }

    .categories div a{ padding: 9px 19px 9px; min-height: inherit;} 
}

@media (max-width: 575px) {
    .hamburger { display: block; right: 15px; position: absolute; top: 28px; }
    .hamburger:focus { outline: none; }

    #header .naviholder { position: absolute; top: 103px; background: white; right: -100%; padding: 25px; -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.15); transition: 300ms ease; -webkit-transition: 300ms ease; -moz-transition: 300ms ease; }
    #header .naviholder.is-active { right: -30%; }
    #header .topLinks { display: none; margin-bottom: 0; position: relative; top: 0; left: 0; }
    #header .topLinks ul { float: none }
    #header .topLinks ul li { float: none; margin: 0; padding: 7px 0; }
    #header .navigation ul { padding-top: 0; }
    #header .navigation ul li { margin: 0px; float: none; padding: 7px 0; }
    #header .navigation ul li a { }
    
    #content { margin-top: 103px; }

    .fieldHolder .field, .fieldHolder .caption { width: 100%; }

    .pdf .bttn{ float: none; margin-top: 20px; margin-left: 14px; }
    .product-detail .productDesc .description{ width: 100%; }
    .propValue{ width: 100% ;}
}
