/*
Theme Name: MedlemsRebel
Theme URI: https://landsmoede.dk
Author: Steffen Ø. Muldbjerg
Author URI: https://muldbjerg.com/
Description: Custom theme for Landsmoede.dk 
Version: 1.0.0

Build ontop of: 
BlankSlate WordPress Theme © 2011-2019 TidyThemes
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}body{line-height:1}button{outline:0}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important}




/* -- VARIABLES -- */

:root {
   --brand-color: #4F3557;
  --brand-color-light: #33542E;
  --brand-color-lightest: #b3d3ae;
  --text-color: #261702;
  --brand-secondary: #510a32;
  --light-gray: #cdcaca;

  /* TEXT */
  --standard-text-size: 19px;
  --standard-line-height: 1.5; 

  /* ANIMATION */
  --standard-easing: cubic-bezier(
    0.165,
    0.84,
    0.44,
    1
  ); /* cubic-bezier(0.645, 0.045, 0.355, 1); */
}
  
/* -- GENEREL -- */
html{
  scroll-behavior: smooth;
}

body {
  font-family: 'Source Sans Pro', sans-serif, -apple-system, "Helvetica Neue", sans-serif;
  color: #261702;
  font-size: 19px;
  line-height: 1.3;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.sr {
  visibility: hidden;
}

.wrapper {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding-left: 80px;
  padding-right: 80px;
}

.clearfix{
  width: 100%;
  clear: both;
}

.bigClearfix{
  clear: both;
}

.textfield{
  margin-bottom: 60px;
}

.pageTitle{
  margin-bottom: 50px;
}

img {
  max-width: 100%;
  height: auto;
}

strong{
  font-weight: bold;
}

em{
  font-style: italic;
}

.clear {
  width: 100%;
  clear: both;
}

::selection {
  background: #4F3557;
  color: #fff;
}



/* -- TYPOGRAFI -- */
a,
a:visited {
  cursor: pointer;
  text-decoration: none;
  color: #885C96;

  transition: all 0.2s var(--standard-easing);
}

a:hover{
  text-decoration: underline;
  color: #4F3557;
  color: #261702;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "YoungSerif", serif, -apple-system;
  line-height: 1.2;
}

h1 {
  font-size: 42px;
}

h2 {
  font-size: 38px;
}

h3 {
  font-size: 32px;
}

h4 {
  font-size: 28px;
}

h5 {
  font-size: 23px;
  margin: 20px 0 5px 0;
}

h6 {
  font-size: 18px;
  margin: 20px 0 5px 0;
}

.manchet{
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 10px;
  font-weight: bold;
    font-size: 90%;
}

.readMoreLine{
  display: block;
  float: left;
  margin-top: 20px;
  font-weight: bold;
  text-decoration: none !important;
}

.readMoreLine::before{
  display: block;
  float: left;
  content: "";
  margin: 12px 0;
  margin-right: 10px;
  height: 1px;
  width: 40px;
  background-color: #261702;

  transition: all 0.15s ease-in;
}

.readMoreLine:hover::before{
  width: 60px;
}

.photoCredit{
  padding-top: 5px;
  font-size: 12px;
  color: #746f78;
}

.wp-block-group .photoCredit{
  margin-top: -20px;
}


/* --- GENERELT --- */

.pageSection{
  margin: 100px 0 50px 0;
}

a.btn{
  color: #fff;
}

.btn{
  display: inline-block;
  background-color: #4F3557;
  font-size: 19px;
  padding: 10px 30px;
  border-radius: 30px;
  font-weight: bold;
  color: #fff;
  margin: 20px 0;

  transition: all 0.15s ease-in;
}

.btn:hover{
  background-color: #2C1C31;
  text-decoration: none;
  
}

.btn:active{
  transform: scale(0.95);
}

.btn.smallBtn{
  font-size: 14px;
  padding: 5px 15px;
}

.sparkleBtn{
  display: block;
  margin: 30px auto;
}

.sparkleBtn::before{
  content: "";
  position: relative;
  display: inline-block;
  width: 11px;
  height: 23px;
  margin-right: 5px;
  top: 4px;
  
  background-image: url(img/yay_left.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.sparkleBtn::after{
  content: "";
  position: relative;
  display: inline-block;
  width: 11px;
  height: 23px;
  margin-left: 5px;
  top: 4px;
  
  background-image: url(img/yay_right.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

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

a.navigationBoxLink{
  display: inline-block;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center center;
  padding: 250px 30px 30px 30px;
  text-align: center;
  color: #fff 
}

a.navigationBoxLink:hover{
  text-decoration: none;
  padding: 230px 30px 50px 30px;
}

a.navigationBoxLink:active span{
  transform: scale(0.95);
}

.smallLabel{
  background-color: #4F3557;
  color: #fff;
  display: inline-block;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  padding: 3px 10px;
  border-radius: 10px;
}



/* -- HEADER -- */
header {
  padding: 30px 0;
}

#logoArea{
  position: relative;
  z-index: 999;
}

#logoArea a{
  text-decoration: none !important;
}

#logoArea h1 {
  font-family: 'Barlow Semi Condensed', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
  font-size: 26px;
  color: #261702;

  transition: all 0.2s var(--standard-easing);
}

#logoArea h1:hover{
  color: #4F3557;
}

#logoArea p{
  margin-top: 3px;
  font-size: 17px;
  color: #261702;
}

