body {
  overflow: hidden;
  max-height: 100vh;
}

* {
    font-family: "Montserrat", sans-serif;
}

#base-sidebar {
  z-index: 55555555555;
}

.radio-wrapper,
.checkbox-wrapper {
  position: relative;
  display: flex;
}
input[type="checkbox"],
input[type="radio"] {
  /*display:  none;*/
  position:  absolute; 
  top:  0px; 
  left: 0px; 
  height:  20px; 
  width:  20px; 
  -webkit-appearance:  none;
}
.radio-label,
.checkbox-label {
  display:  flex; 
  position:  relative;
  font-size:  20px; 
  font-weight:  400;
  align-items:  center; 
  justify-content:  flex-start; 
  margin-bottom:  10px; 
}
.radio-label:before, 
.radio-label:after,
.checkbox-label:before, 
.checkbox-label:after {
  pointer-events: none; 
}
.radio-label:before,
.radio-label:after {
  border-radius:  50%; 
}
.radio-label:before,
.checkbox-label:before {
  display:  flex; 
  content: ' ';
  height:  20px; 
  width:  20px; 
  border:  solid 3px #000;
  background:  #fff;

  margin-right:  10px; 
}
.radio-label:after,
.checkbox-label:after {
  position:  absolute; 
  top:  7px; 
  left:  7px; 
  display:  flex; 
  content: ' '; 
  height:  12px; 
  width:  12px;  
  background: #000;
  transform: scale(0);
  transition:  transform .3s ease; 
}
.checkbox-label:after {
  height:  5px; 
  width:  12px; 
  left:  5px; 
  border-bottom:  solid 4px #000; 
  border-left:  solid 4px #000; 
  background:  none; 
  transform: rotate(-45deg) scale(0);
  transition:  transform .1s ease, opacity .1s ease;
  transform-origin: center center; 
}
.radio-wrapper input[type="radio"]:checked + .radio-label:after {
  transform:  scale(1);
}
.checkbox-wrapper input[type="checkbox"]:checked + .checkbox-label:after {
  opacity:  1; 
  transform: rotate(-45deg) scale(.8);
}
label {
    display:block;
    margin-bottom:0.25rem;
}

/*
** Skeleton
*/
.skeleton-loader-background {
    width: 100%;
    height: 15px;
    display: block;
    background: lightgray;
  }
  
  
  .skeleton-loader-gradient {
    width: 100%;
    height: 8px;
    display: block;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 0.5) 50%,
        rgba(255, 255, 255, 0) 80%
      ),
      lightgray;
    background-repeat: repeat-y;
    background-size: 50px 200px;
    background-position: 0 0;
  }
  
  .skeleton-loader {
    display: block;
    min-height:8px;
    background: linear-gradient(
        to right,
        rgba(255, 255, 255, 0),
        rgba(255, 255, 255, 0.1) 50%,
        rgba(255, 255, 255, 0) 80%
      ),
      #e5e5e5;
    background-repeat: repeat-y;
    background-size: 50px 500px;
    background-position: 0 0;
    animation: shine 2.5s infinite;
    transition: 0.3s all ease;
  }
  
  .skeleton-loader.light {
    background: linear-gradient(
      to right,
      rgba(255, 255, 255, 0),
      rgba(255, 255, 255, 0.1) 50%,
      rgba(255, 255, 255, 0) 80%
    ),
    #f5f5f5;
    background-repeat: repeat-y;
    background-size: 50px 500px;
    background-position: 0 0;
  }
  
  .skeleton-loader.darker {
    background: linear-gradient(
      to right,
      rgba(155, 155, 155, 0),
      rgba(155, 155, 155, 0.15) 65%,
      rgba(155, 155, 155, 0) 99%
    ),
    #c4c4c4;
    background-repeat: repeat-y;
    background-size: 50px 500px;
    background-position: 0 0;
  }
  @keyframes shine {
    0% {
      background-position: 0% 0, /* move highlight to right */ 0 0;
      opacity:0.8
    }
    50% {
      background-position: 100% 0, /* move highlight to right */ 0 0;
      opacity:0.5
    }
    100% {
      background-position: 0% 0, /* move highlight to right */ 0 0;
      opacity:0.8
    }
  }

  .s-message [x-message] {
    display: inline-block;
    word-break: break-word;
  }
  
/**
** Form fields
**/
.clear-form-field input[type="text"], .clear-form-field input[type="search"], .clear-form-field input[type="number"], .clear-form-field input[type="password"], .clear-form-field select, .clear-form-field textarea{
    border:1px solid #e5e5e5;
    font-size: 14px;
    outline:none;
  }
  
  .clear-form-field.with-absolute-button input[type="text"], .clear-form-field.with-absolute-button input[type="search"], .clear-form-field.with-absolute-button input[type="email"], .clear-form-field.with-absolute-button input[type="number"], .clear-form-field.with-absolute-button input[type="password"], .clear-form-field.with-absolute-button select, .clear-form-field.with-absolute-button textarea{
    padding: 0.75rem 4rem 0.75rem 1rem;
  }
  
.is-result [x-message] {
  border:7px solid green;
}

.is-result.current-view .inner {
  transform: scale(1.05);
  position: relative;
  z-index: 100;
}

  /**
  ** Spinner
  **/
  .lds-dual-ring {
    display: inline-block;
    width: 24px;
  }
  .lds-dual-ring:after {
    content: " ";
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 3px solid #333;
    border-color: #333 transparent #333 transparent;
    animation: lds-dual-ring 1.2s linear infinite;
  }
  @keyframes lds-dual-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

  .lds-ripple {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-ripple div {
    position: absolute;
    border: 4px solid #333;
    opacity: 1;
    border-radius: 50%;
    animation: lds-ripple 1s cubic-bezier(0, 0.2, 0.8, 1) infinite;
  }
  .lds-ripple div:nth-child(2) {
    animation-delay: -0.5s;
  }
  @keyframes lds-ripple {
    0% {
      top: 36px;
      left: 36px;
      width: 0;
      height: 0;
      opacity: 0;
    }
    4.9% {
      top: 36px;
      left: 36px;
      width: 0;
      height: 0;
      opacity: 0;
    }
    5% {
      top: 36px;
      left: 36px;
      width: 0;
      height: 0;
      opacity: 1;
    }
    100% {
      top: 0px;
      left: 0px;
      width: 72px;
      height: 72px;
      opacity: 0;
    }
  }
  
/** 
** Notifications
**/
#notify-wrapper {
    position: fixed;
    bottom: 15px;
    left: 6rem;
    z-index: 555555555555555;
  }
  
  .notify-lux {
    text-align: center;
    border-radius: 5px;
    line-height: 1.2;
    margin-top:10px;
    opacity: 0;
    transform:translateY(30px);
    transition:0.25s all ease;
  }
  
  .notify-lux.shown {
    opacity: 1;
    transform:translateY(0px);
  }
  

  .hovered .ce-opacity-25 {
    opacity: 1;
  }

  .toggle-on.ce-opacity-25 {
    opacity: 1;

  }

  .emoji-sizer {
    display: block;
    width: 24px;
    height:24px;
    background-size:contain !important;
    background-repeat: no-repeat !important;
  }

  /** EMOJI **/
  span.emoji {
    display: -moz-inline-box;
    -moz-box-orient: vertical;
    display: inline-block;
    vertical-align: baseline;
    *vertical-align: auto;
    *zoom: 1;
    *display: inline;
    width: 1em;
    height: 1em;
    background-size: 1em;
    background-repeat: no-repeat;
    text-indent: -9999px;
    background-position: 50%, 50%;
    background-size: contain;
  }
  
  span.emoji-sizer {
    line-height: 0.81em;
    font-size: 1em;
     margin: -2px 0;
  }
  
  span.emoji-outer {
    display: -moz-inline-box;
    display: inline-block;
    *display: inline;
    height: 1em;
    width: 1em;
  }
  
  span.emoji-inner {
    display: -moz-inline-box;
    display: inline-block;
    text-indent: -9999px;
    width: 100%;
    height: 100%;
    vertical-align: baseline;
    *vertical-align: auto;
    *zoom: 1;
  }
  
  img.emoji {
    width: 1em;
    height: 1em;
  }
/** EMOJI END **/

/** TIPPY **/
.tippy-box[data-animation=fade][data-state=hidden]{opacity:0}[data-tippy-root]{max-width:calc(100vw - 10px)}.tippy-box{position:relative;background-color:#333;color:#fff;border-radius:4px;font-size:14px;line-height:1.4;white-space:normal;outline:0;transition-property:transform,visibility,opacity}.tippy-box[data-placement^=top]>.tippy-arrow{bottom:0}.tippy-box[data-placement^=top]>.tippy-arrow:before{bottom:-7px;left:0;border-width:8px 8px 0;border-top-color:initial;transform-origin:center top}.tippy-box[data-placement^=bottom]>.tippy-arrow{top:0}.tippy-box[data-placement^=bottom]>.tippy-arrow:before{top:-7px;left:0;border-width:0 8px 8px;border-bottom-color:initial;transform-origin:center bottom}.tippy-box[data-placement^=left]>.tippy-arrow{right:0}.tippy-box[data-placement^=left]>.tippy-arrow:before{border-width:8px 0 8px 8px;border-left-color:initial;right:-7px;transform-origin:center left}.tippy-box[data-placement^=right]>.tippy-arrow{left:0}.tippy-box[data-placement^=right]>.tippy-arrow:before{left:-7px;border-width:8px 8px 8px 0;border-right-color:initial;transform-origin:center right}.tippy-box[data-inertia][data-state=visible]{transition-timing-function:cubic-bezier(.54,1.5,.38,1.11)}.tippy-arrow{width:16px;height:16px;color:#333}.tippy-arrow:before{content:"";position:absolute;border-color:transparent;border-style:solid}.tippy-content{position:relative;padding:5px 9px;z-index:1}
/** TIPPY END **/

.-message-placeholder:empty::before {
  content: "Tryk på enter for at afsende din besked.";
  color:#aaa;
  font-size: 14px;
  position:absolute;
}

.view-login #main-spinner {
  display:none;
}
#conversation-container {
  height:calc(100vh - 21vh) !important;
}
#sidebar-content {
  height: calc( 100vh - 260px)
}
@media only screen and (max-width: 1700px){
  .ce-lg-w-1\/5 {
    flex:0 0 20%;
  } 

}


@media only screen and (max-width: 1366px){
  .ce-md-w-1\/4 {
    flex:0 0 25%;
  } 
  .ce-md-w-3\/4 {
    flex:0 0 75%;
  }

}
@media only screen and (max-height: 801px){
  #conversation-container {
    height:calc(100vh - 26vh) !important;
  }
}
@media only screen and (max-height: 769px){
  #conversation-container {
    height:calc(100vh - 26vh) !important;
  }
}
@media only screen and (max-width: 1024px){
  .ce-constrain-sm {
    max-width: 50%;
  }
}

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

  .ce-constrain-sm {
    max-width: 60%;
  }
}

@media only screen and (max-width: 568px){
  h2 {
    font-size:1.2em;
  }
  .w-32 {
      width:8rem;
  }
  .h-6 {
      height:2rem;
  }
  .w-6 {
      width:2rem;
  }
  .xs-w-5 {
      width:2.5rem;
  }
  .w-12 {
      width:3.5rem;
  }
  .w-24 {
      width:7rem;
  }
  .ce-sm-w-98 {
      width: 18rem;
  }
  .w-64 {
      width:20rem;
  }
  .w-48 {
    width:12rem;
  }
  .h-48 {
      height:12rem;
  }
  .xs-ml-0 {
    margin-left:0px;
  }
  .ce-w-2\/3,.ce-w-1\/3, .ce-w-3\/4,.ce-w-1\/2:not(#platform-navigation) {
      flex: 0 0 100%;
  }
  .ce-w-1\/6 {
      flex: 0 0 50%;
  }
  .xs-pl-0 {
      padding-left:0px;
  }
  .ce-text-sm {
      font-size: 0.8rem;
  }
  .ce-xs-text-xs {
      font-size: 0.7rem;
  }
  .xs-flex {
      display:flex !important;
  }
  .ce-xs-hidden {
    display:none !important;
  }
  .ce-xs-w-auto {
      width: auto !important;
  }
  .ce-xs-overflow-x-auto {
      overflow-x: auto !important;
  }
  .xs-py-0 {
      padding-top:0rem;
      padding-bottom:0rem;
  }
  .xs-px-0 {
      padding-left: 0px !important;
      padding-right: 0px !important;
  }
  .xs-pt-0 {
      padding-top: 0px;   
  }
  .xs-w-24 {
      width:12rem;
  }
  .xs-h-24 {
      height:12rem;
  }
  .xs-ce-w-full {
      width:100%;
  }
  .ce-sm-w-16 {
    width: 8rem;
  }
  .ce-xs-no-constrain {
      max-width: 100%;
  }
  .xs-px-1 {
      padding-left: 0.5rem !important;
      padding-right: 0.5rem !important;
  }
  .xs-px-2 {
      padding-left: 1rem !important;
      padding-right: 1rem !important;
  }
  .xs-pl-2 {
      padding-left: 1rem !important;
  }
  .xs-px-4 {
      padding-left: 2rem;
      padding-right: 2rem;
  }
  .xs-py-0\/5 {
      padding-top: 0.25rem;
      padding-bottom: 0.25rem;
  }
  .xs-py-1 {
      padding-top: 0.5rem;
      padding-bottom: 0.5rem;
  }
  .xs-py-2 {
      padding-top:0.5rem;
      padding-bottom:0.5rem;
  }
  .xs-w-3 {
      width:1.5rem;
      min-width:1.5rem;
  }
  .xs-h-3 {
      height:1.5rem;
      min-height:1.5rem;
  }
  .xs-pt-12 {
      padding-top:6rem;
  }
  .xs-w-2 {
      width:1rem;
      min-width:1rem;
  }
  .xs-h-2 {
      height:1rem;
      min-height:1rem;
  }
  .xs-mr-1 {
      margin-right: 0.5rem !important;
  }
  .xs-ml-2 {
      margin-left: 1rem !important;
  }
  
  .xs-pr-2 {
      padding-right:1rem !important;
  }
  
  .xs-mb-0 {
      margin-bottom:0rem !important;
  }
  .xs-mb-2 {
      margin-bottom:1rem !important;
  }
  .xs-mt-0\/5 {
      margin-top:0.25rem !important;
  }
  .xs-mr-0 {
      margin-right: 0px !important;
  }
  .xs-mx-0 {
      margin-right: 0px !important;
      margin-left: 0px !important;
  }
  
  .ce-xs-w-full {
      width: 100% !important;
  }

  .ce-xs-w-1\/1 {
      flex:0 0 100%;
      max-width: 100%;
      min-width: 100%;
  } 

  .ce-xs-flex-basis-full {
    flex-basis:100% !important;
  }

  .ce-xs-px-4 {
    padding-left:1rem;
    padding-right:1rem;
  }
  
  .ce-xs-flex-0 {
    flex: 0;
  }

 .ce-xs-flex-wrap {
    flex-wrap: wrap !important;
    -webkit-flex-wrap: wrap; /* NEW */
  }

  .ce-text-md {
    font-size:1rem;
  }

  .ce-xs-w-auto {
    flex:1 0 auto;
    width:auto !important;
  }

  #conversation-container {
    height:calc(100vh - 27vh) !important;
  }

  .-xs-mt-2\/5 {
    margin-top:-5vh;
  } 

  .ce-constrain-sm {
    max-width: 80%;
  }

  .s-message > * {
    max-width: 60vw;
  }
}