/*
	Theme Name:    endlessfood
  Theme URI:     https://endlessfood.vps.webdock.cloud/
	Description:   Endless food website
	Author:        Supertusch
	Version:       1.0
  Author URI:    http://supertusch.dk
  Template:      basically-bootstrap-5
  Domain Path:   /languages/
  Text Domain:   endlessfood
*/

@font-face {
  font-family: 'helvetica-neue';
  src:url('/wp-content/themes/endlessfood/assets/fonts/HelveticaNeue.ttc');
  font-weight:normal;
}

@font-face {
  font-family: 'helvetica-neue-bold';
  src:url('/wp-content/themes/endlessfood/assets/fonts/HelveticaNeue-Bold.otf');
  font-weight:bold;
}

@font-face {
  font-family: 'THICDisplay';
  src:url('/wp-content/themes/endlessfood/assets/fonts/THICDisplayVF4VF.ttf');
  font-weight: 1 1000;
 font-style: normal;
}

@font-face {
  font-family: 'helvetica-neue-medium';
  src:url('/wp-content/themes/endlessfood/assets/fonts/HelveticaNeue-Medium.otf');
  font-weight:bold;
}

:root{
  --black: #000000;
  --white: #f6f6f6;
  --cream: #f0e9db;
  --blue: #0802ab;
  --orange: #f2671d;
}


html{
  background-color: var(--white);
}

body{
  font-family: 'helvetica-neue-medium';
  text-transform: lowercase;
  color: var(--black);
  scrollbar-width: none;
}

.capitalize-thic{
  text-transform: uppercase;
}

h2 .capitalize-thic{
  height:6vw;
    /* display: block; */
}

.body-grid{
  display:grid;
  grid-template-columns: 24.6% 1fr;
  min-height: 100vh;
  background-color: var(--white);
  position: relative;
}

main{
  grid-column: -2;
  border:0.34vw solid var(--black);
  border-left:0;
  border-top:0;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  margin-bottom:0;
}


a{
  color: var(--black);
  text-decoration: underline;
}

a:hover{
    color: var(--blue);
}

em{
  color: var(--orange);
  font-style: normal;
}



h2{
  font-family:'helvetica-neue-bold';
  font-size: 6.6vw;
  line-height: 6.6vw;
}

h3{
  font-family:'helvetica-neue-bold';
  font-size: 3vw;
  margin-bottom:1.14vw;
}

h4{
  font-family:'helvetica-neue-bold';
  font-size: 1.95vw;
}

.page h1{
  font-size: 1.7vw;
  margin-bottom:1rem;
  font-family: 'helvetica-neue-medium';
}

.home h1 {
    font-size: 12.7vw;
    font-family: 'THICDisplay';
    font-variation-settings: 'THIC' 10;
    animation: thicThin 6s infinite  ease-in-out alternate;
    -moz-animation: thicThin 6s infinite ease-in-out alternate;
    -webkit-animation: thicThin 6s infinite ease-in-out alternate;
    -o-animation: thicThin 6s infinite ease-in-out alternate;
  }

  .frontpage-background h2{
    font-family: 'THICDisplay';
    font-variation-settings: 'THIC' 10;
    animation: thicThin 6s infinite  ease-in-out alternate;
    -moz-animation: thicThin 6s infinite ease-in-out alternate;
    -webkit-animation: thicThin 6s infinite ease-in-out alternate;
    -o-animation: thicThin 6s infinite ease-in-out alternate;
    text-transform: uppercase!important;
  }



@keyframes thicThin {
from {
        font-variation-settings: 'THIC' 10;
  }
  to{
      font-variation-settings: 'THIC' 100;

}}

@-moz-keyframes thicThin {
  from {
          font-variation-settings: 'THIC' 10;
    }
    to{
        font-variation-settings: 'THIC' 100;

  }}

@-webkit-keyframes thicThin {
  from {
          font-variation-settings: 'THIC' 10;
    }
    to{
        font-variation-settings: 'THIC' 100;

  }
}

