/* Joomla 6 compatibility layer for the original Hoeve Motoren design */
html,body{margin:0;padding:0}.dd-nav ul.mod-menu.dd-hmenu{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap}.dd-nav ul.mod-menu.dd-hmenu>li{display:block}.dd-nav ul.mod-menu.dd-hmenu>li>a{display:block}.dd-sidebar1 .mod-menu.dd-vmenu{margin:0;padding:0;list-style:none}.dd-sidebar1 .mod-menu.dd-vmenu li{list-style:none}.dd-sidebar1 .mod-menu.dd-vmenu a{display:block}.dd-block{margin-bottom:10px}.dd-blockheader .t{margin:0}.dd-content .com-content-article,.dd-content .blog,.dd-content .category-list{padding:10px 20px}.dd-content h1,.dd-content h2,.dd-content h3{font-family:Arial,Helvetica,sans-serif}.hm-slider{position:absolute;left:5px;top:5px;width:950px;height:340px;overflow:hidden;z-index:11}.hm-slider img{position:absolute;inset:0;width:950px;height:340px;object-fit:cover;opacity:0;transition:opacity .9s ease}.hm-slider img.active{opacity:1}.hm-social{position:absolute;z-index:30}.dd-page-footer{font-size:11px;text-align:center}.dd-page-footer a{text-decoration:none}@media(max-width:980px){.dd-nav-inner,.dd-sheet,.dd-header{max-width:960px;width:100%}.hm-slider{width:98.9%;height:auto;aspect-ratio:950/340}.hm-slider img{width:100%;height:100%}}

/* Center menu and integrated slideshow */
.dd-nav-inner{width:960px;max-width:100%;margin:0 auto!important;padding-left:0!important;padding-right:0!important}
.dd-nav .mod-menu,.dd-nav ul.mod-menu.dd-hmenu,.dd-nav ul.mod-menu{float:none!important;display:flex!important;justify-content:center!important;align-items:center;width:100%;margin:0 auto!important;padding:0!important;list-style:none}
.dd-nav .mod-menu>li,.dd-nav ul.mod-menu.dd-hmenu>li{float:none!important}
.dd-header{width:960px;max-width:100%;margin-left:auto!important;margin-right:auto!important}
.dd-object1331261996{left:50%!important;margin-left:-480px!important;width:960px!important}
.dd-animacja{position:relative;margin-left:5px!important;margin-top:5px!important;width:950px!important;height:340px!important;overflow:hidden}
.hm-slider{position:absolute;inset:0;left:0!important;top:0!important;width:950px!important;height:340px!important;margin:0!important;overflow:hidden;z-index:11}
.hm-slider img{position:absolute;inset:0;display:block;width:950px!important;height:340px!important;max-width:none;object-fit:cover;object-position:center;opacity:0;transition:opacity .9s ease}
.hm-slider img.active{opacity:1}
@media(max-width:980px){.dd-nav-inner,.dd-header{width:100%;max-width:960px}.dd-object1331261996{left:0!important;margin-left:0!important;width:100%!important}.dd-animacja{width:calc(100% - 10px)!important;height:auto!important;aspect-ratio:950/340}.hm-slider{width:100%!important;height:100%!important}.hm-slider img{width:100%!important;height:100%!important}.dd-nav .mod-menu,.dd-nav ul.mod-menu{flex-wrap:wrap}}


/* =========================================================
   Hoeve Motoren 1.2 – original white header / wider layout
   ========================================================= */
:root{
    --hm-page-width: 1120px;
    --hm-slider-width: 1100px;
    --hm-slider-height: 394px; /* 950:340 aspect ratio */
}
body{background:#23408E;}
#dd-main{background:#23408E;}
.dd-nav{
    width:100%;
}
.dd-nav-inner{
    width:var(--hm-page-width) !important;
    max-width:calc(100% - 24px) !important;
    box-sizing:border-box;
}
.dd-nav .mod-menu,
.dd-nav ul.mod-menu.dd-hmenu,
.dd-nav ul.mod-menu{
    flex-wrap:nowrap !important;
    white-space:nowrap;
    justify-content:center !important;
}
.dd-nav .mod-menu > li,
.dd-nav ul.mod-menu.dd-hmenu > li{
    flex:0 0 auto;
}
.dd-nav .mod-menu > li > a,
.dd-nav ul.mod-menu.dd-hmenu > li > a{
    padding-left:13px !important;
    padding-right:13px !important;
}

.dd-header{
    width:var(--hm-page-width) !important;
    max-width:calc(100% - 24px) !important;
    height:555px !important;
    box-sizing:border-box;
    background:#fff !important;
    overflow:visible !important;
}
.dd-shapes{
    overflow:visible !important;
}

/* Full top logo */
.dd-logo-1279779218{
    top:28px !important;
    left:10px !important;
    margin-left:0 !important;
    width:auto !important;
    height:auto !important;
    display:block;
}
.dd-logo-1279779218 img{
    display:block;
    width:auto !important;
    height:70px !important;
    max-width:370px !important;
    object-fit:contain;
}

/* Facebook + mail at top right */
.hm-header-links{
    position:absolute;
    top:38px;
    right:22px;
    z-index:110;
    display:flex;
    align-items:center;
    gap:18px;
}
.hm-social-link{
    display:flex;
    align-items:center;
    gap:7px;
    color:#253f93;
    text-decoration:none;
    font-size:13px;
    font-family:Arial,Helvetica,sans-serif;
}
.hm-social-link:hover .hm-social-text{text-decoration:underline;}
.hm-social-icon{
    display:inline-flex;
    width:34px;
    height:34px;
    align-items:center;
    justify-content:center;
    border:1px solid #c7c7c7;
    border-radius:50%;
    background:#fff;
    color:#fff;
    font:700 20px/1 Arial,sans-serif;
    position:relative;
}
.hm-social-icon::before{
    content:"";
    position:absolute;
    inset:4px;
    border-radius:50%;
    background:#283f97;
    z-index:-1;
}
.hm-mail-icon{font-size:17px;}
.hm-social-text{color:#253f93;}

/* Old decorative round logo is now entirely visible */
.dd-object1965089872{
    left:auto !important;
    right:-1px !important;
    margin-left:0 !important;
    top:99px !important;
}
.dd-object395012838{
    left:auto !important;
    right:0 !important;
    margin-left:0 !important;
    top:108px !important;
}
.dd-object395012838 img{
    width:190px !important;
    height:190px !important;
    object-fit:contain;
}

/* Slider: white surrounding area, centered and wider */
.dd-object1331261996{
    top:115px !important;
    left:50% !important;
    margin-left:calc(var(--hm-slider-width) / -2 - 5px) !important;
    width:calc(var(--hm-slider-width) + 10px) !important;
    height:calc(var(--hm-slider-height) + 10px) !important;
    background:#fff !important;
    box-sizing:border-box;
}
.dd-animacja{
    margin:5px !important;
    width:var(--hm-slider-width) !important;
    height:var(--hm-slider-height) !important;
    overflow:visible !important;
}
.hm-slider{
    position:relative !important;
    inset:auto !important;
    left:auto !important;
    top:auto !important;
    width:var(--hm-slider-width) !important;
    height:var(--hm-slider-height) !important;
    overflow:hidden;
    background:#fff;
}
.hm-slider > img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    opacity:0;
    transition:none !important;
}
.hm-slider > img.active{opacity:1;}
.hm-slider > img.hm-under-transition{opacity:0 !important;}

/* transition canvas */
.hm-transition-layer{
    position:absolute;
    inset:0;
    z-index:10;
    pointer-events:none;
    overflow:hidden;
    background-repeat:no-repeat;
    background-position:center;
    background-size:100% 100%;
}
.hm-transition-layer.hm-effect-fade.run{
    animation:hmFade .55s ease both;
}
.hm-transition-layer.hm-effect-slideLeft.run{
    animation:hmSlideLeft .55s ease both;
}
.hm-transition-layer.hm-effect-slideRight.run{
    animation:hmSlideRight .55s ease both;
}
.hm-effect-tile{
    position:absolute;
    display:block;
    opacity:0;
    background-repeat:no-repeat;
    animation-duration:.5s;
    animation-fill-mode:both;
    animation-timing-function:ease-out;
}
.hm-transition-layer.run .hm-slice-down{animation-name:hmSliceDown;}
.hm-transition-layer.run .hm-slice-up{animation-name:hmSliceUp;}
.hm-transition-layer.run .hm-box-in{animation-name:hmBoxIn;}
@keyframes hmFade{from{opacity:0}to{opacity:1}}
@keyframes hmSlideLeft{from{opacity:1;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}
@keyframes hmSlideRight{from{opacity:1;transform:translateX(-100%)}to{opacity:1;transform:translateX(0)}}
@keyframes hmSliceDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}
@keyframes hmSliceUp{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}
@keyframes hmBoxIn{from{opacity:0;transform:scale(.25)}to{opacity:1;transform:scale(1)}}

/* Nivo-like bullets below slider */
.hm-slider-controls{
    position:absolute;
    left:50%;
    bottom:-35px;
    transform:translateX(-50%);
    z-index:25;
    display:flex;
    gap:5px;
    align-items:center;
}
.hm-slider-dot{
    appearance:none;
    width:17px;
    height:17px;
    padding:0;
    border:0;
    background:transparent;
    position:relative;
    cursor:pointer;
}
.hm-slider-dot::after{
    content:"";
    position:absolute;
    width:7px;
    height:7px;
    left:5px;
    top:5px;
    border-radius:50%;
    background:#a72b2b;
    box-shadow:0 0 0 2px #fff,0 0 4px rgba(0,0,0,.25);
}
.hm-slider-dot.active::after{
    background:#fff;
    box-shadow:0 0 0 2px #a72b2b,0 0 4px rgba(0,0,0,.25);
}

/* Original white drop-shadow strip below slider */
.dd-object1015083262{
    top:499px !important;
    left:50% !important;
    margin-left:-478px !important;
    width:957px !important;
    z-index:7;
}

/* Main content follows the wider page */
.dd-sheet{
    width:var(--hm-page-width) !important;
    max-width:calc(100% - 24px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

@media (max-width:1145px){
    :root{
        --hm-page-width:960px;
        --hm-slider-width:950px;
        --hm-slider-height:340px;
    }
    .dd-nav .mod-menu,
    .dd-nav ul.mod-menu.dd-hmenu,
    .dd-nav ul.mod-menu{flex-wrap:wrap !important;}
    .dd-header{height:500px !important;}
    .dd-object1015083262{top:382px !important;}
    .hm-header-links .hm-social-text{display:none;}
}
@media (max-width:980px){
    .dd-header{
        max-width:100% !important;
        height:auto !important;
        min-height:470px;
    }
    .dd-logo-1279779218{left:12px !important;}
    .hm-header-links{right:12px;}
    .dd-object1331261996{
        left:5px !important;
        right:5px !important;
        margin-left:0 !important;
        width:calc(100% - 10px) !important;
        height:auto !important;
        aspect-ratio:950/340;
    }
    .dd-animacja,
    .hm-slider{
        width:100% !important;
        height:100% !important;
    }
    .dd-object1965089872,.dd-object395012838{display:none !important;}
}

/* v1.3 exact header/slider corrections */
.dd-header{
    background:#fff !important;
}
.dd-header:before{
    content:"";
    position:absolute;
    z-index:-1;
    top:0;
    bottom:0;
    left:50%;
    width:100vw;
    transform:translateX(-50%);
    background:#fff;
}
/* Do not draw empty circular placeholders around social links. */
.hm-social-icon{
    width:34px;height:34px;border:0!important;background:transparent!important;
    border-radius:0!important;color:transparent!important;overflow:hidden;
}
.hm-social-icon::before{display:none!important}
.hm-facebook .hm-social-icon{
    border-radius:50%!important;background:#283f97!important;color:#fff!important;
    font:700 23px/34px Arial,sans-serif;text-align:center;
}
.hm-email .hm-social-icon{
    border-radius:50%!important;background:#283f97!important;color:#fff!important;
    font:700 0/34px Arial,sans-serif;text-align:center;position:relative;
}
.hm-email .hm-social-icon:after{
    content:"✉";font:700 18px/34px Arial,sans-serif;color:#fff;
    position:absolute;inset:0;text-align:center;
}
.hm-social-text{display:none!important}

/* White slider band across the full viewport, as on the original page */
.dd-object1331261996:before{
    content:"";
    position:absolute;
    top:-115px;
    bottom:-105px;
    left:50%;
    width:100vw;
    transform:translateX(-50%);
    background:#fff;
    z-index:-1;
}
.dd-object1331261996{z-index:9!important}

/* Original-style navigation arrows */
.hm-slider-arrow{
    position:absolute;
    z-index:30;
    top:50%;
    transform:translateY(-50%);
    width:44px;height:64px;
    border:0;background:rgba(255,255,255,.12);
    color:#b02d2d;
    text-shadow:
       -2px -2px 0 #fff, 2px -2px 0 #fff,
       -2px  2px 0 #fff, 2px  2px 0 #fff,
       0 0 5px rgba(0,0,0,.35);
    font:700 52px/56px Arial,sans-serif;
    cursor:pointer;opacity:0;
    transition:opacity .2s ease,background .2s ease;
}
.hm-slider:hover .hm-slider-arrow{opacity:.9}
.hm-slider-arrow:hover{opacity:1!important;background:rgba(255,255,255,.3)}
.hm-slider-prev{left:12px}
.hm-slider-next{right:12px}


/* v1.6 Floating "Terug naar boven" button, matching the original site */
#toTop{
    position:fixed !important;
    right:22px !important;
    bottom:18px !important;
    z-index:9999 !important;
    width:66px !important;
    height:66px !important;
    padding:0 !important;
    margin:0 !important;
    border:3px solid #fff !important;
    border-radius:50% !important;
    background:#2f8db6 !important;
    box-shadow:0 0 0 1px #1b5672, 0 2px 7px rgba(0,0,0,.28) !important;
    color:#111 !important;
    cursor:pointer !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    opacity:.96 !important;
    transition:transform .15s ease, opacity .15s ease, box-shadow .15s ease !important;
    font-family:Arial,Helvetica,sans-serif !important;
}
#toTop span{
    display:block !important;
    font-size:11px !important;
    line-height:12px !important;
    font-weight:700 !important;
    color:#111 !important;
}
#toTop:hover,
#toTop:focus{
    transform:scale(1.06) !important;
    opacity:1 !important;
    box-shadow:0 0 0 1px #1b5672, 0 3px 9px rgba(0,0,0,.38) !important;
    outline:none !important;
}
#toTop:active{
    transform:scale(.98) !important;
}
@media (max-width:700px){
    #toTop{
        right:12px !important;
        bottom:12px !important;
        width:58px !important;
        height:58px !important;
    }
    #toTop span{
        font-size:10px !important;
        line-height:11px !important;
    }
}