@charset "UTF-8";
/* Do not remove the comments below. It's the markers used by wiredep to inject
   sass dependencies when defined in the bower.json of your dependencies */
.a-kaai {
  background-color: #FFF;
  box-sizing: content-box;
  display: block;
  position: relative;
  top: 0;
  width: 100%;
  z-index: 5000;
}

.a-kaai .kaai-header-top {
  box-sizing: border-box;
  position: relative;
  min-height: 3rem;
  border-bottom: 1px solid #BABABA;
  background-color: white;
}

.a-kaai .kaai-header-top .language-dropdown {
  position: relative;
  float: right;
}

.a-kaai .kaai-header-top .language-dropdown .fa-chevron-down {
  position: absolute;
  left: 3px;
  color: #FFF;
  z-index: 10;
  top: 17px;
  font-size: 14px;
  pointer-events: none;
}

.a-kaai .kaai-header-top .language-dropdown .header-dropdown {
  padding: .5rem .5rem .5rem 1.2rem;
  width: 3rem;
  height: 3rem;
  margin: 0;
  cursor: pointer;
}

.a-kaai .kaai-header-top .language-dropdown .header-dropdown option {
  background-color: #FFF;
  color: #000;
}

@media (min-width: 60em) {
  .a-kaai .kaai-header-top {
    min-width: 0;
  }
}

.a-kaai .kaai-header-bottom {
  height: 3rem;
  /*box-sizing: border-box;
        position: relative;        
        height:$logo-height;
        display: flex;
        align-items: flex-end;
        width:100%;*/
  /*min-height: $header-top-height;*/
  /*margin-top:$header-top-height;*/
}

@media (min-width: 40em) {
  .a-kaai .kaai-header-bottom {
    height: 0;
  }
}

.a-kaai .logo-wrapper {
  margin: 0;
  position: absolute;
  /*top: $logo-height;*/
  /*width: 60px;*/
  width: 6rem;
  white-space: nowrap;
  z-index: 5001;
}

.a-kaai .logo-wrapper::after {
  clear: both;
  content: "";
  display: table;
}

.a-kaai .logo-wrapper * {
  display: inline-block;
}

@media (min-width: 40em) {
  .a-kaai .logo-wrapper {
    width: 10rem;
  }
}

@media (min-width: 60em) {
  .a-kaai .logo-wrapper {
    width: 12rem;
  }
}

.a-kaai .logo-wrapper img.PA, .a-kaai .logo-wrapper #PA-logo {
  /*height: 50px;*/
  display: block;
  width: 6rem;
  height: 3rem;
  display: inline;
  background-color: #fff;
  float: left;
}

.a-kaai .logo-wrapper img.PA span, .a-kaai .logo-wrapper #PA-logo span {
  color: white;
  font-family: "Sun Regular","Helvetica Neue",Helvetica,Arial,Georgia,Sans-serif;
  font-weight: bold;
  line-height: 1.3em;
  padding-left: 0.5rem;
  margin-top: 0.6rem;
  font-size: 0.7rem;
}

@media (min-width: 40em) {
  .a-kaai .logo-wrapper img.PA span, .a-kaai .logo-wrapper #PA-logo span {
    padding-left: 1rem;
    margin-top: 1rem;
    font-size: 1.1rem;
  }
}

@media (min-width: 60em) {
  .a-kaai .logo-wrapper img.PA span, .a-kaai .logo-wrapper #PA-logo span {
    padding-left: 1.5rem;
    margin-top: 1.5rem;
    font-size: 1.1rem;
  }
}

@media (min-width: 40em) {
  .a-kaai .logo-wrapper img.PA, .a-kaai .logo-wrapper #PA-logo {
    width: 10rem;
    height: 5rem;
  }
}

@media (min-width: 60em) {
  .a-kaai .logo-wrapper img.PA, .a-kaai .logo-wrapper #PA-logo {
    width: 12rem;
    height: 6rem;
  }
}

.a-kaai .logo-wrapper img.felix, .a-kaai .logo-wrapper #felix-logo {
  /*height: 50px;*/
  display: block;
  width: 3rem;
  height: 3rem;
  display: inline;
  background-color: #0085a1;
  float: left;
}

.a-kaai .logo-wrapper img.felix span, .a-kaai .logo-wrapper #felix-logo span {
  color: white;
  font-family: "Sun Regular","Helvetica Neue",Helvetica,Arial,Georgia,Sans-serif;
  font-weight: bold;
  line-height: 1.3em;
  padding-left: 0.5rem;
  margin-top: 0.6rem;
  font-size: 0.7rem;
}

@media (min-width: 40em) {
  .a-kaai .logo-wrapper img.felix span, .a-kaai .logo-wrapper #felix-logo span {
    padding-left: 1rem;
    margin-top: 1rem;
    font-size: 1.1rem;
  }
}

@media (min-width: 60em) {
  .a-kaai .logo-wrapper img.felix span, .a-kaai .logo-wrapper #felix-logo span {
    padding-left: 1.5rem;
    margin-top: 1.5rem;
    font-size: 1.1rem;
  }
}

@media (min-width: 40em) {
  .a-kaai .logo-wrapper img.felix, .a-kaai .logo-wrapper #felix-logo {
    width: 5rem;
    height: 5rem;
  }
}

@media (min-width: 60em) {
  .a-kaai .logo-wrapper img.felix, .a-kaai .logo-wrapper #felix-logo {
    width: 6rem;
    height: 6rem;
  }
}

.a-kaai .user-tools {
  margin: 0;
  position: absolute;
  /*top: $header-height;*/
  /*height:$logo-height;    */
  z-index: 40;
  right: 0;
  background-color: white;
  padding-left: 1rem;
}

.a-kaai .user-tools::after {
  clear: both;
  content: "";
  display: table;
}

.a-kaai .user-tools a {
  color: black;
  /*&:focus{
                text-decoration:none;
            }*/
}

.a-kaai .user-tools .fa {
  margin-right: 0.2rem;
}

.a-kaai .user-tools ul {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.a-kaai .user-tools-item {
  margin-right: 2rem;
}

.a-kaai .kaai-outer-container {
  box-sizing: border-box;
  position: relative;
}

.a-kaai .quick-menu {
  float: right;
}

.a-kaai .quick-menu .button {
  margin: 0;
}

.a-kaai .quick-menu-item {
  border-right: 2px solid #005090;
  margin-right: 0;
  display: block;
  float: right;
  background: #0064B4;
}

.a-kaai .has-icon {
  padding-right: 0;
}

.a-kaai .has-icon > span:not(.fa):not(.badge) {
  display: none;
  /*@include respond-to("tablet") {
                padding-left: .625rem;
                display: inline-block;
            }*/
}

.a-kaai .has-icon > span:not(.fa):not(.badge).logout-text {
  display: inline-block;
}

@media (min-width: 40em) {
  .a-kaai .has-icon {
    padding-right: 1.5rem;
  }
  .a-kaai .has-icon > span:not(.fa):not(.badge) {
    display: block;
    padding-left: .625rem;
  }
}

.a-kaai .kaai-header-left {
  float: left;
  padding-left: 0.5rem;
}

@media (min-width: 40em) {
  .a-kaai .kaai-header-left {
    padding-left: 1.5rem;
  }
}

.a-kaai .kaai-header-right {
  float: right;
  padding-right: 1.5rem;
  display: none;
}

@media (min-width: 60em) {
  .a-kaai .kaai-header-right {
    display: block;
  }
}

.a-kaai .kaai-header-text {
  padding-top: .771rem;
  /*padding-bottom: .771rem;*/
  display: block;
  font-size: 1rem;
  overflow: hidden;
  white-space: nowrap;
}

.a-kaai .kaai-header-text a {
  color: black;
  text-decoration: underline;
  margin-right: 1rem;
}

.a-kaai .kaai-header-text a:after {
  content: "";
}

.a-kaai .banner-container .banner {
  display: -webkit-box;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.a-kaai .banner-container .banner .inner {
  width: 100%;
}

.a-kaai .banner-container .critical {
  background-color: #da291c;
  color: white;
}

.a-kaai .banner-container .info {
  background-color: #cce0f0;
}

.a-header {
  background-color: #E5E5E6;
  flex-shrink: 0;
  min-height: 12rem;
}

@media (min-width: 40em) {
  .a-header {
    background-color: #FFF;
  }
}

.a-header .inner-header {
  padding-top: 1.5rem;
  position: relative;
}

@media screen and (min-width: 40em) {
  .a-header .inner-header {
    padding-top: 7rem;
  }
}

@media screen and (min-width: 60em) {
  .a-header .inner-header {
    padding-top: 7rem;
  }
}

.a-header .inner-header .a-header__wrapper a:last-child {
  margin-right: 0;
}

.a-header .inner-header .a-header__wrapper .left {
  text-align: center;
}

.a-header .inner-header .a-header__wrapper h2 {
  margin-bottom: 0;
}

.a-header .extra-content-link-wrapper {
  display: block;
  margin-bottom: 1.5rem;
  text-align: left;
}

.a-header .tabs {
  margin: 0;
  padding: 0;
  list-style: none;
  margin-bottom: 1.5rem;
}

.a-header .tabs ul {
  margin: 0;
  padding: 0;
}

.a-header .tabs li {
  margin: 0;
  list-style: none;
}

.a-header .tabs li {
  list-style: none;
}

@media (min-width: 60em) {
  .a-header .tabs {
    bottom: 0;
    left: 0;
    margin-bottom: 0;
    position: absolute;
    right: 0;
  }
}

.a-header .tabs-list {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media (min-width: 40em) {
  .a-header .tabs-list {
    flex-direction: row;
  }
}

.a-header .tabs-list li {
  margin-bottom: -1px;
  padding: 0;
}

@media (min-width: 40em) {
  .a-header .tabs-list li {
    margin-right: -1px;
  }
}

@media (min-width: 60em) {
  .a-header .tabs-list li {
    align-self: flex-end;
  }
}

.a-header .tabs-list a {
  -webkit-transition: background-color 0.2s ease-out, padding 0.2s ease-out;
  -moz-transition: background-color 0.2s ease-out, padding 0.2s ease-out;
  transition: background-color 0.2s ease-out, padding 0.2s ease-out;
  background: #E5E5E6;
  border: 1px solid #BABABA;
  color: #282020;
  display: block;
  padding: 0.375rem 1.5rem;
  text-align: center;
  text-decoration: none;
}

.a-header .tabs-list a:hover:not(.active),
.a-header .tabs-list a:active .a-header .tabs-list a:visited:not(.active) {
  text-decoration: underline;
}

.a-header .tabs-list a.active {
  background: #FFF;
  font-weight: 700;
}

@media (min-width: 60em) {
  .a-header .tabs-list a.active {
    padding: 0.75rem 1.5rem;
  }
}

.a-header-fancy .a-header__wrapper {
  margin: 0 auto;
}

@media (min-width: 40em) {
  .a-header-fancy {
    background-color: #FFF;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: 50%;
  }
  .a-header-fancy .a-header__wrapper {
    background: #FFF;
    height: 100%;
    max-width: 36rem;
    padding: 1.5rem 1.5rem 0;
    position: relative;
    text-align: center;
  }
  .a-header-fancy .a-header__wrapper:before, .a-header-fancy .a-header__wrapper:after {
    content: "";
    position: absolute;
    top: 14rem;
    border-top: 14px solid rgba(0, 0, 0, 0.2);
  }
  .a-header-fancy .a-header__wrapper:before {
    left: -0.375rem ;
    border-left: 6px solid transparent;
  }
  .a-header-fancy .a-header__wrapper:after {
    right: -0.375rem ;
    border-right: 6px solid transparent;
  }
  .a-header-fancy .a-header__wrapper:last-child {
    margin-bottom: 0;
    padding-bottom: 1rem;
  }
  .a-header-fancy .a-header__wrapper .left {
    float: left;
    margin-right: 1.5rem;
  }
  .a-header-fancy .a-header__wrapper .right {
    float: left;
  }
  .a-header-fancy .extra-content-link-wrapper {
    top: 13.875rem ;
    position: absolute;
  }
  .a-header-fancy:before {
    /*content: "";
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            //height: $sizer * 8;
            height: 21rem;
            background: $alpha-background;
            margin-top: $sizer * 2;
            background-image: url(/img/header-default.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-position-y: 50%;*/
  }
  /*.hero {
        height: $sizer * 8;
        left: 0;
        overflow: hidden;
        position: absolute;
        right: 0;
        top: 0;

        img {
            position: absolute;
            top: 50%;
            left: 50%;
            width: auto;
            height: auto;
            max-height: none;
            max-width: none;
            min-height: 100%;
            min-width: 100%;
            transform: translate(-50%, -50%);
        }
    }*/
}

/*.a-hero {
    height: 18rem;
    min-height: 18rem;
    width: 100%;
    background: $alpha-background;
    position: relative;
    background-size: cover;
    background-clip: content-box;
    background-position: center center;
    transition: height 250ms ease-in-out;

    @include respond-to("tablet") {    
        height: 23.25rem;    
    }
}*/
@media (min-width: 60em) {
  footer {
    /*height: 25rem;*/
    /*position: absolute;*/
    right: 0;
    bottom: 0;
    left: 0;
    padding-bottom: 3rem;
  }
}

footer {
  overflow: hidden;
  position: relative;
  color: #fff;
  clear: both;
  padding-top: 3rem;
  background: #282020;
}

footer ul {
  margin: 0;
  padding: 0;
}

footer li {
  margin: 0;
  list-style: none;
}

footer .inner > div {
  overflow: hidden;
  margin-bottom: 2rem;
}

footer a {
  color: #fff;
}

footer a:hover {
  color: #fff;
}

footer a:after {
  content: "";
}

footer > a {
  margin-bottom: 1.5rem;
}

footer .no-margin {
  margin: 0;
}

footer .button.secondary {
  width: 3rem;
  height: 3rem;
  position: absolute;
  bottom: 0;
  right: 0;
}

footer .button.secondary .fa {
  margin-left: 0;
}

@media (min-width: 40em) {
  footer .ondernemingsnr {
    position: absolute;
    bottom: 0;
  }
}

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

.a-footer__container {
  position: relative;
}

/*footer>a {
        margin-bottom: 1.5rem
    }*/
.a-footer span {
  display: block;
}

@media (min-width: 40em) {
  .a-footer span {
    display: inline;
  }
}

.a-footer .fa {
  display: inherit;
}

.a-footer .button {
  color: #FFF;
  /*margin: 0;*/
  /*position: absolute;*/
  right: 0;
  top: 0;
  /*width: auto;*/
}

.a-footer .a-footer__row {
  margin-bottom: 1.5rem;
}

.a-footer .a-footer__contact p {
  font-weight: 700;
  margin: 0;
}

.a-footer .a-footer__contact .button {
  margin-top: .75rem;
}

.a-footer .a-footer__social a {
  display: inline-block;
  margin-right: .75rem;
  margin-bottom: .75rem;
}

.a-footer .a-footer__subfooter {
  clear: both;
  color: #BABABA;
  height: 3rem;
  padding: .5rem 0;
  text-align: center;
  position: relative;
  background: #000;
}

@media (min-width: 60em) {
  .a-footer .a-footer__subfooter {
    position: absolute;
    width: 100%;
    bottom: 0;
  }
}

.a-footer .a-footer__subfooter span,
.a-footer .a-footer__subfooter a {
  /*font-size: .83333rem;
        line-height: .924em;*/
}

.a-footer .a-footer__subfooter span {
  display: block;
  /*.a-footer__info {
            font-size: .83333rem;
            line-height: .924em
        }*/
}

@media (min-width: 40em) {
  .a-footer .a-footer__subfooter span {
    display: inline;
  }
}

.a-footer .a-footer__subfooter .button {
  color: #fff;
}

.a-footer .a-footer__subfooter a {
  color: #BABABA;
  text-decoration: none;
}

.a-footer .a-footer__subfooter a:hover,
.a-footer .a-footer__subfooter a:focus {
  text-decoration: underline;
}

.a-footer .a-footer__info {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: .8333rem;
}

.inner {
  margin: 0 1.5rem;
  max-width: 80em;
}

.inner::after {
  clear: both;
  content: "";
  display: table;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .inner {
    /* IE10+ CSS styles go here */
    width: calc(100vw - 3rem);
  }
}

@media (min-width: 40em) {
  .inner {
    /*margin: 0 $sizer 0 0;*/
    /*padding-left: $sizer * 3.5;*/
  }
}

@media (min-width: 60em) {
  .inner {
    /*padding-left: $sizer * 5;*/
  }
}

@media screen and (min-width: 80em) {
  .inner {
    margin: 0 auto;
  }
}

@media screen and (min-width: 92em) {
  .inner {
    /*padding-left: 0;*/
  }
}

.partial-bg-container {
  align-items: stretch;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  margin-left: 3rem;
}

@media (min-width: 40em) {
  .partial-bg-container {
    margin-left: 6rem;
    background: linear-gradient(90deg, #FFF 50%, #F3F3F5 50%);
  }
  .partial-bg-container .inner {
    display: flex;
    flex: 1 1 auto;
  }
  .partial-bg-container .partial-bg {
    flex: 1 1 auto;
    margin-right: 0;
  }
  .partial-bg-container .partial-bg:last-child {
    padding-left: 1.5rem;
  }
  .partial-bg-container .partial-bg:last-child:before {
    content: none;
  }
}

.partial-bg-container .partial-bg:first-child {
  background: #FFF;
}

.partial-bg-container .partial-bg:last-child {
  background: #F3F3F5;
  position: relative;
}

.partial-bg-container .partial-bg:last-child:before {
  background: #F3F3F5;
  bottom: 0;
  content: "";
  display: block;
  left: -1.5rem;
  right: -1.5rem;
  position: absolute;
  top: 0;
  z-index: -1;
}

.boxed-content {
  color: #282020;
  position: relative;
  border-width: 1px;
  border-style: solid;
  border-color: #bababa;
  border-image: initial;
  margin: 1em auto;
  padding: 1.5rem;
}

.boxed-content .custom-box .sub-box {
  margin-bottom: 2rem;
}

.basket-block {
  width: 100%;
  display: inline-block;
}

/*.tree > ul > li {
        overflow:scroll;
    }*/
.tree-wrapper {
  overflow-y: auto;
  overflow-x: hidden;
}

@media (min-width: 40em) {
  .tree-wrapper {
    max-height: calc(100vh - 6rem - 3rem - 8rem);
  }
}

.tree {
  font-weight: normal;
}

.tree ul {
  height: 100%;
}

.tree li {
  white-space: nowrap;
}

.tree li .fa {
  color: #000;
  font-size: 17px;
  width: 20px;
}

.tree li .fa:hover {
  font-weight: bold;
}

.tree li .node-loading {
  margin-left: 5rem;
  margin-bottom: 0.5rem;
}

.tree .tree-item {
  padding-bottom: 10px;
  display: inline-block;
}

.tree .tree-item a {
  text-decoration: none;
  color: #000;
}

.tree .tree-item .tree-item-arrow {
  display: inline-block;
  width: 1rem;
}

.tree .tree-item .tree-item-checkbox {
  display: inline-block;
  width: 1.5rem;
}

.tree .tree-item .tree-item-size {
  color: #949494;
  display: inline-block;
  font-size: 0.9rem;
}

.tree .tree-item .tree-item-actions {
  display: inline-block;
}

.tree .tree-item .tree-item-actions .action {
  font-size: 100%;
  color: #a2a2a2;
}

.tree .tree-item .tree-item-actions .action:hover {
  color: #000;
}

.tree .tree-item .tree-item-text {
  margin-bottom: 15px;
  display: inline;
}

.tree .tree-item .tree-item-text:hover * {
  color: #0064B4;
}

.tree .tree-item .tree-item-text a {
  /*&:hover{
                    color:$blue;
                }*/
}

.tree .tree-item .tree-item-text a div {
  display: table-cell;
  white-space: normal;
}

.tree .tree-item .tree-item-text .tree-item-icon {
  padding-right: 0.5rem;
}

.tree .tree-item .tree-item-text .tree-item-icon img {
  width: 20px;
}

.tree .selected {
  font-weight: bold;
  color: #0064B4;
}

.tree .selected a {
  color: #0064B4;
}

.tree .selected .tree-item-icon {
  color: #0064B4;
}

#toast-container .toast {
  opacity: 1 !important;
  border-radius: 0px !important;
}

#toast-container > div {
  width: 22rem;
}

.toast-top-right {
  top: 0px !important;
  right: 0px !important;
}

.no-animate {
  -webkit-transition: none !important;
  transition: none !important;
}

.animate-expand,
.animate-collapse {
  -webkit-transition: all ease .2s;
  -moz-transition: all ease .2s;
  -o-transition: all ease .2s;
  transition: all ease .2s;
  overflow: hidden;
}

.animate-expand.ng-hide-remove,
.animate-collapse.ng-hide-add.ng-hide-add-active {
  height: 0;
}

.animate-collapse.ng-hide-add,
.animate-expand.ng-hide-remove.ng-hide-remove-active {
  height: 100px;
}

.ng-hide.ng-hide-animate {
  display: none !important;
}

@-webkit-keyframes slideLoadingOutUp {
  from {
    -webkit-transform: translate(0, 0);
    opacity: 1;
  }
  to {
    -webkit-transform: translate(0, -1.5625rem );
    opacity: 0;
  }
}

@-moz-keyframes slideLoadingOutUp {
  from {
    -moz-transform: translate(0, 0);
    opacity: 1;
  }
  to {
    -moz-transform: translate(0, -1.5625rem );
    opacity: 0;
  }
}

@keyframes slideLoadingOutUp {
  from {
    -webkit-transform: translate(0, 0);
    -moz-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
  to {
    -webkit-transform: translate(0, -1.5625rem );
    -moz-transform: translate(0, -1.5625rem );
    -ms-transform: translate(0, -1.5625rem );
    -o-transform: translate(0, -1.5625rem );
    transform: translate(0, -1.5625rem );
    opacity: 0;
  }
}

@-webkit-keyframes slideOpen {
  from {
    height: 0;
  }
  to {
    height: 100%;
  }
}

@-moz-keyframes slideOpen {
  from {
    height: 0;
  }
  to {
    height: 100%;
  }
}

@keyframes slideOpen {
  from {
    height: 0;
  }
  to {
    height: 100%;
  }
}

.loading-dots:after {
  overflow: hidden;
  display: inline-block;
  vertical-align: bottom;
  -webkit-animation: ellipsis steps(4, end) 900ms infinite;
  animation: ellipsis steps(4, end) 900ms infinite;
  content: "\2026";
  /* ascii code for the ellipsis character */
  width: 0px;
}

@keyframes ellipsis {
  to {
    width: 20px;
  }
}

@-webkit-keyframes ellipsis {
  to {
    width: 20px;
  }
}

a.plus, .plus {
  font-size: 1rem;
  line-height: 1.4em;
  padding-left: .9375rem;
  font-weight: 700;
  position: relative;
  text-decoration: none;
  text-transform: lowercase;
}

a.plus span:before, .plus span:before {
  transform-origin: center center;
  transition-property: all;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
  font-size: 1.25rem;
  height: .625rem;
  width: .625rem;
  top: .25rem;
  color: #282020;
  content: "+";
  display: inline-block;
  font-weight: 700;
  left: 0;
  line-height: 8px;
  position: absolute;
}

a.plus:hover, .plus:hover {
  text-decoration: none;
}

a.plus:hover span:before, .plus:hover span:before {
  transform: rotate(180deg);
}

.icon-url {
  font-weight: bold;
  display: inline;
  margin-right: 1rem;
  background-color: transparent !important;
}

.icon-url .fa {
  font-size: 85%;
  display: inline;
}

.icon-url .fa span {
  display: inline;
}

.icon-url.disabled {
  color: #BABABA;
  pointer-events: none;
  cursor: default;
}

.icon-right {
  float: right;
}

.help-icon {
  font-size: 120%;
  margin-left: 0.5em;
}

.grey-action-icon {
  font-size: 100%;
  padding: 0.8rem;
  color: #a2a2a2;
}

.grey-action-icon:hover {
  color: #CF0039;
}

.tooltip {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltiptext {
  background-color: #FFF;
  padding: 5px 0;
  border: 1px solid #BABABA;
  box-shadow: 3px 3px 5px rgba(204, 204, 204, 0.34902);
  color: initial;
  padding: 0.5rem;
  position: absolute;
  z-index: 1000;
  font-family: "Sun Regular","Helvetica Neue",Helvetica,Arial,Georgia,Sans-serif;
  font-size: 1rem;
  line-height: 1.4em;
  padding-right: 2rem;
  cursor: default;
}

.tooltiptext .close-button {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  font-size: 120%;
  color: #BABABA;
}

.tooltiptext .close-button:hover {
  color: #DA291C;
}

.tooltip-right {
  top: -6px;
  left: 175%;
  min-width: 200px;
  white-space: initial;
}

@media (min-width: 40em) {
  .tooltip-right {
    min-width: 400px;
  }
}

.tooltip-right:after,
.tooltip-right:before {
  right: 100%;
  top: 7px;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.tooltip-right:after {
  border-right-color: #FFF;
  border-width: 8px;
}

.tooltip-right:before {
  border-right-color: #BABABA;
  border-width: 9px;
  margin-top: -1px;
}

/* Show the tooltip text when you mouse over the tooltip container */
/*.tooltip:hover .tooltiptext {
    visibility: visible;
}*/
.transparent-with-hover {
  background-color: rgba(0, 0, 0, 0);
  color: #0064B4;
}

.transparent-with-hover:hover {
  background-color: #0064B4;
  color: #fff;
}

.button-transparent-delete {
  margin-bottom: 0;
  /*&:hover {
        color:$blue;
    }*/
}

.button-transparent-delete span:hover {
  color: #DA291C !important;
}

.button-transparent-delete:disabled {
  color: #BABABA;
}

.button-transparent-delete:disabled:hover {
  color: #BABABA;
}

/*.button.disabled.transparent{
    color:$line!important;
}*/
.fa-blue {
  color: #0064B4 !important;
}

.fa-white {
  color: #FFF !important;
}

.fa-green {
  color: #4AA32C !important;
}

.fa-red {
  color: red !important;
}

html.ngdialog-open,
body.ngdialog-open {
  overflow: initial !important;
}

.ngdialog-close:before {
  margin: 30px !important;
  content: "" !important;
  font-family: FontAwesome !important;
  color: #949494;
}

.ngdialog-close:hover {
  color: #808080;
}

.ngdialog-close:focus {
  outline: 0;
}

.ngdialog-custom, .ngdialog-metadata, .ngdialog-large, .ngdialog-extra-large {
  padding-top: 20vh !important;
  padding-bottom: 0 !important;
}

.ngdialog-custom .ngdialog-content, .ngdialog-metadata .ngdialog-content, .ngdialog-large .ngdialog-content, .ngdialog-extra-large .ngdialog-content {
  border-radius: 0px !important;
  background: #ffffff !important;
  font-family: "Sun Regular","Helvetica Neue",Helvetica,Arial,Georgia,Sans-serif !important;
  width: 510px;
}

.ngdialog-custom .ngdialog-content form *, .ngdialog-metadata .ngdialog-content form *, .ngdialog-large .ngdialog-content form *, .ngdialog-extra-large .ngdialog-content form * {
  font-size: 1rem !important;
}

.ngdialog-custom .ngdialog-content form input[type="text"], .ngdialog-metadata .ngdialog-content form input[type="text"], .ngdialog-large .ngdialog-content form input[type="text"], .ngdialog-extra-large .ngdialog-content form input[type="text"] {
  width: 100%;
  margin-bottom: 0.5rem;
}

.ngdialog-custom .ngdialog-content form label, .ngdialog-metadata .ngdialog-content form label, .ngdialog-large .ngdialog-content form label, .ngdialog-extra-large .ngdialog-content form label {
  color: rgba(102, 102, 102, 0.6);
  display: inline-block;
}

.ngdialog-custom .ngdialog-content form .label-for-checkbox, .ngdialog-metadata .ngdialog-content form .label-for-checkbox, .ngdialog-large .ngdialog-content form .label-for-checkbox, .ngdialog-extra-large .ngdialog-content form .label-for-checkbox {
  color: black;
}

.ngdialog-custom .ngdialog-content .list-wrapper, .ngdialog-metadata .ngdialog-content .list-wrapper, .ngdialog-large .ngdialog-content .list-wrapper, .ngdialog-extra-large .ngdialog-content .list-wrapper {
  padding: 1rem;
  overflow: auto;
  max-height: 40vh;
}

.ngdialog-custom .ngdialog-content .list-wrapper .list-navigation li, .ngdialog-metadata .ngdialog-content .list-wrapper .list-navigation li, .ngdialog-large .ngdialog-content .list-wrapper .list-navigation li, .ngdialog-extra-large .ngdialog-content .list-wrapper .list-navigation li {
  word-break: break-all;
}

.ngdialog-custom .ngdialog-content .actions, .ngdialog-metadata .ngdialog-content .actions, .ngdialog-large .ngdialog-content .actions, .ngdialog-extra-large .ngdialog-content .actions {
  margin: 1rem 0 0 0;
}

.ngdialog-metadata .ngdialog-content {
  width: 750px !important;
}

.ngdialog-large .ngdialog-content {
  width: 800px !important;
}

.ngdialog-extra-large .ngdialog-content {
  width: 920px !important;
}

.ngdialog-pageview {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  height: 100vh;
}

@media (min-width: 40em) {
  .ngdialog-pageview {
    padding-top: 10vh !important;
    padding-bottom: 2vh !important;
    height: auto;
  }
}

.ngdialog-pageview .ngdialog-content {
  border-radius: 0px !important;
  background: #ffffff !important;
  font-family: "Sun Regular", "Helvetica Neue", Helvetica, Arial, Georgia, Sans-serif !important;
  width: auto !important;
  padding: 2rem !important;
  padding-bottom: 1rem !important;
}

@media (min-width: 40em) {
  .ngdialog-pageview .ngdialog-content {
    max-width: 40rem !important;
  }
}

.ngdialog-pageview .ngdialog-content .content {
  margin-top: 1rem;
  margin-bottom: 1rem;
  overflow: auto;
}

@media (min-width: 40em) {
  .ngdialog-pageview .ngdialog-content .content {
    max-height: 60vh;
  }
}

table thead tr th .fa {
  font-size: 85%;
}

table tbody *[ui-sref]:hover {
  background: #E5E5E6;
}

table tbody tr th .searchfield {
  margin-left: 1rem;
}

table tbody tr td img, table tbody tr td .fa {
  max-width: 1.3rem;
  width: 1.3rem;
  font-size: 1.3rem;
}

table tbody tr td .thumbnail {
  max-width: 100%;
  width: auto;
  height: 100%;
}

table tbody tr td button {
  margin-bottom: 0 !important;
}

table tbody tr td button .fa {
  max-width: none;
}

.tr-vertical-align-top td, .tr-vertical-align-top th {
  vertical-align: top;
}

.tr-one-line td, .tr-one-line th {
  white-space: nowrap;
}

.one-line {
  white-space: nowrap;
}

.one-line-ellipsis {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.no-border-bottom td, .no-border-bottom th {
  border-bottom: 0;
}

.thead-margin-bottom:after {
  content: "-";
  display: block;
  line-height: 1em;
  color: transparent;
  background-color: #fff;
}

.hours {
  overflow: hidden;
}

.hours #hours-today #dropdown a {
  color: #000;
}

.hours #hours-today #link a {
  font-weight: bold;
  text-decoration: none;
}

.hours #hours-today #link a:hover {
  text-decoration: underline;
}

.hours #hours-full-list table tbody tr td {
  padding: 0;
}

#searchResultTable {
  position: relative;
}

#resultContainer .table-with-actionbutton {
  margin-left: 11rem;
}

#resultContainer #table-results {
  overflow-x: auto;
  overflow-y: visible;
}

#resultContainer #table-results table {
  /*th {
                background:#0064B4;
            }*/
}

#resultContainer #table-results table .headcol {
  position: absolute;
  width: 11rem;
  left: 0;
  top: auto;
  background-color: inherit;
  border: inherit;
}

#resultContainer #table-results table tbody tr {
  border: 0;
}

#resultContainer #table-results table tbody td {
  padding: 0.2rem 0.2rem 0.2rem 0.5rem;
  height: 2.2rem;
}

#resultContainer #table-results table tbody td.thumb {
  height: 5rem;
}

.table-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.7);
  z-index: 100;
}

/*.table-resizable {
    border-collapse: collapse;

    .table,
    th,
    td {
        border: 1px solid #ccc;
    }

    th,
    td {
        padding: 0.5rem;
    }

    th {
        position: relative;
    }

    .resizer {
        position: absolute;
        top: 0;
        right: 0;
        width: 5px;
        cursor: col-resize;
        user-select: none;
    }

    .resizer:hover,
    .resizing {
        border-right: 2px solid blue;
    }

    .resizable {
        border: 1px solid gray;
        height: 100px;
        width: 100px;
        position: relative;
    }
}*/
.arrow_box, .arrow_box_noarrow {
  background: #FFF;
  /*border: 1px solid;
    border-color: $line;*/
  position: absolute;
  width: 24rem;
  right: 10px;
  top: 125%;
  border: solid 1px #BABABA;
  box-shadow: 3px 3px 5px rgba(204, 204, 204, 0.34902);
  z-index: 100;
}

.arrow_box .arrow_box_inner, .arrow_box_noarrow .arrow_box_inner {
  width: 100%;
  /*.arrow_box-element.ng-enter {
            -webkit-transition: 1s;
            transition: 1s;
            opacity: 0;
        }
        .arrow_box-element.ng-enter-active {
            opacity: 1;
        }*/
}

.arrow_box .arrow_box_inner .arrow_box-element, .arrow_box_noarrow .arrow_box_inner .arrow_box-element {
  border-bottom: solid 1px #BABABA;
  width: auto;
  line-height: initial;
}

.arrow_box .arrow_box_inner .arrow_box-element .content, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .content {
  padding: 1rem;
}

.arrow_box .arrow_box_inner .arrow_box-element .content:hover, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .content:hover {
  background-color: #E8E8E8;
}

.arrow_box .arrow_box_inner .arrow_box-element .content label, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .content label {
  line-height: 1.5rem;
}

.arrow_box .arrow_box_inner .arrow_box-element .content span, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .content span {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: block;
}

.arrow_box .arrow_box_inner .arrow_box-element .navigate, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .navigate {
  padding: 0;
  background-color: #F8F8F8;
  margin-bottom: 0;
}

.arrow_box .arrow_box_inner .arrow_box-element .navigate:hover, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .navigate:hover {
  background-color: #E8E8E8;
}

.arrow_box .arrow_box_inner .arrow_box-element .navigate .fa, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .navigate .fa {
  color: #90ABBC;
  line-height: inherit;
  position: relative;
  font-size: 90%;
}

.arrow_box .arrow_box_inner .arrow_box-element .disabled, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .disabled {
  background-color: #F8F8F8;
}

.arrow_box .arrow_box_inner .arrow_box-element .disabled .fa, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .disabled .fa {
  color: #dddddd;
}

.arrow_box .arrow_box_inner .arrow_box-element .disabled:hover, .arrow_box_noarrow .arrow_box_inner .arrow_box-element .disabled:hover {
  background-color: #F8F8F8;
}

.arrow_box .arrow_box_inner .arrow-up, .arrow_box_noarrow .arrow_box_inner .arrow-up {
  border-top: solid 1px #BABABA;
}

.arrow_box .arrow_box_inner .arrow-down, .arrow_box_noarrow .arrow_box_inner .arrow-down {
  border-bottom: 0;
}

.arrow_box .arrow_box_inner .actions, .arrow_box_noarrow .arrow_box_inner .actions {
  padding: 1rem;
}

.arrow_box .arrow_box_inner .actions .button, .arrow_box_noarrow .arrow_box_inner .actions .button {
  margin-bottom: 0;
}

.arrow_box .arrow_box_inner .button, .arrow_box_noarrow .arrow_box_inner .button {
  padding-top: 0;
  padding-bottom: 0;
}

.arrow_box .arrow_box_inner .button:hover, .arrow_box .arrow_box_inner .button:focus, .arrow_box_noarrow .arrow_box_inner .button:hover, .arrow_box_noarrow .arrow_box_inner .button:focus {
  box-shadow: inherit;
}

.arrow_box_noarrow .arrow_box_inner .arrow-up {
  border-top: 0;
}

.arrow_box:after,
.arrow_box:before {
  bottom: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.arrow_box:after {
  border-bottom-color: #FFF;
  border-width: 10px;
  margin-left: 167px;
}

@media (min-width: 40em) {
  .arrow_box:after {
    margin-left: 167px;
  }
}

@media (min-width: 60em) {
  .arrow_box:after {
    margin-left: 134px;
  }
}

.arrow_box:before {
  border-bottom-color: #BABABA;
  border-width: 11px;
  margin-left: 166px;
}

@media (min-width: 40em) {
  .arrow_box:before {
    margin-left: 166px;
  }
}

@media (min-width: 60em) {
  .arrow_box:before {
    margin-left: 133px;
  }
}

.navigation-simple {
  background: #fff;
  margin-top: 1.5rem;
}

.navigation-simple .nav-wrapper {
  margin: 0 auto 1.5rem;
  max-width: 80em;
}

.navigation-simple .nav-list {
  border-bottom: 1px solid #BABABA;
}

.navigation-simple .leaf {
  font-size: 1rem;
  line-height: 1em;
  display: inline-block;
  color: #282020;
  font-weight: 700;
  border-bottom-style: solid;
  border-bottom-width: 3px;
  border-bottom-color: transparent;
}

.navigation-simple .leaf:hover, .navigation-simple .leaf.active {
  border-bottom-color: #0064B4;
  text-decoration: none;
  color: #0064B4;
}

.navigation-simple .leaf a {
  color: inherit;
  background: inherit;
  text-decoration: inherit;
  display: inline-block;
  padding: .75rem;
  position: relative;
  top: auto;
  z-index: 20;
  width: 100%;
  cursor: pointer;
}

@media (min-width: 40em) {
  .navigation-simple .nav-list {
    border-bottom: 0;
  }
}

.navigation-horizontal {
  color: #282020;
  position: relative;
  background: #f3f3f5;
  border-width: 1px;
  border-style: solid;
  border-color: #bababa;
  border-image: initial;
  margin: 1em auto;
  padding: 1rem 1.5rem 1rem 1.5rem;
}

.navigation-horizontal .nav-item-active {
  color: #0064b4;
}

.navigation-horizontal .fa {
  color: #90ABBC;
  padding: 0 1rem 0 1rem;
}

.list-navigation .last-no-border .leaf:last-child {
  border-bottom: 0;
}

.list-navigation .leaf.active > * {
  font-weight: initial;
}

.list-navigation .leaf-link p {
  margin: 0;
}

.list-navigation .leaf-link .button span {
  font-size: 1.6rem !important;
  transform: none !important;
}

.list-navigation .leaf-link .button .fa {
  top: 0;
  left: 0;
  font-size: inherit;
  padding: 0;
  color: unset !important;
}

ul.breadcrumb {
  list-style: none;
  padding: 0;
  margin-bottom: 2rem;
}

ul.breadcrumb li {
  display: inline;
}

ul.breadcrumb .active {
  font-weight: bold;
}

ul.breadcrumb li + li:before {
  padding: 8px;
  content: "\f054";
  font-family: FontAwesome;
  color: #949494;
}

ul.breadcrumb li a {
  text-decoration: none;
}

/* Add a color on mouse-over */
ul.breadcrumb li a:hover {
  color: #01447e;
  text-decoration: underline;
}

.navbar {
  margin-top: 1rem;
  /*select {
        font-size: 1.1rem;
    }*/
}

.navbar > * {
  line-height: 2rem;
  vertical-align: middle;
}

.navbar .paging-container {
  float: right;
}

.navbar:after {
  content: "";
  clear: both;
  display: block;
  height: 1rem;
}

select {
  padding: 0.2rem;
  margin: 0;
  cursor: pointer;
  border: 1px solid #ddd;
}

select option {
  background-color: #FFF;
  color: #000;
}

.pagination {
  display: inline-block;
  padding-left: 0;
  margin: -13px 0;
}

.pagination .active a {
  z-index: 3;
  color: #fff;
  cursor: default;
  background-color: #0064B4;
  border-color: #337ab7;
}

.pagination li {
  display: inline;
}

.pagination li a {
  font-size: 1.1rem;
  position: relative;
  float: left;
  padding: 6px 12px;
  margin-left: -1px;
  line-height: 1.42857143;
  color: #337ab7;
  text-decoration: none;
  background-color: #fff;
  border: 1px solid #ddd;
  margin: 1px;
}

.pagination li a:hover {
  color: #fff;
  background-color: #0064B4;
}

.pagination > .disabled > a, .pagination > .disabled > a:focus, .pagination > .disabled > a:hover, .pagination > .disabled > span, .pagination > .disabled > span:focus, .pagination > .disabled > span:hover {
  color: #777;
  cursor: not-allowed;
  background-color: #fff;
  border-color: #ddd;
}

.form-custom .fieldset-custom {
  border: 0;
  margin: 0;
  padding: 0;
  width: 100%;
}

.form-custom .fieldset-custom .label {
  margin-top: 0;
  display: block;
  text-align: left;
}

.form-custom .fieldset-custom .label + .field {
  margin-left: 0;
}

.form-custom .fieldset-custom .field {
  margin-bottom: 1rem;
}

tr .button {
  margin: 0;
}

.invalid-input {
  background: #fbeae8;
}

.input-invNumber {
  width: 7rem !important;
}

.input-date {
  width: 9rem !important;
}

.input-number {
  width: 8rem !important;
}

.button, button {
  white-space: nowrap;
}

.button:focus, button:focus {
  box-shadow: 0 0 0 3px #bfd8ec !important;
}

input:focus {
  box-shadow: 0 0 0 3px #bfd8ec;
}

.input-pageNumber {
  width: 5rem !important;
}

.checkbox-without-label {
  padding: 0 0 0 0 !important;
}

.checkbox-with-label {
  height: 2rem;
  margin: 1rem 1rem 0 1rem !important;
}

input[type="checkbox"]:checked + label:after {
  line-height: 18px;
}

.detailtoegang-bevat {
  line-height: initial;
}

@media (min-width: 60em) {
  .detailtoegang-bevat {
    line-height: 5rem;
  }
}

.input-field-with-right-button {
  position: relative;
  z-index: 110;
  border: 1px solid #BABABA;
}

.input-field-with-right-button input[type="text"] {
  border: 0;
  width: 100%;
}

.input-field-with-right-button .field {
  outline: none;
}

.input-field-with-right-button .field:hover + .button.transparent {
  background-color: #0064B4;
  color: #FFF;
}

.input-field-with-right-button .button.transparent {
  background-color: #FFF;
  color: #0064B4;
}

.input-field-with-right-button .button.transparent:hover {
  background-color: #0064B4;
  color: #FFF;
}

.input-field-with-right-button .input-field-right-button-container {
  height: 3rem;
  margin-right: 0;
  line-height: 3rem;
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
  white-space: nowrap;
}

.input-field-with-right-button .input-field-right-button-container .right-button-field {
  height: 3rem;
  width: 3rem;
  margin-right: 0;
  line-height: 3rem;
  float: right;
}

.select-wrapper {
  position: relative;
}

.select-wrapper .field-select {
  margin-bottom: 0 !important;
}

.select-wrapper .fa {
  right: 0;
  line-height: 3rem;
  position: absolute;
  text-align: center;
  top: 50%;
  transform: translateY(-50%);
  width: 3rem;
  height: 3rem;
  font-size: 1.25rem;
}

.a-profile-custom {
  padding-left: 3rem;
  width: 100%;
  background: #CF0039;
}

.a-profile-custom:before {
  background: url(../img/a-profile.svg) 0 0 no-repeat;
  padding-left: 3rem;
  width: 100%;
  background: #CF0039;
  content: "";
  display: block;
  left: 0;
  top: 0;
  height: 3rem;
  position: absolute;
  width: 3rem;
}

.a-profile, .m-profile {
  padding-left: 3rem;
}

.m-profile {
  background: #0064B4;
}

.tag, .checkbox-tag {
  background: #F3F3F5;
  border-bottom: 1px solid #BABABA;
  display: inline-block;
  color: #282020;
  font-weight: 700;
  height: 3rem;
  line-height: 3rem;
  margin: 0 .75rem .75rem 0;
  position: relative;
}

.tag span:not(.fa), .checkbox-tag span:not(.fa) {
  padding: 0 .75rem;
}

.tag:hover, .tag:focus, .checkbox-tag:hover, .checkbox-tag:focus {
  color: #0064B4;
  text-decoration: none;
}

.tag .fa, .checkbox-tag .fa {
  background: #BABABA;
  color: #fff;
  display: inline-block;
  line-height: 3rem;
  margin-top: 0;
  text-align: center;
}

.checked .fa {
  background: #4AA32C;
}

.small {
  height: 2.25rem;
  line-height: 2.25rem;
}

.small .fa {
  font-size: 1rem;
  line-height: 2.25rem;
  height: 2.25rem;
  width: 2.25rem;
}

.small span:not(.fa) {
  top: 0;
}

.switch {
  position: relative;
}

.switch .label {
  margin: 0;
}

.switch span {
  font-weight: initial;
  position: relative;
  top: -.5rem;
}

.switch span:first-of-type {
  margin-right: .75rem;
}

.switch-checkbox + .switch-label .switch-button {
  transition: all 0.3s ease-in 0s;
  background: #cececf;
  margin: 0;
  min-height: inherit;
  height: 1.25rem;
  width: 1.25rem;
  padding: 0;
  position: absolute;
  top: .25rem;
  left: .25rem;
}

.switch-checkbox + .switch-label .switch-button.red-switch {
  background: #DA291C;
}

.switch-checkbox:checked + .switch-label .switch-button {
  background: #4AA32C;
  margin-left: 1.25rem;
}

.switch-checkbox + .switch-label:before {
  background: #fff;
  border-radius: 0;
  display: inline-block;
  box-shadow: none;
  position: relative;
  top: 0;
  height: 1.75rem;
  width: 3rem;
}

.switch-checkbox + .switch-label {
  margin-right: .75rem;
  padding: 0;
}

.switch-checkbox:checked + .switch-label:before {
  background: #fff;
  border: 1px solid #BABABA;
}

.switch-checkbox:checked + .switch-label:after {
  opacity: 0;
}

.switch.disabled {
  color: #90ABBC;
}

.field:disabled + label {
  cursor: default;
  color: #90ABBC;
}

.switch-checkbox:disabled + .switch-label:before {
  border-color: #90ABBC;
}

.switch-checkbox:disabled + .switch-label .switch-button {
  background: #90ABBC;
}

.one-line label {
  margin-right: 1rem !important;
}

.action-button .input-icon {
  box-shadow: none;
  background-color: transparent;
  color: #000;
}

.action-button .disabled-icon {
  color: #90ABBC;
}

.action-button .custom-dropdown {
  width: 11rem;
  position: relative;
  cursor: pointer;
}

.action-button .custom-dropdown a {
  width: 100%;
}

.action-button .custom-dropdown.icon {
  width: 3rem;
}

.action-button .custom-dropdown.icon .button {
  background-color: transparent;
}

.action-button .custom-dropdown ul {
  margin: 0;
  padding: 0;
  width: 100%;
}

.action-button .custom-dropdown ul li {
  margin: 0;
  list-style: none;
  color: #000;
}

.action-button .custom-dropdown ul li:hover {
  background: #F3F3F5;
}

.action-button .custom-dropdown ul .active {
  font-weight: 700;
  background: #F3F3F5;
}

.action-button .custom-dropdown ul .delete {
  color: #DA291C !important;
}

.action-button .custom-dropdown .dropdown-content {
  width: 11rem;
  background: #fff;
  box-shadow: -0.75rem 0.75rem 0 rgba(0, 0, 0, 0.1);
  border-radius: 0;
  border-bottom: 1px solid #BABABA;
  border-left: 1px solid #BABABA;
  border-right: 1px solid #BABABA;
  position: absolute;
  z-index: 100;
  top: 48px;
}

.action-button .custom-dropdown .dropdown-content li {
  font-size: 1rem;
  line-height: 1.4em;
  border-top: 1px solid #BABABA;
  padding: .75rem 1.5rem;
  padding-left: 3rem;
  position: relative;
}

.action-button .custom-dropdown .dropdown-content li .icon {
  left: 0 !important;
  top: 0 !important;
  width: 3rem !important;
  line-height: 3rem !important;
  padding: 0 !important;
  font-size: 1rem !important;
  transform: unset !important;
  position: absolute;
  max-width: unset;
  text-align: center;
}

.action-button .custom-dropdown .input-icon {
  color: #000;
}

.action-button .custom-dropdown .input-icon:hover {
  color: #0064B4;
  box-shadow: none;
}

.action-button .custom-dropdown .input-icon.chosen {
  color: #0064B4;
}

.action-button .custom-dropdown .input-icon.action-not-available {
  color: #DA291C;
}

.action-button .custom-dropdown .input-dropdown {
  background: white;
  border: 2px solid #0064B4;
  color: #0064B4;
  font-weight: 700;
  display: block;
  max-height: 3rem;
  padding: 0.8rem 2.7rem 0.9rem 1.5rem;
  position: relative;
  line-height: 1.3;
  /*.active:after {
            content: "\f077";
            color: #0064B4;
        }*/
}

.action-button .custom-dropdown .input-dropdown a {
  text-decoration: none !important;
}

.action-button .custom-dropdown .input-dropdown:hover {
  text-decoration: none;
}

.action-button .custom-dropdown .chosen {
  background: #0064B4;
  color: white;
}

.action-button .custom-dropdown .action-not-available {
  background: #DA291C;
  border: 0;
}

.action-button .custom-dropdown .input-dropdown:after {
  content: "\f078";
  display: inline-block;
  font: normal normal normal 14px / 1 FontAwesome;
  position: absolute;
  right: .75rem;
  top: .9090909091rem;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.action-button .custom-dropdown.has-icon .input-dropdown {
  padding-left: 3.75rem;
}

.action-button .custom-dropdown.has-icon .fa {
  background: #0064B4;
  color: #fff;
  display: block;
  font-size: 18px;
  line-height: 3rem;
  position: absolute;
  left: -1px;
  top: 0px;
  height: 3rem;
  width: 3rem;
  text-align: center;
}

.action-button.smallekes .custom-dropdown {
  width: 10rem;
}

.action-button.smallekes .custom-dropdown .dropdown-content {
  top: 24px;
}

.action-button.smallekes .custom-dropdown .input-dropdown {
  padding: 0 0 0 1rem;
  height: 1.7rem;
  line-height: 1.5rem;
}

.action-button.smallekes .custom-dropdown .input-dropdown:after {
  top: .2rem;
}

.action-button.smallekes .button {
  width: 10rem;
  min-height: unset;
  height: 1.7rem;
  padding: 0;
}

.input-with-button-container {
  border: 1px solid #BABABA;
  position: relative;
  float: unset !important;
}

.input-with-button-container input[type="date"]::-webkit-inner-spin-button,
.input-with-button-container input[type="date"]::-webkit-calendar-picker-indicator {
  display: none;
  -webkit-appearance: none;
}

.input-with-button-container input {
  border: 0;
  width: 100%;
  outline: none;
}

.input-with-button-container .action-container {
  height: 3rem;
  margin-right: 0;
  line-height: 3rem;
  position: absolute;
  top: 0;
  right: 0;
  text-align: center;
  white-space: nowrap;
}

.input-with-button-container .action-container .action-button {
  background-color: #FFF;
  color: #0064B4;
  height: 3rem;
  width: 3rem;
  margin-right: 0;
  line-height: 3rem;
  float: right;
}

.input-with-button-container .action-container .action-button:hover {
  background-color: #0064B4;
  color: #FFF;
}

input[type="checkbox"]:focus + label:before {
  box-shadow: 0 0 0 3px #bfd8ec !important;
}

.switch-checkbox:focus + .switch-label:before {
  box-shadow: 0 0 0 3px #bfd8ec !important;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
  background: rgba(0, 0, 0, 0.6);
  z-index: 9999;
  cursor: default;
}

.overlay .content {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  text-align: center;
}

.overlay .content .modal-icon {
  color: #aaaaaa;
}

.overlay .content .modal-icon:hover {
  color: #FFF;
}

.overlay .content .modal-icon-disabled {
  color: #aaaaaa;
}

.overlay .content .upper-buttons {
  height: 10vh;
}

.overlay .content .upper-buttons span {
  top: 2rem;
  right: 2rem;
  position: absolute;
}

.overlay .content .footer {
  height: 10vh;
  /*span {
                top: 2rem;
                right: 2rem;
                position: absolute;                  
            }*/
}

.overlay .content .side-button {
  height: 100vh;
  width: 10vw;
  position: absolute;
  top: 10vh;
}

.overlay .content .side-button:hover > .modal-icon {
  color: #FFF;
}

.overlay .content .side-button .nav-left, .overlay .content .side-button .nav-right {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
}

.overlay .content .side-button .nav-left {
  left: 15px;
}

.overlay .content .side-button .nav-right {
  right: 15px;
}

.overlay .content .left {
  left: 0;
}

.overlay .content .right {
  right: 0;
}

.overlay .content .media-container {
  height: 80vh;
  max-width: 80vw;
  margin: 0 auto;
}

.overlay .content .media-container > * {
  cursor: default;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.overlay .content .media-container img {
  height: 100vh;
  max-width: 80vw;
}

.pdf-content {
  position: absolute;
  top: 4rem;
  left: 50%;
  transform: translate(-50%, 0px);
  bottom: 0;
  overflow: auto;
  max-width: 100%;
}

.pdf-actions {
  position: absolute;
  left: 50%;
  bottom: 2rem;
  transform: translate(-50%, 0px);
  background-color: rgba(0, 0, 0, 0.3);
  padding-top: 0.8rem;
  padding-left: 0.8rem;
  display: block !important;
}

.pdf-actions .button {
  color: #FFF;
}

.fileblock .icon-container, .folderblock .icon-container {
  width: 10rem;
  height: 10rem;
  background-color: #FAFAFB;
  margin: 0 auto;
  margin-bottom: 1rem;
  position: relative;
  padding: 1rem;
  border: 1px solid transparent;
  /*input[type=checkbox] {
            
        }*/
}

.fileblock .icon-container:hover, .folderblock .icon-container:hover {
  border: 1px solid #989898;
}

.fileblock .icon-container img, .folderblock .icon-container img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.fileblock .icon-container .checkbox, .folderblock .icon-container .checkbox {
  top: 0.5rem;
  left: 0.75rem;
  position: absolute;
}

.fileblock .icon-container .action, .folderblock .icon-container .action {
  position: absolute;
  font-size: 100%;
  padding: 0.8rem;
  color: #a2a2a2;
}

.fileblock .icon-container .action:hover, .folderblock .icon-container .action:hover {
  color: #000;
}

.fileblock .icon-container .info, .folderblock .icon-container .info {
  top: 0;
  right: 0;
}

.fileblock .icon-container .tags, .folderblock .icon-container .tags {
  top: 0;
  right: 2rem;
}

.fileblock .icon-container .download, .folderblock .icon-container .download {
  bottom: 0;
  right: 0;
  font-size: 150%;
}

.fileblock .icon-container .icon-type, .folderblock .icon-container .icon-type {
  position: relative;
  float: left;
  width: 50%;
  height: 50%;
}

.ng-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  /*opacity: 0.85;*/
  z-index: 9999;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

.ng-gallery-content {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
  text-align: center;
}

.ng-gallery-content .loading {
  cursor: default;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.ng-gallery-content > a.nav-left, .ng-gallery-content > a.nav-right {
  z-index: 500;
  color: #aaa !important;
  text-decoration: none;
  font-size: 60px !important;
  cursor: pointer;
  outline: none;
}

.ng-gallery-content > a.nav-left .fa, .ng-gallery-content > a.nav-right .fa {
  font-size: 60px !important;
}

.ng-gallery-content > a.nav-left:hover, .ng-gallery-content > a.nav-right:hover {
  color: #fff !important;
}

.ng-gallery-content > a.nav-left {
  position: fixed;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.ng-gallery-content > a.nav-right {
  position: fixed;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.ng-gallery-content > .media-object {
  height: auto;
  max-height: calc(100% - 150px);
  max-width: calc(100% - 100px);
  position: relative;
  display: block;
  margin: 0 auto 0 auto;
  top: 50%;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

.ng-gallery-content > .media-object #video {
  margin: auto;
}

.ng-gallery-content pre {
  margin-bottom: 0;
}

.ng-gallery-content .text {
  text-align: left;
  overflow: auto;
  background-color: white;
}

.ng-gallery-content .unknown-filetype {
  display: table;
}

.ng-gallery-content.effect {
  animation: fadeIn 0.5s;
}

.ng-gallery-content > span.info-text {
  color: #fff;
  display: inline-block;
  width: 100%;
  height: 20px;
  font-weight: bold;
  text-align: center;
  position: fixed;
  left: 0;
  right: 0;
  font-size: large;
}

@media (max-width: 676px) {
  .ng-gallery-content > span.info-text {
    bottom: 4rem;
  }
}

@media (min-width: 676px) and (max-width: 752px) {
  .ng-gallery-content > span.info-text {
    padding-top: 52px;
  }
}

@media (min-width: 752px) and (max-width: 804px) {
  .ng-gallery-content > span.info-text {
    padding-top: 43px;
  }
}

@media (min-width: 804px) {
  .ng-gallery-content > span.info-text {
    bottom: 4rem;
  }
}

.ng-gallery-content > .ng-thumbnails-wrapper {
  width: 400px;
  height: 70px;
  text-align: center;
  position: fixed;
  bottom: 20px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  overflow-x: hidden;
}

.ng-gallery-content > .ng-thumbnails-wrapper > .ng-thumbnails {
  width: 4000px;
  height: 70px;
}

.ng-gallery-content > .ng-thumbnails-wrapper > .ng-thumbnails > div > img {
  width: auto;
  height: 70px;
  float: left;
  margin-right: 10px;
  cursor: pointer;
  opacity: 0.6;
}

.ng-gallery-content > .ng-thumbnails-wrapper > .ng-thumbnails > div > img:hover, .ng-gallery-content > .ng-thumbnails-wrapper > .ng-thumbnails > div > img.active {
  transition: opacity 0.25s ease;
  opacity: 1;
}

@keyframes fadeIn {
  from {
    opacity: 0.3;
  }
  to {
    opacity: 1;
  }
}

/* Loading - from http://loading.io */
uiload {
  display: inline-block;
  position: relative;
}

uiload > div {
  position: relative;
}

@-webkit-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-moz-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-ms-keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes uil-ring-anim {
  0% {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.uil-ring-css {
  background: none;
  position: relative;
  top: 0;
  margin: 180px auto 0 auto;
  width: 100px;
  height: 100px;
}

.uil-ring-css > div {
  position: absolute;
  display: block;
  width: 80px;
  height: 80px;
  top: 20px;
  left: 20px;
  border-radius: 40px;
  box-shadow: 0 6px 0 0 #fff;
  -ms-animation: uil-ring-anim 1s linear infinite;
  -moz-animation: uil-ring-anim 1s linear infinite;
  -webkit-animation: uil-ring-anim 1s linear infinite;
  -o-animation: uil-ring-anim 1s linear infinite;
  animation: uil-ring-anim 1s linear infinite;
}

.upperbuttons {
  z-index: 5000;
  position: fixed;
  top: 0;
  right: 0;
}

.upperbuttons a.close-popup {
  font-size: 42px;
  float: right;
  color: #aaa !important;
  text-decoration: none;
  margin: 0 30px 0 0;
  cursor: pointer;
  position: absolute;
  top: 20px;
  right: 0;
}

.upperbuttons a.close-popup:hover {
  color: #fff !important;
}

.upperbuttons a.external-url-image {
  font-size: 33px;
  float: right;
  color: #aaa !important;
  text-decoration: none;
  margin: 0 30px 0 0;
  cursor: pointer;
  position: absolute;
  top: 28px;
  right: 0px;
}

.upperbuttons a.external-url-image:hover {
  color: #fff !important;
}

.upperbuttons a.download-image {
  font-size: 33px;
  float: right;
  color: #aaa !important;
  text-decoration: none;
  margin: 0 30px 0 0;
  cursor: pointer;
  position: absolute;
  top: 28px;
  right: 0px;
}

.upperbuttons a.download-image:hover {
  color: #fff !important;
}

@media (min-width: 60em) {
  .wcm-container {
    max-width: 60rem;
  }
}

.wcm-container .button a {
  color: white;
  text-decoration: none;
}

.wcm-container .header-image {
  margin-bottom: 2rem;
}

.wcm-container .header-image img {
  width: 100%;
}

.wcm-container .page-content a {
  text-decoration: underline;
}

.wcm-container .page-content .file-link {
  text-decoration: none;
}

.wcm-container .page-content .button a {
  text-decoration: none;
}

#chatbutton {
  position: fixed;
  right: 0;
  bottom: 0;
  z-index: 50;
  text-align: right;
}

#chatbutton .button {
  margin: 0;
}

#chatbutton.is-bound {
  position: absolute;
}

#chatbutton.is-bound button {
  /*right: -1.5rem;
        bottom: -6rem;*/
}

.timeblocks .hour-column {
  height: 100%;
}

.timeblocks .hour-column .hour {
  height: 2rem;
  width: 1rem;
}

.timeblocks .spaces {
  display: inline-block;
  height: 100%;
}

.timeblocks .spaces .space {
  width: 13rem;
  float: left;
}

.timeblocks .spaces .space:last-child .timeblock {
  border-right: 1px solid #BABABA;
}

.timeblocks .spaces .space:last-child .timeblock-container {
  margin-right: 0px;
}

.timeblocks .spaces .space .title {
  font-weight: bold;
  color: #FFF;
  background-color: #0064b4;
  text-align: center;
  padding: 0.5rem;
}

.timeblocks .spaces .space .timeblock-container {
  margin-right: -1px;
}

.timeblocks .spaces .space .timeblock {
  padding: 0.5rem;
  cursor: pointer;
  font-size: 1rem;
  line-height: 1.3rem;
  border-left: 1px solid #BABABA;
  border-right: 1px solid #BABABA;
  position: relative;
}

.timeblocks .spaces .space .timeblock:last-of-type {
  border-bottom: 1px solid #BABABA;
}

.timeblocks .spaces .space .timeblock .checkbox {
  position: absolute;
  width: 0.5rem;
}

.timeblocks .spaces .space .timeblock .checkbox .fa {
  font-size: 1.2rem;
}

.timeblocks .spaces .space .timeblock .content {
  margin-left: 1.5rem;
}

.timeblocks .spaces .space .timeblock:hover {
  background-color: #f9f9f9;
}

.timeblocks .spaces .space .timeblock.selected {
  font-weight: bold;
}

.timeblocks .spaces .space .timeblock.disabled {
  color: #d1d1d1;
  cursor: default;
}

.timeblocks .spaces .space .timeblock.disabled:hover {
  background-color: initial;
}

.timeblocks .spaces .space .timeblock .left-banner {
  position: absolute;
  width: 0.4rem;
  height: 100%;
  left: 0;
  top: 0;
}

.timeblocks .spaces .space .message {
  font-size: 0.9rem;
}

.room-container {
  text-align: center;
}

.room-container .room {
  margin-right: 5rem;
  width: 10rem;
  display: inline-block;
}

.room-container .room .icon-div {
  margin-bottom: 1rem;
  color: #b0d3fd;
}

.room-container .room .icon-div .fa {
  font-size: 6rem;
}

.room-container .room .button-div {
  white-space: nowrap;
}

.room-container .room .button-div a {
  width: 100%;
  margin: 0;
}

/*@import "fontawesome/fontawesome.scss";
@import "fontawesome/solid.scss";
@import "fontawesome/regular.scss";
@import "fontawesome/brands.scss";*/
.skeleton {
  display: flex;
  flex-direction: row;
}

.app {
  display: flex;
  display: -moz-webkit-flex;
  display: -webkit-flex;
  display: -ms-flexbox;
  flex: auto;
  -ms-flex: auto;
  flex-direction: column;
  -ms-flex-direction: column;
  min-height: 100vh;
}

.app .popout-panel {
  background: #fff;
  border-left: 1px solid #BABABA;
  width: 100%;
  position: absolute;
  right: 0;
  top: 3rem;
  text-align: center;
  z-index: 50;
}

@media (min-width: 40em) {
  .app .popout-panel {
    min-width: 22.5rem;
    width: auto;
  }
}

.app .popout-panel header, .app .popout-panel footer, .app .popout-panel .content {
  padding: .75rem;
}

.app .popout-panel footer {
  background: #282020;
  color: #fff;
}

.app .popout-panel footer [class*="button"] {
  margin-bottom: 0;
}

.app .popout-panel .popout-panel-inner {
  z-index: 60;
  position: relative;
}

.app .popout-panel .badge {
  position: relative;
  bottom: auto;
  left: auto;
  top: auto;
  float: right;
}

.app .popout-panel .content {
  text-align: left;
  display: inline-grid;
}

.app .popout-panel:before {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  left: -12px;
  box-sizing: initial;
  z-index: 50;
  border-bottom: 12px solid rgba(0, 0, 0, 0.1);
  border-left: 12px solid rgba(0, 0, 0, 0.1);
}

.app .popout-panel-profile .content {
  padding-bottom: 1.5rem;
}

.app .popout-panel-profile .profile-name {
  font-size: 1.44rem;
  line-height: .97222em;
  font-weight: 700;
  font-family: "Antwerpen", "SunRegular", "Helvetica Neue", Helvetica, Arial, Georgia, Sans-serif;
}

@media (min-width: 40em) {
  .app .popout-panel-login {
    min-width: 1rem;
    width: auto;
  }
}

.app .popout-panel-login button {
  margin-bottom: 0.3rem !important;
}

.app .popout-panel-login a {
  font-weight: bold;
}

.app .avatar {
  width: 3rem;
  height: 3rem;
  display: inline-block;
  overflow: hidden;
  /*position: relative;*/
  z-index: 1;
}

.app .avatar img {
  transform-origin: center center;
  transition-property: all;
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
  display: block;
  width: 100%;
  max-height: 100%;
}

.app .avatar img:not(.pointer) {
  cursor: default;
}

.app .avatar:hover img,
.app .avatar a:focus img {
  transform: scale(1.3);
}

.app .small.avatar {
  width: 2.25rem;
  height: 2.25rem;
}

.app .medium.avatar {
  width: 4.5rem;
  height: 4.5rem;
}

.app .large.avatar {
  width: 6rem;
  height: 6rem;
}

.app .xlarge.avatar {
  width: 7.5rem;
  height: 7.5rem;
}

body {
  /*padding-top: 3rem;*/
}

@media (min-width: 60em) {
  body {
    padding-bottom: 25rem;
    position: relative;
    min-height: 100%;
    /*height: auto;*/
  }
}

@media (min-width: 40em) {
  main {
    /*display:-ms-flexbox;
      flex: auto;
      -ms-flex: auto;
          
      flex-direction: column;
      -ms-flex-direction: column;*/
  }
}

main .background-grey {
  background-color: #E5E5E6;
}

main .inner-container {
  margin-left: 0;
}

main .inner, main .inner-full-width-when-mobile {
  margin: 0 auto;
  padding-left: 0;
}

@media (min-width: 40em) {
  main .inner, main .inner-full-width-when-mobile {
    max-width: 60em;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (min-width: 60em) {
  main .inner, main .inner-full-width-when-mobile {
    max-width: 80em;
  }
}

main .inner .section-left, main .inner-full-width-when-mobile .section-left {
  float: left;
  border-right: 3px solid #eeeeee;
  /*&:hover{
                  border-right:3px solid $blue;
              }*/
}

@media (max-width: 40em) {
  main .inner .section-left, main .inner-full-width-when-mobile .section-left {
    width: 90vw !important;
    border-right: 0px;
  }
  main .inner .section-left .rg-right, main .inner-full-width-when-mobile .section-left .rg-right {
    display: none;
  }
}

@media (min-width: 40em) {
  main .inner .section-left, main .inner-full-width-when-mobile .section-left {
    width: 50%;
    float: left;
    max-width: 55vw;
    min-width: 15vw;
  }
}

main .inner .section-right, main .inner-full-width-when-mobile .section-right {
  display: flex;
  width: 100%;
  padding-left: 0;
}

@media (min-width: 40em) {
  main .inner .section-right, main .inner-full-width-when-mobile .section-right {
    padding-left: 30px;
    width: auto;
  }
}

main .inner .section-wrapper, main .inner-full-width-when-mobile .section-wrapper {
  /*height: -moz-calc(100% - 80px);
              height: -webkit-calc(100% - 80px);
              height: calc(100% - 80px);*/
  min-width: 100px;
  width: auto !important;
  width: 100px;
}

main .inner .section-wrapper .rg-right, main .inner-full-width-when-mobile .section-wrapper .rg-right {
  width: 20px;
}

main .inner .section-wrapper .rg-right span, main .inner-full-width-when-mobile .section-wrapper .rg-right span {
  margin: -20px 0px 0px -0.5px;
}

main .inner .section-wrapper .rg-right:hover, main .inner-full-width-when-mobile .section-wrapper .rg-right:hover {
  background-color: #eeeeee;
}

main .inner .section-wrapper .rg-right:active, main .inner-full-width-when-mobile .section-wrapper .rg-right:active {
  background-color: #bababa;
}

main .inner-full-width-when-mobile {
  width: 100%;
}

@media (min-width: 40em) {
  main .inner-full-width-when-mobile {
    width: calc(100% - 1.5rem*2);
  }
}

main .inner-with-logo-margin {
  margin-left: 0;
}

@media (min-width: 40em) {
  main .inner-with-logo-margin {
    padding-left: 11rem;
  }
}

@media (min-width: 60em) {
  main .inner-with-logo-margin {
    padding-left: 13rem;
  }
}

.browsehappy {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

@media (min-width: 40em) {
  .hide-on-tablet {
    display: none;
  }
}

.hideonmobile {
  display: none;
}

@media (min-width: 40em) {
  .hideonmobile {
    display: block;
  }
}

@media (min-width: 40em) {
  .show-only-on-mobile {
    display: none;
  }
}

.show-only-on-desktop {
  display: none;
}

@media (min-width: 60em) {
  .show-only-on-desktop {
    display: inherit;
  }
}

/* Do not remove the comments below. It's the markers used by gulp-inject to inject
   all your sass files automatically */

/*# sourceMappingURL=index.css.map */