/*! HTML5 Boilerplate v5.3.0 | MIT License | https://html5boilerplate.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */



html {
    /*background-color: rgb(240, 240, 230);*/
    /*background-color: rgb(219, 184, 131);*/
    /*background-color: rgb(229, 223, 211);*/
/*    background-color: #f5f5f5;  */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1.25em;
    /*letter-spacing: -0.025em;*/
    line-height: 1.25;
    /*overflow: auto;*/
    
    font-family: lars;
    background-color: white;
    /*color: #c4c4c4;*/
    color: black;
    -webkit-overflow-scrolling: touch !important;
    

}


body {
    width: 100vw;
   
    margin: 0px;
    padding:0px;
    /*overflow: auto;*/


/*    font-weight: bold;*/
/*    font-size: 1.5vw;*/
    
}

* {box-sizing: border-box;}

/** {
  border: 5px solid #f00 !important;f
}
*/

/*html.touch *:hover {
    all:unset!important;
}

html.touch *:hover {
    pointer-events: none !important;
}*/

::-webkit-scrollbar:horizontal {
    display: none;
    background-color: none;
    padding: 0px 5px 0px 5px;
}

::-webkit-scrollbar {
    width: .4em;
    background-color: none;
    padding: 0px 5px 0px 5px;
}
 
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 0px rgba(0,0,0,0.3);
    background-color: none;
    padding: 0px 5px 0px 5px;
    right: 5px;
}
 
::-webkit-scrollbar-thumb {
    background-color: #2f2f2f;
    border-radius: 10px;
    padding: 0px 5px 0px 5px;
}




*::-webkit-scrollbar {
  width: .01em;
}
 
*::-webkit-scrollbar-track {
  /*box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);*/
}
 
*::-webkit-scrollbar-thumb {
  background-color: none;
  outline: 1px solid blue;
}




/* Paste this css to your style sheet file or under head tag */
/* This only works with JavaScript, 
if it's not present, don't show loader */
.no-js #loader { display: none; background-color: black; }
.js #loader { display: block; position: absolute; left: 100px; top: 0; background-color: black;}
.se-pre-con {
    background-color: black;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(../img/krydsload_stor.gif) center no-repeat #000;
}


















/* --------------------- IO WEBSITE --------------------- */



body::-webkit-scrollbar {
  width: .1em;
}
 
body::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
 
body::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
}

/*.imref-wrapper {
    width: 100%;
    height: 100%;
    position: fixed;
    background-color: green;
}*/

/*.ulineme {
    display: inline-inline;
    width: auto;
    margin: 0 auto;
    cursor: pointer;
}

.ulineme:hover:after {
    display: inline-block;
    width: auto;
    background: #fff;
}

.ulineme:after {
    content: '';
    display: inline-block;
    margin: auto;
    -margin-top: -2px;
    height: 2px;
    width: 0px;
    background: transparent;
    transition: width .3s ease, background-color .3s ease;
}
*/

.imfrefcapalone a:link {
    color: red !important;
}


#reloader {
    position: fixed;
    z-index: 999999999999999999999999999999999999;
    width: 100%;
    height:100%;
    background-color: none;
    cursor: pointer;
    display: none;
}

.shown {
    display: block !important;
}

.vidcaption {
    width: 100%;
    text-align: center;
    font-size: .75em;
    margin-top: .5em;

}

.imref-container{
    z-index: 10000;
    width:100%;
    height: 100%;
    display: none;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    flex-wrap: wrap;
    position: fixed;
    cursor: pointer;
}

.imrefcap {
    position: relative;
    margin-top: 10px;
    background: #fff;
    width: auto;
    text-align: center;
    padding: 5px 10px 5px 10px;
    border-radius: 5px;
    border: 0px solid black;
    -webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
    /*display: inline-block;*/
    margin: 0 auto;
    font-size: .75em;
}

.imrefcapalone {
    width: 50vw;
    font-size: 1em;
    padding: 20px;
}

.imrefcapalone a {
    color:blue !important;
    border-bottom: 2px solid transparent;
}

.imrefcapalone a:hover {
    color:blue!important;
    border-bottom: 2px solid blue;
}

.imref {
    /*position: fixed;*/
    flex-basis: 100px;
    /*flex-grow: 1;*/
    /*margin: 10px;*/
    max-height: 75vh;
    max-width: 75vw;
    /*background-color: red;*/
    /*display:none;*/
    }



.imref img {
    -webkit-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
-moz-box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
box-shadow: 0px 0px 15px 5px rgba(0,0,0,0.25);
}


.imrefimg {
        max-height: 75vh;
    max-width: 75vw;
}


.imreftrigger {
    color: blue;
    cursor: pointer;
    display: inline;
    border-bottom: 2px solid transparent;
    -webkit-transition: 0.5s ease;

}

.imreftrigger:hover {
/*    /*text-decoration: underline;*/
    border-bottom: 2px solid blue;
}

.active {
    display: flex !important;
}





.fncontainer {
    font-size: .75em;
    width: 100%;
    padding: 25px 25px 25px 25px;
    /*background-color: red;*/
    hyphens: auto;
    column-count: 2;
    column-gap: 25px;

      overflow-wrap: break-word;
  word-wrap: break-word;

  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things wherever */
  word-break: break-all;
  /* Instead use this non-standard one: */
  word-break: break-word;

  /* Adds a hyphen where the word breaks, if supported (No Blink) */
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto;

}

.fnoteref {
    vertical-align: super;
    font-size: .75em;
}

.imprint-right-col {
    padding-top:25px;
    /*padding-right:50px;*/
    float: right;
}

.imprint-headline {
    text-align: center;
    text-transform: uppercase;
}

.caps {
    text-transform: uppercase;
}

