/*! HTML5 Boilerplate v8.0.0 | MIT License | https://html5boilerplate.com/ */

/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * 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 {
  color: #222;
  font-size: 1em;
  line-height: 1.4;
}



/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
  background: #000;
  text-shadow: none;
  color:#fff;
}

::selection {
  background: #000;
  text-shadow: none;
  color:#fff;
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 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;
}

video {
  width: 100%;
  cursor: wait;
}

/*
 * Remove default fieldset styles.
 */

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

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

textarea {
  resize: vertical;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
* {box-sizing: border-box;}

.row {--bs-gutter-x: 0.65rem;
  --bs-gutter-y: 0;}

body {font-family: 'Open Sans', sans-serif;
  background:#F7F8FA;
  font-size:14px;
  overflow-y:scroll;}

  /* Hide scrollbar for Chrome, Safari and Opera */
  body::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
body {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}


#wrapper {max-width:1366px;
  margin:auto;}  
 
::placeholder {
    color: #ccc;
}

#startlogo {max-width:150px;
  margin-top:0.4em;}

a {color:#fcb117;
  text-decoration: none;}

a:hover {color:#333;}

.wrapper {padding-left: 1em;
  padding-right: 1em;} 

.btn-primary {background:#fcb117;
    border:none;
    font-size:1em;}

.btn-primary:hover {background:#333;
    border:none;
    outline:none;}

.btn-check:focus + .btn-primary,
.btn-primary:focus,
.btn-check:checked + .btn-primary:focus,
.btn-check:active + .btn-primary:focus,
.btn-primary:active:focus,
.btn-primary.active:focus,
.show > .btn-primary.dropdown-toggle:focus {
      background-color: #333;
      box-shadow: none;
  }

.btn-secondary {background:#333;
      border:none;
      font-size:1em;}
  
.btn-secondary:hover {background:#fcb117;
      border:none;
      outline:none;}

.btn-check:focus + .btn-secondary, 
.btn-secondary:focus, 
.btn-check:checked + .btn-secondary:focus,
.btn-check:active + .btn-secondary:focus,
.btn-secondary:active:focus,
.btn-secondary.active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
        background-color: #fcb117;
        box-shadow: none;
    }  

.flex {display:flex;}
.flex > * {width:100%;}

.flex-3 > div {width:33%;}

.unwrap {flex-wrap:wrap;}

.strong {font-weight: bold;}


.imgContainer {height:200px;
    overflow: hidden;}

.imgContainer img, .pictureset img {
      object-fit: cover;
      width: 100%;
      height: 100%;
  }

 .formfield {
      width: 100%;
  }
  

/* Login-Bereich ================================================*/
#login {
  width: 100%;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}
#login > div {
  background:url(/img/polygon_hintergrund.jpg);
  display: block;
  background-position: top center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 100%;
  position: absolute;
}

#loginintro {
  height: 100vh;
  overflow: hidden;
}
#loginintro > div {
-webkit-box-shadow: 0 7px 14px 0 rgba(65,69,88,.08), 0 3px 6px 0 rgba(0,0,0,.04);
  box-shadow: 0 7px 14px 0 rgba(65,69,88,.08), 0 3px 6px 0 rgba(0,0,0,.04);
  position: relative;
  width: 400px;
  background: #fff;
  padding: 3.5em;
  margin: calc(50vh - 250px) auto;}

#loginintro svg {width:100%;
  max-width: 200px;
  display: block;
  margin: 0 auto;
}
#loginintro .btn {
font-size:13px;
display:block;
width: 100%;
}
#loginintro .formfield {
  position: relative;
  margin-top:1em;
}
#loginintro .input-icon {
  position: absolute;
  left: 0.4em;
  top: 0.5em;
  color: #ddd;
  font-size: 1.2em;
}

#loginintro .formfield label {
  padding-bottom: 0.5em;
}

#loginintro .btn-ohne {margin-top:0.5em;}
#loginintro .btn-ohne:hover {color:#fcb117;}

