@charset "UTF-8";
/***!  /templates/sj_plus/css/your_css.css  !***/

body {
  font-size: 1.5em; /* adjust to make font-sizes larger or smaller */
  line-height: 1.5em; /* if you make the font size larger then increase this value, too */
}

/* Move RSSocial module above mod_languages */
@media (min-width: 992px) { /* adjust for desktop, change breakpoint if needed */
  #rssocial-146 { /* the container of your RSSocial module */
    position: absolute; /* or relative depending on template */
    top: 90px !important; /* adjust to line up vertically */
    left: 0px !important; /* adjust so Instagram icon aligns with Dutch flag */
    z-index: 999 !important; /* ensure it is above other elements */
  }
}

/* Instagram gradient background – works on all devices */
a#rssocial-instagram-icon.rssocial-link.push {
  background: linear-gradient(45deg, #f58529 0%, #dd2a7b 35%, #8134af 65%, #515bd4 100%) !important;
  background-image: linear-gradient(45deg, #f58529 0%, #dd2a7b 35%, #8134af 65%, #515bd4 100%) !important;
  background-color: transparent !important;
  color: #fff !important;
  border-radius: 11px !important;
  display: inline-block !important;
}

/* Inner span / glyph remains white */
a#rssocial-instagram-icon.rssocial-link.push .rssocial-icon {
  color: #fff !important;
  font-size: inherit !important;
}

/* Hover/focus – match the grey of other icons */
a#rssocial-instagram-icon.rssocial-link.push:hover,
a#rssocial-instagram-icon.rssocial-link.push:focus {
  background: #999999 !important;
  color: #fff !important;
}

/* Align the language flags with the top of the contact column */
@media (min-width: 992px) {
  div.mod-languages {
    position: absolute;
    top: 36px; /* align top with contact column */
    right: 197px; /* or adjust left/right as needed */
  }
}

/* to hide playlist on desktop */
@media (min-width: 575.98px) {
  .mod-jt-playlist185 {
    display: none;
  }
}

/* to style playlist */
.mod-jt-playlist185 .playlist-wrap.customstyle .PlayList {
  order: -1;
  background: #33383d;
  background: -moz-linear-gradient(top, #33383d 0%, #1c1e22 100%);
  background: -webkit-linear-gradient(top, #33383d 0%, #1c1e22 100%);
  background: linear-gradient(to bottom, #33383d 0%, #1c1e22 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#33383d', endColorstr='#1c1e22', GradientType=0);
  border-radius: 20px;
  border: 1px solid #282c31;
  height: 300px;
  overflow: auto;
}

.mod-jt-playlist185 .playlist-wrap.customstyle ul.playlist-items,
.jt-playlist.toplist .playlist-wrap.style1 ul.playlist-items {
  background: var(--containerbg-color);
}

.module h3.modtitle {
  padding: 16px 0px;
  border-bottom: solid 1px #ccc !important;
  text-transform: none !important;
}

.module_menu,
div.module {
  margin: 0 0 15px;
}

.mod-jt-playlist185 .playlist-wrap.customstyle .jt-playlist-container,
.mod-jt-playlist185 .playlist-wrap.customstyle .buttons i {
  color: #62a400;
  font-style: normal;
}

.div.yt-socialbt a.color.instagram {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}

.rssocial-icon rssocial-icon-instagram {
  background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
}

/* titel voor intro image */
.com-content-category-blog .item-content {
  display: contents;
}

.com-content-category-blog .page-header {
  order: -1;
}

/* Custom Styling */
/* For Module Bezoekers Online */
div.mywhosonlinemodule {
  text-transform: none;
  margin: 0 0 30px;
}

#bd #yt_mainmenu .yt-resmenu {
  display: none;
}

/* To style intro image */
.com-content-category-blog figure {
  margin: 0;
  height: 150px;
  width: 150px;
  padding-top: 0em;
  padding-right: 0em;
  padding-left: 1em;
  padding-bottom: 1em;
  display: inline-flex;
  align-content: space-around;
  justify-content: space-around;
  align-items: center;
}

/* To style image in blog article in category podcast */
.item-page .img-fulltext {
  margin: 0px 0px 20px 0px;
}

.com-content-article figure {
  width: 100%;
  display: inline-flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: space-around;
  align-items: center;
}

/* To add read more button */
.blog .items-leading .item .article-text a.more:after,
.blog .items-row .item .article-text a.more:after {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 0px;
  transition: 0.3s all ease 0s;
  background: none;
  border: 0px solid #e7e7e7;
  content: "";
  z-index: -1;
}

.blog .items-leading .item:hover .article-text a.more:after,
.blog .items-row .item:hover .article-text a.more:after {
  width: 100%;
}

#bd #yt_footer #yt_copyright {
  margin-top: 5px;
  margin-bottom: 5px;
}

.backtotop {
  background-color: #62a400;
}

.profile-buttons {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  max-width: 265px;
  flex-wrap: wrap;
  margin: 0 auto;
}

/* Algemene hover-animatie */
.amc-button,
.publons-wrapper {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.amc-button:hover,
.publons-wrapper:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 10px rgba(0,0,0,0.25);
}

/* --- Amsterdam UMC button --- */
.amc-button {
  width: 123px;
  height: 72px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.amc-logo {
  width: 70%;
  height: auto;
  object-fit: contain;
  margin-bottom: 4px;
}

.amc-text {
  font-size: 12px;
  color: #003D73;
  font-family: "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
}

/* --- Publons badge --- */
.publons-wrapper {
  width: 123px;
  height: 72px;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.publons-wrapper:hover {
  transform: none;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

/* iframe van Publons scherper + zwart/wit */
.publons-button iframe {
  transform: scale(1.1);
  transform-origin: center;
  filter: grayscale(100%) contrast(115%);
}

/* --- Responsief gedrag --- */
@media (max-width: 320px) {
  .profile-buttons {
    flex-direction: column;
    gap: 8px;
  }
}

/* ✅ Logo met standaard schaduw + zachte hover-zoom */
#yt_header #yt_logo a.logo img {
  transition: transform 0.25s ease-in-out, filter 0.35s ease-in-out;
  filter: drop-shadow(0 4px 10px rgba(0,0,0,0.35)); /* standaard schaduw */
}

#yt_header #yt_logo {
  overflow: visible;
}

#yt_header #yt_logo a.logo:hover img {
  transform: scale(1.05); /* alleen vergroten bij hover */
}