.contentwrapper {

    -webkit-touch-callout: blue !important;
    -webkit-user-select: blue !important;
    -khtml-user-select: blue !important;
    -moz-user-select: blue !important;
    -ms-user-select: blue !important;
    user-select: blue !important;

    ::-moz-selection { background: yellow; }
    ::selection { background: yellow; }
}

::selection {
    color: white;
    background: blue; /* WebKit/Blink Browsers */
}

::-moz-selection {
    color: white;
    background: blue; /* Gecko Browsers */

}


.binarytrigger {
    width: auto;
    display: inline;
    color: blue;
    cursor: pointer;
}

.binarytrigger:hover {
    background: blue;
    color:white;
}



.closethething {
    position: fixed;
    width: 100%;
    height: 100%;
    text-align: center;
    padding-top:100px;
    background: transparent;
    top:100px;
    left: 100px;
    cursor: pointer;
    z-index: 500;
    display: none;
}

#thebinary-1 {
    font-family: arial;
    display: none;
    position: fixed;
    top:25px;
    left: 25px;
    width: calc(95% - 0px;);
    /*width: 100%;*/
    margin-right: 20px;
    height: auto;
    max-height: 100%;
    color:red;
    background: yellow;
    overflow: scroll;
    overflow-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;

/*    font-size: 10em;
    line-height: 1em;*/
    cursor: pointer;
}

#thebinary-2 {
    font-family: lars;
    /*font-weight: 100;*/
    font-size: 2.5em;
    display: none;
    position: fixed;
    top:0px;
    left: 0px;
    /*width: calc(95% - 0px;);*/
    width: 100%;
    margin-right: 20px;
    height: auto;
    max-height: 100%;
    color:white;
    background: blue;
    overflow: scroll;
    overflow-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;

/*    font-size: 10em;
    line-height: 1em;*/
    cursor: pointer;
}



#thebinary-3 {
    font-family: lars;
    /*font-weight: 100;*/
    font-size: 47vw;
    display: none;
    position: fixed;
    top:0px;
    left: 0px;
    width: calc(95% - 0px;);
    /*width: 100%;*/
    margin-right: 0px;
    height: auto;
    max-height: 100%;
    color:red;
    /*background: blue;*/
    overflow: scroll;
    overflow-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;
    /*overflow: hidden;*/
/*    font-size: 10em;
    line-height: 1em;*/
    cursor: pointer;
    /*text-shadow: 0px 0px 50px red;*/
    text-align: center;
}


#thebinary-4 {
    font-family: lars;
    display: none;
    position: fixed;
    top:25px;
    left: 25px;
    width: calc(95% - 0px;);
    /*width: 100%;*/
    margin-right: 20px;
    height: auto;
    max-height: 100%;
    color:black;
    background: none;
    overflow: scroll;
    overflow-wrap: break-word;
    overflow-wrap: break-word;
    word-break: break-all;

/*    font-size: 10em;
    line-height: 1em;*/
    cursor: pointer;
}



/* PULSATING CARET */
[blinker]:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 0.5em;
    height: 1.25em;
    margin-bottom: .25em;
    background: blue;
    animation: caretPulsate .5s linear infinite;
    -webkit-animation: caretPulsate .5s linear infinite;
}
@keyframes caretPulsate {
  0%   {opacity:1;}
  50%  {opacity:1;}
  60%  {opacity:0;}
  100% {opacity:0;}
}
@-webkit-keyframes caretPulsate {
  0%   {opacity:1;}
  50%  {opacity:1;}
  60%  {opacity:0;}
  100% {opacity:0;}
}



/* PULSATING CARET */
[data-typer]:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 0.5em;
    height: 1.25em;
    margin-bottom: .25em;
    background: blue;
    animation: caretPulsate .5s linear infinite;
    -webkit-animation: caretPulsate .5s linear infinite;
    
}
@keyframes caretPulsate {
  0%   {opacity:1;}
  50%  {opacity:1;}
  60%  {opacity:0;}
  100% {opacity:0;}
}
@-webkit-keyframes caretPulsate {
  0%   {opacity:1;}
  50%  {opacity:1;}
  60%  {opacity:0;}
  100% {opacity:0;}
}



video {
    cursor: pointer;
}

/*

h1 {
    font-size:inherit;
    font-style: inherit;
    color: black;
    font-weight: normal;
}

.content {
  background: white;
  opacity: 0.7;
  white-space: nowrap;
  overflow: hidden;
  border-right: 3px solid black;
  -webkit-animation: typing 2s steps(26, end),
    blink-caret 1s step-end 2s;
  -moz-animation: typing 2s steps(26, end),
    blink-caret 1s step-end 2s;
}

@-webkit-keyframes typing {
  from {
    width: 0;
  }

  to {
    width: 400px;
  }
}

@-moz-keyframes typing {
  from {
    width: 0;
  }

  to {
    width: 400px;
  }
}

@-webkit-keyframes blink-caret {

  from,
  to {
    border-color: transparent
  }

  50% {
    border-color: black
  }
}

@-moz-keyframes blink-caret {

  from,
  to {
    border-color: transparent
  }

  50% {
    border-color: black
  }
*/




/* --------------------- IO WEBSITE --------------------- */


























































/* --------------------- 2019 --------------------- */

.slide-wrapper {
    height: 100%;
    width: 100%;
    margin: 0;
    text-align:center;
    /*object-fit: cover;*/
    background-color: white;
}