#loginintro #passwort, #loginintro #passwort2 {padding-left:0.5em!important;}

#loginintro .checkbox input {margin-right:0.5em;
display:inline-block;
width: 20px;}

.sublogo {text-align: center;
  color:#fcb117;
  font-size:1.5em;
  text-transform: uppercase;
  margin-top:0.85rem;
  margin-bottom:1.5rem;}



/* ===============================================
Header  ======================================= */
header {background:#fff;
  position: fixed;
  top:0;
 /*left:calc(50% - 1366px / 2);
  max-width:1366px;*/
  left:calc(50% - 1366px / 2);
  max-width:1366px;
  z-index:100;
  width:100%;
}

header.hasScrolled {	-webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.1);
  -moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.1);
       box-shadow: 0 8px 6px -6px rgba(0,0,0,0.1);}

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

header li {display: block;
  margin:0 0.5em;
}

header .navbar-nav {padding-left:1.25em;
  padding-right:1.25em;
  }

.nav-link i {margin-right:0.5em;
color:#fcb117;}

.navbar-light .navbar-nav .nav-link {
  color: #fff;
  font-size:1.3em;
}

#einlog {list-style: none;
  padding:0;
  margin:0;}

  #einlog a {padding:0;
  margin:0;}

  #navbartoggle {display:flex;
    align-items:center;
    cursor:pointer;
    justify-content: flex-end;
    }
    
  #navbartoggle i {margin-right:0.5em;
    font-size:1.5em;}
  
  .navbar-nav {position:fixed;
    overflow:hidden;
    top:0;
    left:0;
    display:block;
    background:rgba(0,0,0,0.85);
    color:#fff;
    width:100%;
    height:100vh;
    pointer-events: none;
    opacity: 0;
    transition:all 1s ease-in-out;
      }

      .navbar-nav ul {height:calc(100vh - 80px);
      overflow-y:scroll;}

