/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
  color: #fff;
}

/* Custom default button */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none; /* Prevent inheritance from `body` */
  background-color: #fff;
  border: .05rem solid #fff;
}


/*
 * Base structure
 */

html,
body {
  height: 100%;

  background-image: url('../images/cover.jpg');
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #f7f7ff;
  /*background-position: left 0px top -100px;*/
}

body {
 /* box-shadow: inset 0 0 5rem rgba(0, 0, 0, .7);*/
  /*overflow: hidden;*/
}


.cover-image {
    background-image: url('../images/cover2.png');
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    overflow: hidden;
}

.smoke-1 {
  background-image: url('../images/smoke-2.png');
  background-repeat: no-repeat;
  background-size: contain;
  height:  165px;
 /* animation: smokeL 5s 0s infinite;*/
  overflow: hidden;
  position: absolute;
  width: 239px;
  top: 29vw;
    right: 10vw;
}

.smoke-2 {
  background-image: url('../images/smoke-2.png');
  background-repeat: no-repeat;
  background-size: contain;
  height:  165px;
  position: absolute;
  z-index: 997;
  top: 29vw;
    right: 10vw;
  width:239px;
/*  animation: smokeR 5s 1s infinite;*/
  overflow: hidden;
}

.smoke-3 {
  background-image: url('../images/smoke-2.png');
  background-repeat: no-repeat;
  background-size: contain;
  height:  165px;
  position: absolute;
  z-index: 998;
  top: 29vw;
    right: 10vw;
  width:239px;
/*  animation: smokeL 5s 2s infinite;*/
  overflow: hidden;
}

.smoke-4 {
  background-image: url('../images/smoke-2.png');
  background-repeat: no-repeat;
  background-size: contain;
  height:  165px;
  position: absolute;
  z-index: 999;
  top: 29vw;
    right: 10vw;
  width:239px;
/*  animation: smokeR 5s 3s infinite;*/
  overflow: hidden;
}

.smoke-5 {
  background-image: url('../images/smoke-2.png');
  background-repeat: no-repeat;
  background-size: contain;
  height:  165px;
  position: absolute;
  z-index: 1000;
  top: 29vw;
    right: 10vw;
  width:239px;
 /* animation: smokeL 5s 4s infinite;*/
  overflow: hidden; 
}

.suchen {
  background-image: url('../images/suchen.png');
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  position: absolute;
  z-index: 1000;
  top: 0;
  width:100%;

  animation: animationFrames linear 0.8s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 0.8s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: animationFrames linear 0.8s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: animationFrames linear 0.8s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: animationFrames linear 0.8s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes animationFrames{
  0% {
    transform:  translate(0px,0px)  ;
  }
  15% {
    transform:  translate(0px,-25px)  ;
  }
  30% {
    transform:  translate(0px,0px)  ;
  }
  45% {
    transform:  translate(0px,-15px)  ;
  }
  60% {
    transform:  translate(0px,0px)  ;
  }
  75% {
    transform:  translate(0px,-5px)  ;
  }
  100% {
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    -moz-transform:  translate(0px,0px)  ;
  }
  15% {
    -moz-transform:  translate(0px,-25px)  ;
  }
  30% {
    -moz-transform:  translate(0px,0px)  ;
  }
  45% {
    -moz-transform:  translate(0px,-15px)  ;
  }
  60% {
    -moz-transform:  translate(0px,0px)  ;
  }
  75% {
    -moz-transform:  translate(0px,-5px)  ;
  }
  100% {
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  15% {
    -webkit-transform:  translate(0px,-25px)  ;
  }
  30% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  45% {
    -webkit-transform:  translate(0px,-15px)  ;
  }
  60% {
    -webkit-transform:  translate(0px,0px)  ;
  }
  75% {
    -webkit-transform:  translate(0px,-5px)  ;
  }
  100% {
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes animationFrames {
  0% {
    -o-transform:  translate(0px,0px)  ;
  }
  15% {
    -o-transform:  translate(0px,-25px)  ;
  }
  30% {
    -o-transform:  translate(0px,0px)  ;
  }
  45% {
    -o-transform:  translate(0px,-15px)  ;
  }
  60% {
    -o-transform:  translate(0px,0px)  ;
  }
  75% {
    -o-transform:  translate(0px,-5px)  ;
  }
  100% {
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    -ms-transform:  translate(0px,0px)  ;
  }
  15% {
    -ms-transform:  translate(0px,-25px)  ;
  }
  30% {
    -ms-transform:  translate(0px,0px)  ;
  }
  45% {
    -ms-transform:  translate(0px,-15px)  ;
  }
  60% {
    -ms-transform:  translate(0px,0px)  ;
  }
  75% {
    -ms-transform:  translate(0px,-5px)  ;
  }
  100% {
    -ms-transform:  translate(0px,0px)  ;
  }
}

.finden {
  background-image: url('../images/finden.png');
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  position: absolute;
  z-index: 1000;
  top: 0;
  width:100%;

  animation: animationFrames linear 0.8s;
  animation-iteration-count: 1;
  animation-delay: 1s;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 0.8s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-delay: 1s;
  -moz-animation: animationFrames linear 0.8s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -moz-animation-delay: 1s;
  -o-animation: animationFrames linear 0.8s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -o-animation-delay: 1s;
  -ms-animation: animationFrames linear 0.8s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
  -ms-animation-delay: 1s;
}

.staunen {
  background-image: url('../images/staunen.png');
  background-repeat: no-repeat;
  background-size: contain;
  height: 100%;
  position: absolute;
  z-index: 1000;
  top: 0;
  width:100%;

  animation: animationFrames linear 0.8s;
  animation-iteration-count: 1;
  animation-delay: 2s;
  transform-origin: 50% 50%;
  -webkit-animation: animationFrames linear 0.8s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-delay: 2s;
  -moz-animation: animationFrames linear 0.8s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -moz-animation-delay: 2s;
  -o-animation: animationFrames linear 0.8s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -o-animation-delay: 2s;
  -ms-animation: animationFrames linear 0.8s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
  -ms-animation-delay: 2s;
}


@keyframes smokeL {
	0%   { transform: scale(1) translate(0, 0) }
	10%  { opacity: 1; transform: scale(1) translate(0, 0) }
	100% { opacity: 0; transform: scale(1.4) translate(-5vw, -3vw) }
}

@keyframes smokeR {
	0%   { transform: scale(1) translate(0, 0) }
	10%  { opacity: 1; transform: scale(1) translate(0, 0) }
	100% { opacity: 0; transform: scale(1.8) translate(-8vw, -4vw) }
}

.ef-logo {
  background-image: url('../images/ef.png');
  background-repeat: no-repeat;
  height:7vh;
  width:8vw;
  background-size: contain;
  margin-left: -0.5vw;
  z-index: 1040;
  top: 10%;
  right:10%;
  position: fixed;
}



.jello-horizontal:hover{-webkit-animation:jello-horizontal .9s both;animation:jello-horizontal .9s both}
@-webkit-keyframes jello-horizontal{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes jello-horizontal{0%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}

.ef-logo a {display:block; width: 100%; height:100%;}

.container-fluid {
  position: absolute;
  z-index: 1030;
  top: 0;
}

.cover-image .content {
  margin-top: 3%;
}

.cover-image .content-wrapper {
  /*left: 5vw;*/
}

.cover-image .content .logo {
  background-image: url('../images/logo.png');
  background-repeat: no-repeat;
  height:16vh;
  width:21vw;
  background-size: contain;
  margin-left: -0.5vw;
}

.cover-image .content .claim {
  font-family: 'Roboto Condensed', sans-serif; 
  color:white;
  font-weight: 100;
  font-size: 2.5vw;
  line-height: 3vw;
  
}

.cover-image .content .sub-claim {
  font-family: 'Roboto Condensed', sans-serif; 
  color:white;
  font-weight: 100;
  font-size: 1.5vw;
  line-height: 2vw;
  margin-top: 1vw;
}

.cover-image .content .coming-soon-img {
  background-image: url('../images/coming-soon.png');
  background-repeat: no-repeat;
  height:15vh;
  width:24vw;
  background-size: contain;
  margin: 3vw;
}

.coming-soon-img-social {
  background-image: url('../images/coming-soon.png');
  background-repeat: no-repeat;
  height:27vh;
  width:35vw;
  background-size: contain;
  margin: 30vw;
  margin-bottom: 0;
}

.coming-soon-img-social .social .header {
 font-size: 2vw;
}

.cover-image .content .search {
  padding-top: 4vw;
}

.cover-image .content .search .has-search .form-control-feedback {
  position: absolute;
  z-index: 2;
  display: block;
  width: 2.375rem;
  height: 2.375rem;
  line-height: 2.2vw;
  text-align: center;
  pointer-events: none;
  color: #aaa;
  font-size: 1vw;
}

.cover-image .content .search .has-search .form-control {
  padding-left: 2.375rem;
  font-size: 1vw;
  font-weight: 100;
  font-family: 'Roboto Condensed', sans-serif;
  width: 140%;
  -webkit-box-shadow: 0px 3px 0px 0px rgba(50, 50, 50, 0.5);
  -moz-box-shadow:    0px 3px 0px 0px rgba(50, 50, 50, 0.5);
  box-shadow:         0px 3px 0px 0px rgba(50, 50, 50, 0.5);
  border-radius: .5vw;
}

.cover-image .content .navi-buttons {
  padding-top: .7vw;
}

.cover-image .content .navi-buttons .btn-primary {
  background-color: #464664;
  border-color: #464664;
  border-radius: .5vw;
  font-size: 1vw;
  font-weight: 100;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  margin-right: 1rem;
}

.cover-image .content .navi-buttons .btn-primary:hover {
  background-color: #d36f2d;
  border-color: #d36f2d;
  box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);
}

.topnavi {

  padding: 1vh 0vh;
  z-index: 1032;
}

.topnavi .topnavi-buttons button.btn-primary {
  background-color: rgba(255, 255, 255, .1);
  border: none;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 100;
  font-size: .75vw;
}

.topnavi .topnavi-buttons button:hover {
  background-color: rgba(255, 255, 255, .3);
}

.topnavi .topnavi-buttons .btn-social {
  padding-left: .5rem;
  padding-right: .5rem;
}


.responsive-menu { z-index: 1060; position: fixed; right: 80px; top:44px; transition: all .45s; }
.responsive-menu a.nav-trigger-mobilemenu {color:white; text-decoration: none; width: 40px; height: 40px; font-size: 1.4vw; background: rgba(70, 70, 100, 1);  border: 1px solid rgba(70, 70, 100, 1); border-radius: 5px; padding: .4rem .7rem; }
.responsive-menu a.nav-trigger-mobilemenu:hover { background-color: #d36f2d; border-color: #d36f2d; box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);}
.responsive-menu i.lni-close {display: none;}
.responsive-menu i.lni-menu {display: inline;}

.nav-open-2 .responsive-menu i.lni-close {display: inline;}
.nav-open-2 .responsive-menu i.lni-menu {display: none;}

.nav-open-2 .responsive-menu a.nav-trigger-mobilemenu {font-size: 1.4vw;  padding: .4rem .7rem; width: 40px; height: 40px; color:white; background: #d36f2d; border: 1px solid  #d36f2d; border-radius: 5px; }
.nav-open-2 .responsive-menu {top:50px; right: 500px;}


/* OFF CANVAS SIDEBAR */

.overlay-2 {position: fixed; z-index: 1032; top: 0; left: 0; width: 100%; height: 100%; background:#34495e; opacity: 0; visibility: hidden; transition: opacity .5s, visibility .5s; }
.nav-container-2 {position: fixed; z-index: 1059; top: 0;right: 0;height: 100%; width: 90%; max-width: 525px; border-radius: 5px;background: white; overflow: auto; transform: translateZ(20px); transform: translateX(100%); transition: transform .5s cubic-bezier(.07,.23,.34,1);}
.nav-open-2 .nav-container-2 {transform: translateX(20px); }
.nav-open-2 .overlay-2 {opacity: .95; visibility: visible; }

.filter-responsive {box-shadow: inset 0 -1rem 2rem rgba(0, 0, 0, .5); height:100%; background-image: url('../images/sidenav-bg.png'); background-size: 120%; background-repeat: no-repeat; background-position: left -75px bottom 25px;  background-color:#f7f7ff;}
.filter-responsive .modal-content {border:none; background:transparent; }
.filter-responsive .modal-content .modal-header {border-bottom:none; padding:1.4rem 1rem; }

.filter-responsive .modal-content .modal-header .logo {margin-left:1rem;  background-image: url('../images/logo.png');  background-repeat: no-repeat;  height:5rem;  width:10rem;  background-size: contain;}

.filter-responsive .modal-content .modal-body {padding: 0;}
.filter-responsive .modal-content .modal-body .collapsed {margin-left:0;}
.filter-responsive .modal-content .modal-body a {text-decoration: none;}
.filter-responsive .modal-content .modal-body h4 {font-size: 1rem;}

.filter-responsive .modal-content .modal-body .popover-body {padding:0;}
.filter-responsive .modal-content .modal-body .popover-body .popover-header {padding: .2rem 2rem; background-color: transparent; border-bottom: none;}
.filter-responsive .modal-content .modal-body .popover-body .popover-header h4 {border: 1px solid rgba(70, 70, 100, 1); color:white; font-size: .8vw; font-weight: 100;  background-color: rgba(70, 70, 100, 1); padding: .4rem 1.5rem; border-radius: 5px;}
.filter-responsive .modal-content .modal-body .popover-body .popover-header h4:hover {background-color: #d36f2d; border-color: #d36f2d; box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);}


/* OFF CANVAS SIDEBAR END */


.topnavi .btn-apps {
  margin-right: 3rem;
  margin-top: 2rem;
  font-size: 1.4vw;
  background: rgba(70, 70, 100, 1);
  color: white;
  border: 1px solid rgba(70, 70, 100, 1);
  padding: .3rem .7rem;
  border-radius: 5px;
  line-height: 1.5;
}

.topnavi .btn-apps:hover {
  background-color: #d36f2d; border-color: #d36f2d; box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);
}

/*  POPOVER APP MENU START */
.popover {margin-right:2.5rem; z-index: 1030; box-shadow: 0px 6px 20px 6px rgba(0,0,0,0.3); min-width: 22vw; background-color: #f7f7ff;}
.popover-body .apps { margin: 0rem .75rem 2rem .75rem;}
.popover-body .apps button {margin:.15rem .15rem; font-weight: 100; background-color: rgba(70, 70, 100, 1); font-size: .9rem; width:6rem; line-height: 1.2rem; min-height: 6rem; color:white; padding:.25rem .5rem;}
.popover-body .apps button i {font-size: 2rem;}
.popover-body .apps button:hover {box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3); background-color: #d36f2d; border-color: #d36f2d; color: white;}

/*  POPOVER EULENFISCH */
.popover {margin-right:2.5rem; margin-top: 1rem; z-index: 1030; box-shadow: 0px 6px 20px 6px rgba(0,0,0,0.3); min-width: 22vw; background-color: #f7f7ff;}
.popover-body .ef { margin: 0rem .75rem 2rem .75rem;}
.popover-body .ef .cover-ef {float: left;   width: 8rem;  height: 10rem;  background-image: url(../images/ef-cover.jpg);  background-repeat: no-repeat;  background-size: contain;  margin: 1rem 1rem 1rem .5rem;}
.popover-body .ef .text-ef { font-family: 'Roboto Condensed', sans-serif; color:#464664; font-weight: 100; padding: 1rem 0rem 0rem 1rem;}
.popover-body .ef .text-ef a {color:#db5744;}

/*  MODAL THEMEN MENU START */

.modal-backdrop {  background:#34495e; opacity: .75!important;}

.modal-content {}
.themen .modal-header {border:none; background-color: #f7f7ff; }
.themen .modal-header h5.modal-title {margin-left: 1.25rem; font-weight: 100; font-size:1.25vw; font-family: 'Roboto Condensed', sans-serif; color:#464664;}
.themen .modal-body h6 {margin-left: .5rem; font-size: 1vw; font-weight: 100;   font-family: 'Roboto Condensed', sans-serif; }
.themen .modal-body ul {padding:0}
.themen .modal-body ul li {text-align:center; font-family: 'Roboto Condensed', sans-serif; font-size: .8vw; padding:.5rem 1em;  margin:.5rem .5rem; float:left; width:5vw; height:5vw; font-weight: 100; border-radius: 5px; list-style-type: none; color:white; background-color: #464664;}
.themen .modal-body ul li:hover { box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3); background-color: #d36f2d; border-color: #d36f2d; color: white;}

/*  MODAL THEMEN MENU END */

/*  MODAL LEHRPLAN MENU START */


#lehrplan .modal-content {height:100%;}
#lehrplan .modal-body {padding-left:.5rem; padding-bottom: 0px;}
#lehrplan .popover-body {padding: 0rem .75rem;}
#lehrplan .modal-footer {border:0px;}


.lehrplan .modal-header {border:none; background-color: #f7f7ff; }
.lehrplan .modal-header h5.modal-title {margin-left: 1.25rem; font-weight: 100; font-size:1.25vw; font-family: 'Roboto Condensed', sans-serif; color:#464664;}


.filter-licence-container .form-group {background-color: #f7f7ff; border-radius: 5px; margin-bottom: .5rem;}
.filter-licence-container .form-group span.custom-control-label span.count {padding: 0rem 20rem 0rem 1rem; font-size: 0.8rem;  }
.filter-licence-container .form-group span.custom-control-label span.help {position: absolute; font-size: 1.1rem; right:5px; top:3px;  }
.filter-licence-container .form-group span.custom-control-label span.help a {color:#464664; } 
.filter-licence-container .form-group span.custom-control-label span.help a:hover {position: absolute; color: white; text-decoration: none; font-size: 1.1rem;  right:0px; top:0px;}
.filter-licence-container .form-group span.custom-control-label span.help:hover {position: absolute; right:5px; top:3px; }
.filter-licence-container .form-group span.custom-control-label::after {display: none;}
.filter-licence-container .form-group span.custom-control-label { width:100%;  display: inline-block; /*background-color: #464664;*/  border: 1px solid #464664;   /*color: white;*/  border-radius: 5px;  white-space: nowrap;  margin: 3px 0px;  -webkit-touch-callout: none;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none;  -webkit-tap-highlight-color: transparent;  transition: all .2s;  padding: .3rem 1.5rem .3rem 2.5rem;}
.filter-licence-container .form-group label { transition: all .35s ease;  padding: 0px 0rem;  cursor: pointer;  margin: 0px;}
.filter-licence-container .form-group span.custom-control-label::before {  display: inline-block;  font-style: normal;  font-variant: normal;  text-rendering: auto;  -webkit-font-smoothing: antialiased;  font-weight: 100;  font-size: 1rem;  border: none;  content: '\E959';  font-family: "LineIcons";  transition: transform .3s ease-in-out;  left: .8rem;    top: .2rem;    outline-style:none !important;  box-shadow:none !important; border-color:transparent !important;    background: transparent !important;}
.filter-licence-container .form-group input[type="checkbox"]:checked + span.custom-control-label::before {  content: '\E957';  transform: rotate(-360deg);  transition: transform .3s ease-in-out;  outline-style:none !important;  box-shadow:none !important;  border-color:transparent !important;  background: transparent !important;}
.filter-licence-container .form-group input[type="checkbox"]:disabled + span.custom-control-label {opacity: 0.4; }
.filter-licence-container .form-group input[type="checkbox"]:disabled + span.custom-control-label:hover {background-color: #464664; color: white; border: 1px solid #464664;}
.filter-licence-container .form-group input[type="checkbox"]:checked + span.custom-control-label:hover {background-color: #d36f2d; color: #fff;}
.filter-licence-container .form-group input[type="checkbox"] + span.custom-control-label:hover {  box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);  background-color: #d36f2d;  border: 1px solid #d36f2d; color: #fff; }
.filter-licence-container .form-group input[type="checkbox"]:checked + span.custom-control-label {  border: 1px solid #d36f2d;  background-color: #d36f2dcc;  color: #fff;  transition: all .2s;}
.filter-licence-container .form-group input[type="checkbox"] {display: absolute;}
.filter-licence-container .form-group input[type="checkbox"] {position: absolute;opacity: 0;}
.filter-licence-container .form-group input[type="checkbox"]:focus + span.custom-control-label {border: 1px solid #d36f2d;}

.filter-licence-container h5 {padding: 1rem 0rem 1rem 0rem;}

.filter-licence-container .filter-bar {padding: 0rem 2rem 2rem 2rem;}

.filter-licence-container .filter-bar .usage .usage-info {padding:1rem;  transition: all .35s ease; font-size: 0.8rem;}

.filter-licence-container .filter-bar .usage .btn {padding: .5rem 1rem; color:white; background-color: rgba(70, 70, 100, 1 );font-family: 'Roboto Condensed', sans-serif; font-weight: 100; }
.filter-licence-container .filter-bar .usage .btn:hover  {background-color: #d36f2d; box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3);}
.filter-licence-container .filter-bar .usage .btn-label {left: -9px;}

.filter-licence-container .filter-bar .usage .form-group span.custom-control-label {border-radius: 0;font-size: .9rem; background-color: #f7f7ff; border: none; color:#464664;}
.filter-licence-container .filter-bar .usage .form-group {background-color: white; border-radius: 0px; margin-bottom: 0rem;}
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"]:disabled + span.custom-control-label:hover {background-color: white; border: 0; color: white;}
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"]:checked + span.custom-control-label:hover {background-color: #d36f2dcc; color: white;}
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"]:focus + span.custom-control-label {border: 0;}
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"] + span.custom-control-label:hover {color:white;  background-color: #d36f2dcc;  border: 0; }
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"]:checked + span.custom-control-label {  border: 0;}

.filter-licence-container .filter-bar .usage .form-group span.custom-control-label span.help a {color:#464664; } 
.filter-licence-container .filter-bar .usage .form-group span.custom-control-label span.help a:hover {color: white; text-decoration: none; font-size: 1.3rem; top:-5px;}
.filter-licence-container .filter-bar .usage .form-group input[type="checkbox"]:checked + span.custom-control-label span.help a {color: white;}

.filter-licence-container .filter-bar .usage .dropdown-menu {min-width: 16rem;}

#licence .filter-licence-container .filter-bar .search {padding: 0rem 2rem;}

.filter-licence-container .filter-bar .search label {font-size:.9rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 100; margin-bottom: 0; padding: 0rem 1rem 0rem 0rem;}
.filter-licence-container .filter-bar .search .textfield {font-size:.9rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 100;  -webkit-appearance: none;  box-sizing: border-box;  border-radius: 5px;  padding: .5em;  font-size: .9rem;  color: #464664;  background-color: #f7f7ff;  transition: .35s;  border-bottom: 1px solid #95a5a6;  border-left: 0;  border-top: 0;  border-right: 0;  font-family:'Roboto Condensed', sans-serif; font-weight: 100;}
.filter-licence-container .filter-bar .search .textfield::-webkit-input-placeholder {  color: #95a5a6;  transition: .15s}
.filter-licence-container .filter-bar .search .textfield:-ms-input-placeholder {  color: #95a5a6;  transition: .15s}
.filter-licence-container .filter-bar .search .textfield::-ms-input-placeholder {  color: #95a5a6;  transition: .15s}
.filter-licence-container .filter-bar .search .textfield::placeholder {  color: #95a5a6;  transition: .15s}
.filter-licence-container .filter-bar .search .textfield:hover {  outline-width: 0;  color: #5d6d77; border-color: #5d6d77}
.filter-licence-container .filter-bar .search .textfield:hover::-webkit-input-placeholder {  color: #5d6d77}
.filter-licence-container .filter-bar .search .textfield:hover:-ms-input-placeholder {  color: #5d6d77}
.filter-licence-container .filter-bar .search .textfield:hover::-ms-input-placeholder {  color: #5d6d77}
.filter-licence-container .filter-bar .search .textfield:hover::placeholder {  color: #5d6d77}
.filter-licence-container .filter-bar .search .textfield:focus {  outline-width: 0;  border-color: #34495e}
.filter-licence-container .filter-bar .search .textfield:focus::-webkit-input-placeholder {  color: #34495e}
.filter-licence-container .filter-bar .search .textfield:focus:-ms-input-placeholder {  color: #34495e}
.filter-licence-container .filter-bar .search .textfield:focus::-ms-input-placeholder {  color: #34495e}
.filter-licence-container .filter-bar .search .textfield:focus::placeholder {  color: #34495e}

.filter-licence-container .filter-bar-selected { margin-bottom: 2rem;} 
.filter-licence-container .filter-bar-selected  .selected {padding: 0rem 0rem 1rem 1rem;}
.filter-licence-container .filter-bar-selected  .selected .tag {margin: 0rem .25rem .25rem 0rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 100; background-color: #d36f2daa; border: 1px solid transparent; display: block; float:left; color:white; font-size: 0.8rem; padding: .3rem 1.2rem .3rem .4rem; border-radius: 5px;}
.filter-licence-container .filter-bar-selected  .selected .tag::before { padding: .2rem .4rem; font-size: .5rem; content: '\E951';  font-family: "LineIcons";}
.filter-licence-container .filter-bar-selected  .selected .tag:hover {background-color: #d36f2d; border: solid 1px #d36f2d; box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3); }


.filter-licence-container .licence-list {padding: 0rem 0rem 0rem 1rem;}
.filter-licence-container .licence-list .form-group {background-color:white;}
.filter-licence-container .licence-list .form-group span.custom-control-label {width: auto; margin-right: 1rem; font-size:.9rem; font-family: 'Roboto Condensed', sans-serif; font-weight: 400; }
.filter-licence-container .licence-list .form-group span.custom-control-label span.count {position: absolute; right:5px; font-size: 0.8rem;  }
.filter-licence-container .licence-list .usage-info {padding:.5rem; margin-right:1rem; font-weight: 100;  font-family: 'Roboto Condensed', sans-serif; transition: all .35s ease; font-size: 0.8rem; background-color: #f7f7ff;     border-radius: 5px; margin-bottom: 2rem;}


.filter-subject-container {height: 500px;   overflow-y: auto; overflow-x: hidden; }

.filter-subject-container .fixed-bg {background-color: white;}

.filter-subject-container .usage {margin-right: 1rem;}
.filter-subject-container .form-group span.custom-control-label span.count {padding: 0rem 0rem 0rem 1rem; font-size: 0.8rem;  }
.filter-subject-container .form-group span.custom-control-label {white-space:normal;}
.filter-subject-container .form-group span.custom-control-label span.help a:hover {position: absolute;}
.filter-subject-container .form-group span.custom-control-label span.help:hover {position: absolute;}

.filter-subject-container .readmore-toggle-btn a {font-size: 0.9rem;}
.filter-subject-container .readmore-toggle-btn a.collapsed:after {content: '+ mehr zeigen';}
.filter-subject-container .readmore-toggle-btn a:not(.collapsed):after {content: '- weniger zeigen';}
.filter-subject-container .readmore-toggle-btn {padding: 10px 0px 20px 0px; }

.filter-subject-container #readmore-toggle #collapseSubjects.collapse:not(.show) {display: block; height: 300px; overflow: hidden;}
.filter-subject-container #readmore-toggle #collapseSubjects.collapsing {height: 300px;}

.filter-subject-container .subject-list .workItem {max-width: 25%;}


#lehrplan .modal-footer .btn-primary {background-color: #464664; color: white; font-weight: 100; font-family: 'Roboto Condensed', sans-serif; font-size: .875rem; border-color: #464664;}
#lehrplan .modal-footer .btn-primary:hover {background-color: #d36f2d; border-color: #d36f2d;  box-shadow: 0px 4px 0px 0px rgba(0,0,0,0.3); }
#lehrplan .modal-footer .btn-secondary { font-weight: 100; font-family: 'Roboto Condensed', sans-serif; font-size: .875rem;}


/*  MODAL LEHRPLAN MENU END */


/* FOOTER */

.title-coop {margin-top: 9vw; margin-bottom:.5rem; font-weight: 100; font-family: 'Roboto Condensed', sans-serif; font-size: 1.75rem; opacity: .75; color:#464664;}

.logo-coop {height: 100px; margin-bottom: 2rem;}
.logo-coop .bistumlimburg { margin: 0rem 0rem; opacity: .4; height:120%; width:140px; background-size: contain;  background-image: url('../images/koop-2.png'); background-repeat: no-repeat;}
.logo-coop .bistumlimburg:hover {opacity: .75;}
.logo-coop .jlid {margin: 0rem 0rem; opacity: .4; height:120%; width:80px; background-size: contain;  background-image: url('../images/koop.png'); background-repeat: no-repeat;}
.logo-coop .jlid:hover {opacity: .75;}
.logo-coop .ps {margin: 0rem 0rem; opacity: .4; height:90%; width:213px; background-size: contain;  background-image: url('../images/koop-3.png'); background-repeat: no-repeat;}
.logo-coop .ps:hover {opacity: .75;}
.logo-coop .cz {margin: 0rem 0rem; opacity: .4; height:90%; width:172px; background-size: contain;  background-image: url('../images/koop-4.png'); background-repeat: no-repeat;}
.logo-coop .cz:hover {opacity: .75;}
.logo-coop .renovabis {margin: 0rem 0rem; opacity: .4; height:93%; width:104px; background-size: contain;  background-image: url('../images/koop-5.png'); background-repeat: no-repeat;}
.logo-coop .renovabis:hover {opacity: .75;}
.logo-coop .lumium {margin: 0rem 0rem; opacity: .4; height:70%; width:180px; background-size: contain;  background-image: url('../images/koop-6.png'); background-repeat: no-repeat;}
.logo-coop .lumium:hover {opacity: .75;}
.logo-coop .adveniat {margin: 0rem 0rem; opacity: .4; height:100%; width:130px; background-size: contain;  background-image: url('../images/koop-7.png'); background-repeat: no-repeat;}
.logo-coop .adveniat:hover {opacity: .75;}
.impressum {font-weight: 100; font-family: 'Roboto Condensed', sans-serif; font-size: .875rem; opacity: .75; color:#464664;}
.impressum span {padding-right: .5rem;}
.impressum a {padding: 0rem .5rem; color:#464664;}
.impressum a:hover {}



/* RESPONSIVE */

@media (min-width: 1400px) {
  .modal-dialog {max-width: 40%;   margin: 1.75rem auto; top:5%; height: 670px; }
  #lehrplan .modal-dialog {max-width: 60%;}
}

@media (min-width: 1100px) and (max-width: 1400px) {

  body {background-size: contain;    background-image: url('../images/cover-md.jpg');  }
  .cover-image { background-size: 90%; background-position: 11vw 14vh; }
  .smoke-1 { background-size: 90%; background-position: 11vw 14vh;  }
  .smoke-2 { background-size: 90%; background-position: 11vw 14vh;}
  .smoke-3 { background-size: 90%; background-position: 11vw 14vh;  }
  .smoke-4 { background-size: 90%;   background-position: 11vw 14vh; }
  .smoke-5 { background-size: 90%; background-position: 11vw 14vh;  }
  .suchen { position: absolute; background-position: 4vw 8vh;  }
  .finden {position: absolute;    background-position: 4vw 8vh;  }
  .staunen {position: absolute;    background-position: 4vw 8vh;  }
  .topnavi {padding: 1.5vh 0vh;  }
  .topnavi .topnavi-buttons button.btn-primary {    font-size: 1.2vw;}
  .cover-image .content-wrapper {    right: 6vw;}
  .cover-image .content .claim {    font-size: 3vw;    line-height: 3.5vw;}
  .cover-image .content .search .has-search .form-control {    padding-left: 3.375rem;    font-size: 1.5vw;  }
  .cover-image .content .search .has-search .form-control-feedback {    width: 3.375rem;    height: 2.375rem;    line-height: 3.5vw;    font-size: 1.5vw;  }
  .cover-image .content .navi-buttons .btn-primary {font-size: 1.25vw;}
  /*.ef-logo {margin-left: -0.5vw;    top: 4vh;    right:140px;    position: fixed;}*/
  .logo-coop {height: 50px;}
  .title-coop {font-size: 1.5rem;}
  .impressum {font-size: .8rem;}
  .modal-dialog {max-width: 40%;   margin: 1.75rem auto; top:5%; height: 670px; }
  #lehrplan .modal-dialog {max-width: 60%;}
}

@media (min-width: 769px) and (max-width: 1100px) {
  body {    background-size: cover;    background-image: url('../images/cover-s.jpg');    background-position-y: -16vh; }
  .cover-image {   background-size: 125%; background-position-y: 2vh;  background-position-x: -11vw; }
  .smoke-1 { background-size: 125%; background-position-y: 2vh;  background-position-x: -11vw;}
  .smoke-2 { background-size: 125%;  background-position-y: 2vh;  background-position-x: -11vw; }
  .smoke-3 { background-size: 125%;  background-position-y: 2vh;  background-position-x: -11vw; }
  .smoke-4 { background-size: 125%;   background-position-y: 2vh;  background-position-x: -11vw;}
  .smoke-5 { background-size: 125%;  background-position-y: 2vh;  background-position-x: -11vw;  }
  @keyframes smokeL {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.4) translate(-8vw, -10vw) }
  }
  @keyframes smokeR {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.8) translate(-16vw, -12vw) }
  }
  .suchen {  position: absolute; background-position: 8vw 5vh; }  
  .finden {  position: absolute; background-position: 8vw 5vh; }
  .staunen {  position: absolute;  background-position: 8vw 5vh; }
  .topnavi { padding: 1.5vh 0vh;}
  .topnavi .topnavi-buttons button.btn-primary { font-size: 1.2vw; }
  .responsive-menu {right:20px;}
  .cover-image .content-wrapper { right: 0; }
  .cover-image .content .claim {font-size: 3vw; line-height: 3.5vw;  }
  .cover-image .content .search .has-search .form-control { padding-left: 3.375rem; font-size: 1.5vw; }
  .cover-image .content .search .has-search .form-control-feedback { width: 3.375rem;  height: 2.375rem; line-height: 3.5vw;  font-size: 1.5vw; }
  .cover-image .content .navi-buttons .btn-primary {  font-size: 1.3vw; font-weight: 400; border-radius: 5px;}
  /*.ef-logo { margin-left: -0.5vw; top:55vw; right:20px; position: fixed;}*/
  .logo-coop {height: 50px;}
  .title-coop {font-size: 2vw; margin-top: 23.5vw;}
  .impressum {font-size: .8rem;}
  .responsive-menu a.nav-trigger-mobilemenu {    padding: .5rem .7rem}
  .nav-open-2 .responsive-menu a.nav-trigger-mobilemenu {padding: .5rem .7rem}
  .popover-body .apps button i {font-size: 1.5rem;}
  .popover-body .apps button {    font-weight: 400; font-size: .8rem; width:5.5rem; min-height: 5.5rem;}
  .filter-responsive {background-position: left 45px bottom 0px;     background-size: 100%}
  .filter-responsive .modal-content .modal-body .popover-body .popover-header h4 {font-size: .8rem; font-weight: 400; }
  .modal-dialog {top:0px; margin: 1rem auto; height:620px;}
  #lehrplan .modal-dialog {max-width: 90%;}
  .lehrplan .modal-header h5.modal-title {font-size: 1.25rem;}

  .coming-soon-img-social {
    background-image: url('../images/coming-soon.png');
    background-repeat: no-repeat;
    height:27vh;
    width:47vw;
    background-size: contain;
    margin-top: 35vw;
    margin-bottom: 0;
  }
  
  .coming-soon-img-social .social .header {
   font-size: 2vw;
  }


}

@media (min-width: 576px) and (max-width: 768px) {
  body {    background-size: cover;    background-image: url('../images/cover-s.jpg');    background-position-y: -16vh; background-position-x: 30%;}
  .cover-image {   background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw; }
  .cover-image .content {margin-top: 15px;}
  .cover-image .col-1-responsive-fix {justify-content: start!important; }
  .cover-image .col-2-responsive-fix {display: none;}
  .cover-image .content-wrapper { right: 0vw; left:60px;}
  .cover-image .content .claim {    font-size: 1.25rem;  line-height: 1.6rem;}
  .cover-image .content .search {padding-top: 3rem;}
  .cover-image .content .navi-buttons .btn-primary {font-size: .9rem; font-weight: 400; border-radius: 5px;}
  .cover-image .content .search .has-search .form-control {font-size: .9rem;}
  .cover-image .content .search .has-search .form-control-feedback {line-height: 2rem; font-size: 1rem;}
  .smoke-1 { background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw;}
  .smoke-2 {background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw; }
  .smoke-3 { background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw; }
  .smoke-4 { background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw;}
  .smoke-5 {background-size: 160%; background-position-y: 23vh;  background-position-x: -45vw;  }
  @keyframes smokeL {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.4) translate(-8vw, -18vw) }
  }
  @keyframes smokeR {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.8) translate(-16vw, -20vw) }
  }
  .suchen {  position: absolute; background-position: -43vw 23vh; background-size: 160%; }  
  .finden {  position: absolute; background-position: -43vw 23vh; background-size: 160%;}
  .staunen {  position: absolute;  background-position: -43vw 23vh; background-size: 160%;}
  .responsive-menu {right:40px;}
  .responsive-menu a.nav-trigger-mobilemenu {font-size: 1.25rem; padding: .7rem .9rem; }
  .nav-open-2 .responsive-menu a.nav-trigger-mobilemenu {font-size: 1.25rem;    padding: .5rem .7rem}
  /*.ef-logo { margin-left: -0.5vw; top:85%; right:40px; position: fixed; height: 6vh; width: 13vw;}*/
  .logo-coop {height: 50px; margin-top: 0; bottom: 45px; position: absolute;}
  .title-coop {font-size: .8rem; margin-top: 0; bottom: 90px; position: absolute;}
  .impressum {font-size: .8rem; bottom: 10px; position: absolute;}
  .popover-body .apps button i {font-size: 1.5rem;}
  .popover-body .apps button {    font-weight: 400; font-size: .8rem; width:5.5rem; min-height: 5.5rem;}
  .filter-responsive {background-position: left 45px bottom 0px;     background-size: 100%}
  .filter-licence-container .licence-list .form-group span.custom-control-label {width:100%; }
  .filter-licence-container .licence-list .form-group {padding-right: 1rem;}
  .filter-subject-container .search {padding-top:1rem;}
  .filter-subject-container .subject-list .workItem {max-width: 33%;}
  .filter-responsive .modal-content .modal-body .popover-body .popover-header h4 {font-size: .8rem; font-weight: 400; }
  .modal-dialog {top:0px; margin: 1rem auto; height:90%;}
  #lehrplan .modal-dialog {max-width: 90%;}
  .lehrplan .modal-header h5.modal-title {font-size: 1.25rem;}
  .row {margin:0;}
}

@media (max-width: 576px) {
  body {    background-size: cover;    background-image: url('../images/cover-s.jpg');    background-position-y: -16vh; background-position-x: 28%;}
  .cover-image {   background-size: 180%; background-position-y: 67%;  background-position-x: -65vw; }
  .cover-image .content .logo {    width: 30vw;  }
  .cover-image .content {margin-top: 15px;}
  .cover-image .col-1-responsive-fix {justify-content: start!important; }
  .cover-image .col-2-responsive-fix {display: none;}
  .cover-image .content-wrapper { right: 0vw; left:20px;}
  .cover-image .content .claim {    font-size: 1.25rem;  line-height: 1.6rem;}
  .cover-image .content .navi-buttons .btn-primary {font-size: .9rem; font-weight: 400; border-radius: 5px;}
  .cover-image .content .search .has-search .form-control {font-size: .9rem;     width: 82vw;  }
  .cover-image .content .search .has-search .form-control-feedback {line-height: 2rem; font-size: 1rem;}
  .smoke-1 { background-size: 180%; background-position-y: 67%;  background-position-x: -65vw;}
  .smoke-2 {background-size: 180%; background-position-y: 67%;  background-position-x: -65vw; }
  .smoke-3 {background-size: 180%; background-position-y: 67%;  background-position-x: -65vw; }
  .smoke-4 {background-size: 180%; background-position-y: 67%;  background-position-x: -65vw;}
  .smoke-5 {background-size: 180%; background-position-y: 67%;  background-position-x: -65vw;  }
  @keyframes smokeL {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.4) translate(-8vw, -18vw) }
  }
  @keyframes smokeR {
    0%   { transform: scale(1) translate(0, 0) }
    10%  { opacity: 1; transform: scale(1) translate(0, 0) }
    100% { opacity: 0; transform: scale(1.8) translate(-16vw, -20vw) }
  }
  .suchen {  position: absolute; background-position: -67vw 70%; background-size: 180%;}  
  .finden {  position: absolute; background-position: -62vw 70%; background-size: 180%;}
  .staunen {  position: absolute; background-position: -62vw 70%; background-size: 180%;}
  .responsive-menu {right:40px;}
  .responsive-menu a.nav-trigger-mobilemenu {font-size: 1.25rem; padding: .4rem .6rem; }
  .nav-open-2 .responsive-menu {right:84%;}
  .nav-open-2 .responsive-menu a.nav-trigger-mobilemenu {font-size: 1.25rem;    padding: .5rem .7rem}
  /*.ef-logo { margin-left: -0.5vw; top:85%; right:40px; position: fixed; height: 6vh; width: 13vw;}*/

  .logo-coop {height: 50px; margin-top: 0; bottom: 45px; position: absolute;}
  .title-coop {font-size: 1.2rem; margin-top: 51vw; position: absolute;}
  .impressum {font-size: .8rem; margin-top:2vw;  position: absolute;}
  .popover-body .apps button i {font-size: 1.5rem;}
  .popover-body .apps button {    font-weight: 400; font-size: .8rem; width:5.5rem; min-height: 5.5rem;}
  .filter-responsive {background-position: left 45px bottom 0px;     background-size: 100%}
  .filter-licence-container .licence-list .form-group span.custom-control-label {width:100%; min-height :3.5rem; }
  .filter-licence-container .licence-list .form-group span.custom-control-label span.count {bottom:3px;}
  .filter-licence-container .licence-list .form-group {padding-right: 1rem;}
  .filter-subject-container .search {padding-top:1rem;}
  .filter-subject-container .subject-list .workItem {max-width: 100%;}
  .filter-licence-container .licence-list {padding: 0rem 0rem 0rem 0rem;}
  .filter-licence-container .filter-bar {padding: 0rem 1rem 1rem 1rem;}
  .filter-licence-container .filter-bar .search .textfield {width: 100%;}
  .filter-responsive .modal-content .modal-body .popover-body .popover-header h4 {font-size: .8rem; font-weight: 400; }
  .modal-dialog {top:0px; margin: .5rem auto; height:98%;}
  #lehrplan .modal-dialog {max-width: 95%;}
  .lehrplan .modal-header h5.modal-title {font-size: 1rem; margin-left: 0rem;}
  #lehrplan .popover-body {padding:0px;}
  .filter-subject-container .usage {    margin-right: 0.2rem;}
  .filter-licence-container .filter-bar .usage .btn {padding:.25rem;}
  .filter-licence-container .filter-bar-selected .selected {     padding: 0rem 0rem 1rem 0rem;  }
  .row {margin:0;}
  .logos-flex-container {margin-top: 59vw !important;}
  .coming-soon-img-social {margin-top: 340vw; height: 30vw; width: 96vw; margin-left: 0; margin-right: 0;}
  .coming-soon-img-social .social .header {padding: 0px!important; font-size: 5vw;}
  .coming-soon-img-social .social .header-2 {font-size: 3vw;}
}



.swing {
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes swing {
  20% {
  -webkit-transform: rotate3d(0, 0, 1, 15deg);
  transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
  -webkit-transform: rotate3d(0, 0, 1, -10deg);
  transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
  -webkit-transform: rotate3d(0, 0, 1, 5deg);
  transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
  -webkit-transform: rotate3d(0, 0, 1, -5deg);
  transform: rotate3d(0, 0, 1, -5deg);
  }
  100% {
  -webkit-transform: rotate3d(0, 0, 1, 0deg);
  transform: rotate3d(0, 0, 1, 0deg);
  }
  }
  @keyframes swing {
  20% {
  -webkit-transform: rotate3d(0, 0, 1, 15deg);
  transform: rotate3d(0, 0, 1, 15deg);
  }
  40% {
  -webkit-transform: rotate3d(0, 0, 1, -10deg);
  transform: rotate3d(0, 0, 1, -10deg);
  }
  60% {
  -webkit-transform: rotate3d(0, 0, 1, 5deg);
  transform: rotate3d(0, 0, 1, 5deg);
  }
  80% {
  -webkit-transform: rotate3d(0, 0, 1, -5deg);
  transform: rotate3d(0, 0, 1, -5deg);
  }
  100% {
  -webkit-transform: rotate3d(0, 0, 1, 0deg);
  transform: rotate3d(0, 0, 1, 0deg);
  }
  }

  

/* general styling */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}



.container {
  color: #fff;
  margin: 0 auto;
  text-align: center;
  font-weight: 100;
  padding-top: .5rem;
}

.container h2 {
  font-size: 1.5vw;
  font-weight: 100;
  padding-bottom: 0px;
  padding-top: .5rem;
  margin:0px;
}



li {
  display: inline-block;
  font-size: .7vw;
  list-style-type: none;
  padding: .5em;
  text-transform: uppercase;
}

li span {
  display: block;
  font-size: 1.5vw;
}



#content {
  display: none;
  padding: 1.5rem;
}

@media (min-width: 1100px) and (max-width: 1400px) {
  .container h2 {  padding-top: .2rem;}
  .cover-image .content .coming-soon-img {
    margin-bottom: 0;
  }
}
@media (min-width: 769px) and (max-width: 1100px) {
 .container h2 {  padding-top: .1rem;}

 .cover-image .content .coming-soon-img {
  margin-bottom: 0;
}
}
@media (min-width: 576px) and (max-width: 768px) {

  .cover-image .content .coming-soon-img {
    margin-bottom: 0;
  }

}
@media (max-width: 576px) {
  .cover-image .content .sub-claim {
    font-size: 3.5vw;
    line-height: 3.5vw;
    margin-top: 4vw;
  }
  .ef-logo {
    height: 11vh;
    width: 23vw;
  }

  .cover-image .content .coming-soon-img {
    height: 19vh;
    width: 61vw;
  }

  .container h2 {
    font-size: 3.5vw;
    padding-top: 0px;
  }

  li {
    font-size: 2.5vw;
    padding: .5em;
  }

  li span {
    font-size: 3.5vw;
  }
}


.social ul {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0rem;
  list-style-type: none;
  font-size: 2rem;
}

.social .header {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; 
  color:white;
  font-size: 1.5rem;
}

.social .header-2 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap; 
  color:white;
}

.social ul li {
  padding: 1rem;
}

.fab {
  font-size: 2rem;
}

/* transition for social icon hover animation */
.fa-facebook,
.fa-codepen,
.fa-youtube,
.fa-instagram,
.fa-github,
.fa-pinterest {
  transition: 0.4s;
  cursor: pointer;
}

/* social media icons hover color */
.fa-facebook:hover,
.fa-facebook:focus {
  color: #1877f2;
  transform: scale(1.1);
}

.fa-twitter:hover,
.fa-twitter:focus {
  color: #1da1f2;
  transform: scale(1.1);
}

.fa-youtube:hover,
.fa-youtube:focus {
  color: #df2426;
  transform: scale(1.1);
}

.fa-instagram:hover,
.fa-instagram:focus {
  color: #bd22a2;
  transform: scale(1.1);
}

.fa-github:hover,
.fa-github:focus {
  color: #000;
  transform: scale(1.1);
}

.fa-github:hover,
.fa-github:focus {
  color: #000;
  transform: scale(1.1);
}

.fa-codepen:hover,
.fa-codepen:focus {
  color: #000;
  transform: scale(1.1);
}

.fa-pinterest:hover,
.fa-pinterest:focus {
  color: #b3001b;
}





.logos-flex-container {
  padding: 0 5%;
  margin: 0;
  list-style: none;
  
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  
  -webkit-flex-flow: row wrap;
  justify-content: space-around;
}

.logos-flex-item a:hover img {
  transform: scale(1.1);
}

.logos-flex-item {
  width: 250px;
  height: 100px;
  margin-top: 10px;
  text-align: center;
}

@media screen and (max-width: 1100px) {
  .logos-flex-item {
  width: 140px;
  height: 80px;
  margin-top: 10px;
  text-align: center;
}
.logos-flex-item img {
  width: 95%;
}
}

/* .flex-item img {
  width:200px;
}
 */