#logoImg img{
  position: fixed;
  transform: translateX(-45px);
  margin-top: 1px;
  width: 30px;
}

#logoImg img.white{
  display: none;
}

#mainMenu {
  text-align: right;
}

#mainMenu li {
  display: inline;
}

#mainMenu li a {
  font-size: var(--standard-text-size);
  padding: 10px;
  color: #261702;
}

#mainMenu .current-menu-item{
  text-decoration: underline;
}

#mainMenu li:nth-child(1){
  display: none;
}

#mainMenu #menu-item-89 a,
#mainMenu #menu-item-894 a{ /* TILMELD DIG LINKET */
  color: #885C96;
  white-space: nowrap;
  
}

#menu-item-89 a::before,
#menu-item-894 a::before{
  content: "";
  position: relative;
  display: inline-block;
  width: 7px;
  height: 13px;
  margin-right: 5px;
  
  background-image: url(img/yay_left.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

#menu-item-89 a::after,
#menu-item-894 a::after{
  content: "";
  position: relative;
  display: inline-block;
  width: 7px;
  height: 13px;
  margin-left: 5px;
  
  background-image: url(img/yay_right.svg);
  background-size: contain;
  background-repeat: no-repeat;
}

.post-type-archive-kandidater .menu-item-21,
.post-type-archive-kandidater .menu-item-893{
  text-decoration: underline;
}

.post-type-archive-forslag .menu-item-20,
.post-type-archive-forslag .menu-item-892{
  text-decoration: underline;
}

#menuToggle{
  display: none;
  float: right;
  z-index: 1;
  -webkit-user-select: none;
  user-select: none;
  padding: 10px;
}

#menuToggle span{
  display: block;
  width: 30px;
  height: 3px;
  margin-bottom: 7px;
  position: relative;
  background: var(--light-gray);
  border-radius: 3px;
  
  z-index: 1;
  transform-origin: 4px 0px;
  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
              opacity 0.55s var(--standard-easing);
}

#menuToggle span:first-child{
  transform-origin: 0% 0%;
}

#menuToggle span:nth-last-child(2){
  transform-origin: 0% 100%;
}
 
#menuToggle.active span{
  opacity: 1;
  transform: rotate(45deg) translate(-12px, -9px);
  background: #fff;
}

#menuToggle.active span:nth-last-child(3){
  opacity: 0;
  transform: rotate(0deg) scale(0.2, 0.2);
}

#menuToggle.active span:nth-last-child(2){
  transform: rotate(-45deg) translate(-9px, 9px);
}

.menu-mainmenu-container{
  height: 100%;
  padding-top: 4px;
}




/* -- FOOTER -- */

footer {
  position: relative;
  background-color: #291B2D;
  visibility: visible;
  color: #fff;
  background-image: url('img/compass.svg');
  background-position: right bottom;
  background-repeat: no-repeat;
  background-size: auto 80%;
  z-index: 2;
}

footer a, footer a:visited{
  color: #fff;
}

#footerBtn{
  position: absolute;
  margin-top: -20px; 
  /* transform: translateY(-20px); */
}

#mainFooter{
  margin-top: 110px;
}

.footerMessage{
  margin-top: 200px;
}

.footerMessageText{
  margin-top: 70px;
  padding-top: 40px;
}

.footerImage{
  text-align: center;
  margin-bottom: -100px;
  z-index: 99;
}

.footerImage img{
  height: 400px;
  max-width: 100%;
}