@-o-keyframes thicThin {
  from {
          font-variation-settings: 'THIC' 10;
    }
    to{
        font-variation-settings: 'THIC' 100;

  }
}

p, .text-box li{
  font-size: 1.7vw;
  color:black;
}

strong{
  font-family:'helvetica-neue-bold';
}

/* MENU */
aside.navigation-sidebar{
  position:fixed;
  display:flex;
  flex-direction:column;
  top:0;
  bottom:0;
  width:24.6%;
  justify-content: space-between;
  overflow-y: scroll;
  border: var(--black) solid 0.34vw;
  border-bottom:0;
  padding:0;
  scrollbar-width:none;
}

::-webkit-scrollbar {
  display: none;
}

nav{
  display:flex;
  flex-direction: column;
  align-items: center;
  overflow-y: scroll;
  scrollbar-width:none;
}

.brand-logo-home-button{
  width:16.6vw;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height:8.9vw;
  transition: width 0.5s ease-in-out;
}

.brand-logo-home-button:hover{
    width:17vw;
}

.menu-main-menu-container{
  width:100%;
}

ul.main-menu-list {
  display:flex;
  flex-direction: column;
  border-top: var(--black) solid 0.34vw;
  border-bottom: var(--black) solid 0.34vw;
}

ul.main-menu-list{
  list-style: none;
  padding:0;
  text-align: center;
  font-family:'helvetica-neue-bold';
}
ul.sub-menu{
  list-style: none;
  padding:0;
  text-align: center;
  font-family:'helvetica-neue-bold';
}

ul.main-menu-list a,
ul.sub-menu a{
    text-decoration: none;
    color: var(--black);
    text-transform: lowercase;
}

ul.main-menu-list a:hover,
ul.sub-menu a:hover{
    color: var(--blue);
    text-decoration: underline;
}

ul.main-menu-list li{
  border-bottom:0.34vw solid var(--black);
}

ul.main-menu-list li:last-child{
  border-bottom:0;
}

ul.sub-menu li{
  border: none;
}

ul.sub-menu {
  display:none;
}

li.current_page_item {
  background-color: var(--blue);
}



li.current_page_item a {
  color: var(--white);
  text-decoration: underline;
}

li.current_page_item:hover{
  color: var(--blue);
  background-color: var(--white);
}

li.current_page_item:hover a{
  color: var(--blue);
}

li.current_page_item ul.sub-menu{
  display:flex;
  flex-direction: column;
  border-top: 0.34vw solid var(--black);
}

li.current_page_item ul.sub-menu a{
  color: var(--black);
  text-decoration: none;
}

li.current_page_item ul.sub-menu a:hover{
  color: var(--blue);
  text-decoration:underline;
}

ul.main-menu-list {
  font-size: 3vw;
}

ul.sub-menu {
  font-size: 1.7vw;
  background-color: var(--white);
}

.navbar-toggler{
  display:none!important;
}

/* screensaver animation*/
.screensaver {
  display: none;
}

.screensaver.appear{
  position: fixed;
  top:0;
  bottom:0;
  right:0;
  left:0;
  background-color: var(--white);
  z-index: 100000;
  display: block;
}
.screensaver .screensaver-logo{
  position:absolute;
  top:0;
}

.screensaver.appear .screensaver-logo{
opacity:0;
}

/* FOOTER */

footer{
    border-top:0.34vw solid var(--black);
    border-bottom:0.34vw solid var(--black);
}

.footer-socials{
  display:grid;
  grid-template-columns: 1fr 1fr;
  border-bottom:0.34vw var(--black) solid;
}

.footer-social{
  display:flex;
  justify-content: center;
}

.footer-social:first-child{
  border-right: 0.34vw solid var(--black);
}


.footer-links{
  display:grid;
  grid-template-columns: 1fr 1fr;
}

.footer-link:first-child{
  border-right: 0.34vw solid var(--black);
}

.footer-link p {
  font-size: 1vw;
  text-align: center;
  margin-bottom:0;
  padding: 14px 0;
  color: var(--black);
  text-decoration: underline;
}

