/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/*
body *{outline:1px solid #ccc}
*/



.site-header .main-navigation{background:none !important}
.main-navigation .inside-navigation{background:var(--base-3)}

.main-navigation .aanmelden{background:var(--accent) !important}
.main-navigation .aanmelden a{color:var(--base-3) !important}



.slideout-navigation .logo{margin:20px auto;width:175px}
.slideout-navigation .main-nav ul li a{line-height:40px}
.slideout-navigation .sub{padding-left:25px} 


.site-logo .is-logo-image, .sticky-navigation-logo .is-logo-image{height:30px;margin:0;padding:0;width:auto}

@media all and (max-width:767px) {
    .site-logo .is-logo-image, .sticky-navigation-logo .is-logo-image{height:20px}
}




.soliloquy-wrapper .soliloquy-controls{display:none !important}

.home .featured-image .attachment-full{display:none !important}



/* @media all and (min-width:768px) {.grid-2-col h2{text-align:center}} */
@media all and (min-width:1025px) {
    .grid-img{height:0;padding-top:66.6667%;position:relative}
    .grid-img figure{bottom:0;left:0;position:absolute;right:0;top:0}
    .grid-img figure img{bottom:0;height:100%;left:0;object-fit:cover;position:absolute;right:0;top:0;width:100%}
}

















/* buttons */

.wp-block-button{}
.wp-block-button .wp-block-button__link{border-radius:0;font-weight:bold}




/* grid 2col */



@media (max-width: 767px) {
  .grid-2col{margin-bottom:-20px}
  .grid-2col .grid-2col-item:nth-child(odd){background-color: var(--accent);color: var(--base-3)}
  .grid-2col .grid-2col-item:nth-child(odd) a.wp-block-button__link{background-color:var(--base-3);color:var(--contrast)}
  .grid-2col .grid-2col-item:nth-child(odd) a.wp-block-button__link:hover{background-color:var(--contrast);color:var(--base-3)}
}

@media (min-width: 768px) {
    .grid-2col{margin-bottom:-40px}
    .grid-2col .grid-2col-item:nth-child(4n+1),
    .grid-2col .grid-2col-item:nth-child(4n+4) {
        background-color: var(--accent);
        color: var(--base-3);
    }
    .grid-2col .grid-2col-item:nth-child(4n+1) a.wp-block-button__link,
    .grid-2col .grid-2col-item:nth-child(4n+4) a.wp-block-button__link {
      background-color:var(--base-3);color:var(--contrast)
    }
    .grid-2col .grid-2col-item:nth-child(4n+1) a.wp-block-button__link:hover,
    .grid-2col .grid-2col-item:nth-child(4n+4) a.wp-block-button__link:hover {
      background-color:var(--contrast);color:var(--base-3)
    }
}

.grid-2col-item .img-hover {
    overflow: hidden;       /* cruciaal */
}

/* basis: transition voor filter + transform */
.grid-2col-item .img-hover a img {
    transition: transform 0.3s ease, filter 0.3s ease;

}

/* hover: donkere overlay + lichte vergroting */
.grid-2col-item .img-hover a img:hover {
    filter: brightness(70%); /* donkere overlay effect */
    transform: scale(1.05);  /* lichte vergroting */
}






/* form */

.form-grid{display:grid;gap:1rem;grid-template-columns:repeat(12,1fr)}
.form-field{display:flex;flex-direction:column}
.form-spacer{margin-top:2rem}
.col-span-12 {grid-column:span 12}
.col-span-6  {grid-column:span 6}
.col-span-4  {grid-column:span 4}
.col-span-3  {grid-column:span 3}
.col-span-2  {grid-column:span 2}

@media (max-width: 768px) {
  .col-span-12,
  .col-span-6,
  .col-span-4,
  .col-span-3,
  .col-span-2 {
    grid-column:span 12 !important;
  }
}

.form-grid input:not([type=submit]),
.form-grid select,
.form-grid textarea {
  background: var(--base);
  border: 1px solid var(--base);
  padding: 10px 15px;
  width: 100%;
}

input[type=submit] {
  background-color: var(--accent);
  color: var(--base-3);
  font-weight: bold;
  text-decoration: none;
  margin:1rem 0 0 0;
  padding: 1rem 1.5rem;
  width: auto;
}


















/* Google maps */
.gmaps{background:#333;border:1px solid #333;height:0;padding-top:56.25%;position:relative;width:100%}
.gmaps iframe{bottom:0px;height:100% !important;left:0px;position:absolute;right:0px;top:0px;width:100% !important}





/* footer */


#sb_instagram #sbi_images{padding:0}

.section-social {
    width: 100%;
    background: var(--contrast);
    padding: 30px;
}

.section-social ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;

    display: grid;
    grid-template-columns: repeat(4, auto);
    justify-content: center;
    align-items: center;
    gap: 20px;

    max-width: 800px;
}

.section-social li {
    display: flex;
    justify-content: center;
    align-items: center;
}

.section-social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.section-social svg {
    width: 50px;
    height: auto;
    max-width: 200px;
    display: block;
}

@media (max-width: 768px) {
    .section-social ul {
        grid-template-columns: repeat(4, auto);
        gap: 10px
    }
}

.section-social a:hover svg {
    transform: scale(1.1);
}

.section-social svg {
    transition: transform 0.2s ease;
}




.section-sponsors {
    width: 100%;
    background: var(--base-2);
    padding: 40px 0;
}

.section-sponsors ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;

    display: grid;
    grid-template-columns: repeat(3, auto);
    justify-content: center;
    align-items: center;
    gap: 32px;

    max-width: 900px;
}

.section-sponsors li {
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-sponsors a {
    display: inline-flex;
    line-height: 0;
    padding:15px;
    border:1px solid var(--contrast-3);
    transition: border-color .5s;
}

.section-sponsors a:hover{
  border-color:var(--accent)
}

.section-sponsors svg {
    width: 160px;
    height: auto;
    max-width: 200px;
    display: block;
}

@media (width < 768px) {
    .section-sponsors ul {
        grid-template-columns: repeat(1, auto);
    }
}