/*custom css*/

/*sofia pro*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');




@font-face{font-family:Graphik;src:url(../webfonts/42a9b7733ff5f4bc9df84ddb93dfbe18.woff2) format("woff2"),url(../webfonts/0391160d15d5bbc0e3a38a534b207df8.woff) format("woff");font-weight:400;font-style:normal}
@font-face{font-family:Graphik;src:url(../webfonts/6706d3d4ee0bd862e29e97fef6e4c087.woff2) format("woff2"),url(../webfonts/829a22f53590743ffa497a3a8a7a4254.woff) format("woff");font-weight:400;font-style:italic}
@font-face{font-family:Graphik;src:url(../webfonts/f9277a68f8dbabfbba240d15af014666.woff2) format("woff2"),url(../webfonts/a286d62ab78d2f015dc2ff580055a734.woff) format("woff");font-weight:600;font-style:normal}
@font-face{font-family:Graphik;src:url(../webfonts/06db86269df471f1e1f65980fe0db0e3.woff2) format("woff2"),url(../webfonts/a408a6f3155a7ba27ddf1c76a161c286.woff) format("woff");font-weight:600;font-style:italic}
@font-face{font-family:Graphik;src:url(../webfonts/ccdcda5632405996251c79f35213ac22.woff2) format("woff2"),url(../webfonts/73e968e279dc221483b4426710fd6483.woff) format("woff");font-weight:800;font-style:normal}
@font-face{font-family:Produkt;src:url(../webfonts/5d50778ffe266e2b891b948c61860157.woff2) format("woff2"),url(../webfonts/28b07e5243f3d3d2265b3d8bd18f46fe.woff) format("woff");font-weight:800;font-style:normal}
@font-face{font-family:Produkt;src:url(../webfonts/ef6344ced8d6fd362eee09a90ee45c25.woff2) format("woff2"),url(../webfonts/aab0beff658b14cfff278cf2f61e5a1e.woff) format("woff");font-weight:300;font-style:normal}



body{
    font-family: Graphik,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight:400;
    color:#0a0a0a;
    text-rendering: optimizeLegibility;
    -moz-osx-font-smoothing: grayscale;
}

a{
    font-family: Graphik,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight:600;
    color:#0a0a0a;
    transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0);
    text-decoration: underline;
    cursor: pointer;
}

strong{
    font-weight:700;
}

a:hover{    
    color:#0000a4;
}

h1, h2, h3, h4, h5, h2 a, h4 a{
    font-family: Produkt, sans-serif;
    font-weight:800;
    font-style: normal;
    /*letter-spacing:2px;*/
    color:#0000a4;
    /*text-transform:uppercase;*/
}

h1{
    font-size:24px;
}

h2{
    color:#646464;
    font-size:24px;
    margin-bottom:1em;
    font-weight:300 !important;
}

h2 a, h4 a{
    text-decoration:none;
}



h3{
    font-family: Graphik,Helvetica Neue,Helvetica,Arial,sans-serif;
    color:#0000a4;
    font-size:20px;
    margin-bottom:0.5em;
    font-weight:800;
    /*letter-spacing: 1px;*/
}

h4{
    font-size:14px;
}

h5{
    font-family: Graphik,Helvetica Neue,Helvetica,Arial,sans-serif;
    color:#0000a4;
    font-size:14px;
}

p{
    font-family: Graphik,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size:18px;
    line-height:26px;
    color:#0a0a0a;
    font-weight:400;
    
}


.wit{
    color:#FFFFFF !important;
}

.pos-rel{position:relative;}

.p-20{
    padding:20px 20px 20px 20px;
}

.pt-20{padding-top:20px;}
.pt-30{padding-top:30px;}
.pt-40{padding-top:40px;}
.pt-60{padding-top:60px;}

.pb-40{padding-bottom:40px;}
.pb-60{padding-bottom:60px;}

.mt-20{margin-top:20px !important;}
.mt-40{margin-top:40px;}
.mt-60{margin-top:60px;}
.mt-100{margin-top:100px;}

.mb-10{margin-bottom:10px;}
.mb-20{margin-bottom:20px;}
.mb-40{margin-bottom:40px;}
.mb-60{margin-bottom:80px;}
.mb-80{margin-bottom:80px;}
.mb-100{margin-bottom:100px;}


.mw-180{
    max-width:180px;
}