.footerBottom{
  margin-top: 100px;
  margin-bottom: 50px;
  color: #885C96;
}

.footerBottom a{
  color: #885C96;
  text-decoration: underline;
}

.footerBottom a:hover{
  color: #fff;
}

#mainFooter h6{
  margin-bottom: 20px;
}

#mainFooter ul li{
  padding: 5px 0;
}

#mainFooter a:hover{
  color: #885C96;
  text-decoration: none;
}

.footerLogo{
  text-align: right;
}

.footerLogo img{
  height: 40px;
}


.rightSidebar{
  font-size: 12px;
  transform: rotate(-90deg);
  position: fixed;
  z-index: 1;
  bottom: 150px;
  text-align :right;
  right: -80px;
}

.rightSidebar .line{
  width: 60px;
  height: 1px;
  background-color: #4F3557;
  float: left;
  margin: 8px 10px 8px 0;
}

.rightSidebar a{
  color: #261702;
}





/* -- PAGE -- */

main#content{
  padding-top: 130px;
  padding-bottom: 80px;
}

main#content.page h2,
main#content.page h3{
  margin: 40px 0 10px 0;
}


main#content.page p{
  margin-bottom: 15px;
}

main#content.page img{
  /* margin: 40px 0 70px 0; */
}

main#content.page .wp-block-embed-youtube{
  margin: 40px 0 70px 0;
}

main#content.page ul{
  font-size: var(--standard-text-size);
  margin-bottom: 15px;
  list-style: disc;
  list-style-position: outside;
  margin-left: 35px;
}

main#content.page ul li{
  margin-bottom: 10px;
}

main#content.page ol{
  font-size: var(--standard-text-size);
  margin-bottom: 15px;
  list-style-position: outside;
  margin-left: 35px;
  list-style-type: decimal;
}

main#content.page ol li{
  margin-bottom: 10px;
}

main#content.page .wp-block-preformatted{
  font-family: "Inconsolata", monospace;
  font-size: var(--standard-text-size);
  line-height: var(--standard-line-height);
  margin-bottom: 15px;
  padding: 25px 15px;
  background-color: rgba(0,0,0,.1);
}

main#content.page figcaption{
  font-size: var(--standard-text-size);
  transform: translateY(-45px);
  color: var(--light-gray);
}



/* -- FRONTPAGE - HOME -- */

.frontpageTitle{
  margin-bottom: 20px;
}

.notificationHomePage img{
  float:right; 
  width: 100px;
  margin: 40px 50px 0 0;
}

.notificationTitle{
  padding-bottom: 20px;
  margin-bottom: 50px;
}

/* --> HeroSpot */

.heroSpot{

}

.heroSpotTitle{
  position: relative;
  max-width: 50%;
  margin-bottom: -240px;
  z-index: 99;
}

.heroSpotTitle h1{
  font-size: 62px;
}

.heroSpotText{
  margin-top: 290px;
  padding-right: 20px;
}



/*  --> På landsmøde (teaser) */
.teaser{
  text-align: center;
}

.teaserBox{
  padding: 30px;
}

.teaserBox img{
  width: 60%;
  margin-bottom: 20px;
}

.teaserBox h5{
  font-family: 'Source Sans Pro', sans-serif, -apple-system, "Helvetica Neue", sans-serif;
  font-weight: bold;
  margin-bottom: 20px;
}

/* --> Podcast */
.podcast .col-sm-4{
  text-align: center;
}

.podcast .col-sm-4 img{
  width: 80%;
}

main#content .podcast h2{
  margin: 0 0 40px 0; 
  font-size: 62px;

}

.latestPodcast{
  padding-top: 40px;
}

.latestPodcast h4{
  font-family: 'Source Sans Pro', sans-serif, -apple-system, "Helvetica Neue", sans-serif;
  font-weight: bold;
  font-size: 24px;
  margin: 15px 0 5px 0;
}

.latestPodcast .length{
  color: #AEAEAE;
}

.latestPodcast .length::before{
  display: block;
  float: left;
  content: "";
  margin: 12px 0;
  margin-right: 10px;
  height: 1px;
  width: 40px;
  background-color: #AEAEAE;

  transition: all 0.15s ease-in;
}

.latestPodcast a:hover {
  text-decoration: none;
  color: #885C96;
}

.latestPodcast a:hover .length:before{
  width: 60px;
}

/* --> Deadlines */
.deadlines{
  text-align: center;
}