/* Hide scrollbar for Chrome, Safari and Opera */
.navbar-nav ul::-webkit-scrollbar {
  display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.navbar-nav ul {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

     

      .navbar-nav.togglenav {
        pointer-events:unset;
        opacity:1;}

        #closenav {font-size:1.5em;
        text-align: right;
      width:100%;
      padding:1em;
      display:block;}

      #navbartoggle:hover, .navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus, #closenav:hover {color:#fcb117;}

      header .navbar-brand {padding:0;
        position:relative;
        display:flex;
        align-items:center;}

      .sublogotitle {color:#bbb;
        line-height: 1.35;
        font-size:0.7em;
          margin:0 0 0 1em;
        padding:0 0 0 1em;
        border-left:1px solid #ddd;
        text-transform:uppercase;
        letter-spacing: 0.02em;}

        #accountName {text-align: right;}

        .deletebtn {position:absolute;
        right:1em;
        top:-0.75em;
        font-size:1.25em;
        background:#fff;
        border:none;
        padding:0 0.5em;
        cursor: pointer;
        }

        .deletebtn :hover {color:#fcb117;}




/* ===============================================
Laptop  ================================== */

.laptop {position:absolute!important;
  width:150%;
  top:-5em;
  left:-5em;}

  .laptopbild {
    position: absolute;
    top: 6.3em;
    left: 11.7em;
    height: 425px;
    width:590px;
    overflow: hidden;
}

.laptopbild > img {object-fit: cover;
  height:100%;}

  .contElementLaptop {position:relative;
    min-height:550px;
}

.contElement:nth-child(odd) .laptopbild {
  position: absolute;
  top: 6.3em;
  right: 11.7em;
  left:unset;
  height: 425px;
}

.contElement:nth-child(odd) .laptop {position:absolute!important;
  width:150%;
  top:-5em;
  right:-5em;
  left:unset;}

/* ===============================================
Mainbereich  ================================== */
main {height:100%;  
  background:#F7F8FA;
  min-height: 100vh;}

  .white {background:#fff;}

section {
padding:6em 4em 4em 4em;
height:100%;} 

.folien {width:100%;
  height:100vh;}

h1 {font-size:1.2em;
  text-transform: uppercase;
  margin-bottom:1em;
width:100%;}  

h2 {font-size:1.2em;
    text-transform: uppercase;
    margin:0;}   

h3 {color:#fcb117;
    font-size:1.1em;}  

img {width:100%;
display:block;} 

.contElementIMG img {
  max-width: max-content;
  margin: auto;}

.card {
  background: none;
  border: none;
  margin-bottom:1em;
  padding-left: var(--bs-gutter-x);
  padding-right: var(--bs-gutter-x);
}

.card-body {
  background: #fff;
  overflow:hidden;
  border-radius: 0.5rem;
  border:1px solid rgba(0,0,0,0.075);
  position: relative;
  -webkit-box-shadow: 0 0.8px 0.5px rgb(0 0 0 / 0%), 0 1.4px 1px rgb(0 0 0 / 0%), 0 2.1px 1.7px rgb(0 0 0 / 0%), 0 2.6px 2.5px rgb(0 0 0 / 0%), 0 3.2px 3.6px rgb(0 0 0 / 0%), 0 3.8px 5.1px rgb(0 0 0 / 0%), 0 4.4px 7.3px rgb(0 0 0 / 0%), 0 5.3px 10.6px rgb(0 0 0 / 1%), 0 6.5px 16.3px rgb(0 0 0 / 1%), 0 10px 29px rgb(0 0 0 / 1%);
  box-shadow: 0 0.8px 0.5px rgb(0 0 0 / 0%), 0 1.4px 1px rgb(0 0 0 / 0%), 0 2.1px 1.7px rgb(0 0 0 / 0%), 0 2.6px 2.5px rgb(0 0 0 / 0%), 0 3.2px 3.6px rgb(0 0 0 / 0%), 0 3.8px 5.1px rgb(0 0 0 / 0%), 0 4.4px 7.3px rgb(0 0 0 / 0%), 0 5.3px 10.6px rgb(0 0 0 / 1%), 0 6.5px 16.3px rgb(0 0 0 / 1%), 0 10px 29px rgb(0 0 0 / 1%);
}

.card-title {font-size:1.15em;
  margin-bottom:0.15em;
  color:#fcb117;}

.card-icon {position:absolute;
font-size:2em;
right:0.5em;
bottom:0.25em;
margin:0;
opacity:0.1;}  


label {margin-top:0.85em;
  margin-bottom:0.35em;
  font-size:0.85em;}

.form-control {
  border-color: #efefef;
}  

.form-control:focus {outline:none;
  box-shadow:none;
  border-color: #efefef;
  border-bottom-color: #fcb117;
}

button.navbar-toggler {
  border: none;
  padding:0;
}

.navbar-toggler-icon {  display: flex;
  justify-content: center;
  align-items: center;}

.navbar-light .navbar-toggler-icon {
  background:none;
}


.cardbild {padding:0;}  

.modulhead {color:#ccc;
  font-size:0.8em;
  margin-bottom:0.75em;
  display:flex;
}

.modulhead > * {width:100%}

.modulhead > .modulicon {width:10px;
  text-align: right;}

  .col-3 > a, .col-3 > a > .card, .col-3 > a {
    display: block;
    height: 100%;
}

.col-3 > a > .card > .card-body {
  height: calc(100% - 1.5em);
}

.cardbild .modulcard {
  padding: 1rem 1rem;}  

.modulbranche {color:#fcb117;
font-size:0.9em;
padding:0;
margin:0;}  

.modultitle {font-weight:600;
font-size:1.2em;
padding:0;
  margin:0;
color:#000;}

  .onlylink:hover {text-decoration: none;}

  a:hover .card-body {-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2); 
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);}

/* Klickstrecke individuell  ================================== */
    #specialForm  {width:calc(100% - 0.6em * 2);
      display:flex;
      align-items: center;
      justify-content: space-between;
    margin:0 0.6em 0.5em;
  padding:0 0 1em;}

    #specialForm input {width:100%;
      border-radius:10px;
      border:none;
      background:rgba(0,0,0,0.03);
    padding:0.5em 1em;
  margin-right:0.5em;}

    #specialForm input:focus {outline:none;}

    #specialForm .nice-select {border:none;
      min-width:250px;}

      #specialForm .btn {font-size:12px;
        cursor: pointer;
        background:none;
        color:#333;}

        #specialForm .btn:hover {
          color:#fcb117;}

          .subheader {width:100%;
          text-transform: none;
        border-bottom:1px solid #fcb117;
      padding-bottom:0.5em;
      margin-bottom:1em;}

      #filterBox {width:100%;}

      .leadbox {display:flex;
        flex-wrap:wrap;
        margin-top:1em;
        margin-bottom:3em;}

        .infofilter i {margin-right:0.35em;
          color:#fcb117;}

          .keine {text-align:center;
          padding:30vh 2em}

          .keine i {display:block;
          font-size:4em;
          margin-bottom:0.25em;
        color:#fcb117;}

        .keine span {color:#fcb117;
        font-weight:bold;
        font-size:1.4em;
      display:block;}

      .ergebnis {font-size:0.75em;
      }

/* Index-Seite  ================================== */
#startBox {display:flex;
  width:100%;}

#startBox > div {width:100%;}
/*
#startBox > div:last-child {width:350px;
  border-left:1px solid rgba(0,0,0,0.1);
  padding-left:3em;}

#startBox > div:first-child {display:flex;
    flex-wrap:wrap;
    padding-right:2.5em;}

#startBox > div:first-child > div {width:50%;
  margin-bottom: 0.75em;
}*/

#startBox > div {display:flex;
  flex-wrap:wrap;}