.insta-logo-wrapper, .linkedin-logo-wrapper{
  display:flex;
  justify-content: center;
  width:3vw;
}

.insta-logo-link:hover svg path,
.linkedin-logo-link:hover svg path {
  fill:var(--blue);
}

.insta-logo-link:active svg path,
.linkedin-logo-link:active svg path{
  fill:var(--white);
}

.insta-logo-link:active,
.linkedin-logo-link:active {
  background-color: var(--blue);
}

/* FRONT PAGE */
.frontpage-background{
  height:100vh;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;
}

.frontpage-textbox{
  display:flex;
  flex-direction: column;
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}

.frontpage-background h1,
.frontpage-background h2{
  color: var(--white);
}

.frontpage-background h2{
  font-size: 2.9vw;
  line-height: 120%;
}

.frontpage-logos{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:7.5vw;
  margin-top: 6.9vw;
}

/* VARIABLE BLOCK */
.variable-block-grid{
  display: grid;
  grid-template-columns: 34% 1fr;
  /* border-bottom:0.34vw solid var(--black); */
  min-height: 25.3vw;
}


.variable-block-grid:not(:last-child){
    border-bottom:0.34vw solid var(--black);
}

.variable-block-grid.remove{
  border-bottom:none;
}


.image-only-block:not(:last-child){
  border-bottom:0.34vw solid var(--black);
}

.image-only-block.remove{
  border-bottom:none;
}