main#content.page .deadlines h2{
  margin-bottom: 60px;
}

.deadlineBox a{
  display: inline-block;
  width: 90%;
  margin: 0 auto;
  border: 2px solid #2C1C31;
  text-align: left;
  padding: 30px;
  font-weight: bold;
  margin-bottom: 30px;
}

.deadlineBox a:hover{
  text-decoration: none;
  box-shadow: 15px 15px #4F3557;
}

.deadlineBox .date{
  color: #4F3557;
  font-size: 30px;
}

.deadlineBox .date .day{
  font-size: 60px;
  margin-bottom: -10px;
}

.deadlineBox .line{
  width: 100%;
  height: 2px;
  background-color: #2C1C31;
  margin: 20px 0;
}

.deadlineBox .text{
  font-size: 26px;
}




/* --> kandidater */

.kandidatFrontArea{
  margin-bottom: 50px;
}

.kandidatRow{
  text-align: center;
  margin-bottom: 60px;
}

.kandidatRow .kandidatImage{
  height: 120px;
  overflow: visible;
}

.kandidatRow .kandidatImageSrc{
  width: 120px;
  height: 120px;
  border-radius: 75px;
  margin: 0 auto;
}

.kandidatRow h2{
  font-family: 'Source Sans Pro', sans-serif, -apple-system, "Helvetica Neue", sans-serif;
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 5px;
}

.kandidatRow a{
  color: #261702;
}

.kandidatRow a:hover{
  color: #2C1C31;
}


/* -- ERROR PAGE -- */

.errorpage{
  text-align:center;
}

.errorpage h1{
  margin-bottom: 30px;
}


/* -- FORSLAG -- */
.forslagTable{
  margin-top: 40px;
}

.forslagRow{
  width: 100%;
  display: grid;
  grid-template-columns: 30px 4fr 1fr;
  padding: 17px 0;
}

.forslag{
  border-bottom: 1px solid #D3D3D3;
}

.forslag:first-child{
  border-top: 1px solid #D3D3D3;
}

.forslag a{
  color: #261702;
}

.forslag a:hover{
  color: #2C1C31;
  text-decoration: none !important;
}

.forslagRow .arrow{
  font-weight: bold;
  color: #4F3557;

  transition: all 0.15s var(--standard-easing);
}

a:hover .forslagRow .arrow{
  padding-left: 4px;
  text-decoration: none !important;
}

.forslagRow .title{
  font-weight: bold;
}

.forslagRow .title span{
  font-weight: normal;
}

p.forslagsKategori{
  opacity: 0.6;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.stillere {
}

.stillere span{
  display: inline-block;
  font-weight: bold;
  margin-right: 10px;
}

.aendringsforslag{
  
}

main#content.page ul.aendringsforslagList{
  margin-left: 0px;
}

.aendringsforslagList li{
  line-height: 25px;
  list-style-type: none;
}

.forslagArea{
  padding: 20px 0;
}

.forslagArea span{
  font-weight: bold;
}

.forslagsTekst {
  margin: 70px 0 10px 0;
}

.forslagsTekst h1,
.forslagsTekst h2,
.forslagsTekst h3,
.forslagsTekst h4,
.forslagsTekst h5,
.forslagsTekst h6{
  font-family: 'Source Sans Pro', sans-serif, -apple-system, "Helvetica Neue", sans-serif;
  margin-bottom: 5px;
}

.forslagsTekst h5{
  border-bottom: solid 1px #eee;
  padding-bottom: 10px;
  margin-bottom: 15px;
  font-weight: bold;
}

.forslagsTekst span[style="text-decoration: underline;"]{
  color: green;
  
}

.forslagsTekst del{
  color: #f00;
}


/* -- PROGRAM -- */

#program{
  margin-bottom: 20px;
}

#dayList{
  margin: 40px 0 20px 0;
  text-align: center;
  min-height: 35px;
}

#dayList li{
  display: inline;
  padding: 10px 20px;
  text-transform: uppercase;
  color: #777;
  cursor: pointer;
  
  transition: all 0.1s ease-in;
}

#dayList li::before{
  content: "";
  position: relative;
  display: inline-block;
  width: 0px;
  height: 13px;
  margin-right: 5px;
  
  background-image: url(img/yay_left.png);
  background-size: contain;
  background-repeat: no-repeat;
}