.fullbleed {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fullbleed img {
    height: 100%;
    /*object-fit: contain;*/
}

.contain {
    object-fit:contain;
    padding: 125px 20px 125px 20px;
}

.padding {
    padding: 50px;
}

.padding-75 {
    padding: 75px;
}

/*.portrait-wrapper {
    height:100%;
}*/

.portrait-2-wrapper {
    float:left;
    width:50%;
    height:100%;
    padding: 50px 15px 50px 15px;
}

.portrait-3-wrapper {
    float:left;
    width:33%;
    height:100%;
    padding: 50px 15px 50px 15px;
}

.portrait-4-wrapper {
    float:left;
    width:25%;
    height:100%;
    padding: 1%;
}

.portrait-left {
    height: 100%;
    float:right;
    object-fit:scale-down;
    margin-right: -5px !important
}

.portrait-right {
    height: 100%;
    float:left;
    object-fit:scale-down;
    margin-left: -5px !important;
}

.doublefullbleed {
    float:left;
    width:50%;
    height:100%;
    object-fit:cover;
}

.webvid-wrapper {

}



.webvid {
    position: absolute;
    width: 75%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /*object-fit: scale-down;*/
    -webkit-box-shadow: 10px 10px 29px -15px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 29px -15px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 29px -15px rgba(0,0,0,0.75);

/*    border-left: 1px solid rgb(223, 224, 230);
    border-right: 1px solid rgb(223, 224, 230);
    border-bottom: 2px solid rgb(223, 224, 230);*/

}

video .webvid {

}

.fullbleedvid {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    object-fit: scale-down;
    border-left: 1px solid rgb(223, 224, 230);
    border-right: 1px solid rgb(223, 224, 230);
    border-bottom: 2px solid rgb(223, 224, 230);
}

/* --------------------- 2019 --------------------- */


























.name-image {
    width: 50%;
    display: block;
    margin:0 auto;
}

.introwrapper {
    position: fixed;
    display: block;
    width: 100%;
    height: 100%;
    /*background-color:rgb(220,215,200);*/
    background-color:rgb(255,255,255);
    z-index: 99999999999999999999999999999999;
    /*background-color: black;*/
    /*color: white;*/
}

.intro-inner {
    display:none;
    color:black;
    text-align: center;
    font-size: 50em;
    /*font-family: alexismark;*/
    /*font-family: lean;*/
    /*font-family: timescondensed;*/
    /*font-weight: 700;*/
    /*letter-spacing: .05em;*/
    margin:auto;
    width: 75%;
    height: auto;
    line-height: 1.2em;
    letter-spacing: -.01em;
    position: relative;
    top: 50%;
    transform: perspective(1px) translateY(-50%);
}




.topmenu {
    /* text-transform: uppercase; */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background-color: none;
    position: fixed;
    padding: 15px 5px 5px 15px;
    width: 100%;
    height: auto;
    margin-bottom: 0px;
    /* font-size: 1em; */
    letter-spacing: -.00em;
    font-weight: 500;
    line-height: 1em;
    z-index: 9;
    right: 0px;
    font-size: 1.1em;
    mix-blend-mode: exclusion;
    color: white;
}





.contentwrapper {
    padding: 25px 25px 25px 25px;
    /*margin-bottom: 125px;*/
    display: block;

    font-size: 1.1em;
}

.theslideshow-wrapper {
    margin:0 auto;
}

.theslideshow {
    height: calc(100vh - 0px);
    position: fixed;
    text-align: center;
    width: 100%;
    margin: 0 auto;
    vertical-align: center;
    top:0px;
}


  #prev {
    width:25%;
    height: calc(100% - 100px);
    display: block;
    left: 0px;
    position: fixed;
    
    margin-top:50px;
    z-index: 99999;
    cursor: w-resize;
    cursor: url('../img/websitepil_l.png') 15 20, auto; 



-webkit-tap-highlight-color:  rgba(255, 255, 255, 0); 
  }

/*  #prev:-moz-selection {
        background: none;
        text-shadow: none;
    }

  #prev:selection {
        background: none;
        text-shadow: none;
    }*/



#next {
    width:25%;
    height: calc(100% - 100px);
    display: block;
    right: 0px;
    position: fixed;
    
    margin-top:50px;
    z-index: 99999;
    cursor: url('../img/websitepil_r.png') 15 20, auto; 
      
  }



.cycle-slideshow {
    height: 100%;
    width: 100%;
    position: relative;
    display: inline-block;
    z-index: 1;
    background-color: none;
    cursor: pointer;
    text-align: left;

}

.cycle-slideshow img {
    /* mix-blend-mode: multiply; */
    margin:0 auto;
    cursor: pointer;
    max-width: 100%;
    max-height: 100%;
/*    height: auto;
    width: auto;*/
}


.cycle-caption {
    width: 100%;
    text-align: left;
    background-color: none;
    z-index: 999999999999999999;
    display: inline-block;
    margin-top: .25em;
}


#adv-custom-caption {
position: fixed;
    bottom: 15px;
    width: 75%;
    text-align: center;
    z-index: 999999;
    margin-left: 12%;
    /*margin-left: 20px;*/
    mix-blend-mode: exclusion;
    color: white;



}

#slidetext {
    position: fixed;
    bottom:20px;
    right:25px;
}

.theactualimage {
    width: 100%;
    height: 100%;
}


.background-slider-image {
    width: 100%;
    height: 100%;
    background:white;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}


.vertical {
    background-size: auto 100% !important;
    /*padding:50px 50px 50px 50px !important;*/
}

.sticktop {
    background-position: center top;
}



.scaledown95 {
    background-color: black;
    background-size: 95% auto;
}

.scaledown85 {
    background-color: black;
    background-size: 85% auto;
}

.scaledown75 {
    background-color: black;
    background-size: 75% auto !important;
}

.scaledown60 {
    background-color: black;
    background-size: 60% auto;
}

.scaledown40 {
    background-color: black;
    background-size: 40% auto !important;
}

.whiteback {
    background-color: white;
}

.blackback {
    background-color: black!important;
}


.secondfont {
    font-family: timescondensed;
    font-size: 1.3em;
    letter-spacing: .01em;
    line-height: inherit;
}

.comingpast {
    width:100%;
    padding-left: 25px;
}




