/* base colors */

body {
  background: #fafafa;
  color: #404040;
}
a {
  color: #5b9bd5;
}
a:hover {
  color: #404040;
}
.asphalt {
  background: #404040;
  color: #fefefe;
}
.asphalt a {
  color: #fefefe;
}
.asphalt a:hover {
  color: #fafafa;
}
.dutch {
  background: #5b9bd5;
  color: #fefefe;
}
.dutch a {
  color: #fefefe;
}
.dutch a:hover {
  color: #fafafa;
}
.dimmed {
  background: #fafafa;
  color: #404040;
}
.regular {
  background: #fefefe;
  color: #404040;
}
.btn-dutch {
  background: #404040;
  color: #fefefe;
}
.btn-dutch:hover {
  background: #5b9bd5;
  color: #fefefe;
}
.btn-allNews:hover {
  background: #404040;
  color: #fefefe;
}
.btn-allNews {
  background: #5b9bd5;
  color: #fefefe;
}
.mainTitle,
.pageTitle {
  color: #fefefe;
}
.newsTitle {
  color: #5b9bd5;
}
.contactTitle {
  color: #fefefe;
}
.sectionTitle {
  color: #fefefe;
}
.mainHeroSearch input.search-input {
  color: #5b9bd5;
}
.contactform input,
.contactform textarea {
  color: #5b9bd5;
}
.btn-contactform {
  background: #fefefe;
  color: #5b9bd5;
}
.btn-contactform:hover {
  background: #404040;
  color: #fefefe;
}
.social-list a i {
  color: #fefefe;
}
.social-list a:hover i {
  color: #5b9bd5;
}
.dutch .social-list a:hover i {
  color: #404040;
}
footer span {
  color: #aaa;
}
.navbar-dark li.nav-item a.nav-link {
  color: #fefefe;
}
.navbar-dark li.nav-item a.nav-link:hover {
  color: #5b9bd5;
}
.currentDutch {
  color: #5b9bd5;
}
.postMeta {
  color: #404040;
}
header.asphalt nav.navbar-dark ul.navbar-nav li.active a,
header.asphalt nav.navbar-dark ul.navbar-nav li.active ul li.active a {
  color: #5b9bd5;
}
header.asphalt nav.navbar-dark ul.navbar-nav li.active ul li a,
header.asphalt nav.navbar-dark ul.navbar-nav li.active ul li.active a:hover  {
  color: #fefefe;
}
.dimmed .sidebar li,
.dimmed .sidebar h5,
.regular .sidebar li,
.regular .sidebar h5,
.dutch .sidebar li,
.dutch .sidebar h5 {
  color: #404040;
}

/* typography */

body {
    font-family: "Regular", "Verdana", sans-serif;
    line-height: 170%;
    font-size: 95%;
}
h1, h2, h3 {
  font-family: "Black", "Verdana", sans-serif;
  font-weight: normal;
}
h4, h5, h6 {
  font-family: "Extrabold", "Verdana", sans-serif;
  font-weight: normal;
}
strong, b {
  font-family: "Bold", "Verdana", sans-serif;
  font-weight: normal;
}
em, blockquote {
  font-family: "Italic", "Verdana", sans-serif;
  font-style: normal;
}
.sectionTitle {
  font-family: "Black", "Verdana", sans-serif;
  font-weight: normal;
}
.mainHeroBox h3 {
  font-size: calc(75% + .2vw + .2vh);
}
.mainHeroBox h6 {
  font-size: 1.1rem;
  line-height: 1.8rem;
}

.contactTitle {
  font-size: calc(100% + 2vw + 2vh);
  font-family: "Extrabold", "Verdana", sans-serif;
}
.btn-dutch {
  font-family: "Medium", "Verdana", sans-serif;
}
.btn-allNews {
  font-family: "Semibold", "Verdana", sans-serif;
  font-size: 1.2rem;
}
.mainTitle {
  font-size: calc(100% + 2vw + 2vh);
}
.pageTitle {
  font-size: calc(35% + 1.5vw + 1.5vh);
}
.sectionTitle {
  font-size: 2rem;
}
.mainHeroBox i {
  font-size: 2rem;
}
.mainHeroSearch input.search-input {
  font-family: "Medium", "Verdana", sans-serif;
  font-size: 1.25rem;
}
.mainHeroSearch button.search-button {
  font-size: 1.25rem;
}
.btn-contactform {
  font-family: "Semibold", "Verdana", sans-serif;
  font-size: 1.2rem;
}
.social-list i {
  font-size: calc(50% + .8vw + .8vh);
}
.socialText {
  font-family: "Medium", "Verdana", sans-serif;
}
footer {
    font-size: .9rem;
    line-height: 1.5rem;
}
li.nav-item {
  font-family: "Medium", "Verdana", sans-serif;
}
.postMeta {
  font-family: "Bold", "Verdana", sans-serif;
  font-size: calc(50% + .5vw + .5vh);
}
.singlecontent a {
  font-family: "Semibold", "Verdana", sans-serif;
}
.singlecontent h5 a {
  font-family: "Bold", "Verdana", sans-serif;
  font-weight: normal;
}
.singlecontent a.tagLink {
  font-family: "Regular", "Verdana", sans-serif;
}