#startBox > div > div {width:33%;
  margin-bottom: 1.5em;
}

#startBox > div .card {height:100%;
  margin:0;}

.start {padding: 0 0.6em;
display:flex;
width:100%;
justify-content:space-between;
align-items:center;
border-bottom:1px solid rgba(0,0,0,0.1);
padding-bottom:0.75em;
margin-bottom:2.25em;}

.start > h1 {width:100%;
margin:0;}

.start > ul {width:150px;}


/* Footer  ================================== */
footer {background:#fff;
  padding:0 4em 2em;
margin-top:-2em;}

footer > div {border-top:1px solid rgba(0,0,0,0.1);
  padding-top:2em;
  display:flex;
  justify-content:flex-end;}

  footer > div > div {margin-right:2.5em;}

  footer > div > div p {margin:0;
  padding:0;}

/* Folien-Seiten  ================================== */
#goback {padding:5.7em 3.5em 1em;
background:#fff;}

#goback > div {
  border-bottom:1px solid #efefef;
  padding-bottom:0.35em;
display:flex;
justify-content: space-between;
align-items:center;
}

#goback p {padding:0;
  margin:0;
width:150px;
color:#fcb117;}

  #goback h1 {font-size:1em;
    color:#fcb117;
  text-align: center;
  padding:0;
  margin:0;}

#goback a:hover {text-decoration: none;}

.nextbtn {text-align: right;}

.folien {padding:0;
  position: relative;
  height: 100%;
background:#fff;}

  .contElement {display:flex;
    position: relative;
    overflow: hidden;
    height:100%;
    padding:3em 1em;
  }

  .contElement  > * {
    width: 50%;
    padding:0 2em;
}

.contElement:nth-child(even) {padding-bottom:1em;}

  .contElementIMG {margin-top:-2em;}

  .contElement:nth-child(odd) {flex-direction: row-reverse;
    background: rgb(252,177,23);
    background: -moz-linear-gradient(90deg, rgba(252,177,23,1) 0%, rgba(252,146,23,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(252,177,23,1) 0%, rgba(252,146,23,1) 100%);
    background: linear-gradient(90deg, rgba(252,177,23,1) 0%, rgba(252,146,23,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fcb117",endColorstr="#fc9217",GradientType=1);
    color:#fff;
    padding-top:4.5em;
    padding-bottom:4.5em;}

    .contElement.template2 {flex-direction:row!important;}

    .contElement.template2:nth-child(odd) .contElementText {padding-top:6em;}

  .contElementText {position:relative;
    font-size:1.4em;
    font-weight:300;
  padding-top:1em;
  padding-bottom:2.5em;}

  .contElementText h2 {color:#fcb117;
    margin-bottom:0.5em;}

    .contElement:nth-child(odd) .contElementText h2 {color:#fff;}

    .contElement:nth-child(odd) .contElementText a {color:#000;}

    .contElementIcon {position:absolute!important;
      cursor:pointer;
      bottom:0;
      left:calc(50% - 0.5em)}

      .contElement:last-child .contElementIcon {display:none;}

    
    .contElement:nth-child(odd):before {
      content: "";
      width: 0;
      height: 0;
      border-left: 0 solid transparent;
      border-right: 100vw solid transparent;
      border-top: 5vw solid#fff;
      position: absolute;
      top: 0;
      left: 0;
  }

  .contElement:nth-child(odd):after {
    content: "";
    width: 0;
    height: 0;
    border-left: 100vw solid transparent;
    border-right: 0 solid transparent;
    border-bottom: 5vw solid#fff;
    position: absolute;
    bottom: 0;
    left: 0;
}

  .contElementText > *, .contElementIMG > * {position:relative;
    z-index:1;}

    .contElementText p + ul {margin-top:1em;}

    .contElementText ul {list-style: none;}

    .contElementText li {margin:0.5em 0;}

    .contElementText li:before {content:"";
      width:15px;
      height:15px;
      background:#fcb117;
      margin-left:-1.5em;
      margin-right:0.8em;
      display:inline-block;
    }

    .contElement:nth-child(odd) li:before {background:#fff;}

    img.subicon {max-height:70px;
      width:auto;
      margin-top:2.5em;
    object-fit: unset;
    height: auto;
    display:block;}

        .textbox, .textbox li {visibility: visible!important;
          text-align:left;}
  
#verweise {height:200px;}

._se_bookmark_button {
  display: none;
}
.clickDown {cursor:pointer;}

.clickDown:hover {color:#000;}

.clickDown i {margin-right:0.35em;}

.clickText {display:none;}

.sun-editor + .sun-editor {display:none!important;}


/* Media Queries  ================================== */
@media all and (min-width:1367px) {
body {/*background:url(../img/polygon_hintergrund.jpg);*/
  background:#F7F8FA;
background-attachment: fixed;
background-position: center;
background-size:cover;}

#wrapper {-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.05); 
    box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.05);
}
}

.addListe {background:#333;
  color:#fff;
  display:inline-block;
  padding:0.5em 0.75em;
}

.formliste input {margin-bottom:0.75em;}




/* Media Queries  ================================== */
@media all and (max-width:1366px) {
header {left:0;}

.contElement:nth-child(even) .contElementText:after {
  border-left-width: 10vw;
  border-right-width: 10vw;
  left: calc(40% - 10vw);
}

.contElement:nth-child(odd) .contElementText:after {
  border-left-width: 10vw;
  border-right-width: 10vw;
  left: calc(60% - 10vw);
}


.contElement:nth-child(even) .contElementText:before {
border-left-width:10vw;
border-right-width: 10vw;
left: calc(40% - 10vw);
}

.contElement:nth-child(odd) .contElementText:before {
border-left-width: 10vw;
border-right-width: 10vw;
left: calc(60% - 10vw);
}

.laptop {
  left:-2vw;}

  .laptopbild {
    position: absolute;
    top: 6.3vw;
    left: 11.7vw;
    height: 31vw;
    width:41vw;
}

.laptopbild > img {height:100%;}

.contElementLaptop {position:relative;
    min-height:50vw;
}

.contElement:nth-child(odd) .laptopbild {
  position: absolute;
  top: 6.3vw;
  right: 11.7vw;
  left:unset;
  height: 31vw;
}

.contElement:nth-child(odd) .laptop {
  right:-2vw;
  left:unset;}




}
/* Media Queries  ================================== */
@media all and (max-width:1200px) {
  .contElementText {
    font-size: 1.2em;
}  

#startBox > div:first-child > div {
  width: 100%;
}
}
/* Media Queries  ================================== */
@media all and (max-width:991px) {
  section {
    padding: 6em 2em 2em 2em;
}

#wrapper .navbar-toggler {
    display:none;
}  

#wrapper .navbar-collapse {display:block;}

#wrapper .navbar > .container, .navbar > .container-fluid {flex-wrap:nowrap;}

}
/* Media Queries  ================================== */
@media all and (max-width:870px) {
  .contElement {flex-wrap:wrap;}

  .contElement > div {width:100%!important}

  .contElementText {position:relative;}

  .contElement:nth-child(even) .contElementText:after,
  .contElement:nth-child(odd) .contElementText:after,
  .contElement:nth-child(even) .contElementText:before,
.contElement:nth-child(odd) .contElementText:before {
  display: none;
}

.contElement:nth-child(odd) {
  flex-direction: row;
}

.contElementIMG {
  margin-top: 0;
}

.contElementIcon {display:none;}


#goback h1 {display:none;}

.contElement .contElementText, .contElement .contElementBild {
  padding: 1em!important;
}

.laptop,
.contElement:nth-child(odd) .laptop {  width:100%;
  top:0!important;
  left:0!important;}

  .laptopbild,
  .contElement:nth-child(odd) .laptopbild {
    top: 8vw!important;
    left: 15.5vw!important;
    height: 41vw;
    width:65.25vw;
    overflow: hidden;
}

.contElementLaptop {
    min-height:60vw;
}
}

/* Media Queries  ================================== */
@media all and (max-width:700px) {
  #startBox {
    flex-wrap:wrap;
  }
  
  #startBox > div:first-child {
    padding-right: 0;
  }
  
  #startBox > div:last-child {
    padding-left: 0;
    border:none;
    margin-top:2em;
  }
}


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

/*
 * Hide visually and from screen readers
 */

.hidden,
[hidden] {
  display: none !important;
}

/*
 * Hide only visually, but have it available for screen readers:
 * https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 *
 * 1. For long content, line feeds are not interpreted as spaces and small width
 *    causes content to wrap 1 word per line:
 *    https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
 */

.sr-only {
  border: 0;
  clip: rect(0, 0, 0, 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
  /* 1 */
}

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

.sr-only.focusable:active,
.sr-only.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: inherit;
  width: auto;
}

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

.invisible {
  visibility: hidden;
}

/*
 * 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: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}

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

@media only screen and (min-width: 35em) {
  /* Style adjustments for viewports that meet the condition */
}

@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:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
  *,
  *::before,
  *::after {
    background: #fff !important;
    color: #000 !important;
    /* Black prints faster */
    box-shadow: none !important;
    text-shadow: none !important;
  }

  a,
  a:visited {
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
  }

  abbr[title]::after {
    content: " (" attr(title) ")";
  }

  /*
   * Don't show links that are fragment identifiers,
   * or use the `javascript:` pseudo protocol
   */
  a[href^="#"]::after,
  a[href^="javascript:"]::after {
    content: "";
  }

  pre {
    white-space: pre-wrap !important;
  }

  pre,
  blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
  }

  /*
   * Printing Tables:
   * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
   */
  thead {
    display: table-header-group;
  }

  tr,
  img {
    page-break-inside: avoid;
  }

  p,
  h2,
  h3 {
    orphans: 3;
    widows: 3;
  }

  h2,
  h3 {
    page-break-after: avoid;
  }
}