@import "/blog/css/vars.css?v=22"; 
/*@import url('https://fonts.googleapis.com/css2?family=Hind:wght@300;400;500;600&display=swap'); */

/*Eigen CSS */
/*body { font-family: 'Hind', sans-serif !important; letter-spacing:0.5px !important; font-size: 1.3rem !important;}
h1, .h1 { font-family: 'hind', sans-serif !important; font-weight: 500; font-size: 48px; letter-spacing:2px; } */
.lead { letter-spacing:0.5px; font-size: 1.5rem; color: var(--senz-lead-text); }
h2 { font-family: 'Open Sans', sans-serif !important; letter-spacing:2px; }
h3 { font-family: 'Open Sans', sans-serif !important; }

.cleanlink, .cleanlink:hover { text-decoration:none; }

#bg-loading { position: absolute; z-index: 99999; width:97%; height:100%; background-color:rgba(255,255,255,0.8); padding-top: calc(20% - 35px); padding-left: calc(50% - 35px); display:none;}
#bg-loading i { position:relative;float:left; }

/* Categorie kleuren */
.text-bg-blog-red { color: #fff !important;background-color: #cd1719 !important; }
.text-bg-blog-grey { color: #fff !important;background-color: #707475 !important; }
.text-bg-blog-navy { color: #fff !important;background-color: #263553 !important; }
.text-bg-blog-black { color: #fff !important;background-color: #000000 !important; }
.text-bg-blog-lavender { color: #fff !important;background-color: #857e90 !important; }
.text-bg-blog-green { color: #fff !important;background-color: #4b532f !important; }
.text-bg-blog-blue { color: #fff !important;background-color: #697f91 !important; }

.btn { border-radius: 0 !important; }
.input-group button.btn { padding: 0px 20px;}
.btn-outline-blue, .btn-outline-blue:active, .btn-outline-blue:visited {  background-color: rgb(255,255,255,0.6); border-color: var(--senz-dark) !important; color: var(--senz-dark) !important; }
a.btn-outline-blue:hover, button.btn-outline-blue:hover {
    background-color: var(--senz-dark) !important;color: #f2f2f2 !important; transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; }
.soft { font-weight:300; }
.z-low { z-index: 500 !important; }
.z-high { z-index: 1010 !important; }

.padded-md { padding-top: 35px; padding-bottom: 35px; }
.padded-xl { padding-top: 70px; padding-bottom: 70px; }

.progress{ height:4px; background: #f2f2f2; width:100%; border-radius:0 !important;}
.progress__highlight{ transition: width 0.15s linear; background:#000000; height:100%; width:0%;}

/*Table */
.table thead th { border:0 !important; }
.table-bordered td, .table-bordered th { border:0; }
.table tbody td, .table tbody th { border-top: 1px solid #dee2e6 !important; }

/* Header */
header { background-color: #ffffff; padding-top: 8px; padding-bottom: 10px;  }
header nav { border-bottom: 1px solid #000000; padding-bottom: 10px; }
header nav a { text-decoration: none; color: #ababab; margin-right: 15px; font-size: 1.2rem;  }
header nav a:hover { color: #000000; }
header nav .btn-xs { padding: 0px 5px; }

header #logobar { margin-top: 30px; margin-bottom: 20px;  }
header #logobar #logo { max-height: 40px; }
header #logobar a { color: #343434; text-decoration: none; font-size: 1.2rem; line-height: 40px; margin-right: 25px; font-weight: 500;}
header #logobar a:hover, header #logobar a.active { color: #0000FF; }
header #logobar a.active::before { content: '\2022'; margin-right:10px; }

#subscrbar { margin-bottom: 30px; }
#subscrbar .alert { padding: 0.8rem 1rem; font-size: 1rem; }

/* Blog overview */
section#blogs .card a {text-decoration: none; }
section#blogs .card .nav-item { font-size: 15px; }
section#blogs .card .nav-item.date::before { font-family: "Font Awesome 5 Free";font-weight: 900;content: '\f133'; margin-right: 8px; font-size: 80%; }
section#blogs .card .nav-item.read::before { font-family: "Font Awesome 5 Free";font-weight: 900;content: '\f253'; margin-right: 8px; font-size: 80%; }

/* Share */
#sharebar { background-color: #f2f2f2; font-size: small; padding: 15px; }

/* Blog article */
#paragraph1 p:first-child::first-letter { font-weight: bold; font-size:65px;float:left;margin:-12px 10px 0 0;}

/*Footer */
section#footer { background: var(--senz-dark); padding: 40px 0 60px 0; color: #AAAAAA; font-size: 1.1rem;}
section#footer i.fa { color: #C0c0c0; width:30px;}
section#footer span.filler { padding-left:30px;}
section#footer h4 { text-decoration: none; font-size: 1.25rem;color: #f2f2f2; }
section#footer a { color: #bcbcbc; text-decoration:none;}
section#footer a:hover { color: #f2f2f2; }

/*Modal */
.modal-content, .modal-header { border-radius: 0 !important; }
.modal-footer { display: inline; }
.fields input, .fields textarea { border-radius: 0; }
.fields input { padding: 1.4rem 0.75rem !important; }

/* The side navigation menu */
.sidenav { height: 100%;  width: 0; position: fixed; z-index: 1050; top: 0; right: 0px; background-color: rgb(0, 0, 0, 0.9); overflow-x: hidden; transition: 0.5s;box-shadow: 0.5rem 0 1rem rgba(0,0,0,.35)!important; }
.sidenav .inner {  padding: 100px 30px 0 30px; }
.sidenav .border-bottom { border-color: #828282 !important; }
.sidenav a { padding: 6px; text-decoration: none; font-size: 18px; color: #c2c2c2; display: block; }
.sidenav a.h5 { margin-bottom: 0px; }
.sidenav a.sub { font-size: 14px; }
.sidenav a.sub:hover { color: #f2f2f2 !important; }
.sidenav span { padding: 8px 8px 8px 32px; text-decoration: none; font-size: 25px; display: block;border-bottom:1px solid #343434; }
.sidenav a:hover { color: #f1f1f1; }
.sidenav.menuopen { width:45%; }
.sidenav .closebtn { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px;}
.sidenav .subnav.d-none { transition: all 1s ease; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; -ms-transition: all 1s ease; }

/*Modal */
.mdlCart { }
.mdlCart .modal-header { background-color: #BFE6BF; color: #008800; }
.mdlCart .modal-header.remove { background-color: #D9534F; color: #FFDDDD; }
.mdlCart .modal-header h4 {  font-weight:bold; font-size:14px; }

#checkout [data-toggle="dropdown"]:after { margin-left: auto !important; }

.embed-responsive {  position: relative; display: block; width: 100%; padding: 0; overflow: hidden; }
.embed-responsive::before { display: block; content: ""; }
.embed-responsive .embed-responsive-item,.embed-responsive embed,.embed-responsive iframe,.embed-responsive object,.embed-responsive video {
    position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; border: 0;}
.embed-responsive-21by9::before {  padding-top: 42.857143%; }
.embed-responsive-16by9::before {  padding-top: 56.25%; }

/* Einde Eigen CSS */


/*Responsive */

@media (min-width:768px) {
}

@media (min-width:1024px) {
}

@media (max-width:1023px) {
}

@media (max-width:1200px) and (min-width:1024px) {
}

@media (max-width:768px) {
	#topbar a { font-size: 16px; }
	#sharebar a { font-size: small !important; }
}
@media (min-width: 1200px) {
	.container { margin-right: 7%!important; margin-left: 7%!important; max-width: 86%!important; }
}
/* 4K resolution */
@media (min-width: 2040px) {
}
.alert { border-radius: 0; }
.alert-dark { background-color: #000000; color: #f2f2f2; }
.badge { border-radius: 0; padding: 0.5em 0.65em 0.35em 0.65em !important; text-transform: lowercase; }
.badge i { margin-right: 5px; }
.card-grid .card-grid-lg { height: 560px; }
.card-grid .card-grid-sm {    height: calc(280px - calc(var(--bs-gutter-y) / 2)); }
.card { border:0; border-radius: 0;}
.card .card-element-hover {
  visibility: hidden;
  margin-top: 30px;
  opacity: 0;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  z-index: 9;
}
.card:hover .card-element-hover {
  visibility: visible;
  margin-top: 0px;
  opacity: 1;
}

.card.card-overlay-bottom {
  overflow: hidden;
}
.card.card-overlay-bottom:before {
  content: "";
  position: absolute;
  height: 50%;
  width: 100%;
  bottom: 0;
  left: 0;
  right: 0;
  background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(black));
  background-image: linear-gradient(180deg, transparent, black);
  z-index: 1;
}
.card .card-img-overlay {
  z-index: 2;
}

.card.card-overlay-top {
  overflow: hidden;
}
.card.card-overlay-top:before {
  content: "";
  position: absolute;
  height: 50%;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
  background-image: -webkit-gradient(linear, left bottom, left top, from(transparent), to(black));
  background-image: linear-gradient(0deg, transparent, black);
}

.card-img-scale .card-img {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.card-img-scale:hover .card-img {
  -webkit-transform: scale(1.08);
          transform: scale(1.08);
}

.card-bg-scale {
  z-index: 99;
}

.card-bg-scale::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: inherit;
  -webkit-transition: all 1s !important;
  transition: all 1s !important;
  z-index: -2;
}

.card-bg-scale:hover::after {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  -webkit-transition: all 1s !important;
  transition: all 1s !important;
}

.card-featured {
  position: absolute;
  z-index: 99;
  background: #2163e8;
  color: #fff;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
  text-align: center;
  top: -8px;
  right: -48px;
  width: 120px;
  padding: 16px 0 3px 0;
}

.card-img-flash {
  position: relative;
  overflow: hidden;
}

.card-img-flash::before {
  content: "";
  position: absolute;
  top: 0;
  z-index: 2;
  left: -80%;
  width: 50%;
  height: 100%;
  display: block;
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
          transform: skewX(-25deg);
}

.card-img-flash:hover::before {
  -webkit-animation: imgflash 1s;
          animation: imgflash 1s;
}

@-webkit-keyframes imgflash {
  100% {
    left: 125%;
  }
}
@keyframes imgflash {
  100% {
    left: 125%;
  }
}
.card-grid .card-grid-lg {
  height: 560px;
}
.card-grid .card-grid-sm {
  height: calc(280px - calc(var(--bs-gutter-y) / 2));
}

@media (max-width: 767.98px) {
  .card-grid .card-grid-lg {
    height: 400px;
  }
}
.card-fold {
  position: relative;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0);
          box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.card-fold:after {
  position: absolute;
  content: "";
  height: 0;
  width: 0;
  bottom: 0;
  right: 0;
  z-index: 1000;
  background: linear-gradient(-45deg, #fff 45%, #fff 45%, #d0d4d9 50%, #fff 70%);
  -webkit-box-shadow: -5px -5px 5px rgba(0, 0, 0, 0.4);
          box-shadow: -5px -5px 5px rgba(0, 0, 0, 0.4);
  -webkit-transition: 0.3s;
  transition: 0.3s;
  border-radius: 0.7rem 0px 0px 0px;
}

.card:hover .card-fold:after,
.card:focus .card-fold:after,
.card:active .card-fold:after,
.card:hover.card-fold:after,
.card:focus.card-fold:after,
.card:active.card-fold:after {
  width: 40px;
  height: 40px;
}
.text-bg-primary {
  color: #fff !important;
  background-color: RGBA(33, 99, 232, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-secondary {
  color: #fff !important;
  background-color: RGBA(89, 93, 105, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-success {
  color: #fff !important;
  background-color: RGBA(12, 188, 135, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-info {
  color: #fff !important;
  background-color: RGBA(79, 158, 248, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-warning {
  color: #000 !important;
  background-color: RGBA(247, 195, 46, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-danger {
  color: #fff !important;
  background-color: RGBA(214, 41, 62, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-light {
  color: #000 !important;
  background-color: RGBA(247, 248, 249, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-dark {
  color: #fff !important;
  background-color: RGBA(25, 26, 31, var(--bs-bg-opacity, 1)) !important;
}

.link-primary {
  color: #2163e8 !important;
}
.link-primary:hover, .link-primary:focus {
  color: #1a4fba !important;
}

.link-secondary {
  color: #595d69 !important;
}
.link-secondary:hover, .link-secondary:focus {
  color: #474a54 !important;
}

.link-success {
  color: #0cbc87 !important;
}
.link-success:hover, .link-success:focus {
  color: #0a966c !important;
}

.link-info {
  color: #4f9ef8 !important;
}
.link-info:hover, .link-info:focus {
  color: #3f7ec6 !important;
}

.link-warning {
  color: #f7c32e !important;
}
.link-warning:hover, .link-warning:focus {
  color: #f9cf58 !important;
}

.link-danger {
  color: #d6293e !important;
}
.link-danger:hover, .link-danger:focus {
  color: #ab2132 !important;
}

.link-light {
  color: #f7f8f9 !important;
}
.link-light:hover, .link-light:focus {
  color: #f9f9fa !important;
}

.link-dark {
  color: #191a1f !important;
}
.link-dark:hover, .link-dark:focus {
  color: #141519 !important;
}
.nav.nav-divider .nav-item {
    display: inline-block;
    vertical-align: middle;
}
.nav.nav-divider a:not(.dropdown-item) {
  color: inherit;
}
.nav.nav-divider .nav-item + .nav-item:before {
  content: "\2022";
  color: inherit;
  padding-left: 0.65rem;
  padding-right: 0.75rem;
  opacity: 0.8;
}
.nav.nav-divider .nav-item {
  display: inline-block;
  vertical-align: middle;
}
.nav.nav-divider .nav-link {
  padding: 0;
  color: inherit;
}