/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/
/******************************************
blauw         = 007AC2
donker blauw  = 00223E
oranje        = FF6F00
donker oranje = B24D00
******************************************/

/*****************************************/
/* algemene aanpassingen                 */
/*****************************************/

@import url('https://fonts.googleapis.com/css2?family=Asap+Condensed:wght@200;300;400;500;600;700;900&display=swap');

/* Padding voor alle HubSpot rijen met max-width-section-centering */
[class*="-max-width-section-centering"]:not(
.blog_header-row-0-max-width-section-centering,
.site_footer-row-1-max-width-section-centering,
.site_footer-row-0-hidden) { padding-left: 30px; padding-right: 30px; }



.site_footer-row-0-background-layers a { color:rgba(255,255,255,.75); font-size:14px; text-decoration: none; }
.site_footer-row-0-background-layers a:hover { color:#fff; }

.footeronderbalk a { color:rgba(255,255,255,.5); font-size:14px; text-decoration: none; }
.footeronderbalk a:hover { color:rgba(255,255,255,1.0); }

/* Algemene tekstlinks effect */
.sr-blog-post p > a:not(.hs-button), .body_dnd_area p > a:not(.hs-button) {
  padding: 0 2px; font-weight: 600; color: #007ac2; text-decoration: none;
  background: linear-gradient(to left, #333, #007ac2, #007ac2)
              no-repeat calc(200% - var(--p, 0%)) 100% / 200% var(--p, 1px);
  transition:
    color 0.3s var(--t, 0s), background-position 0.3s calc(0.3s - var(--t, 0s)), background-size 0.3s var(--t, 0s); }
.sr-blog-post p > a:not(.hs-button):hover, .body_dnd_area p > a:not(.hs-button):hover { --p: 100%; --t: 0.3s; color: #fff; text-decoration: none; }



.hs-search-highlight { animation: pulseColor 2.5s ease-in-out infinite; }
@keyframes pulseColor { 0%   { color: #007ac2; } 50%  { color: #333; } 100% { color: #007ac2; } }



.hs-search-results__pagination__link--first, .hs-search-results__pagination__link--last { display:none; }
.hs-search-results__pagination__link--active { border-radius: 25px; }
.hs-search-results__pagination__link--number { padding: 3px 13px; }



h1, h2, h3, h4, h5, h6 { letter-spacing: -0.3px; line-height: 1.2em; }
.icn-supertitel { color:#666; font-size: 22px; font-weight: 200; text-transform: uppercase; margin: 0 0 10px 0; padding: 0; }
.mini-button-RS { color:#333; background-color:#ccc; padding:0 10px; border-radius: 15px; }
.mini-button-RS:hover { color:#fff; background-color:#007ac2; }
.mini-button-RS-autocad { color:#fff; background-color:#cc0201; }
.mini-button-RS-inventor { background-color:#f1c223; }
.mini-button-RS-revit { color:#fff; background-color:#007ac2; }
.mini-button-RS-fusion { color:#fff; background-color:#ff6f00; }
.mini-button-RS-autocad:hover, .mini-button-RS-inventor:hover, .mini-button-RS-revit:hover, .mini-button-RS-fusion:hover { color:#333; background-color:#ccc; }

/* ul { list-style-position: outside; padding-left: 22px !important; }
ul li { list-style-position: outside; padding:0 0 5px 0px !important; }
ul li::marker { color:#007ac2; font-weight: 700; font-size: 21px; line-height: 1; transform: translateY(2px); } */

:not(.hs-form) > ul,
:not(.hs-form) ul {
    list-style-position: outside; padding-left: 22px !important; }

/* Alle li's buiten .hs-form */
:not(.hs-form) > ul li,
:not(.hs-form) ul li {
    list-style-position: outside; padding: 0 0 5px 0 !important; }

/* Markers buiten .hs-form */
:not(.hs-form) > ul li::marker,
:not(.hs-form) ul li::marker {
    color: #007ac2; font-weight: 700; font-size: 21px; line-height: 1; transform: translateY(2px); }


ol { list-style: decimal; list-style-position: outside; margin: 0 0 0 0 !important; padding: 0 0 0 22px !important; }
ol li { margin: 0 0 5px 0 !important; padding: 0 0 0 10px !important; text-indent: 0; list-style-position: outside; }
ol li::marker { color: #007ac2; font-weight: 700; line-height: 1; }
ol li::before { content: none !important; display: none !important; }

ul li p, ol li p { margin: 0; }

/* tabellen */
table { width: 100%; border: 1px solid #eee; }
th, td { padding: 10px 20px 10px 20px !important; text-align: left; vertical-align: top; }
th { color:#fff !important; }
tr:nth-child(even) {background-color: rgba(0, 0, 0, 0.04);}
tr:hover {background-color: rgba(0, 0, 0, 0.02);}
table tr th, table thead tr th { color:#fff; background: #007ac2; }

.tableopmaak { width: 100%; border: 0px solid #eee; }
.tableopmaak td { padding: 0px 0px 0px 0px !important; text-align: left; vertical-align: top; }
.tableopmaak tr:nth-child(even) {background-color: #fff;}
.tableopmaak tr:hover {background-color: #fff !important;}

a[target="_blank"]
  :not(:has(img.hs-image-social-sharing-24))
  :not(:has(.hs-social-follow__icon))
  ::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: 0;
  background-image: url("https://20171138.fs1.hubspotusercontent-na1.net/hubfs/20171138/ICN%20website%20RS/icon-url-blankpage.png");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: top;
}

/* Parallax achtergrond alle */
.body_dnd_area-row-2-background-layers,.body_dnd_area-row-3-background-layers,.body_dnd_area-row-4-background-layers,.body_dnd_area-row-5-background-layers,
.body_dnd_area-row-6-background-layers,.body_dnd_area-row-7-background-layers,.body_dnd_area-row-8-background-layers,.body_dnd_area-row-9-background-layers,
.body_dnd_area-row-10-background-layers,.body_dnd_area-row-11-background-layers,.body_dnd_area-row-12-background-layers
{ background-attachment: fixed; background-size: cover; background-position: center; }

@media (min-width: 769px) {
  .hs-image-widget { margin-top: 8px; }
}
@media (max-width: 768px) {
  .hs-image-widget {
    width: 100vw; max-width: none; height: auto; display: block; margin-left: 50%; transform: translateX(-50%); margin-bottom:20px; }
}

.error-page .cta_button { 
  background-color: #007ac2;
  border: 2px solid #00223e;
  color: #fff;
  border-radius: 40px;
  font-family: Asap Condensed;
  font-size: 20px;
  font-weight: 600;
  margin: 10px 0;
  padding: 4px 24px 6px;
  text-decoration: none;
  transition: all .3s ease 0s;
}
.error-page .cta_button:hover { background-color: #00223e; border-color: #007ac2; color: #fff; }
/* 404 tekst */
.error-page:before { color: rgba(0, 0, 0, 0.04); font-size: 320px; font-family: Asap Condensed; font-weight: 700; }



/*****************************************/
/* Hubspot formulier aanpassingen        */
/*****************************************/

form { gap: 0; }
.hbspt-form form { width: 100%; font-size:14px; }
.hbspt-form label, .hbspt-form p, .hs-custom-form label { font-size: 14px; padding: 0 0px 4px 20px; }
.hs-custom-form p { font-size: 14px; padding: 0 0px 4px 0px; }
.hbspt-form a, .hs-custom-form a { color: #a4c1c5; font-weight: 600; }
.hs-form-required, .hs-custom-form .hs-form-required { color: #740a98!important; }
input[type=checkbox], input[type=radio] { margin: 7px 20px 0px 0px; min-height: 38px; }

.hs-input:not([type='checkbox']):not([type='radio']) { width:100% !important; }
input.hs-input.error, div.field.error input, div.field.error textarea, div.field.error .chzn-choices, textarea.hs-input.error, select.hs-input.error 
  { border: 1px solid #f00 !important; }
.hs-input option { color: #444; background-color: #fff; }
.hs-error-msg { color:#f00 !important; }
.hbspt-form ul, .hs-custom-form ul { list-style-type: none; margin: 5px 0 0 0; padding: 0px !important; }
.hbspt-form ul li, .hs-custom-form ul li { margin: 0px; padding: 0px !important; }
.field { margin: 0 0 10px; }
.legal-consent-container .field.hs-form-field { margin-bottom: 8px; }
.legal-consent-container .hs-form-booleancheckbox-display>span { margin-left: 0px !important; }
.legal-consent-container~.hs_recaptcha { margin-top: 0px !important; }
.hs-form-booleancheckbox-display { padding: 0px 0px 0px 0px !important; }
.hs_recaptcha { height: 0px; display: none; }
.hbspt-form textarea, .hs-custom-form textarea { height: 170px; }

.hbspt-form .hs_submit .hs-button, .hs-custom-form .hs-button { 
    font-size:20px; font-family: Asap Condensed; font-weight: 600; text-decoration: none;
    color: #fff; background-color: #007ac2 !important;
    display: inline-block; padding: 4px 24px 6px !important; margin: 20px 0 0px 0 !important; 
    border: 2px solid !important; border-color: #00223e !important; border-radius: 25px; transition: all 300ms ease 0ms;
}
.hbspt-form .hs_submit .hs-button:hover, .hs-custom-form .hs-button:hover { color: #FFFFFF; background-color: #00223e !important; border-color: #007ac2 !important; }
fieldset { max-width:100% !important; }
fieldset.form-columns-2 .hs-form-field:first-child .input { margin-right: 20px !important; }
form fieldset>div .input { margin: 0 10px 0 0 !important; }
.hs-fieldtype-select {  }
.fn-date-picker .pika-lendar { width: 420px !important; }

/* Radioknop labels uitlijning */
.hs-form-radio-display { display: flex; align-items: flex-start; gap: 0px; margin-bottom: 12px; }
.hs-form-radio-display span { display: inline-block; line-height: 1.5; }
label { display: block; margin-bottom: 0px; }

@media (max-width: 1200px) and (min-width: 992px) {
  .header__bottom .container { max-width: 1160px; padding-left: 25px; padding-right: 30px; }
  .header__menu--desktop:not(.header__menu--top) .header__menu-item--depth-1>.header__menu-link { padding: 0 3px; }
}
input:focus { outline-offset: -2px; }

.hbspt-form input, .hbspt-form select, .hbspt-form textarea, .hs-custom-form input, .hs-custom-form select, .hs-custom-form textarea 
  { padding:10px 20px !important; border: 0 !important; border-radius: 25px; border: 1px solid #007ac2 !important; background-color:rgba(0,0,0,.075) !important; min-height:auto; line-height:inherit; }
.hbspt-form input[type=checkbox], .hbspt-form input[type=radio], .hs-custom-form input[type=checkbox], .hs-custom-form input[type=radio] { width:auto; vertical-align:top; }
.form-control, input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=submit]), input[readonly]:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=submit]), select, textarea {
    border: 2px solid #007ac2; border-radius: 25px; color: #333; font-family: Open Sans; font-size: 16px; min-height: 42px; }

.hs-search-field__button { border-radius: 25px; padding: 7px 17px 10px; margin-left: 10px; background-color:#fff; border: 2px solid #007ac2 !important; }
.hs-search-field__button:hover { background-color:#007ac2; border: 2px solid #00223e !important; }
.hs-search-results ul.hs-search-results__listing { padding-left: 0px !important; }
.hs-fieldtype-select.hs-form-field .input { flex-direction: column; }
fieldset { gap: 20px; }
@media only screen and (min-width: 992px) { .form-columns-2>.hs-dependent-field, .form-columns-2>.hs-form-field { max-width: calc(50% - 10px); } }




.hs-button {
    font-size:20px; font-family: Asap Condensed; font-weight: 600; text-decoration: none;
    color: #007ac2; background-color: rgba(255, 255, 255, 0.5);
    display: inline-block; padding: 4px 24px 6px; margin: 10px 0 10px 0; 
    border: 2px solid; border-color: #007ac2; border-radius: 40px; transition: all 300ms ease 0ms;
}
.hs-button:hover { color: #FFFFFF; background-color: #007ac2; border-color: #00223e; }
.hs-button-oranje { color: #fff; background-color: #FF6F00; border: 2px solid; border-color: #B24D00; }
.hs-button-oranje:hover { color: #fff; background-color: #B24D00; border-color: #FF6F00; }
.hs-button-blauw { color: #fff; background-color: #007AC2; border: 2px solid; border-color: #00223E; }
.hs-button-blauw:hover { color: #fff; background-color: #00223E; border-color: #007AC2; }



/* Navigatie balk achtergrondafbeelding */
.header_styles {
  background-color: rgba(255, 255, 255, 0.5) !important;
  backdrop-filter: blur(5px);
/*   background-image: url('https://portal-icn.nl/hubfs/ICN-logobalk.png') !important; */
  background-image: url('/hubfs/ICN-logobalk.png') !important;
  background-position: 0px 28px !important;
  background-size: 100% 71px !important;
  background-repeat: no-repeat !important;
  height:71px;
  padding:0 !important;
}

.header__menu { margin-top: -33px; }
.header__menu-item--depth-1[data-mega="true"] .header__menu-submenu--level-2{ top: 69px; }
.header__container:not([data-layout=mobile]) .header__menu-item[data-mega=true] .header__menu-submenu { width: 626px; left: 40%; }
.header__menu-submenu .header__menu-item { width: 300px; background-color: transparent; }
.header__menu-link-span { background-color: transparent;  }
.header__menu-submenu { background-color: transparent; }
.header__menu-submenu .header__menu-link { padding: 0 10px !important; }
.header__container:not([data-layout=mobile]) .header__menu-item[data-mega=true] .header__menu-submenu--level-3 { background-color: transparent !important; }
.header__menu-submenu { border-radius: 0 0 20px 20px; overflow: hidden; }

.header__bottom .hs-search-field, .header__bottom .hs-search-field__button, .header__bottom .header__search-col { width:35px !important; height:35px !important; }
.header__bottom .header__search-col { margin-top:-39px; }
.header__bottom .hs-search-field__button { min-height:35px !important; border: 2px solid !important; border-color: #00223e !important; border-radius: 30px !important; }
.header__bottom .hs-search-field__button:hover { color:#fff !important; border-color: #fff !important; background-color:#007ac2 !important; }
.header__bottom .hs-search-field__desktop .hs-search-field__input  { width:350px !important; min-height: 35px !important; height:35px !important; border-radius: 30px !important;  }

/* ---------- Icons in navigatie ---------- */
.header__menu-item--depth-3 .header__menu-link { display: inline-flex; align-items: center; }
.header__menu-item--depth-3 .header__menu-link .header__menu-link-span { display: inline-flex; align-items: center; gap: 8px; }
.header__menu-item--depth-3 .header__menu-link .header__menu-link-span::before {
  content: ""; display: inline-block; width: 22px; height: 22px; flex: 0 0 22px;
  background-repeat: no-repeat; background-position: center; background-size: 22px 22px; transform: translateY(1px); background-image: var(--icon);
}
/* ---------- Icons in navigatie ICN Software ---------- */
.header__menu-item--depth-3 .header__menu-link[href*="/projectbox-voor-revit/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/RevitProjectBox.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/iflow/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/ICN%20website%20RS/iFlow.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/3b-tools-voor-revit/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/3btools.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/3b-view/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/3bview.png"); }
/* ---------- Icons in navigatie Autodesk ---------- */
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-software-offerte-aanvraag/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/autodesk.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-aec-collection/"] .header__menu-link-span            { --icon: url("/hs-fs/hubfs/20171138/aeccollection.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-pdm-collection/"] .header__menu-link-span            { --icon: url("/hs-fs/hubfs/20171138/pdmcollection.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/forma-design-collaboration/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/autodesk.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/forma-industry-cloud/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/autodesk.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-autocad-lt/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/autocadlt.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-autocad/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/autocad.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-revit-lt/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/revitlt.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-revit/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/revit.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/navisworks/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/navisworks.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-inventor/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/inventor.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-fusion/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/fusion.png"); }
.header__menu-item--depth-3 .header__menu-link[href*="/autodesk-vault/"] .header__menu-link-span { --icon: url("/hs-fs/hubfs/20171138/vault.png"); }

.header__menu-container--mobile { position: relative; top: -22px; }
.header__menu-toggle svg rect { fill: white !important; }
.header__menu-toggle--open svg rect { fill: white !important; }
.header__menu--mobile { margin-top: 30px; }

.header__menu-container--mobile .header__menu-link-span { font-size: 22px !important; color: #333 !important; }
.header__menu-container--mobile .header__menu-link-span:hover { color: #007ac2 !important; }

#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1 > .header__menu-link:active,
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1.header__menu-link--active-link > .header__menu-link { color: #007ac2 !important; }
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1 .header__menu-child-toggle,
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1 .header__menu-child-toggle path { color: #fff !important; fill: #007ac2 !important; }

#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1 > .header__menu-link:hover, 
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1.header__menu-link--active-link > .header__menu-link:hover { color: #000 !important; }
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1:hover .header__menu-child-toggle,
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-1:hover .header__menu-child-toggle path { color: #0f0 !important; fill: #000 !important; }

#hs_cos_wrapper_site_header-module-2 .header__container[data-layout="mobile"] .header__menu-item--open>.header__menu-submenu { top: 0px; }

#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-2 { padding: 0 !important; }
#hs_cos_wrapper_site_header-module-2 .header__menu-container--mobile .header__menu-item--depth-3 { padding: 0 !important; }

#hs_cos_wrapper_site_header-module-2 .header__menu--mobile .hs-search-field { height: 60px !important; width: 100% !important; }
#hs_cos_wrapper_site_header-module-2 .header__menu--mobile .hs-search-field__button { height: 46px !important; width: 46px !important; padding:16px; }
.hs-search-field__mobile input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=submit]) { padding-left: 68px; }
#hs_cos_wrapper_site_header-module-2 .hs-search-field__input { background: #EEEEEE; border-radius: 24px; }
.form-control-sm, .form-wrapper-sm input:not([type=radio]):not([type=checkbox]):not([type=file]):not([type=submit]) { font-size: 16px; min-height: 46px; }

.header__menu--mobile { border-top: 0px solid #fff; height: 100vh; left: 0; right: 0; width: 100%; overflow: hidden; }

.header__menu--desktop .header__menu-submenu { border: 2px solid #007AC2; border-width: 2px 0 0 0 !important; }
.header__container .header__menu-submenu .header__menu-item:hover { background-color: transparent !important; }
#hs_cos_wrapper_site_header-module-2 .header__container .header__menu-submenu .header__menu-item:hover { background-color: transparent !important; }


.sidebar-wrapper { display: flex; flex-direction: column-reverse; }
.sidebar-menu { padding-top: 0px; padding-bottom: 25px; }
.sidebar-menu.tags ul { display: flex; flex-direction: column; }
.sidebar-menu ul { padding-left: 0 !important; }

.sidebar-menu.tags ul li a { 
  line-height: 1.2; color: #007ac2; background-color: transparent; border: 0px solid #fff; display: block; font-size: 16px; padding: 0px; text-decoration: none; transition: background 0s ease-out, color 0s ease-out, border-color 0s ease-out; }
.sidebar-menu.tags ul li a:hover { background-color: transparent !important; border-color: transparent; color: #84d0f5; text-decoration: none; }
.sidebar-menu.tags ul li a.active { font-weight: 600; background: transparent !important; border-color: transparent; color: #84d0f5; text-decoration: none; }


/* Blog pagina instellingen */
.header__logo-col { margin:0 !important; }
.blog-listing .blog-middle { margin-top: 21px; }
.sr-blog-post { margin-top: 0px; }

.site_footer-row-0-background-layers {
    background: linear-gradient(180deg,rgba(0, 34, 62, 1) 0%, rgba(0, 34, 62, 1) 60%, rgba(0, 78, 128, 1) 100%) !important;
    background-position: left top !important; background-size: auto !important; background-repeat: no-repeat !important;
}
.site_footer-row-0-background-layers p { margin-bottom:0 }


/* afstand kopjes in footer bij kleine schermen */
@media (max-width: 767px) { .site_footer-row-0-background-layers h3 { margin-top: 17px !important; }}
/* hover en focus social icons footer */
.hs_cos_wrapper_widget .hs-social-follow .hs-social-follow__link:hover { background-color: #00223e !important; }
.hs_cos_wrapper_widget .hs-social-follow .hs-social-follow__link:focus { background-color: #009fe3 !important; }
/* styling social sharing icons bij blogposts RS_social_sharing module */
.social-sharing { text-align: right; margin: -3px 0 20px 0; }
.hs-image-social-sharing-24:hover { border: 2px solid #00223e !important; }
.widget-type-social_sharing img { height: 24px !important; width: 24px !important; margin-right:5px; border-radius: 20px !important; }
.widget-type-social_sharing img:hover { border: 2px solid #00223e !important; }


.bloghero-h1 { padding-top: 100px; }
.featured-image-hero { 
  background-image: url(/hubfs/banner-bg5.png) !important;
  background-position: center center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
}

/* softe overgang schaduw header */
.header__container .header__bottom { transition: background 0.5s ease-in-out, box-shadow 0.5s ease-in-out; }

/* Globale zijmarges voor alle standaard breakpoints */
@media (min-width: 1200px) { .header__container .header_styles .container, .header__container .header__bottom .container, .sr-footer .sr-footer-nav .container, .container
  { padding-left: 0px; padding-right: 0px; }}

/* Regel Posts about... verwijderen */
.sr-blog-listing-02 .articles-list .text-center { display:none; }

/* Post narration audio in post blogs */
.hs-audio-player { margin-bottom:30px; }


/*****************************************/
/* specifieke aanpassingen                  */
/*****************************************/

/* grijze klant logo's, kleur in hover */
.hs_cos_wrapper_type_logo img { filter: grayscale(100%) contrast(50%); transition: 0.3s; }
.hs_cos_wrapper_type_logo img:hover { filter: grayscale(0%) contrast(100%); }



/* aanpassing koopknoppen van Payment module (standaard van Hubspot) */
/* geld voor ALLE betaalknoppen (zowel overlay-knoppen als nieuwe-tab knoppen) */
a.button[href*="https://payments-na1.hubspot.com/payments/"] { font-size: 20px; font-family: "Asap Condensed", sans-serif; font-weight: 600; text-decoration: none; }

button.hs-button[class*="button__open-overlay-widget_"],
a.button[href*="https://payments-na1.hubspot.com/payments/"] {
  display: inline-flex;
  align-items: center;
  text-align: left;
  line-height: 1.4;
  gap: 0px;
  padding: 8px 24px 10px;
  margin: 10px 0;
  border: 2px solid #B24D00 !important;
  border-radius: 60px;
  background-color: #FF6F00;
  color: #fff;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
button.hs-button[class*="button__open-overlay-widget_"]:hover,
a.button[href*="https://payments-na1.hubspot.com/payments/"]:hover {
  background-color: #B24D00;
  border: 2px solid #FF6F00 !important;
}
button.hs-button[class*="button__open-overlay-widget_"] .button__icon svg,
a.button[href*="https://payments-na1.hubspot.com/payments/"] .button__icon svg {
  width: 1.2em;
  height: 1.2em;
  fill: currentColor;
}

.drie-blokken-homepage-RS { padding: 25px; border: 0px solid #fff; border-radius: 20px; background-color:#fff; box-shadow: 0px 12px 18px -6px #666666; transition: box-shadow 0.3s ease; }
.drie-blokken-homepage-RS:hover { box-shadow: 0px 6px 9px -3px #666666; background-color:#eee; }
a .drie-blokken-homepage-RS { color:#333 !important; } a:hover .drie-blokken-homepage-RS { color:#000 !important; }
.drie-blokken-homepage-RS h2 { color:#007ac2; font-size: 24px;}
.drie-blokken-homepage-RS p { margin: 0;}
@media (max-width:  768px) { .drie-blokken-homepage-RS { height: auto; }}
@media (min-width: 768px) and (max-width: 991px) { .drie-blokken-homepage-RS { height: 250px; }}
@media (min-width: 992px) { .drie-blokken-homepage-RS { height: 180px; }}


.extra_homeknoppen_campagne { box-shadow: 0px 12px 18px -6px #666666; border-radius: 20px; transition: box-shadow 0.3s ease; }
.extra_homeknoppen_campagne:hover { box-shadow: 0px 6px 9px -3px #666666; }


/* oplossen van margin-bottom van 1 pixel groot, werkt dit wel? */
@media (min-width: 767px) and (max-width: 768px) { 
  .row-fluid .span4 { padding-bottom: 30px !important; }
  }
}

/* animatie 3 knoppen homepage */
.animatiehome1, .animatiehome2, .animatiehome3 { opacity: 0; position:relative; }
.animatiehome1 { animation: fadeInBounce 1.2s ease-out .25s forwards; 
  background-image: url("https://20171138.fs1.hubspotusercontent-na1.net/hubfs/20171138/ICN%20website%20RS/homeblok-1.png"); background-size: cover; background-position: center; background-repeat: no-repeat; 
}
.animatiehome2 { animation: fadeInBounce 1.2s ease-out .50s forwards; 
  background-image: url("https://20171138.fs1.hubspotusercontent-na1.net/hubfs/20171138/ICN%20website%20RS/homeblok-2.png"); background-size: cover; background-position: center; background-repeat: no-repeat;
}
.animatiehome3 { animation: fadeInBounce 1.2s ease-out .75s forwards; 
  background-image: url("https://20171138.fs1.hubspotusercontent-na1.net/hubfs/20171138/ICN%20website%20RS/homeblok-3.png"); background-size: cover; background-position: center; background-repeat: no-repeat;
}

/* animatie 3 knoppen auxalia homepage tijdelijk */
.animatiehome4, .animatiehome5, .animatiehome6 { opacity: 0; position:relative; }
.animatiehome4 { animation: fadeInBounce 1.2s ease-out .25s forwards; }
.animatiehome5 { animation: fadeInBounce 1.2s ease-out .50s forwards; }
.animatiehome6 { animation: fadeInBounce 1.2s ease-out .75s forwards; }



@keyframes fadeInBounce {
  0% { transform: translateY(-145px); opacity: 0; animation-timing-function: ease-in; }
  20% { opacity: 0.3; }
  40% { transform: translateY(-24px); opacity: 0.6; animation-timing-function: ease-in; }
  65% { transform: translateY(-12px); opacity: 0.9; animation-timing-function: ease-in; }
  82% { transform: translateY(-6px); opacity: 1; animation-timing-function: ease-in; }
  93% { transform: translateY(-4px); opacity: 1; animation-timing-function: ease-in; }
  25%, 55%, 75%, 87% { transform: translateY(0); animation-timing-function: ease-out; }
  100% { transform: translateY(0); opacity: 1; animation-timing-function: ease-out; }
}

/* blog images ronde hoeken en 2:1 formaat */
.sr-blog-listing-02 .article-panel .article-img { aspect-ratio: 2 / 1; overflow: hidden; }
.sr-blog-listing-02 .article-panel .article-img img { border-radius: 20px 20px 0 0; overflow: hidden; }
/* heading h3 boven filtering bloglisting tags kleiner maken */
.hs_cos_wrapper_type_post_filter H3 { font-size:20px; }

.sr-blog-listing-02 .article-panel:hover {
    box-shadow: 15px 25px 60px 0 rgba(0, 0, 0, .13);
}

/* Tabbed Card van Hubspot */


@media (max-width: 767px) { .hs-tabs-wrapper { margin-bottom:20px; }}

.hs-tabs__tab { color:#333; border-radius: 20px 20px 0 0; }
.hs-tabs__tab, .hs-tabs__tab:active, .hs-tabs__tab:focus, .hs-tabs__tab:hover { padding: 10px 30px; border-radius: 20px 20px 0 0; }
.hs-tabs__tab:active, .hs-tabs__tab:focus, .hs-tabs__tab:hover { color:#007ac2; }
.hs-tabs__content__panel { padding: 20px 30px; } 
.hs-tabs__content__panel p { margin: 0 0 10px 0; }
.hs-tabs__content { border-radius: 0 20px 20px 20px; }
.hs-tabs__tab, .hs-tabs__tab:hover { font-size:20px; font-family: Asap Condensed; font-weight: 600; }
.hs-tabs__tab[aria-selected='true'] { border-bottom: 2px solid #007ac2 !important; font-size:20px; font-family: Asap Condensed; font-weight: 600; }
.hs-tabs__tab[aria-selected='true']:after { border-bottom: 2px solid #007ac2 !important; }

/* testimonial-slider-01 quote svg kleur */
.sr-cards-testimonial-slider-01 *, .sr-cards-testimonial-slider-01 svg { fill: #007ac2; }
    
/* Animatie slider, blokken sliden van rechts en faden in */
.animatieslidervanrechts > [class^="animatie"] {
  opacity: 0;
  transform: translateX(200px);
  animation: icn-slide-fade 0.7s ease-out forwards;
  will-change: transform, opacity;
}
.animatieslidervanrechts > .animatie1 { animation-delay:    0s; }
.animatieslidervanrechts > .animatie2 { animation-delay: 0.15s; }
.animatieslidervanrechts > .animatie3 { animation-delay: 0.30s; }
.animatieslidervanrechts > .animatie4 { animation-delay: 0.45s; }
.animatieslidervanrechts > .animatie5 { animation-delay: 0.60s; }
.animatieslidervanrechts > .animatie6 { animation-delay: 0.75s; }
.animatieslidervanrechts > .animatie7 { animation-delay: 0.90s; }
.animatieslidervanrechts > .animatie8 { animation-delay: 1.05s; }

@keyframes icn-slide-fade {
  0%   { opacity: 0; transform: translateX(200px); }
  75%   { opacity: 0.5; }
  100% { opacity: 1; transform: translateX(0); }
}


.trainer_extra_info { position: relative; display: inline-table; height: auto; width: 100%; margin: 30px 0; }
.traineromschrijving { margin-top: 30px; width: 100%; height: auto; font-style: italic; font-size: 14px; }
.traineromschrijving img { position: relative; width:150px; height:150px; margin-left:20px; float:right; border-radius: 75px; z-index: 1; }
.trainertekst { position: relative; top:50px; }
.trainernaamfunctie { position: absolute; width: 100%; top: 0px; padding: 0px 0px 2px 20px; background-color: #007ac2; font-family: Asap Condensed, sans-serif; letter-spacing: -0.3px; font-size: 30px; }
.trainernaam { color: #fff; font-weight: 600; }
.trainerfunctie { color: #fff; font-weight: 300; }




















.single-events {
	&--title {
		margin-bottom: 43px;
	}

	.yoast_breadcrumb {
		@include r(575) {
			display: none;
		}
	}

	.main_content {
		p {
			margin-top: 0;

			&:last-child {
				margin-bottom: 0;
			}
		}

		.more_content {
			display: none;
			padding-bottom: 10px;

			&_btns {
				margin: 0 -5px;

				.main-btn {
					display: inline-block;
					margin: 5px;
				}

				&:not(.active) {
					.less_btn {
						display: none;
					}
				}

				&.active {
					.more_btn {
						display: none;
					}
				}
			}
		}
	}

	&--thumb {
		margin-top: 10px;

		@include r(575) {
			margin-bottom: 25px;
		}

		img {
			width: 100%;
		}
	}

	&--sidebar {
		background: $secondary;
		padding: 13px 0 40px;

		@include r(575) {
			width: 90%;
			margin-left: auto;
			margin-right: auto;
		}

		.sidebar {
			&__header {
				padding: 15px;

				@include m(xl) {
					padding: 27px 39px 27px 27px;
				}

				&--title {
					display: block;
					background: $w;
					color: $secondary;
					position: relative;
					padding: 0 10px 0 50px;

					@include m(xl) {
						padding: 0 67px;
					}

					.icon {
						width: 80px;
						height: 80px;
						border-radius: 50%;
						display: flex;
						flex-wrap: wrap;
						align-items: center;
						justify-content: center;
						background: $primary;
						left: 0;
						top: 50%;
						transform: translate(-50%, -50%);
						position: absolute;
					}
				}
			}

			&__body {
				margin-bottom: 30px;

				&>div {
					position: relative;
					border-bottom: 1px solid rgba($grey, .2);
					padding: 9px 15px 29px 50px;

					@include m(xl) {
						padding: 9px 20px 29px 80px;
					}

					svg {
						position: absolute;
						top: 26px;
						left: 15px;

						@include m(xl) {
							left: 42px;
						}
					}

					span {
						font-size: 14px;
						color: $grey;
						margin-bottom: 2px;
						line-height: 1;
					}

					p {
						color: $w;
						margin: 0;
					}
				}
			}

			&__status {
				font-size: 14px;
				font-weight: 500;
				padding: 0 30px;

				@include m(md) {
					padding: 0 20px;
				}

				@include m(xl) {
					padding: 0 41px;
				}
			}

			&__footer {
				margin-top: 30px;
				padding: 0 30px;

				@include m(md) {
					padding: 0 10px;
				}

				@include m(lg) {
					padding: 0 30px;
				}

				@include m(xl) {
					padding: 0 55px;
				}

				.main-btn {
					width: 100%;

					@include r(991) {
						padding-left: 10px;
						padding-right: 10px;
					}
				}
			}
		}
	}

	.your_experts {
		.person_item {
			max-width: 230px;
			margin: 0 auto;

			&--image {
				margin-bottom: 20px;

				img {
					width: 100%;
				}
			}

			&--cont {
				.person_name {
					margin-bottom: 15px;

					@include m(xl) {
						margin-bottom: 24px;
					}
				}

				.person_position {
					margin: 0;
					line-height: 1.4;

					@include m(md) {
						line-height: 1.7;
					}

					@include m(xl) {
						padding-right: 20px;
					}
				}
			}
		}
	}

	.events_programm {
		margin-bottom: 80px;

		&>.h4 {
			margin-bottom: 40px;
		}

		.tabs,
		.tracks-tabs {
			.tabs-nav,
			.tracks-tabs-nav {
				border-bottom: 1px solid $light-blue;
				list-style: none;
				padding: 0;
				margin: 0 0 34px;
				display: flex;
				flex-wrap: wrap;

				li {
					margin-right: 2px;

					a,
					span {
						font-size: 16px;
						padding: 10px 28px;
						color: $secondary;
						border: 1px solid $light-blue;

						&:hover {
							cursor: pointer;
							background: lighten($light-blue, 5);
						}
					}

					&.active {
						a,
						span {
							background: $light-blue;
						}
					}
				}
			}
		}

		.tracks-tabs {
			.tracks-tabs-nav {
				border-bottom: none;
				li {
					a {
						padding: 10px 45px;
					}
				}
			}
		}

		.events_timeline {
			margin-top: 40px;

			&--item {
				padding-left: 22px;
				position: relative;
				padding-top: 50px;

				@include m(sm) {
					padding-left: 122px;
					padding-top: 0;
				}

				&:not(:last-child) {
					padding-bottom: 30px;
				}

				&:before {
					position: absolute;
					content: '';
					width: 4px;
					top: 0;
					bottom: 0;
					background: #DEF1F0;
					left: 0;

					@include m(sm) {
						left: 98px;
					}
				}

				.time_item {
					background: $secondary;
					color: $w;
					padding: 8px 12px;
					white-space: nowrap;
					line-height: 1;
					display: inline-block;
					position: absolute;
					top: 0;
					min-width: 78px;
					text-align: center;
					left: 20px;

					@include m(sm) {
						right: calc(100% - 80px);
						left: auto;
					}

					&:after {
						position: absolute;
						content: '';
						top: 50%;
						transform: translateY(-50%);
						width: 8px;
						height: 8px;
						border-radius: 50%;
						background: $primary;
						left: -23px;

						@include m(sm) {
							left: calc(100% + 16px);
						}
					}

					.polygon {
						width: 18px;
						position: absolute;
						top: 0;
						bottom: 0;
						right: 100%;
						transform: rotate(180deg);

						@include m(sm) {
							transform: none;
							left: 100%;
							right: auto;
						}

						svg {
							width: 100%;
							height: 100%;

							polygon {
								fill: $secondary;
							}
						}
					}
				}

				p {
					&:first-child {
						margin-top: 0;
					}

					&:last-child {
						margin-bottom: 0;
					}
				}
			}

			&--block {
				border: 1px solid $grey;

				.header_block {
					position: relative;
					background: $background-pre;
					padding: 9px 50px 9px 10px;
					display: flex;
					flex-wrap: wrap;
					align-items: center;

					@include m(sm) {
						padding: 9px 50px 9px 20px;
					}

					&--img {
						width: 64px;
						height: 64px;
						border-radius: 50%;
						overflow: hidden;
						margin-right: 21px;

						img {
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
					}

					div:not(.header_block--img) {
						flex: 1 1;

						p {
							margin: 0;
							color: $grey;
						}
					}

					.language-label {
						position: absolute;
						top: 10px;
						right: 10px;
						background-color: $secondary;
						color: $w;
						padding: 3px 5px;
						border-radius: 5px;
						max-width: 40px;
						white-space: nowrap;
						overflow: hidden;
					}
				}

				.body_block {
					position: relative;
					padding: 10px 33px 25px 10px;

					@include m(sm) {
						padding: 13px 33px 35px 20px;
					}

					p {
						max-width: 511px;

						&:last-child {
							margin-bottom: 0;
						}
					}

					&--cta_btn {
						position: absolute;
						bottom: 10px;
						right: 10px;
					}

					&--link,
					.dropdown_btn {
						display: inline-block;
						position: absolute;
						bottom: 10px;
						left: 20px;
						cursor: pointer;
						padding-right: 30px;
						min-width: 24px;
						min-height: 26px;

						&:before {
							position: absolute;
							content: '';
							top: 2px;
							bottom: 0;
							right: 0;
							background-image: url("data:image/svg+xml,%3Csvg width='20' height='21' viewBox='0 0 20 21' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.6604 9.05308L19.6771 10.0497C20.1076 10.4716 20.1076 11.154 19.6771 11.5715L10.7786 20.2982C10.3481 20.7202 9.65193 20.7202 9.22601 20.2982L0.322875 11.5715C-0.107626 11.1495 -0.107626 10.4671 0.322876 10.0497L1.33959 9.05308C1.77467 8.62662 2.48454 8.6356 2.91046 9.07104L8.16808 14.4804L8.16808 1.57878C8.16808 0.981734 8.65812 0.501403 9.26723 0.501403L10.7328 0.501403C11.3419 0.501403 11.8319 0.981734 11.8319 1.57878L11.8319 14.4804L17.0895 9.07104C17.5155 8.63111 18.2253 8.62213 18.6604 9.05308Z' fill='%23A7D500'/%3E%3C/svg%3E%0A");
							@include tr();
							//background-repeat-y: no-repeat;
							//background-repeat-x: repeat;
							//background-position: 0 50%;
							background-size: 14px;
							background-repeat: no-repeat;
							background-position: center;
							width: 24px;
							height: 26px;
						}

						.show_less {
							display: none;
						}

						&.active {
							.show_more {
								display: none;
							}

							.show_less {
								display: block;
							}
						}

						&.active:before {
							transform: scale(1, -1);
						}

					}

					&--link {
						&:hover {
							&:before {
								transform: scale(1, -1);
							}
						}
					}

					.dropdown_content {
						display: none;
						padding-bottom: 20px;

						.main-btn {
							margin-right: 10px;
						}
					}
				}
			}
		}
	}

	.related_events {
		border-top: 1px solid $grey;
		padding: 50px 0;

		@include m(sm) {
			padding: 60px 0;
		}

		@include m(md) {
			padding: 80px 0;
		}

		@include m(lg) {
			padding: 110px 0 100px;
		}

		@include m(xl) {
			padding: 134px 0 124px;
		}

		.subtitle {
			margin-bottom: 10px;
		}
	}
}