/*********************************************************/

#mainHeader {
  position:fixed;
  z-index: 9999;
  width: 100%;
}
.jumbotron {
 background-image: url('../images/heroBg.jpg');
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center;
 min-height: 100vh;
 border-radius: 0;
 padding-top: 30vh;
}

.heroTitle {
  color: #fefefe;
  font-size: calc(85% + 1.5vw + 1.5vh);
  text-shadow: 0px 0px 5px #404040;
}

@media screen and (max-width: 800px) {
  .heroTitle {
    font-size: calc(70% + 1.1vw + 1.1vh);
  }
  h3, .h3 {
    font-size: 1.2rem;
  }
  h4, .h4 {
    font-size: 1.1rem;
  }
  h5, .h5 {
    font-size: 1.05rem
  }
}

hr.heroDivider {
  border-top: 1px solid #fefefe;
  width: 7rem;
}

.heroTagline {
  color: #fefefe;
  font-size: calc(25% + .8vw + 1vh);
  font-family: "Extrabold", "Verdana", sans-serif;
  text-shadow: 0px 0px 5px #404040;
}

.heroArrow a {
  color: #fefefe;
  font-size: calc(50% + 2vw + 1vh);
  text-shadow: 0px 0px 5px #404040;
}

.boxTitle {
  font-size: 1.2rem;
  font-family: "Extrabold", "Verdana", sans-serif;
}
.boxTitle a:hover {
  text-decoration: none;
}
.boxIcon a {
  font-size: 1.75rem;
  color: #5b9bd5;
}
.box:hover .boxIcon a {
  color: #404040;
}
.boxIcon a:hover {
  color: #404040;
}
.boxText blockquote {
  font-family: "Regular", "Verdana", sans-serif;
  font-style: normal;
}

#blocks {
   min-height: 100vh;
   padding-top: 10vh;
}

.blocksTitle h2 {
  color: #404040;
  font-size: calc(50% + 2vw + 2vh);
  font-family: "Extrabold", "Verdana", sans-serif;
  margin: -2rem auto;
}

hr.blocksDivider {
  border-top: 1px solid #5b9bd5;
  width: 7rem;
}

.blocksTagline {
  color: #404040;
  font-size: calc(25% + .8vw + 1vh);
  font-family: "Extrabold", "Verdana", sans-serif;
}
.blocksArrow a {
  color: #5b9bd5;
  font-size: calc(50% + 2vw + 1vh);
}

#news {
 background-image: url('../images/newsBg.jpg');
 background-size: cover;
 background-repeat: no-repeat;
 background-position: bottom;
 min-height: 100vh;
 padding-top: 10vh;
}

.newsTitle h2 {
  color: #fefefe;
  font-size: calc(50% + 2vw + 2vh);
  font-family: "Extrabold", "Verdana", sans-serif;
  text-shadow: 0px 0px 5px #404040;
  margin: -2rem auto;
}

hr.newsDivider {
  border-top: 1px solid #fefefe;
  width: 7rem;
}

.newsTagline {
  color: #fefefe;
  font-size: calc(25% + .8vw + 1vh);
  font-family: "Extrabold", "Verdana", sans-serif;
  text-shadow: 0px 0px 5px #404040;
}

.newsArticle {
  min-height: 35vh;
}

.newsItemCover img {
  max-width: 100%;
  height: auto;
}

.newsItemTitle {
  font-size: 1.05rem;
  line-height: 150%;
  word-break: break-word;
}

.newsItemTitle a {
  color: #5b9bd5;
}
.newsItemTitle a:hover {
  color: #404040;
  text-decoration: none;
}
.newsArrow a {
  color: #fefefe;
  font-size: calc(50% + 2vw + 1vh);
  text-shadow: 0px 0px 5px #404040;
}

#contact {
 background-image: url('../images/mainContact-bg.jpg');
 background-size: cover;
 background-repeat: no-repeat;
 background-position: bottom;
 min-height: 100vh;
 padding-top: 10vh;
}

