:root {
  --main-text-color: rgba(255,255,255,0.8);
  --main-bg-color: #202222;
  --warning-color: #0664d3;
  --colored-box-bg: darkorange;
}


.unselectable {
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
}

* {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}

*,
*:after,
*:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* DONT style scrollbars, the original doesnt */

html {
  font-family: sans-serif;
  font-size: 11px; 
  line-height: 1.15;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  height: 100%;
  margin: 0px; padding: 0px;
}

body {
  background: var(--main-bg-color);
  font-family: Georgia;
  font-weight: 400;
  line-height: 1.5;
  font-size: 1.325rem; /* i think this is the right size! */
  color: var(--main-text-color);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0px;
  padding: 0px;
  height: 100%;
  overflow: auto;
}

/* for fullsize */
body.fullSize {
  overflow: hidden;
}

#pageWrapper {
  width: auto;
  position: relative;
  min-height: 100vh;
}

.insideWrapper {
  max-width: 127.2727272727rem;
  margin: 0px auto;
}


.hidden {
  visibility: hidden;
  height: 0px;
}


/* *********************************************************************************** */

blockquote, dd, div, dl, dt, form, h1, h2, h3, h4, h5, h6, li, ol, p, pre, td, th, ul {
  margin: 0;
  padding: 0;
}

dl, ol, ul {
  margin-bottom: 1rem;
  list-style-position: outside;
  line-height: 1.6;
}


h1, h2, h3, h4, h5, h6 {
  font-family: 'auBold'; /* 'au_passatabold'; */
  margin: 0px 0px 1rem 0px;
  font-style: normal;
  font-weight: 400;
  color: inherit;
  line-height: 1.4;
  letter-spacing: 0.0125em;
  text-rendering: optimizeLegibility;  
}

h1.pageTitle {
  font-size: 3.6rem;
  margin: 0 0 1.6rem;
  letter-spacing: 0;
}

.firstHeader {
  margin-top: 1em;
  margin-bottom: 0;
}

p {
  margin-bottom: 1rem;
  font-size: inherit;
  line-height: 1.6;
  text-rendering: optimizeLegibility;
}

p.mainP {
  font-size: 16px; /* 1.2em; */
}

a {
  line-height: inherit;
  color: inherit; /* #002546; */
  text-decoration: none;
  cursor: pointer;
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
}
a:hover {
  text-decoration: underline;
}

/* logos for danish sponsors */
img.spons {
  margin-bottom: 1rem;
  margin-right: 2rem;
  opacity: 0.5;
  vertical-align: top;
}

.skf {
  max-height: 75px;
}
.aak {
  max-height: 65px;
}

/* *********************************************************************************** */

.warning {
  background-color: var(--warning-color);
  margin-bottom: 0;
  padding: .6rem;
  overflow: auto;
  position: relative;
  margin: 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: hidden;
}

.warning h3 {
  text-align: center;
  margin-bottom: .1rem;
  font-size: 1.6363636364rem;
  line-height: 1.4;
}

.warning h3 a {
  text-decoration: none;
  color: rgba(255,255,255,0.86); /*  #0a0a0a; */
  padding: .6rem;
}

/* *********************************************************************************** */

header {
  max-width: 127.2727272727rem;
  margin: 0px auto;
  background-color: var(--colored-box-bg); /* darkorange; /* #002546; */
  color: #222; /* #fff; */
  padding: 0px; /* 1rem; */
}

header::after {
  content: "";
  display: table;
  clear: both;
}


/* logo */
header #logo {
  display: block;
  max-width: 300px; /* 142px; */
}

header #logo h1 {
  display: block;
  max-width: 100%;
  /* float: left; */
  margin-bottom: 0px;
}
header #logo h1 a {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  height: 48px; /* 48 + 2 = 50px; */
  padding-bottom: 2px;
  padding-left: 15px;
}
header #logo h1 a img {
  display: block;
  max-width: 100%;
}


/* *********************************************************************************** */
/* topmenu */