@media(max-width:764px){
    .pt-20{padding-top:10px;}
    .pt-40{padding-top:20px;}
    .pt-60{padding-top:30px;}

    .pb-40{padding-bottom:20px;}
    .pb-60{padding-bottom:30px;}

    .mt-40{margin-top:20px;}
    .mt-60{margin-top:30px;}
    .mt-100{margin-top:50px;}

    .mb-10{margin-bottom:5px;}
    .mb-20{margin-bottom:10px;}
    .mb-40{margin-bottom:20px;}
    .mb-60{margin-bottom:40px;}
    .mb-80{margin-bottom:40px;}
    .mb-100{margin-bottom:50px;}
}



.blauw{
    color:#085afb;
}

.bgkleur-1{background:#FFD2AD;;}
.bgkleur-2{background:#DCEEFF;}
.bgkleur-3{background:#E2F9ED;}


.navbar-toggler {
    margin-left:auto;
    margin-right:auto;
    font-size:12px;
    border-radius:0;
}

.navbarcontainer{
    position:relative;
    width:100%;
    top:0;
    left:0;
    z-index:999999;
}

.navbarcontainer .navbar-light .navbar-toggler {
    background-color:rgba(255,255,255,0.5);
    border:1px solid #FFFFFF;
}

.navbarcontainer .navbar-light .navbar-nav .nav-link{
    color:#FFFFFF;
}

.navbar-light .navbar-brand{
    /*background:rgba(255,255,255,0.5);*/
}

.navbarcontainerpage{
    position:fixed;
    background:#FFFFFF;
    border-bottom:1px solid #DDDDDD;
}

.navbarcontainerpage .navbar-light .navbar-nav .nav-link{
    color:#0a0a0a;
}

.navbarcontainer .navbar-light .navbar-nav .nav-link:hover, .navbarcontainerpage .navbar-light .navbar-nav .nav-link:hover{
color:#085AFB;
}

.home-header{
    background: url('../imgs/home-header.jpg');
    background-size:cover;
    background-position:left center;
    min-height:450px;
    /*border-radius:0px 150px 0px 0px; */
}

.welovecycling{
    position:absolute; 
    right:20px; 
    bottom:10px;
}
.welovecycling img{
    width:140px;
}


.artikel-header{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/header_welovecycling_08-21-1.jpg');
    background-size:cover;
    background-position:top center;
    height:35vh;
}

.artikel-header-1{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)),
    url('../imgs/artikel_ben-jij-klaar-voor-de-cyclos/cyclist-header-01-1920x730.jpg?v=20220407');
    background-position: left top;
}

.artikel-header-2{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)),
    url('../imgs/artikel_waarom-een-echte-flandrien-met-een-skoda-rijdt/vladimir-vidim-slavia-skoda-tour-de-france-1920x1280.jpg');
    background-position: center center;
    background-size:cover;
}

.artikel-header-3{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)),
    url('../imgs/artikel_durf-jij-over-de-kasseistroken-van-parijs-roubaix-te-fietsen/artikel3-©golazo.jpg');
    background-position: right center;
    background-size:cover;
}

.artikel-header-4{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)),
    url('../imgs/artikel_5-momenten-waar-het-gebeurt-in-luik-bastenaken-luik-en-de-waalse-pijl/artikel4.jpg');
    background-position: right center;
    background-size:cover;
}

.artikel-header-5{
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)),
    url('../imgs/artikel_luik-bastenaken-luik-het-verhaal-van-een-rijke-wielergeschiedenis/artikel5.jpg?v=2');
    background-position: center center;
    background-size:cover;
}

.logo-container{
    background:#FFFFFFAA; 
    width:30%; 
    padding:20px 20px 20px; 
    margin-left:auto; 
    margin-right:auto;
}

.top-home-section{
    /*background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/home_header.jpg');*/
    background-attachment: fixed;   
    background-size: cover; 
    background-repeat:no-repeat; 
    background-position:center center;
}

.top-artikel-section{
    position:relative; 
    height:60vh; 
    background-size: cover; 
    background-repeat:no-repeat;     
}

.artikel1{
    background-position:center center;
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/artikel_header_01.jpg');
    background-attachment: fixed;    
}

.artikel2{
    background-position:right center;
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/artikel_header_02.jpg');
    background-attachment: fixed;    
}