.vimeo-wrapper {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: -1;
   pointer-events: none;
   overflow: hidden;
}
.vimeo-wrapper iframe {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}



.vimeo-wrapper video {
   width: 100vw;
   height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 100vh;
   min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}












































.bunden {
    padding: 25px 25px 25px 25px;
    display: table;
}



.tilbageop {
    display: table;
    margin: 0 auto;
    height: auto;
    width: 100%;
    text-align: center;
}







.topsmall {
    font-size: 1em;
    margin: 10px 0px 0px 13px;
    width:100%;
    display: block;
    background-color: none;
    padding:0;
    z-index: 9999;
}

.udmedmig {
    right:-500px !important;
}




.minvideo {
    cursor: pointer;
}


.muter {
    mix-blend-mode: exclusion;
    color: white;
    z-index: 999999999999999999999999999;
    position: fixed;
    cursor: pointer;
    /* background-color: red; */
    right: 20px;
    bottom: 15px;
    /* width: 100px; */
    /* height: 25px; */
    /* background-color: red; */
}

#unmute-hojervid {
    background-color: red;
}

.responsify {
    position: relative;
    padding-bottom: 60%;
    height: 0;
    overflow: hidden;
    max-width: 100%;
}

.responsify iframe, .responsify object, .responsify embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}











.knapperne {
    background-color: none;
    margin-right: .65em; 
    width: auto;
    display: inline-block;
    height:auto;
    float: right;
}

.indextrigger {
    background-color: none;
    z-index: 10;
    position:fixed;
    top:10px;
    right:25px;
    border-bottom: 0px !important;
    color: #c4c4c4;
    display:inline-block;
    vertical-align: top;
}

.smallindex {
    font-size: .35em !important;
    font-weight: 500;
    letter-spacing: 0em;
    top: -10px;
}



.placeholderindex {
    opacity: 0;
    position:relative;
    color:none;
    background-color: none;
    top: 0px;
    right: 15px;
    float: right;
    display:inline-block;
    vertical-align: top;
}

.indextrigger:hover {
    /*border-bottom: 2px solid #c4c4c4 !important;*/
    color:#c4c4c4;
}

.omostrigger {
    position: fixed;
    bottom:15px;
    right:15px;
}

.omostrigger:hover {
    background-color: blue;
}
 


.blue {
    color: blue;
}

.project {
    position: relative;
    text-align: center;
    margin-bottom:;
    font-size: 1em;
    background-color: none;
    margin-top: 100px;
    float:left;
    width: 100%;
}

.project:first-of-type {
    margin-top: 0px;
}

b
.titelnoknap{

    display: inline-block;
    padding:0px 0px 0px 0px;

    margin-right: px;

}


.topmenu .knap {
    /*margin-bottom: -1px;
    border-bottom: 2px solid transparent;*/
}

.knap {
      -webkit-transition: all 1000ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 1000ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 1000ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 1000ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

    display: inline-block;
    cursor: pointer;
    padding: 10px 25px 12px 25px;
    border: 1px solid black;
    border-radius: 30px;
}

.sidsteknap{
    /*background-color: red;*/
    margin-right: 0px;
}

.knap:hover {
    /*background-color: #c4c4c4;*/
/*    -ms-transform: rotate(5deg);
    -ms-transform-origin: 0% 5%; 
    -webkit-transform: rotate(5deg);
    -webkit-transform-origin: 0% 5%;
    transform: rotate(5deg);
    transform-origin: 0% 5%;*/
    /*border-bottom: 2px solid #c4c4c4 !important;*/
    /*color:rgb(50, 50, 50);*/
    color: white;
    border: 1px solid blue;
}


.close-omos-kryds {
    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

    font-family: helvetica;
    width: 1em;
    text-align: center;
    height: 1em;
    /*line-height: .84em;*/
    background-color: none;
    position: fixed;
    font-size: 3em;
    bottom: 15px;
    right: calc(-110% + 5px);
    cursor: pointer;
    font-weight: 100;
    z-index: 99999999999999999999999;
    margin-right: -10%;
}

.close-omos-kryds:hover {
          /*-webkit-transform: rotate(180deg);
          transform: rotate(180deg);*/
          color: blue;
}

.close-omos-kryds-inde {
    right: calc(10% + 5px);
}


/*.nytkryds.close-omos-kryds:hover {
          -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
}*/


.nytkryds.close-omos-kryds {
        left: 0px;
        top: 0px;
}

.nytkryds.close-index-kryds {
          /*background-color: red;*/
          height: auto;
          margin-top: -25px;
}


.nytkryds {
/*    display: block;
    color: blue;
    mix-blend-mode: multiply;
    float: right;
    cursor: pointer;
    font-size: 2em;
    -webkit-transition: color .25s;
    transition: color .25s;
    margin-top: 17px;
    margin-left: 12px;*/

}

.nytkryds:hover {
    color:black;
}



.omostrigger:hover {
    /*background-color: #c4c4c4;*/
}

.omoscontainer{
    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

    position:fixed;
    /*background-color: #dbc275;*/
    background-color: #ededed;
    /*color: black;*/
    border-left: 0px solid #c4c4c4;
    /*width: calc(50% - 10px);*/
    width: calc(100% - 0px);
    height: calc(100% + 15px);
    float: right;
    padding: 25px;
    padding-top:0px;
    right:-100%;
    top:0px;
    z-index: 10;
/*    padding-right: 50%;*/
    overflow: scroll;
    /*opacity: .85;*/
}


.omoscontainer a:link, .omoscontainer a{
    color:blue;
}

.omoscontainer a:link:hover, .omoscontainer a:hover{
    color:black;
}

.omoscontainer::-webkit-scrollbar {
    display: none;c
}

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

.omoscontainer .p66 {
    width: 66%;
    display: inline-block;
    margin: 0px 0px 0px 0px;
    float:left;
}

