/* CSS customizations by Trendwerk */

/* Variables */
:root {
  --blue: #1976D2;
  --navy: #26364D;
}

/* Overwrite some colors */
#wrap-header-index {
  background-color: var(--blue) !important;
}

#site-desc-full,
#site-desc-small,
.sub-header,
#wrap-footer,
.fora-bg h3,
.forum-bg h3 {
  background-color: var(--navy) !important;
}

/* Tables */
/* @see: https://www.webwinkelforum.nl/app.php/thankslist */
table {
  font-size: 16px;
}

th, td {
  padding: 0.5rem;
  text-align: left;
  font-size: 14px;
}

/* Header */
#site-desc-small,
#sub-header {
  padding: 56px 0 0 0;
  width: 100%;
}

#site-desc-small .chunk,
#sub-header .chunk {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

@media (min-width: 1200px) {
  #site-desc-small .chunk,
  #sub-header .chunk {
    width: 100%;
    flex-direction: row-reverse;
  }
}

.leaderboard {
  width: 100vw;
  max-width: 728px;
  display: block;
  flex-shrink: 0
}

#site-desc-small .leaderboard img,
#sub-header .leaderboard img {
  position: relative;
  object-fit: contain;
  width: 100%;
  height: auto;
  max-width: 728px;
  display: block;
}


#site-desc-small #page-description,
#sub-header .sub-header-title {
  padding: 27px 0;
  width: 100%;
}

@media (min-width: 1200px) {
  #site-desc-small #page-description,
  #sub-header .sub-header-title {
    width: 100px;
    flex-grow: 1;
    margin-right: 20px;
  }
}

#site-desc-small h1,
#sub-header h2 {
  display: block;
  font-size: 2.4em;
}

@media (min-width: 1200px) {
  #site-desc-small h1,
  #sub-header h2 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

#site-desc-small h2 {
  display: none;
}

/* Content */
.background-main {
  margin-bottom: 2rem;
}

.background-content {
  background-color: #FFFFFF;
  background-color: white;
  border-color: #EAEAEA;
  border-radius: 2px;
  border-style: solid;
  border-width: 1px;
  box-shadow: 0 0 6px rgba(0,0,0,.03);
  padding: 2rem;
}

.background-content .chunk {
  padding: 0;
}

@media (min-width: 1024px) {
  .background-content {
    padding: 4rem;
  }
}

/* Sub header */
.sub-header-buttons {
  margin-bottom: 2rem;
}

.sub-header-buttons .button span {
  display: inline;
}

/* Advertentie */
.postbody.postbody-featured {
  background-color: lightyellow;
  font-size: 13px;
}

.postbody-featured a {
  text-decoration: underline;
}

/* Forms */
.form dl {
  font-size: 13px;
  margin-bottom: 1.5rem;
}

.form dt {
  font-weight: bold;
  margin-bottom: 0.5rem;
}
.form dt p {
  font-weight: normal;
  color: #5A5A5A !important;
}

.form input,
.form textarea {
  padding: 10px;
  border-radius: 4px;
  background-color: white;
  border: 1px solid #CCC;
}

.form .submit-buttons input {
  border: none;
  font-weight: bold;
  background-color: var(--blue);
  padding: 10px 20px;
}

.captcha-title {
  display: none;
}

/* Sidebar */
@media (min-width: 1001px) {
  .content-main:not(:only-child), .forumlist-main:not(:only-child), .page-content:not(:only-child) {
    margin-right: 318px;
  }
}

.main-sidebar, .sidebar {
  width: 300px;
}

.sidebar-block-empty {
  margin-bottom: 18px;
}

.widget-partner-buttons-grid {
  display: grid;
  grid-template-columns: 125px 125px;
  gap: 12px;
}

.widget-partner-buttons-grid {
  display: grid;
  grid-template-columns: 125px 125px;
  gap: 12px;
}

.widget-latest-posts ul {
  list-style: none;
}

.widget-latest-posts li {
  display: flex;
}

.widget-latest-posts li span {
  color:#999;
  width: 48px;
  flex-shrink: 0;
}

.widget-latest-posts li a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.widget-for-sale__title {
  font-weight: bold;
  display: block;
  margin-bottom: 0.5em;
}

.widget-for-sale p {
  margin-bottom: 0.75em;
}

.widget-for-sale__links {
  display: flex;
  justify-content: space-between;
}

.widget-statistics strong {
  float: right;
}

/* FAQ */
.faq-container {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}

.faq-title {
  font-size: 2rem;
  margin: 0 0 1rem;
}

@media (min-width: 1024px) {
  .faq-container {
    flex-direction: row;
  }

  .faq-links {
    width: 30%;
  }

  .faq-content {
    width: 70%;
  }
}

/* Footer */
.footer-stats {
 display: none;
}

.site-footer .rside {
  display: none;
}