.artikel3{
    background-position:right center;
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/artikel_header_03.jpg');
    background-attachment: fixed;    
}

.artikel4{
    background-position:right center;
    background: linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.4)), url('../imgs/artikel_header_04.jpg');
    background-attachment: fixed;    
}

@media(max-width:767px){
    .artikel-header-1, .artikel-header-2, .artikel-header-3, .artikel-header-4{
        background-size:cover;
        background-position:center center;
        background-attachment:scroll !important;
    }
    .top-artikel-section {
        height:40vh;
    }
    
}


.artikel-title{
    font-size:30px;
    line-height:1.2;
    color:#FFFFFF;
}

.andereartikels{
    line-height:16px;
}

.andereartikels a{
    font-weight:700;
    font-size:13px;
}

.extraside{
    border-top:1px solid #DDDDDD;
}



.onderschrift{
    font-size: 12px;
}

/* Home Title */
.home-title {
    font-family: 'Roboto', sans-serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.2em;
    position: relative;
    margin: 0;
    word-wrap: break-word;
    color: #fff;
    padding-left: 0em;
}
.home-title.fs60 {
    font-size: 60px;
    line-height: 1.2em;

}
.home-subtitle {
    font-family: 'Roboto', sans-serif; 
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3em;   
    position: relative;
    margin: 0;
    margin-top: 20px;
    padding-left: 60px;
    word-wrap: break-word;
    color: #fff;
}
.home-subtitle.withoutline {
    padding-left: 0;
}
.home-subtitle:after {
    content: "";
    position: absolute;
    left: 0;
    top: 7px;
    height: 2px;
    display: block;
    width: 50px;
    background:#FFFFFF;
}
.home-subtitle.withoutline:after {
    content: none;
}

@media (max-width: 991px) {
    .home-title,
    .home-title.fs60 {
        font-size: 40px;
            line-height: 1.1em;

        
    }
    .home-subtitle {
        font-size: 16px;
        line-height: 1.2em;
    }
    .home-subtitle:after {
        top: 6px;
    }
}
@media (max-width: 767px) {
    .home-text {
        padding: 40px;
    }
    .home-title,
    .home-title.fs60 {
        font-size: 25px;
         line-height: 1.2em;


    }
    .home-subtitle {
        font-size: 12px;
        line-height: 1.4em;
        margin-top: 10px;
    }
    .home-subtitle:after {
        top: 5px;
    }
    
    .logo-container{
        width:80%;
    }
}





.home-title-1 {
    width: 100%;
    font-family: 'Roboto', sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.1em;
    position: relative;
    margin: 0;
    word-wrap: break-word;
    color: #fff;
    margin-bottom: 40px;
}
.home-line-1,
.home-line-2 {
    width: 100px;
    height: 2px;
    display: block;
}
.home-line-1 {
    margin: 0 auto 40px;
}
.home-line-2 {
    width: 50px;
    margin: 0 0 28px 0;
}

@media (max-width: 767px) { 
    .home-title-1 {
        font-size: 30px;
        margin-bottom: 20px;
            line-height: 1.1em;

    }
    .home-line-1 {
        margin: 0 auto 20px;
    }
    .home-line-2 {
        margin: 0 0 20px 0;
    }
}
/**/


.quoteblock{
    padding-left:5%; 
    border-left:2px solid #e3e5e5;
    margin-top:50px;
    margin-bottom:50px;
}



.terugnaaroverzicht{
    font-family: 'Roboto', sans-serif;
    color:#0a0a0a;
}


.overzichtrij{
    background-color:#f5f7f7;
}

.title{
    font-size:24px;
    line-height:38px;
}

.tekstoverzichtcontainer{
    padding:15%;
}

.overzicht-img{
    background-size:cover; 
    background-position:center center; 
    min-height:250px;
}




/*==start===hover link effect lees meer================*/
.link-hs::after{
    background-color:#085afb;
}