.omoscontainer .p50 {
    width:calc(50% - 25px);
}

.omoscontainer .p33 {
    padding-bottom: 100px;
    width: 50%;
}

.omoscontainer .p33:nth-of-type(2) {
    margin-left:25px;
    padding-right: 25px;
    /*background-color: red;*/
}


.aboutformal {
    display: block;
    clear: both;
    float: left;
    font-size: .75em;
    margin-bottom: 13px;
    margin-top: 50px;
    bottom: 0px;
    width: calc(100% - 15px);
    text-align: center;
    /* background-color: green; */
}




table {
    /*font-family: arial, sans-serif;*/
    border-collapse: collapse;
    width: 100%;
    margin-bottom: -1em;
}

td, th {
    vertical-align:top;
    /*border: 1px solid #dddddd;*/
    text-align: left;
    padding-bottom: 1em;
}



td {
/*    background-color: red;*/
    /*padding-bottom: .5em;*/
}

tr :after {
    margin-bottom: 2em;
}

tr {
    margin-bottom: 1em;
}

.yir {
    width:1.75em;
}

/*tr:nth-child(even) {
    background-color: #dddddd;
}
*/



.hesten {
    width: 66%;
    margin-left: 10%;
    display: block;
    padding-top:0px !important;
    display: block;
    clear: both;
}

.two-col {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;

    -webkit-column-gap: 50px; /* Chrome, Safari, Opera */
    -moz-column-gap: 50px; /* Firefox */
    column-gap: 50px;
} 

/*.omoscontainer .stortekst {
    display:inline-block;
    float: left;
    margin-bottom: 0px;
}*/


.omoscontainer .stortekst {
    display: inline-block;
    float: left;
/*    margin-bottom: 75px;
    font-size: 1em;
    font-weight: 500;*/
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

.omoscontainer .onlybig {

}


.office {
    width: 100%;
}


.pilkryds{
    cursor: pointer;
    vertical-align: bottom !important;
    display:inline-block;
    float:right;
    width: 10vw;
    height:10vw;
    max-height: 225px;
    max-width: 225px;
    margin-top:12px;
    vertical-align: top;

    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);



}

.storpil:hover {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.stortkryds{
    float:right;
}

.storpil {
    margin-right:50px;
}

.stortkryds:hover{
        -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

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


/*.omoscontainer .stortkryds {
    width: 150px;
    height:150px;
}
*/



/*.stortekst {
    display: block;
    width: 100%;
    padding:0px 0px 0px 5px;
    font-size: 3em;
    letter-spacing: -.02em;
    line-height: 1em;
    margin: 0px 5px 0px -4px;  
    font-family: timescondensed;
}

.intekst-stortekst {
    font-family: timescondensed;
    display: block;
    clear: both;
    width: 100%;
    padding:0px 0px 0px 5px;
    font-size: 3em;
    letter-spacing: -.02em;
    line-height: 1em;
    margin: 0px 5px 0px -5px;  
}*/

.stortekst {
    /*font-family: old_standard;*/
    display: block;
    width: 100%;
    padding:0px 0px 0px 5px;
    /*font-weight: 100;*/
    /*font-size: 3em;*/
    /*letter-spacing: -.02em;*/
    line-height: 1em;
    margin: 0px 5px 20px 20px;  
    /*font-family: timescondensed;*/
    text-transform: uppercase;  
}

.intekst-stortekst {
    /*font-family: timescondensed;*/
    display: block;
    clear: both;
    width: 100%;
    /*text-align: center;*/
    /*padding:0px 0px 0px 5px;*/
    /*font-weight: 100;*/
    /*font-size: 3em;*/
    /*letter-spacing: -.02em;*/
    line-height: 1em;
    /*margin: 0px 5px 20px 20px;*/
    margin-bottom: 1em;
    /*margin-left: 25px;*/
    text-transform: uppercase;  
    margin-top: 1em;
}

.omoscontainer-inde{
   right:0% !important; 
}







.close-index-kryds {
/*    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);

    width: 1em;
    text-align: center;
    height: 1em;
    line-height: .84em;
    background-color: none;
    position: fixed;
    font-size: 3em;
    top:-10px;
    right: -10px;
    cursor: pointer;
    font-weight: 100;
    z-index: 999999999999999999999999999999;
    margin-right: -100%;
    background-color: none;
    color: #c4c4c4;*/
}

.close-index-kryds:hover {
/*          -webkit-transform: rotate(180deg);
          transform: rotate(180deg);*/
}

.close-index-kryds-inde {
    margin-right:0%;
}

.indextrigger:hover {
    /*background-color: #c4c4c4;*/
}

.indexcontainer{
    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

    vertical-align: top;
    position:fixed;
    background-color: rgba(0,0,0, 1);
    background-color: none;
    /*color: black;*/
    border-left: 0px solid #c4c4c4;
    /*width: calc(50% - 10px);*/
    width: calc(100% - 0px);
    height: auto;
    float: right;
    padding: 25px 25px 25px 45px;
    right:0%;
    bottom:-100%;
    z-index: 99999999;
/*    padding-right: 50%;*/
    overflow: none;


    /*opacity: .5;*/
/*    border-left:3px solid #c4c4c4;
*/
    /*opacity: .8;*/

    margin-top: -2px;

/*    -webkit-box-shadow: -26px 0px 72px 29px rgba(0,0,0,1);
    -moz-box-shadow: -26px 0px 72px 29px rgba(0,0,0,1);
    box-shadow: -26px 0px 72px 29px rgba(0,0,0,1);;*/

    /*border-top: 2px solid #c4c4c4;*/
}

.indexcontainer-inde{
   bottom:0% !important; 
}

.indexcontainer .p50 {
    width: calc(50% - 10px);
    display:inline-block;
    float: left;
    background-color: none;
}


.indexcontainer .p66 {
    width: calc(66% - 10px);
    display:inline-block;
    float: left;
    background-color: none;
}

.indexcontainer .p50:last-of-type {
    width: calc(50% - 10px);
    display:inline-block;
    float: left;
    background-color: none;
}


.indexcontainer ol {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    list-style-type: decimal;
    list-style-position: outside;
    margin-bottom: 0px;
    margin-left: 0px;
    padding-left: 33px;
    margin-top: 0em;
    overflow: scroll;
    font-size: ;
    
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;

    -webkit-column-gap: 2em; /* Chrome, Safari, Opera */
    -moz-column-gap: 2em; /* Firefox */
    column-gap: 2em;
    max-width: 1000px;
    vertical-align: top;
}



.indexcontainer li {
    width: auto;
    height: auto;
    display: list-item;
    padding-left: 1em;
    margin-left: 1em;
    vertical-align: top;
    line-height: auto;

/*    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box;    
    box-sizing: border-box;    */     
}




.go-to-project {
    display: inline-block;
    color:#c4c4c4;
/*    margin-bottom:-.5em !important;*/
    width: auto;
    border-bottom: 2px solid black;
    vertical-align: top;
    /*mix-blend-mode: exclusion;*/
}



.go-to-project img {
    display: block;
    max-width: 50%;
    height: auto;
    display: none;

/*    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);*/
}

.go-to-project:hover {
    cursor: pointer;
    /*border-bottom: 2px solid #c4c4c4*/;
    color:rgb(50, 50, 50);
    /*border-right: 3px solid black;*/
}















/*.caption {
-webkit-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000);

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);



    font-size: 1.5em;

    width: auto;
    text-align: center;
    height: auto;
    margin:0 auto;
    margin-top: 1em;
    display: table;
    clear: left;
    clear: right;
    position: relative;
    z-index: 1;
    cursor: pointer;

    border-bottom: 3px solid black;


}*/

.caption {
-webkit-transition: all 350ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition: all 350ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition: all 350ms cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition: all 350ms cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */

-webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
   -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); 
        transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000); /* easeOutQuint */



    font-size: 1em;
    /*font-weight: 100;*/
    width: auto;
    text-align: left;
    height: auto;
    margin:0 auto;
    margin-top: 1em;
    display: inline-block;
    float: left;
    clear: left;
    clear: right;
    position: relative;
    z-index: 1;
    cursor: pointer;
    /*text-transform: uppercase;*/
    border-bottom: 2px solid black;
    margin-bottom: calc(1em - 5px);


}