#dayList li::after{
  content: "";
  position: relative;
  display: inline-block;
  width: 0px;
  height: 13px;
  margin-left: 6px;
  
  background-image: url(img/yay_right.png);
  background-size: contain;
  background-repeat: no-repeat;
}

#dayList li.active::before,
#dayList li.active::after{
  width: 8px;
}

#dayList li.active{
  color: #261702;
  font-weight: bold;
  zoom: 120%;
}

.programItem{
  border-bottom: 1px solid #D3D3D3;
}

.programItem:first-of-type{
  border-top: 1px solid #D3D3D3;
}

.programItem.beskrivelse .top{
  cursor: pointer;
}

.programItem .top,
.programItem .bund{
  display: grid;
  grid-template-columns: 1fr 5fr 2fr 30px;
  align-items: center;
}

.programItem .top{
  padding: 15px 0;
}

.programItem .bund{
  overflow: hidden;
  max-height: 0px;

  transition: all 0.15s ease-in;
}

.programItem.open .bund{
  padding-top: 5px;
  padding-bottom: 15px;
  overflow: hidden;
  max-height: 300px;
}

.programItem #tid,
.programItem #navn,
.programItem .arrowArea{
  font-weight: bold;
}

.programItem #sted{
  font-size: 80%;
  padding-right: 5px;
}

.programItem .arrow{
  font-size: 120%;
  color: #4F3557;
  transition: all 0.2s ease-in;
  user-select: none;
}

main#content.page .programItem p.arrow{
  margin: 0px;
}

.programItem.open .arrow{
  transform: rotate(45deg) translate(2px, 6px);
}



/* -- BLOG -- */
.blogPost{
  padding-bottom: 100px;
}

.blogPost a{
  color: #261702;
  text-decoration: none !important;
}

main#content.page .blogPost h2{
  margin: 20px 0 10px 0;
}

.blogPost .readMore a:hover{
  color: #4F3557;
}

.blogPost:hover .readMoreLine::before{
  width: 60px;
}

.blogCategory a{
  display: inline-block;
  font-family: "Inconsolata", "HansKendrick_bold", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 5px;
  font-size: 14px;
  color: #4F3557;
  margin-left: 10px;

  transition: all 0.2s var(--standard-easing);
}

.blogCategory a:first-child{
  margin-left: 0px;
}

.blogCategory a:hover{
  color: var(--brand-secondary);
}

.blogPostImg {
  clear: both;
  margin-bottom: 30px;
  width: 100%;
  overflow: hidden;
  text-align: center;
}

main#content .blogPostImg img{
  margin: 0px;
  margin-bottom: -2px;
}

.blogPostImg img {
  height: auto;
  max-width: 100%;

  transition: all 0.5s var(--standard-easing);
}

.blogPost:hover .blogPostImg img {
  transform: scale(1.1);
}

.nextWorkCase{
  margin-top: 100px;
  padding-top: 30px;
  border-top: 1px solid var(--light-gray);
}

.nav-links{
  margin-top: 60px;
  font-size: 32px;
}

.nav-links a{
  color: #261702;
  text-transform: capitalize;

  transition: all 0.15s var(--standard-easing);
}

.nav-links a:hover{
  color: #4F3557;
  
}

.nav-links div{
  float: left;
  margin-right: 60px;
}

.categoryPageTitle{
  font-family: "Inconsolata", "HansKendrick_bold", sans-serif;
  letter-spacing: 1px;
}

.categoryPageTitle span{
  font-family: "HansKendrick_bold", sans-serif;
  font-size: 80%;
}

/* PODCAST PLAYER */
.mejs-container{
  margin-bottom: 20px;
}

.mejs-container, .mejs-container .mejs-controls, .mejs-embed, .mejs-embed body{
  background: #4F3557 !important;
}

.mejs-controls .mejs-time-rail .mejs-time-current{
  background: #885C96 !important;
}

/* - BLOG SINGLE - */

.blogSingle .date{ 
  float: left;
  margin-top: 10px;
  color: var(--light-gray);
}



/* - KOMMENTARER - */
#comments {
  /* width: 50%; */
  margin-top: 100px;
  padding-top: 30px;
  border-top: 1px solid var(--light-gray);
}

.comments-title{
  margin-bottom: 20px;
}

#reply-title{
  display: none;
}

.comment-form label{
  display: none;
}

.comment-form input{ 
  font-size: 19px;
  border: none;
  padding: 15px;
  border-bottom: 1px solid var(--light-gray);
}

.comment-form-comment textarea{
  width: 100%;
  border: 1px solid var(--light-gray);
  padding: 15px;
  font-size: 19px;
}
 
.comment-form-cookies-consent{
  display: none;
}

.comment-form input[type="submit"]{
  cursor: pointer;
  border: none;
  padding: 10px 15px;
  background-color: #4F3557;
  color: #fff;
  
  transition: all 0.2s var(--standard-easing);
}

.comment-form input[type="submit"]:hover{
  /* color: #4F3557; */
  background-color: #2C1C31;
}

#comments-list{
  margin-top: 70px;
}

.comment-notes{
  color: var(--light-gray);
}

.commentsField{
  clear: both;
  padding-bottom: 25px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--light-gray);
  border-color: rgba(0,0,0,.1);
}

.commentsField:last-child{
  border: none;
}

main#content.page .commentsField .avatar{
  margin: 0px;
  border-radius: 5px;
  float: left;
  margin-bottom: 10px;
}

.commentsField .name{
  margin-left: 65px;
  font-size: 20px;
}

.commentsField .date{
  color: #999;
  font-size: 14px;
  margin-left: 20px;
}

.commentsField .commentText{
  clear: both;
  margin-left: 65px;
  padding-bottom: 10px;
}

/* -- FORMS -- */

.wpcf7 label{
  font-size: 15px;
  font-weight: bold;
}

.wpcf7 input{
  font-size: 19px;
  border: none;
  padding: 15px;
  margin-top: 5px;
  border-bottom: 1px solid var(--light-gray);
}

.wpcf7 textarea{
  width: 100%;
  border: 1px solid var(--light-gray);
  padding: 15px;
  margin-top: 5px;
  font-size: 19px;
}

.wpcf7 input[type="submit"]{
  display: inline-block;
  background-color: #4F3557;
  font-size: 19px;
  padding: 10px 30px;
  border-radius: 30px;
  font-weight: bold;
  color: #fff;
  margin: 20px 0;
  transition: all 0.15s ease-in;
  cursor: pointer;
  border: none;
}

.wpcf7 input[type="submit"]:hover{
  /* color: #4F3557; */
  background-color: #2C1C31;
}


/* KANDIDATER */

.kandidat{
  padding-bottom: 60px;
  padding-right: 20px;;
}

.kandidat a{
  color: #261702;
}

.kandidat h2{
  margin-bottom: 10px;
}

.kandidatImage{
  width: 100%;
  height: 300px;
  overflow: hidden;
  margin-bottom: 20px;
}

.kandidatImageSrc{
  width: 100%;
  height: 320px;
  background-size: cover;
  background-position: center center;

  transition: all 0.15s ease-in;
}

.kandidat:hover .kandidatImageSrc {
  transform: scale(1.05);
}

.ingenKandidater{
  text-align: center;
}

.ingenKandidater img{
  width: 30%;
  margin: 0 35% 40px 35%;
}

/* KANDIDATER - SINGLE */
.kandidatValue{
  font-size: 19px;
  line-height: 29px;
  margin-top: 30px;
}

/* .kandidatValue:first-child{
  margin-top: 30px;
} */

.featureImage{
  position: absolute;
  right: 50%;
  margin-right: -50vw;
  left: 50%;
  top: 0;
  bottom: 0;
  float: right;
  /* max-height: 400px; */
  max-height: auto;
  z-index: -1;
}

.featureImage .image{
  margin-top: 140px;
  position: relative;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.video, .is-type-video {
  width: 100%;
  position: relative;
  overflow: hidden;
  margin-top: 30px;
}

.video:before, .is-type-video:before {
  content: "";
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  display: block;
  overflow: hidden;
}

.video iframe, .is-type-video iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


/* --- PRAKTISK --- */

.faqArea{
  text-align: center;
  margin-bottom: 100px;
}

main#content.page .faqArea h3{
  margin: 5px 0 30px 0;
}

.faqTable{
  padding-top: 30px;
  text-align: left;
}


.faqRow{
  width: 100%;
  border-bottom: 1px solid #D3D3D3;
  font-weight: bold;
}

.faqRow .top{
  display: grid;
  grid-template-columns: 1fr 30px;
  padding: 15px 0;
  cursor: pointer;
}

.faqRow:first-child{
  border-top: 1px solid #D3D3D3;
}

main#content.page .faqRow .arrow{
  margin: 0px;
  transition: all 0.15s var(--standard-easing);
}