header #topMenu {
  display: block;
  float: right;
  padding: 0px;
}
header #topMenu ul {
  display: block;
  float: right;
  list-style-type: none;
  line-height: 1.0;
  padding: 0px;
  margin: 0px;
  color: white;
}
header #topMenu ul li {
  display: block;
  float: left;
}
header #topMenu ul li a {
  display: block;
  float: left;
  color: #222; /* #fff; */
  text-decoration: none;
  padding: 0px; /*  1rem 1rem 1.1rem 1rem; */
  font-size: 150%;
  border-left: 1px solid rgba(0,0,0,0.1); /* 1px solid hsla(0, 0%, 100%, .15); */
  position: relative;
}

/* find icon */
header #topMenu ul li.find a {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding-right: 40px;
  padding-left: 15px;
  font-size: 1.45rem;
  height: 50px;
  vertical-align: middle;
  font-family: 'auRegular'; /* 'auIcons'; */
}
header #topMenu ul li.find a::after {
  font-family: 'auIcons';
  content: "f";
  font-size: 3rem;
  position: absolute;
  height: 25px; /* 32px; /* 25px; */
  width: 34px;
  color: #222; /* #fff; */
  z-index: 100;
  display: block;
  top: 16px; /* 15px; /* 1rem; */
  right: 6px;
  overflow: hidden;
}

/* search icon */
header #topMenu ul li.search a {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  color: #222; /* #fff; */
  padding: 0px 15px;
  height: 50px;
  width: 42px; /* 45px; */
}
header #topMenu ul li.search a::after {
  position: absolute;
  display: block;
  top: 13px; /* 15px; /* 1rem; */
  height: 25px; /* 32px; /* 25px; */
  width: 18px; /* 15px; /* 34px; */
  font-family: 'auIcons';
  font-size: 2rem;
  content: "7";
}
    


.department header .find .find-button {
  padding-right: 40px;
  font-size: 1.45rem;
}
.department header .find-button:after {
    font-family: au_icons;
    content: "f";
    font-size: 3rem;
    position: absolute;
    height: 25px;
    width: 34px;
    color: #fff;
    z-index: 100;
    display: block;
    top: 1rem;
    right: 6px;
    overflow: hidden;
}


/* *********************************************************************************** */

.sectionTitle {
  max-width: 127.2727272727rem;
  margin: 0px auto;
  padding-top: .5em;
  padding-bottom: .5em;
  border-bottom: 3px solid var(--colored-box-bg); /* darkorange; /* #002546; */
}

.sectionTitle h2 {
  font-family: 'auRegular';
  font-weight: 400;
  font-size: 3.6rem;
  padding: .5em 0;
  letter-spacing: 0;
}

.sectionTitle h2 a {
  /* color: #002546; */
  color: rgba(255,255,255,0.92);
  text-decoration: none;
}





/* *********************************************************************************** */

#main {
  max-width: 127.2727272727rem;
  margin: 0px auto;
}

/*
#main h1, #main h2, #main h3, #main h4 {
  margin-top: 1em;
  margin-bottom: 0;
}
*/


.ulContentLinks {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}

.ulContentLinks li {
  display: block;
  padding-left: 1.5rem;
  margin-bottom: .65rem;
  position: relative;
}

.ulContentLinks li::before {
  font-family: 'auIcons';
  content: "≥";
  position: absolute;
  top: 4px;
  left: 0px;
  font-size: .8rem;
  margin-right: 1rem;
}

.ulContentLinks li a {
  line-height: inherit;
  /* color: white; /* #002546; */
  color: rgba(255,255,255,0.92); /* #234; */
  /* text-decoration: none; */ /* dont do this here */
  cursor: pointer;
}


/* button */
a.button {
  display: inline-block;
  vertical-align: middle;
  margin: 0 0 1rem;
  padding: .85em 1em;
  -webkit-appearance: none;
  border: 1px solid transparent;
  border-radius: 0;
  transition: background-color .25s ease-out,color .25s ease-out;
  font-size: 1.55rem;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  background-color: var(--colored-box-bg);
  color: #222; /* #fefefe; */
  font-family: 'auRegular';
  text-decoration: none;
}

/* full width */
a.btnFull {
  width: 100%;
  text-align: left;
}
a.btnFullCenter {
  width: 100%;
  text-align: center;
}