#pageHero .heroTitle {
  text-shadow: 0px 0px 5px #404040;
}

#pageHero .pageTagline,
#pageHero .pageTagline blockquote {
  color: #fefefe;
  text-shadow: 0px 0px 8px #404040;
  font-size: 1.1rem;
  line-height: 1.75rem;
  font-family: "Bold", "Verdana", sans-serif;
  font-style: normal;
}

#pageHero .heroArrow {
  text-shadow: 0px 0px 5px #404040;
}

#topics {
  min-height: 100vh;
  padding-top: 10vh;
  margin-bottom: -10vh;
}
#topics blockquote {
  font-family: "Regular", "Verdana", sans-serif;
}
#content {
  min-height: 100vh;
  padding-top: 10vh;
}

#content .icon {
  font-size: 3rem;
}
article {
  margin: auto 1rem;
}
article p {
  margin: 1.5rem 0;
  word-wrap: break-word;
}
article h1,
article h2,
article h3,
article h4,
article h5,
article h6 {
  line-height: 150%;
  margin: 2rem auto;
}
article .card button {
  color: #5b9bd5;
  text-decoration: none;
}
article .card button:hover,
article .card button:focus,
article .card button:active {
  color: #404040;
  text-decoration: none;
}
article table {
  width: 100%;
  border: 1px solid #404040;
  margin: 3rem auto;
}
article table th,
article table tr,
article table td {
  border: 1px solid #404040;
}
article table td,
article table th {
  padding: .5rem;
}
article table th {
  background: #404040;
  color:  #fefefe;
  font-family: "Medium", "Verdana", sans-serif;
}
article table th:empty {
	display: none;
}
article blockquote {
  border-left: 3px solid #5b9bd5;
  padding-left: 3rem;
}
.limage {
  max-width: 160%;
  margin: 3rem -30%;
}
@media screen and (max-width: 994px) {
  .limage {
    max-width: 100%;
    margin: 3rem 0;
  }
}
.limage blockquote {
  border-left: none;
  padding-left: 0;
  font-family: "Regular", "Verdana", sans-serif;
  font-style: normal;
}
.limage h3.boxTitle {
  margin-bottom: .5rem;
}
figure {
  width: 100%;
  text-align: center;
}
figure img {
  max-width: 100%;
  height: auto;
}
figure iframe,
#player {
  width: 100% !important;
  height: auto;
}
figure ul {
  margin: 1.5rem 0;
  padding: 0;
}
figure ul li {
  list-style: none;
  margin: 2%;
  padding: 0;
  display: block;
  width: 46%;
  float: left;
}
figure ul:after {
  content:"";
  display:block;
  clear:both;
 }
figcaption {
  margin: 1.5rem auto;
  font-size: 80%;
  font-family: "Italic", "Verdana", sans-serif;
  font-style: normal;
}
article a {
  font-family: "Medium", "Verdana", sans-serif;
}
article h2.boxTitle a,
article h3.boxTitle a {
  font-family: "Extrabold", "Verdana", sans-serif;
}
article h2.boxTitle,
article h3.boxTitle {
  margin: 0 0 2rem 0;
}
.blogpostDate date {
  font-family: "Medium", "Verdana", sans-serif;
  font-size: .8rem;
  color: #5b9bd5;
}
.subpageIcon {
  font-size: 3rem;
}

.subpageTitle h1,
.subpageTitle h2 {
  color: #404040;
  font-size: calc(50% + 2vw + 2vh);
  font-family: "Extrabold", "Verdana", sans-serif;
  line-height: 150%;
}

.info {
  background: #5b9bd5;
  padding: 1rem 2rem;
  color: #fefefe;
  position: relative;
  margin: 2rem 0;
  border-radius: 2px;
}
.info:before {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f05a";
  color: #fefefe;
  font-size: 1.5rem;
}
.info a {
  color: #fefefe;
  text-decoration: underline;
}
.info a:hover {
  text-decoration: none;
}
.alert {
  background: #404040;
  padding: 1rem 2rem;
  color: #fefefe;
  position: relative;
  margin: 2rem 0;
  border-radius: 2px;
}
.alert:before {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0c1";
  color: #fefefe;
  font-size: 1.5rem;
}
.alert a {
  color: #fefefe;
  text-decoration: underline;
}
.alert a:hover {
  text-decoration: none;
}
.danger {
  background: #fafafa;
  padding: 1rem 2rem;
  color: #404040;
  position: relative;
  margin: 2rem 0;
  border-radius: 2px;
  border: 2px solid #404040;
}
.danger:before {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f030";
  color: #404040;
  font-size: 1.5rem;
}
.danger a {
  color: #404040;
  text-decoration: underline;
}
.danger a:hover {
  text-decoration: none;
}