.faqRow .answer{
  font-weight: normal;
  overflow: hidden;
  max-height: 0px;

  transition: all 0.15s ease-in;
}

.faqRow.open .answer{
  padding-top: 5px;
  padding-bottom: 15px;
  overflow: hidden;
  max-height: 600px;
}

.faqRow.open .arrow{
  transform: rotate(45deg) translate(2px, 6px);
}



/* --- TILMELDING --- */
.tilmelding{
  text-align: center;
  padding: 0 30px;
}

main#content .tilmelding h2{
  margin-bottom: 40px;
}



/* --- WORKSHOPS Page --- */

main#content.page ul#modulHeading{
  margin-left: 0px;

}
#modulHeading li{
  list-style: none;
}

.workshopItem{
  clear:both;
  font-weight: bold;
  border-bottom: 1px solid #D3D3D3;
  padding: 15px 0;
}

.workshopItem:first-of-type {
  border-top: 1px solid #D3D3D3;
}

#workshopOverview #modulHeading {
  display: block;
}

.modulHeading_mobil {
  display: none;
}

.modul1, .modul2{
  padding-right: 30px;
}

@media only screen and (max-width: 767px) {
  #workshopOverview #modulHeading {
      display: none;
  }

  #workshopOverview .modulHeading_mobil {
      display: block;
  }
}

/* --- DEBATTER --- */

.debatItem{
  clear:both;
  font-weight: bold;
  border-bottom: 1px solid #D3D3D3;
  padding: 15px 0;
}

.tid1, .tid2, .tid3{
  padding-right: 30px;
}

.debatItem:first-of-type {
  border-top: 1px solid #D3D3D3;
}

#debatOverview #modulHeading {
  display: block;
}

@media only screen and (max-width: 767px) {
  #debatOverview #modulHeading {
      display: none;
  }

  #debatOverview .modulHeading_mobil {
      display: block;
  }
}




@media only screen and (min-width: 1200px){

  .kandidatRow .kandidatImage{
    height: 150px;
  }
  
  .kandidatRow .kandidatImageSrc{
    width: 150px;
    height: 150px;
  }

}