/* person info box */
.infoBoxWrapper {
  display: block;
  width: 100%;
  max-width: 305px;
  min-height: 13.82em;
  background-color: rgba(0,0,0,0.2); /* #f0eeef; */
  margin: 0 0.8em 0.8em 0;
  padding: 0.8em;
  position: relative;
}

.infoBoxWrapper h3 {
  margin-bottom: 0.25rem !important;
}

.infoBoxWrapper p {
  font-size: 85%;
  max-width: calc(100% - 80px);
}
/* details */
.infoBoxWrapper ul.details {
  max-width: calc(100% - 80px);
  font-size: 95%;
  /* word-break: break-all; */
}
.infoBoxWrapper ul.details li {
  display: block;
  width: 100%;
  padding-left: 2.5rem;
}
.infoBoxWrapper ul.details li a {
  text-decoration: underline;
  text-decoration-style: dotted; /*  var(--main-text-color); */
  cursor: pointer;
}
.infoBoxWrapper ul.details li.email {
  background: url(../images/smallIcons/email.png);
  background-position: left 4px;
  background-repeat: no-repeat;  
}
.infoBoxWrapper ul.details li.building {
  background: url(../images/smallIcons/building.png);
  background-position: left 4px;
  background-repeat: no-repeat;  
}
.infoBoxWrapper ul.details li.phone {
  background: url(../images/smallIcons/phone.png);
  background-position: left 4px;
  background-repeat: no-repeat;  
}


.infoBoxImgWrapper {
  position: absolute;
  right: 0px;
  bottom: 0px;
  width: 100%;
  min-height: 13.82em;
  /* border: 1px solid red; */
  z-index: -1;
}

.infoBoxImgWrapper img {
  position: inherit;
  bottom: 1em !important;
  right: 1em;
  top: inherit;
  height: 110px;
  width: 80px;
  object-fit: cover;
}


/* revised Wrapper - below content */
.revisedWrapper {
  border-top: 1px solid rgba(255,255,255,0.25); /* 1px solid #e4e4e4; */
  font-family: 'auRegular';
  clear: both;
  padding: 1.2em 0;
  font-size: 90%;
  color: rgba(255,255,255, 0.82); /* #636363; */
  text-transform: none;
  padding-bottom: 2.2em;
  display: block;
  overflow: hidden;  
}



/* *********************************************************************************** */

.collapsible {
  background-color: rgba(255,255,255, 0.075);
  padding: 1rem 1rem 0px 1rem;
  margin-bottom: 1rem;
  position: relative;
  clear: both;
}

a#collapseBtn {
  position: absolute;
  top: 1rem;
  right: 0.65rem;
  background-color:rgba(255,255,255,0.75);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  text-align: center;
  margin-bottom: 0px;
  overflow: hidden;
  background: rgba(255,255,255,0.75) url(../images/minusIcon.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
a#collapseBtn.plus {
  background: rgba(255,255,255,0.75) url(../images/plusIcon.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;  
}
a#collapseBtn:hover {
  text-decoration: none;
}

/* collapsible content */
#collapseContent {
  height: auto;
  overflow: hidden;

}
#collapseContent.hidden {
  height: 0px;
}


/* *********************************************************************************** */

.breadCrumbWrapper {
  text-align: right;
  padding: 1rem 1rem; /* 0px; */
}



ul#breadcrumbs {
  list-style: none;
  color: rgba(255,255,255, 0.82); /* #636363; */
  font-family: 'auRegular';
  font-size: 90%;
  padding: 0px;
  margin: 0px;
}

ul#breadcrumbs li {
  display: inline-block;
}

ul#breadcrumbs li strong {
  font-family: 'auRegular'; /* AUPassataRegular; */
  font-weight: 400;
}

ul#breadcrumbs li a {
  display: inline-block;
  color: rgba(255,255,255, 0.82); /* #7b7b7b; */
  text-decoration: underline;
}
ul#breadcrumbs li a.active {
  text-decoration: none;
}


/* spacer bullet */
div.breadSpacer {
  display: inline-block;
  font-size: 80%;
  padding-left: 0.25em;
}
div.breadSpacer::before {
  font-family: 'auIcons';
  content: "≥";
  color: rgba(255,255,255, 0.75);
}


/* *********************************************************************************** */
/* footer */