.fact {
  background: #fafafa;
  padding: 1rem 2rem;
  color: #5b9bd5;
  position: relative;
  margin: 2rem 0;
  border-radius: 2px;
  border: 2px solid #5b9bd5;
}
.fact:before {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0eb";
  color: #5b9bd5;
  font-size: 1.5rem;
}
.fact a {
  color: #5b9bd5;
  text-decoration: underline;
}
.fact a:hover {
  text-decoration: none;
}

.personas .info:before,
.personas .fact:before,
.personas .danger:before,
.personas .alert:before {
  position: absolute;
  top: .5rem;
  right: .5rem;
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "";
  color: #fefefe;
  font-size: 1.5rem;
}

.personas .fact {
	text-align: right;
}

.personas .info img,
.personas .danger img,
.personas .alert img {
	max-width: 33%;
	height: auto;
	float: right;
	margin: 1.5rem 0 1rem 1rem;
}

.personas .fact img {
	max-width: 33%;
	height: auto;
	float: left;
	margin: 1.5rem 1rem 1rem 0;
}

.personas .fact ul li {
  margin-left: 2rem;
}

.lastMod {
  font-size: .8rem;
}
.pagination {
  margin: 4rem 0 2rem 0;
  width: 100%;
}
.btn-paginate {
  margin: 0 .5rem;
  min-width: 3rem;
  color: #5b9bd5;
}
.btn-paginate:hover {
  border: 1px solid #5b9bd5;
  background: #5b9bd5;
  color: #fefefe;
}
.btn-current {
  border: 1px solid #404040;
  background: #404040;
  color: #fefefe;
}
.btn-current:hover {
  color: #fefefe;
}
.tagLink {
  white-space: nowrap;
  margin: 0 2rem 0 0;
}

/* ============ desktop view ============ */
@media all and (min-width: 992px) {
	.navbar .nav-item .dropdown-menu{ display: none; }
	.navbar .nav-item:hover .nav-link{ color: #fff;  }
	.navbar .nav-item:hover .dropdown-menu{ display: block; }
	.navbar .nav-item .dropdown-menu{ margin-top:0; }
}
.dropdown-menu {
  background: #404040;
  padding: .5rem 0;
  border: 0 none;
}
.dropdown-menu a:hover {
  background: #5b9bd5;
}
/* ============ desktop view .end// ============ */
figure.video {
  margin: 2rem auto;
}
figure.video iframe {
  min-height: 410px;
  border: 0 none;
}
.limage figure.video iframe {
  min-height: 656px;
}
@media screen and (max-width: 994px) {
  .limage figure.video iframe {
    min-height: 360px;
  }
}
div.clear {
  clear: both;
}
.embed-container {
  margin-bottom: 1.5rem;
}
.card-columns {
  margin: 1.5rem 0;
}
element.style {
}
@media (min-width: 576px) {
  .card-columns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
  .card-columns-onecol {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
}
@media (min-width: 990px) {
  .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
  }
  .card-columns-twocol {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
  }
  .card-columns-onecol {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
  }
}
#cookie-modal {
  max-width:100%;
}

.newsArticle img {
  width: 100%;
  height: auto;
}

.featured-toast {
  z-index: 5;
  right: 0;
  bottom: 0;
  width: 80%;
  max-width: 550px;
  min-height: 200px;
}

.toast {
  max-width: 100%;
  min-height: 200px;
  background: #5b9bd5;
  color: #fefefe;
}

.toast-header {
  background: #5b9bd5;
  color: #fefefe;
}
.toast-header .close {
  text-shadow: none;
}
.toast-header span {
  color: #fefefe;
}
.toast i {
  font-size:75%;
  margin: 10px 5px auto 3px;
}

.toast button {
  margin-top: 4px;
}

.toast-body, .toast-header {
  padding: 1rem 1.5rem;
}

.toast-body a {
  color: #fefefe;
  font-family: "Bold", "Verdana", sans-serif;
}
.btn-asphalt {
  background: #fefefe;
  color: #5b9bd5 !important;
}
.btn-asphalt:hover {
  background: #404040;
  color: #fefefe !important;
}
.pageLink {
  border: 1px solid #5b9bd5;
  padding: 1.5rem;
  display: block;
  margin: 1.5rem 0;
}

.pageLink img {
  max-width: 100%;
  height: auto;
}

.pageLink h6 {
  margin: 0 auto 1rem 0;
}

.pageLink h6 a {
  font-family: "Extrabold", "Verdana", sans-serif !important;
}
