@font-face {
    font-family: intro-bold;
    src: url(INTRO-BOLD.OTF);
    font-display: swap;
}

:root {
  --mainColor: #f63a3a;
  --mainTextColor: #212529;
  --navColor: #ffffff;
  --navColor: #ffffff;
}

h1, h2, h3, h4, h5, h6 {
font-family: intro-bold;
}

body {
color:var(--mainTextColor);
}

/*
 * BG Colors
 */
.bg-actueel {background-color:#242424;}
.bg-korting {background-color:#e74340;}
.bg-drogist {background-color:#b1b62c;}
.bg-bouwen {background-color:#562cb6;}
.bg-politiek {background-color:#5b4cce;}
.bg-computers{background-color:#b32c25;}
.bg-cultuur{background-color:#61370d;}
.bg-geldzaken{background-color:#2b43d9;}
.bg-gezondheid{background-color:#d41111;}
.bg-gokken{background-color:#e7ab0a;}
.bg-hobbies{background-color:#d46810;}
.bg-horeca{background-color:#e89738;}
.bg-internet{background-color:#1635d1;}
.bg-mode{background-color:#b916d1;}
.bg-muziek{background-color:#d49610;}
.bg-onderwijs{background-color:#2aac8f;}
.bg-recreaties{background-color:#2aac6e;}
.bg-reizen{background-color:#ccd223;}
.bg-sport{background-color:#30d223;}
.bg-tuin{background-color:#30d223;}
.bg-vakantie{background-color:#ccd223;}
.bg-vervoer{background-color:#23d2d0;}
.bg-verzekeren{background-color:#2a71ac;}
.bg-wonen{background-color:#6e2aac;}
.bg-zakelijk{background-color:#092763;}
.bg-tips{background-color:#dbbc0f;}
.bg-informatief{background-color:#0f9adb;}
.bg-liefde{background-color:#db0f0f;}
.bg-dieren{background-color:#62ba3f;}

.bg-main  {background-color:var(--mainColor);}


/** Global **/

a {color: var(--mainColor); }

.topbar {font-family: intro-bold; background: #1d1d1d; padding: 10px 0px; text-align: right;}

.topbar a {color:#ffffff; margin:0px 10px; text-decoration: none;}
.topbar a:hover {color:var(--mainColor);}

.logo {max-height: 60px;}


/** Navbar **/

.navbar {
  font-size: 18px;
  font-family: intro-bold;
}

.navbar-light .navbar-nav .nav-link {
  font-weight: bold;
  margin: 0px 20px;
  color:#000000;
}

.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
      color: var(--mainColor);
}



/** Blogpost **/


.blog-header {border-bottom: 1px #eee solid;}

.blog-post {
  margin-bottom: 4rem;
}
.blog-post-title {
  margin-bottom: .25rem;
  font-size: 2.5rem;
}
.blog-post-meta {
  margin-bottom: 1.25rem;
  color: #727272;
}

.blogimg {float: left; margin:0px 30px 30px 0px; max-width: 250px;}

/** Card **/

.card {
  transition: all 0.4s;
  background: #f8f9fa;
  border-radius: 10px;
  border: none;
}

.card-body {padding:1.5rem;}

.card .radiusimg {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.card:hover {
    -webkit-box-shadow: 11px 10px 38px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 11px 10px 38px rgba(0, 0, 0, 0.1);
    box-shadow: 11px 10px 38px rgba(0, 0, 0, 0.1);
    background: #fff;
}

.card h3 {font-size: 1.1rem; line-height: 1.1;}
.card h3 a {color:#212529; text-decoration: none;}
.card h3 a:hover {color: var(--mainColor);}

.card p {font-size: 0.9rem;}

.card-sidebar .card-body {padding:0.5rem 1rem 0.5rem 0rem;}

.sidebarimg {
  height:100%;
  width:100%;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-top-right-radius:0px;
  object-fit: cover;
}

/** CTA **/
.cta .btn-success {background: #fff; border:none; color:var(--mainColor)}

/** Listgroup **/

.list-group {font-family: intro-bold;}
.list-group-item {background: none; padding-left:0px;}
.list-group-item a {color:var(--mainTextColor); text-decoration: none;}
.list-group-item a:hover {color:var(--mainColor);}
/** Footer **/

footer {
border-top: .05rem solid #e5e5e5;
background-color: #f9f9f9;
}
.bottom-footer {
  color: #ffff;
  font-family: intro-bold;
  background: #1d1d1d;
  padding: 20px 0px;
}

.bottom-footer p {margin:0;}

.bottom-footer a {text-decoration: none;}