footer {
  /* padding: 5rem 1.5rem 5rem 1.5rem; */
  border-top: 1px solid rgba(255,255,255,0.25); /* 1px solid #e4e4e4; */
}

footer ul li {
  list-style: none;
  padding-left: 1.5rem;
  margin-bottom: .65rem;
}



/* *********************************************************************************** */
/* page-id */

.page-id {
  font-family: Georgia;
  color: inherit; /* #06315a; */
  width: 100%;
  text-align: right;
  display: block;
  padding-right: 1em;
  margin-top: -2em;
  font-size: 80%;
}




/* *********************************************************************************** */
/* *********************************************************************************** */
/* *********************************************************************************** */
/* *********************************************************************************** */
/* *********************************************************************************** */

@media (min-width: 0px) {

  /* section padding */
  #main { padding: 0px 1.3636363636rem; }

  .sectionTitle { padding-left: 1.3636363636rem; padding-right: 1.3636363636rem; }

  footer { padding: 5rem 1.3636363636rem 5rem 1.3636363636rem; }


  /* hero img */
  #heroImgWrapper {
    width: 100%;
    height: auto; /* 350px; */
    min-height: 90px;
    margin-bottom: 2em;
    /* background-image: url(../images/ELO_2021_new-banner.png); */
    background-image: url(../images/ELO_2021_Inverse.png);
    background-color: #111;
    background-position: left top;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    /*
    -webkit-transition: all 400ms ease-in-out;
    -moz-transition: all 400ms ease-in-out;
    -o-transition: all 400ms ease-in-out;
    transition: all 400ms ease-in-out;
    */
  }
  #heroImgWrapper .imgCaption {
    position: absolute;
    margin-left: 14px;
    bottom: 6px;
    color: rgba(255,255,255,0.86);
    text-shadow: 0px 0px 5px black;
    font-family: 'auRegular';
  }


  /* herowrapper fullsize */
  #heroImgWrapper.fullSize {
    position: fixed;
    top: 0px; /* 0px; */
    left: 0px;
    width: 100vw !important; /* 50vw !important; */
    min-width: auto;
    height: 50vh; /* 100vh; */
    background-color: black;
    z-index: 100;
    overflow: hidden;
    background-position: left center;
    background-size: cover;
  }

  #heroFrame {
    width: 100%; /* 50%; */
    height: 50%;
  }
  
  /* mapbox */
  #heroImgWrapper #map {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 100; /* Needs to be on top of imgFrame, for events */
    width: 100%;
    height: 100%;
    opacity: 1.0;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
  }
  #heroImgWrapper #map.hidden {
    opacity: 0.0;
  }

  #heroImgWrapper #imgFrame {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 90;    
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 1.0;
    -webkit-transition: all 200ms ease-in-out;
    -moz-transition: all 200ms ease-in-out;
    -o-transition: all 200ms ease-in-out;
    transition: all 200ms ease-in-out;
  }
  #heroImgWrapper #imgFrame.hidden {
    opacity: 0.0;
  }

}


/* *********************************************************************************** */
/* 800px is where the hero img changes */

@media (min-width: 800px) {

  /* hero img */
  #heroImgWrapper {
    width: 100%;
    height: 350px;
  }

  /* herowrapper fullsize */
  #heroImgWrapper.fullSize {
    width: 50vw !important;
    height: 100vh;
  }

  #heroFrame {
    width: 50%;
  }

}


/* *********************************************************************************** */

@media (min-width: 1440px) {

  /* section padding */
  #main { padding: 0px 0rem; }
  .sectionTitle { padding-left: 0rem; padding-right: 0rem; }
  footer { padding: 5rem 0rem 5rem 0rem; }


}



/* *********************************************************************************** */
/* *********************************************************************************** */
/* *********************************************************************************** */


@font-face {
  font-family: 'auRegular';
  src: url('../fonts/au/aupassata_rg-webfont.woff2') format('woff2'),
       url('../fonts/au/aupassata_rg-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'auBold';
  src: url('../fonts/au/aupassata_bold-webfont.woff2') format('woff2'),
       url('../fonts/au/aupassata_bold-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'auIcons';
  src: url('../fonts/au/au_icons.woff2') format('woff2'),
       url('../fonts/au/au_icons.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}