.caption:hover {
    /*border-bottom: 2px solid #c4c4c4;*/
    color:rgb(50, 50, 50);
    /*border-bottom: 1px solid #c4c4c4;*/
}

.morecaption {
    text-align: left;
    display:none;
    clear: both;
    width: 50%;
    /*max-width: 1000px;*/
    /*margin: 0 auto;*/
    position: relative;
    background-color: none;
    border-bottom: 0px solid #c4c4c4;
    height:auto;
    /*padding-bottom: .25em;*/
}

.year {
    position: relative;
    display: block;
    margin-top: 1em;
}






/*.closer {
    position: absolute;
    right: 0px;
    bottom: -1em;
    cursor: pointer;
    float: right;
    font-weight: 100;
    font-size: 2.25em;
    width: 1em;
     height: 1em; 
    text-align: center;
     line-height: .84em; 
    background-color: none;
    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
}

.closer:hover {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}*/





.closer {
    position: relative;
    right: calc(51% - 1em);
    bottom: -0.5em;
    /* display: inline-block; */
    cursor: pointer;
    float: right;
    font-weight:300;
    font-size: 1.5em;
    /* margin-top: .5em; */
    width: 1em;
    height: 1em; 
    text-align: center;
    line-height: .84em; 
    background-color: none;
    -webkit-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition: all 750ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);

    

}


.closer:hover {

}


.closer::-moz-selection {
        background: none;
        text-shadow: none;
    }

.closer::selection {
        background: none;
        text-shadow: none;
    }

.turned-kryds {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}











/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */





img{
  /*  -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;*/
}


/*
 * A better looking default horizontal rule
 */

hr {
    display: none;
    height: 1px;
    border: 0;
    border-top: 2px solid black;
    margin: .25em 0 .25em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    /*background: #ccc;*/
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */


@font-face {
    font-family: "lars";
    src: url("../fonts/Lars-Regular.woff2") format('woff2');
}

@font-face {
    font-family: "lars";
    src: url("../fonts/awesome-font-bold.woff") format('woff2');
    font-weight: bold;
}

@font-face {
    font-family: "lars";
    src: url("../fonts/Lars-RegularItalic.woff2") format('woff2');
    font-style: italic;
}







@font-face {
    font-family: centmono;
    src: url('../fonts/cent_mono.otf');
}

@font-face {
    font-family: old_standard;
    src: url('../fonts/OldStandard-Regular.ttf');
}

@font-face {
    font-family: arialcondensed;
    src: url('../fonts/ArialMTPro-Cond.otf');
}

@font-face {
    font-family: timescondensed;
    src: url('../fonts/TimesNewRomanMTStd-Cond.otf');
}

@font-face {
    font-family: alexismark;
    src: url('../fonts/alexismark.otf');
}

@font-face {
    font-family: lean;
    src: url('../fonts/lean.otf');
}

.topmenu a:link  {
    text-decoration: none!important;
}

a {
    color: white;

    -webkit-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1); /* older webkit */
-webkit-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
   -moz-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
     -o-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
        transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1); /* older webkit */
-webkit-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
   -moz-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
     -o-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
        transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); /* custom */
}


   /* unvisited link */
a:link {
    color:white;
    text-decoration: none!important;
    /*text-decoration: underline;*/
}