.link-hs {
    font-size: 11px;
    font-weight: 700;
    line-height: 1;   
    position: relative;
    float: left;
    margin: 0;
    margin-top: 40px;
    padding-left: 60px;
    /*text-transform: uppercase;*/
    color: #353c3e;
}
a.link-hs {
    text-decoration: none;
}
.link-hs:after {
    content: "";
    position: absolute;
    display: block;
    width: 100px;
    height: 2px;
    top: 5px;
    left: -50px; 
    -webkit-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0);  
    -moz-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0); 
    -o-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0);
    -ms-transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0); 
    transition: all 0.3s cubic-bezier(0.0, 0.0, 0.3, 1.0);
}
.link-hs:before {
    content: "";
    position: absolute;
    display: block;
    width: 100px;
    height: 2px;
    top: 5px;
    left: -50px; 
    background: #737d80;
}
.link-hs:hover:after {
    width: 0;
}
.link-hs.right {
    float: right;
    padding-right: 60px;
    padding-left: 0;
}
.link-hs.right:after {
    right: -50px;
    left: auto;
}
.link-hs.right:before {
    right: -50px;
    left: auto;
}

@media (max-width: 1199px) {
    .link-hs {
        margin-top: 30px;
    }
}
@media (max-width: 991px) {
    .link-hs {
        margin-bottom: 80px;
        padding-right: 0;
        padding-left: 110px;
    }
    .link-hs:after {
        left: 0;
    }
    .link-hs:before {
        left: 0; 
    }
    .link-hs.right {
        float: left !important;
        padding-left: 110px;
    }
    .link-hs.right:after {
        left: 0;
        right: auto;
    }
    .link-hs.right:before {
        left: 0; 
        right: auto;
    }
}
/*==einde===hover link effect lees meer================*/


.hs-height-i,
.hs-height-c {
    height: 585px;
}
@media (max-width: 1199px) {
    .half-title {
        font-size: 22px; 
        margin-bottom: 30px;
    }
    .hs-height-i,
    .hs-height-c {
        height: 485px;
    }
}
@media (max-width: 991px) {
    .hs-height-i {
        height: 750px;
    }
    .hs-height-c {
        height: auto;
    }
}




.section-title::after{
    background-color:#085afb;
}

.section-title,
.section-title-center {
    font-family: 'Roboto', sans-serif;
    font-size: 24px;
    line-height: 1.2;
    padding-left: 60px;
    margin-top: 0;
    margin-bottom: 0;
    color: #646464;
}
.text-right .section-title {
    text-align: right;
    padding-left: 0;
    padding-right: 60px; 
}
.section-title:after {
    content: "";
    position: absolute;
    display: block;
    width: 50px;
    height: 2px;
    top: 13px;
    left: 15px; 
}
.text-right .section-title:after {
    right: 15px; 
    left: auto;
}
.section-title-center {
    text-align: center;
    padding-left: 0;
}
.section-title-center:before {
    content: "";
    position: relative;
    display: inline-block;
    width: 50px;
    height: 2px;
    top: -8px;
    left: -10px; 
}



/* Counter */
.counter-no {
    font-family: 'Roboto', sans-serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1;
    color:#646464;
    }
    
    .counter-no-2 {
    font-family: 'Roboto', sans-serif;
    font-size: 40px;
    font-weight: 400;
    line-height: 1;
    color:#646464;
    }
.counter-title {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    margin-top: 0;
    margin-bottom: 0;
    padding: 6px 0;
    color:#646464;
}

.artikelcontent{
    
}

.artikelcontent h3{
    margin-top:40px;
    margin-bottom:5px;
    color:#0a0a0a;
    font-size:25px;
    /* 
    font-weight:700;
    font-family:"lato", sans-serif;
    text-transform: none;
    font-weight:bold;*/
}


.artikelcontent p{
    margin-bottom:25px;
}


.artikelcontent .tussenblok{
    background:#ffd2ad; 
    padding:40px 40px 15px 40px; 
    margin-bottom:30px;
}

.artikelcontent .tussenblok h3{
    color:#0000a4;
    margin-top:0;
}

.artikelcontent .tussenblok p{
    color:#0000a4;
}


.artikelcontent .tussenblok ul,
.artikelcontent .tussenblok ul li a,
.artikelcontent .tussenblok ol li a{
    font-family: 'Roboto', sans-serif;
    color:#0000a4;
}

.artikelcontent .tussenblok a:hover{
    color:#3EA63D;
}

.artikelcontent .tussenblok ul li a,
.artikelcontent .tussenblok ol li a{
    text-decoration:underline;
}

.artikelcontent .tussenblok ul li,
.artikelcontent .tussenblok ol li{
    margin-bottom:20px;
}

.cta-border{
    border-top:1px solid #646464; 
    border-bottom:1px solid #646464;
}

.cta-content{
    padding:0px 30px 30px 30px;
}

.footer{
    background-color:#0000a4;
    color:#acbbbf;
    padding-top:40px;
    padding-bottom:20px;
}

.footer p{
    color:#FFFFFF;
}

.footer .logo img{
    height:80px;
}


.ctapop{
    position:fixed; 
    top:155px; 
    left:0; 
    max-width:250px; 
    background:rgba(0,0,164,0.8); 
    color:#FFFFFF; 
    z-index:999999999;
    line-height:20px;
    font-family: 'Roboto', sans-serif;
    font-weight:400;
    font-style: normal;
    text-align:left;
}

.ctapop p{
    margin-bottom:0;
    color:#FFFFFF;
}

.cta-padding{
    padding:20px 20px 20px 30px;
}

.cta-padding h3{
    font-size:12px;
    margin-bottom:10px;
}

.cta-padding a{
    font-size:10px;
}

.ctapop a{
    color:#FFFFFF;
}

.corners{
    /*border-radius:0px 80px 0 0;*/
}

.btn{
    border-radius:0;
}

.filterbtn{
    background-color:#0000a4;
    font-family: 'Roboto', sans-serif;
    color:#FFFFFF;
    border:0px solid #FFFFFF;
    /*border-radius: 12px;*/
    padding-left:20px;
    padding-right:20px;
    padding-bottom:10px;
    padding-top:10px;
}

.filterbtn:hover{
    background-color:#333333;
    color:#FFFFFF;
}

.btndonkergroen{
    background:#0000a4;
    color:#FFFFFF;
}

.btnlichtgroen{
    background:#FFFFFF;
    color:#0000a4 !important;
}

.btnlichtgroen:hover{
    background:#0000a4;
    color:#FFFFFF !important;
}

.btnoverzicht{
    border:1px solid #646464;
    color:#646464;
    border-radius:0;
    font-family: 'Roboto', sans-serif;
    font-weight:400;
    font-size:14px;
}

.btnoverzicht:hover{
    background:#646464;
    color:#FFFFFF;
}

.overzichttop{
    background-size:cover;
    background-position:center center; 
    /*border-radius:0px 80px 0 0px;*/
    min-height:200px;
}

.overzichtbottom{
    background-size:cover;
    background-position:center center; 
    /*border-radius:0px 0px 25px 25px;*/
}

.overzichtlinks{
    background-size:cover;
    background-position:center center; 
    /*border-radius:25px 0 0 25px;*/
}

.overzichtrechts{
    background-size:cover;
    background-position:center center;
    /*border-radius:0 25px 25px 0;*/
}

.overzichtbgdonker{
    background:#046A38;
}

.overzichtbglicht{
    background:#6cc24a;
}



.nieuwsbladheader, .standaardheader, .krantheader{
    width:100%;
}

.nieuwsbladheader, .standaardheader{
    min-height:50px;
    height:150px !important;
    border:none; 
    margin:0;
    
    overflow:hidden !important;
}

.standaardheader{
    height:100px !important;
}

.copyright{
    position:absolute; 
    right:0; 
    bottom:-15px; 
    font-size:10px;
}


@media(min-width:1040px){
    .nieuwsbladheader{
        margin-bottom:-10px;
    }
    
}

@media(max-width:1039px){
    .nieuwsbladheader{
        min-height:30px !important;
        height:100px !important;
    }
    
    .overzichtimg{
        min-height:240px; 
        /*border-radius:25px 25px 0 0;*/
    }
    
    .overzichtbgdonker, .overzichtbglicht{
       /* border-radius:0 0 25px 25px;*/
    }
    
}

@media(max-width:767px){
    
    .standaardheader{
        min-height:30px !important;
        height:70px !important;
    }
    
    .artikel-header{
        height:25vh;
    }
    
    .home-header{
        height:30vh;
    }
    
    
    .overzichtimg{
        min-height:240px; 
        /*border-radius:25px 25px 0 0;*/
    }
    
    .overzichtbgdonker, .overzichtbglicht{
        /*border-radius:0 0 25px 25px;*/
    }
    
}

@media(max-width:614px){
    .nieuwsbladheader{
        min-height:30px !important;
        height:35px !important;
    }
    
    .krantheader{
        height:40px !important;
    }
    
    .standaardheader{
        height:70px !important;
    }
}