@media only screen and (max-width: 900px){
  #mainMenu li a{
    padding: 10px 6px;
  }
}




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

  .wrapper {
    width: 90%;
    max-width: 1600px;
    margin: 0 auto;
    padding-left: 0px;
    padding-right: 0px;
  }

  main#content{
    overflow-x: hidden;
    padding-top: 70px;
  }

  .pageSection{
    margin: 50px 0 30px 0;
  }

  .rightSidebar{
    display: none;
  }

  .smallClearfix{
    clear: both;
    width: 100%;
  }

  .bigClearfix{
    display: none;
  }


  /* -- TYPOGRAFI -- */
  h2{
    font-size: 32px;
  }

  /* -- HEADER -- */
  #logoArea.active{
    z-index: 9999;
  }

  #logoArea.active h1,
  #logoArea.active p{
    display: none;
  }

  #logoImg img{
    position: relative;
    transform: translateX(0px);
    float: left;
    margin-right: 10px;
  }

  #logoArea.active #logoImg img.white{
    display: block;
  }

  #logoArea.active #logoImg img.black{
    display: none;
  }

  #logoArea p {
    margin-left: 40px;
  }

  #menuToggle{
   position: relative;
   display: block;
   margin-top: -5px;
  }

  #menuToggle.active{
    z-index: 999;
    position: fixed;
    top: 30px;
    right: 4%;
  }

  #mainMenu{
    visibility: hidden;
    position: absolute;
    overflow: hidden;
    width: 0px;
  }

  .menu-mainmenu-container{
    padding-top: 0px;
  }

  #menu-mainmenu{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  #mainMenu.active{
    position: fixed;
    visibility: visible;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: #2C1C31;
    color: #fff;
    z-index: 999;
  }

  #mainMenu .menu-hovedmenu-container{
    position: relative;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  #mainMenu li{
    text-align: center;
    display: block;
    font-size: 23px;
    padding: 20px 0;
    transform: translateY(40px);
    opacity: 0;

    transition: all 0.3s var(--standard-easing);
  }

  #mainMenu.active li:nth-child(1){
    display: block;
    transition-delay: 0s;
  }

  #mainMenu.active li:nth-child(2){
    transition-delay: 0.1s;
  }

  #mainMenu.active li:nth-child(3){
    transition-delay: 0.2s;
  }

  #mainMenu.active li:nth-child(4){
    transition-delay: 0.3s;
  }

  #mainMenu.active li:nth-child(5){
    transition-delay: 0.4s;
  }

  #mainMenu.active li{
    opacity: 1;
    transform: translateY(0px);
  }

  #mainMenu li a {
    color: #fff;
    font-size: 28px;
  }

  #logoArea.active #logoImg{
    position: relative;
    z-index: 99999;
  }

  /* -- FOOTER -- */

  footer{
    background-image: none;
  }

  .footerMessage{
    margin-top: 100px;
  }

  .footerMessageText{
    margin-bottom: 70px;
  }

  #mainFooter ul{
    font-size: 19px;
  }

  #mainFooter .col-sm-3{
    margin-bottom: 50px;
  }

  .footerBottom{
    margin-top: 20px;
    margin-bottom: 50px;
  }

  .footerLogo{
    text-align: center;
    margin-top: 40px;
  }

  /* -- HOME -- */

  .heroSpotTitle{
    max-width: 80%;
  }

  .heroSpotTitle h1{
    font-size: 34px;
  }

  .heroSpotImage{
    margin-top: 30px;
  }

  .navigationSection{
    grid-template-columns: 1fr;
  }

  .teaserBox{
    padding: 10px 0px;
  }

  .podcast .col-sm-4 img{
    width: 40%;
  }

  .deadlineBox a:hover{
    box-shadow: none;
  }

  /* -- KANDIDAT -- */

  .featureImage{
    width: 100%;
    height: 300px;
    z-index: -82;
    left: 0;
    position: relative;
    margin-right: 0px;
    margin-bottom: 30px;
  }
  
  .featureImage .image{
    margin-top: 0px;
  }
}


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

  main#content{
    padding-top: 80px;
  }

  /* -- TYPOGRAFI -- */
  h1 {
    font-size: 32px;
  }
  
  h2 {
    font-size: 28px;
  }
  
  h3 {
    font-size: 24px;
  }
  
  h4 {
    font-size: 22px;
  }
  
  h5 {
    font-size: 20px;
  }
  
  h6 {
    font-size: 18px;
  }

  /* -- HEADER -- */

  #logoImg img{
    width: 25px;
  }

  #logoArea h1{
    font-size: 20px;
  }

  #logoArea p{
    margin-left: 35px;
    margin-top: 0px;
  }

  #menuToggle{
    margin-top: -5px;
  }

  /* -- FOOTER -- */
  .footerMessage{
    margin-top: 60px;
  }

  .footerImage img{
    height: auto;
    width: 50%;
  }

  /* -- HOME -- */

  .forslagRow {
    grid-template-columns: 30px 4fr;
  }

  .forslagRow .category{
    margin-top: 10px;
    grid-column: 2 / span 1;
    color: #999;
  }

  main#content .podcast h2{
    margin-bottom: 20px; 
    font-size: 32px;
  }

  .deadlines .col-xs-6{
    width: 100%;
  }

  .deadlineBox a{
    padding: 15px;
    width: 100%;
    margin-bottom: 10px;
  }

  .deadlineBox .date{
    width: 40%;
    float: left;
  }

  .deadlineBox .line{
    display: none;
  }

  .deadlineBox .text{
    float: left;
    width: 50%;
    margin-left: 5%;
  }

  #dayList li{
    font-size: 14px;
    padding: 10px 6px;
    user-select: none;
  } 

  .programItem .top, .programItem .bund{
    grid-template-columns: 2fr 5fr 3fr 10px;
  }

  .programItem .bund .beskrivelse{
    font-size: 16px;
    grid-column: 1 / span 3;
  }

  .programItem.open .arrow {
    transform: rotate(45deg) translate(0px, 0px);
  }

  /* -- FORSLAG -- */
  .forslagArea{
    margin-bottom: 40px;
  }

  /* -- KANDIDAT -- */

  .kandidat h2{
    font-size: 22px;
  }

  .kandidatImage, .kandidatImageSrc {
    height: 150px;
  }

}



@media only screen and (max-height: 400px){

  #mainMenu li{
    padding: 10px 0;
  }
}


/* -- FONTS -- */


@font-face {
  font-family: "YoungSerif";
  src: url("fonts/youngserif-regular-webfont.woff2") format("woff2"),
    url("fonts/youngserif-regular-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}