/* visited link */
a:visited {

}

/* mouse over link */
a:hover {

}

/* selected link */
a:active {
    /*color: blue;*/
}

.clickme {
    display: inline-block;
-webkit-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1); /* older webkit */
-webkit-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
   -moz-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
     -o-transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); 
        transition: all 1000ms cubic-bezier(0.000, 0.875, 0.980, 1.005); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1); /* older webkit */
-webkit-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
   -moz-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
     -o-transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); 
        transition-timing-function: cubic-bezier(0.000, 0.875, 0.980, 1.005); /* custom */
}

.clickme:hover {
    cursor: pointer;
    color: rgb(0, 0, 255);
/*    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);*/
}

.click-alexismark {

}


#string{font-size:0.5vw}
#string > span{font-size:0.8em}


button {
    border-radius: 5px;
    background-color: #eee;
    outline: none;
    line-height: 1em;
}

button a:link {
    border-bottom: 0px solid #c4c4c4!important;
}

button a:hover {
    background-color: transparent!important;
}








*{box-sizing: border-box; padding: 0; margin: 0} /*reset all browser style*/

:root{background: ; min-height: 100vh; width: 100vw} /*set the root element to viewport*/




.down {
    margin-bottom: .25em!important;
}

.right {
    float:right!important;
    margin-bottom: 1em!important;
}

.left {
    float:left!important;
    margin-bottom: 1em!important;
}

.center{
    display: inline-block !important;
}

.block {
    display: block !important;
    clear: both !important;
}


.float-right {
    float: right!important;
}


.float-left {
    float: left!important;
}

.lefted-caption{
    width: auto;
    height:auto;
    display: inline-block;
    float: left;
    background-color: none;
}




.p100 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(100% - 0px);
    display: inline-block;
    vertical-align: top;
    background-color: none;
    margin: 0 auto;
}

.p95 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: 95%;
    display: block;
    vertical-align: top;
    margin: 0 auto;
}

.p85 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: 85%;
    display: block;
    vertical-align: top;
    margin: 0 auto;
}

.p75 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: 75%;
    display: block;
    vertical-align: top;
    margin: 0 auto;
}

.p66 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: 66%;
    margin: 0 auto;
    display: block;
    vertical-align: top;
    background-color: none;
}

.p60 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(60% - 13px);
    margin: 0 auto;
    display: inline-;
    vertical-align: top;
    background-color: none;
}

.p50 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(50% - 13px);
/*    padding-right: 15px;*/
    display: inline-block;
    vertical-align: top;
    background-color: none;
    margin: 0 auto;
}


.p40 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(40% - 13px);
/*    padding-right: 15px;*/
    display: inline-block;
    vertical-align: top;
    background-color: none;
    margin: 0 auto;
}


.p33 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(33.3% - 13px);
/*    padding-right: 15px;*/
    display: inline-block;
    vertical-align: top;
    background-color: none;
    /*margin: 0 auto;*/
}


.p25 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: calc(25% - 5px);
/*    padding-right: 15px;*/
    display: inline-block;
    vertical-align: top;
    background-color: none;
}

.p15 {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    width: 15%;
    display: inline-block;
    vertical-align: top;
}

.indent {
    margin-left: 15px;
    display: inline-block;
}

.scrolltotop {
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
    padding-top: 200px;
}

.scrolltotop-pil {
    -webkit-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition: all 500ms cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -webkit-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    -o-transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    transition-timing-function: cubic-bezier(0.230, 1.000, 0.320, 1.000);
    /* height: 200px; */
    width: 200px;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 200px;
    display: inline-block;
    cursor: pointer;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

.tiltoptekst {
    /* background-color: red; */
    margin-left: calc(50% - 50px);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    margin-top: 250px;
    height: 100px;
    width: 100px;
    padding-top: 35px;
    transform-origin: center center;
    border-radius: 50px;
    /*border: 2px solid #c4c4c4;*/
}

.tiltoptekst:hover {
    /*background-color: red;*/
/*    margin-left: calc(50% - 99px);*/
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
}

/*.scrolltotop-pil:hover {

        margin-top: -25px;
}*/

.singlepic {
    width: 100%;
    position: relative;
    display: inline-block;
    z-index: 1;
    background-color: none;
    cursor: pointer;
    margin-bottom: 5px;
}




iframe {
    width:100%;
}


#gallery div {
    width: 100%;
    height: 100%;
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
/*    image-rendering: -webkit-optimize-contrast;*/
}   





.show-description {
    display: none!important;
    width: 100%;
    height: 3em;
    background-color:none;
    position: fixed;
    bottom: 0px;
    left:0px;
    z-index: 9;
    -webkit-transition: all 500ms cubic-bezier(0.005, 0.975, 0.820, 0.990); 
   -moz-transition: all 500ms cubic-bezier(0.005, 0.975, 0.820, 0.990); 
     -o-transition: all 500ms cubic-bezier(0.005, 0.975, 0.820, 0.990); 
        transition: all 500ms cubic-bezier(0.005, 0.975, 0.820, 0.990); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.005, 0.975, 0.820, 0.990); 
   -moz-transition-timing-function: cubic-bezier(0.005, 0.975, 0.820, 0.990); 
     -o-transition-timing-function: cubic-bezier(0.005, 0.975, 0.820, 0.990); 
        transition-timing-function: cubic-bezier(0.005, 0.975, 0.820, 0.990); /* custom */
}
.show-description:hover {
    opacity: 0;
}


.oppe {
    bottom: 3em!important;
}

.drejud {
    left:-25px;
}

.snur {
    transition: all 1s ease;


  animation: rotate 1s forwards alternate linear
}

@keyframes rotate {
  0% {
    transform: rotate(0deg)
  }
  
  100% {
    transform: rotate(-360deg)
  }
}