.left-image-wrapper{
  height:100%;
  min-height:25.71vw;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.top-heading-bar{
  background-color: var(--orange);
  border-bottom:0.34vw solid var(--black);
  border-top:0.34vw solid var(--black);
  padding: 1.3vw 1.3vw 1vw 1.3vw;
  position:relative;
}

.anchor-point{
  position:absolute;
  margin-top:-1.6vw;
}

.left-text-box{
  padding:1.71vw 0.71vw 2.86vw 1.3vw;
}

.left-image-box{
  border-right: 0.34vw solid var(--black);
}

.main-body-text{
    padding:1.71vw 1.71vw 2.86vw 0.71vw;
}

.text-box {
  max-width:900px;
}

.image-only-wrapper img{
  width:100%;
}



/* ACCORDION */

h4.item-question{
  padding: 0.92vw 1.4vw;
  border-bottom: 0.34vw solid var(--black);
}

.item:last-child h4.item-question{
  border-bottom:none;
}

h4.item-question:hover{
  color: var(--white);
  background-color: var(--blue);
}

h4.item-question.active{
  color: var(--white);
  background-color: var(--blue);
}

h4.item-answer{
  font-family:'helvetica-neue';
  padding: 0.92vw 1.4vw;
  border-bottom: 0.34vw solid var(--black);
  color: var(--white);
  background-color: var(--blue);
}

/*SPONSORS BLOCK*/

.sponsors-logos{
  display:flex;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  gap:1.4vw;
  padding: 1.04vw 1.4vw;
}

.sponsors-logos a{
  display: flex;
}

.sponsors-logos-wrapper{
  display: flex;
  justify-content: center;
  align-items:center;
}

/* .sponsors-logos {
  overflow: hidden;
  width: 100%;
  position: relative;
  height:90px;
}

.logos-track {
  position: absolute;
  display: flex;
  gap: 30px;
  width: 200%;
  animation: scroll-left 20s linear infinite;
  left: 0;
  top: 20px;

}

.sponsor-link {
  display: flex;
  height: 50px;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
}

.sponsors-logos-wrapper {
  display: inline-block;
}

.sponsors-logos-wrapper img {
  height: 40px;
  width: auto;
}
 */






/*BLUE BLOCK*/

.blue-block-body-text{
  background-color: var(--blue);
  color: var(--white);
  padding: 1.71vw 1.71vw 6vw 1.71vw;
  border-bottom: 0.34vw solid var(--black);
}

/*CONTACT BLOCK*/

.contact-block-grid{
  display:grid;
  grid-template-columns: 24vw 1fr;
  padding: 0.9vw 1.3vw;
  border-bottom: 0.34vw solid var(--black);
}

.contact-details{
padding: 0 0.9vw 0 0;
display: flex;
justify-content: flex-start;
align-items: center;
}

.contact-block-grid h3, .contact-block-grid p{
  margin-bottom:0;
}

.contact-block-grid a{
  font-size: 1.7vw;
  color: var(--black);
  text-decoration: none;
}

.contact-block-grid:hover{
  background-color: var(--blue);
}

.contact-block-grid:hover p, .contact-block-grid:hover p a, .contact-block-grid:hover h3{
  color: var(--white);
}

.contact-block-grid p a:hover{
  text-decoration: underline;
}

/*PRESSBLOCK*/

a.press-link p{
  color: var(--black);
  text-decoration: underline;
    font-family:'helvetica-neue-medium';
}

a.press-link:hover p{
    color: var(--blue);
}

/*MEDIA QUERIES*/

@media screen and (max-width:780px) {
  p, .text-box li, .page h1:not(.thic){
    font-size: 1.125rem;
    line-height: 1.35rem;
    letter-spacing: -0.0125rem;
  }
  ul.sub-menu {
    font-size: 1.125rem;
}
.footer-link p{
  font-size:0.7rem;
}
h4.item-question, h4.item-answer, .contact-block-grid a{
  font-size: 1.125rem;
}
h1{
  font-size:6.25rem;
}
.frontpage-background h2{
  font-size: 2rem;
}
}

@media screen and (max-width:680px) {
  ul.main-menu-list{
    font-size:1.86rem;
  }
  .variable-block-grid{
    display:block;
  }
  h1{
    font-size:5rem;
  }
  .frontpage-background h2{
    font-size: 1.5rem;
  }
  h3{
    font-size: 1.375rem;
    line-height: 1.5125rem;
    letter-spacing: -0.01375rem;
    margin-bottom:1.123rem;
  }

  .left-text-box {
    padding: 1.71vw 0.71vw 0 1.3vw;
}
.main-body-text {
    padding: 0 1.71vw 0 1.3vw;
}


.brand-logo-home-button{
  padding: 0 6px;
}

.insta-logo-wrapper, .linkedin-logo-wrapper {
width:100%;
padding:12px 0;
}

.insta-logo-wrapper svg, .linkedin-logo-wrapper svg {
  width:30px;
  height: 30px;
}
}



  @media screen and (max-width:630px) {

    .home h1{
      font-size: 21.24vw;
    }

    h2{
      font-size: 2.375rem;
      line-height: 2.375rem;
      letter-spacing: -0.02375rem;
    }
    h2 .capitalize-thic{
      height: unset;
    }
    .frontpage-background h2{
      font-size: 5vw;
    }

    .frontpage-textbox{
      top: calc(50% - 70px);
    }

    .left-text-box, .main-body-text {
      padding:14px 10px 6px 10px;
    }

    h4.item-question, h4.item-answer{
      padding:14px 10px 12px 10px;
    }

    .top-heading-bar{
      padding:6px 36px 6px 10px;
    }

.blue-block-body-text,
.contact-block-grid{
  padding:6px 36px 6px 10px;
}

 .body-grid{
    display:block;
  }
  .frontpage-background{
    left:0;
    height: 80vh;
  }

  .brand-logo-home-button{
    padding:6px;
    width:142px;
  }

  .brand-logo-home-button:hover{
      width:130px;
  }
  .custom-logo-link{
    width:180px;
  }


  /* aside.navigation-sidebar{ */
  .mobile-menu{
    position: fixed;
    top:73px;
    bottom:3px;
    left:-100%;
    transition: left 0.5s;
    background-color: var(--white);
    width:100%;
    z-index: 999;
    display: flex!important;
    flex-direction: column;
    justify-content: space-between;
    border-left: var(--black) solid 3px;
    border-right: var(--black) solid 3px;
  }

  .mobile-menu.appear{
    left:0;
  }

  ul.main-menu-list{
    border-top: none;
  }

  #main-menu {
    display:none;
  }
  footer{
  display:none
  }

  .footer-link p{
    font-size:0.625rem;
  }

  aside.navigation-sidebar{
    display:flex;
    justify-content: center;
    position: fixed;
    top:0;
    height: 73px;
    width:100%;
    z-index: 99999;
    background-color: var(--white);
    border-bottom: var(--black) solid 3px;
  }

.menu-bottom-button{
  display: flex!important;
  justify-content: center;
  align-items: center;
  position: fixed;
  bottom:0;
  width:100%;
  cursor: pointer;
  z-index: 99999;
  border: var(--black) solid 3px;
}

.menu-bottom-button h4{
  font-size: 1.86rem;
  font-family: 'helvetica-neue-medium';
}

.top-heading-bar.menu-bottom-button{
  padding: 10px;
}

.contact-block-grid {
  display:block;
}

.mobile-footer{
    border-top: 3px solid var(--black);
}

.accordion, .contact_block{
    border-left: 3px solid var(--black);
}

.contact_block:last-of-type .contact-block-grid{
  border-bottom:0;
}

body{
  margin-bottom:42.8px;
}

main{
  margin-top: calc(73px - 3px);
  margin-bottom:58.72px;
}

.variable_block{
  border-left: 3px solid var(--black);
  border-top:none;
  border-bottom:none;
}

.left-image-box{
  border-right:none;
  border-bottom: 3px solid var(--black);
}

.sponsors-logos,
.press_block,
.blue_block{
    border-left: 3px solid var(--black);
}

li.current_page_item ul.sub-menu{
  border-top: 3px solid var(--black);
}

.left-image-wrapper {
  aspect-ratio: 16/9;
}



ul.main-menu-list li {
  padding:8px 0 6px 0;
}

.page-id-15 .menu-item:first-of-type{
  padding:8px 0 0 0;
}

.sponsors-logos{
  flex-wrap: wrap;
  gap:16px;
}

.sponsors-logos a{
  flex: 1 0 30%;
}


}


/*CHANGE ALL BORDER WIDTHS*/

@media screen and (max-width:630px) {
  aside.navigation-sidebar,
  .mobile-menu,
  .mobile-menu.appear,
  .top-heading-bar,
  .brand-logo-home-button,
  .frontpage-background,
  .left-image-box,
  .contact-block-grid,
  .footer-socials,
  .footer-social:first-child,
  .footer-links,
  .footer-link:first-child,
  .sponsors-logos,
  .blue-block-body-text,
  footer,
  .top-heading-bar.menu-bottom-button,
  .mobile-footer,
  h4.item-question,
  h4.item-answer,
  .variable-block-grid:not(:last-child),
  main {
    border-width: 3px;
  }

  aside.navigation-sidebar,
  .image-only-block {
    border-bottom-width: 3px;
  }

  .mobile-menu,
  .mobile-menu.appear,
  .top-heading-bar.menu-bottom-button {
    border-left-width: 3px;
    border-right-width: 3px;
  }

  .top-heading-bar,
  .footer-socials,
  .footer-social:first-child,
  .footer-links,
  .footer-link:first-child,
  .sponsors-logos,
  .blue-block-body-text,
  .frontpage-background,
  .left-image-box,
  .contact-block-grid,
  footer,
  .mobile-footer,
  .top-heading-bar.menu-bottom-button,
  h4.item-question,
  h4.item-answer,
  ul.main-menu-list,
  ul.main-menu-list li,
  main {
    border-bottom-width: 3px;
  }

  .top-heading-bar,
  .footer-socials,
  .footer-link:first-child,
  .left-image-box,
  .mobile-menu,
  .mobile-menu.appear {
    border-top-width: 3px;
  }

  .left-image-box,
  .mobile-menu,
  .mobile-menu.appear {
    border-right-width: 3px;
  }

  .mobile-menu,
  .mobile-menu.appear {
    border-left-width: 3px;
  }
}

.anchor-point{
  margin-top:-76px;
}

.cky-revisit-bottom-right {
  bottom:65px!important;
}

}