/*.example-pager {
    padding-left: 10px;
    top: -5px;
    font-size: 2.5em;
    position: fixed;
    z-index: 99999999999;
        color: rgb(255, 255, 255);
    mix-blend-mode: difference;
    cursor: pointer;

}*/




#custom-pager {
    padding: 10px;
    position: fixed;
/*    font-size: 1.5em;*/
/*    top: -30px;*/
    height: auto;
    width: 95%;
    z-index: 999999999999999999;
/*    mix-blend-mode: difference;*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

/*            -webkit-transform-origin: 0% 0%;
    -webkit-transform: rotate(2deg);*/
}


.cycle-pager-active {
/*background-color: rgb(255, 255, 255);*/
/*border: 2px solid rgb(255, 255, 255);
border-radius: 15px;*/
text-align: center;
/*border-bottom: 4px solid rgb(255,255,255)!important;*/
padding-right: 1.5em;
padding-left: 1.5em;
}








.navigator {
    position: fixed;
    width: auto;
    padding:10px 0px 0px 10px;
    background-color: none;
    z-index: 999999999999999999999;
/*        font-size: 1.5em;*/
        color: rgb(255, 255, 255);
/*    mix-blend-mode: difference;*/
}




/* ==========================================================================
   Mulig true-image løsning
   ========================================================================== */
.wraptocenter {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: ...;
    height: ...;
}
.wraptocenter * {
    vertical-align: middle;
}
/*\*//*/
.wraptocenter {
    display: block;
}
.wraptocenter span {
    display: inline-block;
    height: 100%;
    width: 1px;
}
/**/
</style>
<!--[if lt IE 8]><style>
.wraptocenter span {
    display: inline-block;
    height: 100%;
}



/* ==========================================================================
   Mulig true-image løsning
   ========================================================================== */














/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers
 */

.hidden {
    display: none !important;
}

.inline {
    display: inline-block!important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    display: none;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}


    .blivlille {
        /*font-size: .75em;*/
    }




/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

.onlyphone {
    display: none;
    #c4c4c4-space:pre-line;
}






@media only screen and (max-width: 1070px) {
    
    body {
        font-size: .75em;
    }

    .indexcontainer {
        display:none;
    }

    .indextrigger {
        display:none;
    }

    .placeholderindex {
        display: none !important;
    }

    .knapperne {
        margin: 0px 0px 0px 0px;
        float: right;

    }

    .pilkryds {
        width: 100px;
        height: 100px;
    }

    .closer {
    right: calc(0% + 0px);
    }

    .imprint-right-col {
    padding-top:25px;
    padding-right:0px;
    float: right;
}

}



@media only screen and (max-width: 900px) {
    body {
        /*font-size: .7em;*/
    }

    .blivlille {
        width: 50%;
        /*font-size: 1em;*/
    }


}

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

    .topmenu {
        padding: 5px;
    }

/*    .fullbleed {
        object-fit: contain;
    }*/

    .containphone {
        object-fit: contain !important; 
    }

    .intro-inner {
        font-size: .7em;
        width: 90%;
        /*line-height: 1.5em;*/
    }

    .name-image {
    width: 80%;
    display: block;
    margin:0 auto;
    }

    .contentwrapper {
    /*display: block;*/
    }

    .muter {
    display: none;
    }

    .onlycomp {
        display:none !important;
    }

    .background-slider-image {
        background-size: 100% auto;
    }

    .vertical {
    background-size: auto 100% !important;
    object-fit: cover !important;
    padding: 0px !important;
    height: 100%;
    }

    .phoneflip{
        background-size: auto 100% !important;
    }

    .phoneflipvert {
        background-size: 100% auto !important;
        /*background-color: green;*/
    }

    .knap{
        margin-right: .25em !important; 
    }

    .onlyphone {
        display:inline-block;
    }



.scaledown95, .scaledown85, .scaledown75, .scaledown60, .scaledown40 {
    background-size: 100% auto !important;
}


#adv-custom-caption {
    width: 100%;
    text-align: center;
    margin: 0;
    padding: 0 5% 0 5%;
}







    .p95 {
        width: 100% !important;
    }

    .p85 {
        width: 100% !important;
    }

    .p75 {
        width: 100% !important;
    }

    .p66 {
        width: 100% !important;
    }

    .p60 {
        width: 100% !important;
    }

    .p50 {
        width: 100% !important;
    }

    .p40 {
        width: 100% !important;
    }

    .p33 {
        width: 100% !important;
    }

    .p25 {
        width: 100% !important;
    }



    .omoscontainer .pilkryds {
        width: 40px;
        height: 40px;
        top: 10px;
        right:calc(50% - 20px);
    } 


    .omoscontainer {
        max-width: 100%!important;
        padding:15px;
        padding-top: 0px;
    }

    .aboutintro {
        top:0px!important;
    }


    .morecaption {
        width: 100%;
    }

    .project {
        margin-top: 25px;
    }


    .onlybig {
        display: none !important;
    }

/*    .office {
        margin-top:10px !important;
    }*/

    .titelnoknap {
        display: inline;
        width: auto;
    }

    .knapperne {
        /*float:left!important;*/
    }



    .omoscontainer .p33:nth-of-type(2) {
    margin-left:0px;
    /*background-color: red;*/
    } 

    .omoscontainer .p33 {
    margin:0px;
    padding-bottom: 10px;
    /*background-color: red;*/
    } 

    .aboutformal {
        bottom: 100px;
    }



}








@media only screen and (max-width: 650px) {
        .two-col {
        column-count: 1;
    }


    .introwrapper {
    font-size: 3em;
}




    ::-webkit-scrollbar {

    display: none;
    width: 0em;
    background-color: none;
    padding: 0px 5px 0px 5px;
    }

    .hesten {
    margin-top: -10px!important;
    }


}


@media print,
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 1.25dppx),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */