@import url('https://fonts.googleapis.com/css?family=Muli:200,300,400');

body {
  background: #ffffff;
  font-family: 'Muli', sans-serif;
  font-style: normal;
  font-weight: 300;
  overflow-x: hidden;
}

html, body {
  width: 100%;
  height: 100%;
}



/*---------------------------------------
  Typorgraphy              
-----------------------------------------*/

h1,h2,h3,h4,h5,h6 {
  font-style: normal;
  font-weight: 200;
  letter-spacing: 0px;
}

h1 {
  color: #3d3d3f;
  font-size: 50px;
  line-height: normal;
}

h2 {
  color: #575757;
  font-size: 40px;
  line-height: 52px;
  margin-top: 0px;
}

h4 {
  color: #797979;
  font-size: 18px;
  font-weight: normal;
}

p {
    color: #878787;
    font-size: 16px;
    font-weight: 300;
    line-height: 25px;
    letter-spacing: 0.2px;
}

strong, span {
  color: #878787;
  font-weight: normal;
}



/*---------------------------------------
  Buttons               
-----------------------------------------*/

.section-btn {
  background: #d7b065;
  border: none;
  border-radius: 50px;
  color: #ffffff;
  font-size: 13px;
  font-weight: bold;
  letter-spacing: 1.6px;
  padding: 14px 32px 18px 32px;
  margin-top: 32px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

.section-btn:focus,
.section-btn:hover {
  background: #000000;
  color: #ffffff;
}




.section-btn2 {
  margin: 32px 0 0 0;
  padding: 0;
  background: #d7b065;

}

.section-btn2 a,
.section-btn2 button {
  line-height: 40px;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  perspective: 1000px;
  color: #ffffff;
  font-weight: normal;
}

.section-btn2 a span,
.section-btn2 button span {
  position: relative;
  display: inline-block;
  font-weight: normal;
  padding: 0 25px;
  background: #5050FF;
  border-radius: 1px;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.csstransforms3d .section-btn2 a span::before,
.csstransforms3d .section-btn2 button span::before {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000;
  border-radius: 1px;
  color: #9D0F11;
  padding: 0 25px;
  content: attr(data-hover);
  -webkit-transition: background 0.3s;
  -moz-transition: background 0.3s;
  transition: background 0.3s;
  -webkit-transform: rotateX(-90deg);
  -moz-transform: rotateX(-90deg);
  transform: rotateX(-90deg);
  -webkit-transform-origin: 50% 0;
  -moz-transform-origin: 50% 0;
  transform-origin: 50% 0;
}

.section-btn2 a:hover span,
.section-btn2 a:focus span,

.section-btn2 button:hover span,
.section-btn2 button:focus span {
  -webkit-transform: rotateX(90deg) translateY(-22px);
  -moz-transform: rotateX(90deg) translateY(-22px);
  transform: rotateX(90deg) translateY(-22px);
}

.csstransforms3d .section-btn2 a:hover span::before,
.csstransforms3d .section-btn2 a:focus span::before,

.csstransforms3d .section-btn2 button:hover span::before,
.csstransforms3d .section-btn2 button:hover span::before {
    background: #000000;
}





/*---------------------------------------
    General               
-----------------------------------------*/

html{
  -webkit-font-smoothing: antialiased;
}

a {
  color: #575757;
  -webkit-transition: 0.5s;
  transition: 0.5s;
  text-decoration: none !important;
}

a:hover, a:active, a:focus {
  color: #000000;
  outline: none;
}

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*:before,
*:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.section-title {
  margin: 0;
  padding-bottom: 32px;
}

#about, #work,
#contact {
  position: relative;
  padding-top: 80px;
  padding-bottom: 80px;
}

#about img, #team img {
  border-radius: 5px;
}

#work {
  border-top: 1px solid #f0f0f0;
  border-bottom: 1px solid #f0f0f0;
}

#contact {
  text-align: center;
}


.describe { position: absolute; display: block; left: 5px; top: 10px; z-index: 9; }

/*---------------------------------------
  Pre loader section              
-----------------------------------------*/

.preloader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 99999;
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-items: center;
  background: none repeat scroll 0 0 #ffffff;
}

.spinner {
  border: 1px solid transparent;
  border-radius: 5px;
  position: relative;
}

.spinner:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 65px;
  height: 65px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border: 1px solid #000000;
  border-top-color: #f9f9f9;
  animation: spinner .9s linear infinite;
}

@-webkit-@keyframes spinner {
  to {transform: rotate(360deg);}
}

@keyframes spinner {
  to {transform: rotate(360deg);}
}



/*---------------------------------------
  Navigation section              
-----------------------------------------*/

.custom-navbar {
  border: none;
  margin-bottom: 0;
  background-color: #ffffff;
  padding-top: 22px;
}

.custom-navbar .navbar-brand {
  color: #444;
  font-weight: normal;
  font-size: 20px;
}

.custom-navbar .nav li a {
  font-size: 12px;
  font-weight: normal;
  color: #656565;
  letter-spacing: 1px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
  padding: 0;
  margin: 15px;
}

.custom-navbar .navbar-nav > li > a:hover,
.custom-navbar .navbar-nav > li > a:focus {
  background-color: transparent;
  color: #ffa400;
}

.custom-navbar .navbar-nav li a:after {
  content: "";
  position: absolute;
  display: block;
  width: 0px;
  height: 2px;
  margin: auto;
  background: transparent;
  transition: width .3s ease, background-color .3s ease;
}

.custom-navbar .navbar-nav li a:hover:after,
.custom-navbar .nav li.active > a:after {
  background: #000000;
  color: #ffffff;
  width: 100%;
}

.custom-navbar .nav li.active > a {
  background-color: transparent;
  color: #d7b065;/**color: #454545; */
}

.custom-navbar .navbar-toggle {
  border: none;
  padding-top: 12px;
}

.custom-navbar .navbar-toggle {
  background-color: transparent;
}

.custom-navbar .navbar-toggle .icon-bar {
  background: #000000;
  border-color: transparent;
}

@media(min-width:768px) {
    .custom-navbar {
      border-bottom: 0;
      background: 0 0; 
    }
    .custom-navbar.top-nav-collapse {
      background: #ffffff;
      box-shadow:0 40px 100px rgba(0,0,0,.2);
      padding: 10px 0;
    }

}



/*---------------------------------------
  Home section              
-----------------------------------------*/

#home {
  display: -webkit-box;
  display: -webkit-flex;
   display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
   align-items: center;
  height: 100vh;
  position: relative;
  padding-top: 62px;
}

#home img {
  width: 120px;
  height: 120px;
}


/*---------------------------------------
  About section              
-----------------------------------------*/

#about .section-title {
  padding-bottom: 16px;
}

#about .col-md-4 a {
  width: 100px;
  height: 100px;
  display: inline-block;
  margin: 6px 6px 0px 0;
}

#about .about-thumb {
  margin-top: 22px;
}

#about .about-thumb strong {
  font-weight: normal;
  display: block;
  padding-top: 4px;
}



/*---------------------------------------
  Skill section              
-----------------------------------------*/

#skill {
  border-top: 1px solid #f0f0f0;
  padding-top: 80px;
  padding-bottom: 60px;
}

.skill-thumb strong,
.skill-thumb span {
  color: #575757;
  font-size: 16px;
  padding-bottom: 8px;
  display: inline-block;
}

.skill-thumb .progress {
  background: #ffffff;
  border-radius: 5px;
  box-shadow: none;
  height: 4px;
}

.skill-thumb .progress-bar-primary {
  background: #3d3d3f;
}



/*---------------------------------------
  Work section              
-----------------------------------------*/

#work .work-thumb {
  border-radius: 5px;
  margin-bottom: 15px;
  padding: 0;
  overflow: hidden;
  position: relative;
  top: 0;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

#work .work-thumb:hover {
  background: #ffffff;
  box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
  top: -5px;
}

#work .work-thumb img {
  border-radius: 5px;
}



/*---------------------------------------
  Contact section              
-----------------------------------------*/

#contact .form-control {
  border-radius: 0px;
  border-color: #f0f0f0;
  box-shadow: none;
  font-size: 16px;
  margin-top: 12px;
  margin-bottom: 12px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

#contact .form-control:focus {
  border-bottom: 2px solid #999999;
}

#contact input {
   background: #000000;
  border: none;
  border-radius: 20px;
  color: #ffffff;
  font-weight: 350;
  padding-bottom: 10px;
  margin-top: 24px;
  height: 165px;
  width: 140px;
}

#contact input:hover {
  background: #033292;
  border: none;
  border-radius: 20px;
  color: #ffffff;
  font-weight: 350;
  padding-bottom: 10px;
  margin-top: 24px;
  height: 165px;
  width: 140px;
}

#contact button#submit {
  background: #000000;
  border: none;
  border-radius: 50px;
  color: #ffffff;
  font-weight: 300;
  height: 55px;
  padding-bottom: 10px;
  margin-top: 24px;
}

#contact button#submit:hover {
  background: #d7b065;
  color: #ffffff;
}

#contact2 .form-control {
  border-radius: 0px;
  border-color: #f0f0f0;
  box-shadow: none;
  font-size: 16px;
  margin-top: 12px;
  margin-bottom: 12px;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
}

#contact2 .form-control:focus {
  border-bottom: 2px solid #999999;
}


#contact2 input {
  height: 55px;
  border: none;
  border-bottom: 1px solid #f0f0f0;
}

#contact2 button#submit {
  background: #000000;
  border: none;
  border-radius: 50px;
  color: #ffffff;
  font-weight: 300;
  height: 55px;
  padding-bottom: 10px;
  margin-top: 24px;
}

#contact2 button#submit:hover {
  background: #d7b065;
  color: #ffffff;
}


/*---------------------------------------
  Mobile Responsive styles              
-----------------------------------------*/

@media (min-width: 768px) and (max-width: 1024px) {
  #home {
    height: 50vh;
  }
}

@media (min-width: 667px) and (max-width: 767px) {
  #home {
    height: 140vh;
  }
}

@media (min-width: 568px) and (max-width: 665px) {
  #home {
    height: 190vh;
  }
}

@media (max-width: 980px) {

 h1 {font-size: 33px;}

 #work .work-thumb {
  margin-top: 30px;
 }

}


@media (max-width: 768px) {

  h1 {
    font-size: 30px;
    line-height: normal;
  }

  h2  {font-size: 30px;}

  .custom-navbar {
    background-color: #ffffff;
    box-shadow:0 40px 100px rgba(0,0,0,.2);
    padding-top: 0px;
    padding-bottom: 5px;
  }

  .custom-navbar .nav {
    padding-bottom: 10px;
  }

  .custom-navbar .nav li a {
    display: inline-block;
    margin-bottom: 5px;
  }

}


@media (max-width: 580px) {

  #about .about-thumb {
    margin-top: 0px;
  }

  .about-thumb .social-icon {
    margin-bottom: 15px;
  }

}


@media (max-width: 357px) {

  h1 {
    font-size: 28px;
  }

  #about .col-md-4 a {
    width: 85px;
    height: 85px;
  }

}


input[type="radio1"] {
        display: none;
    }
    input[type="radio1"] + img{
        border: 2px solid transparent;
    } 
    input[type="radio1"]:checked + img{
        border: 20px solid red;
    }

/*
 * Base structure
 */



/*
 * Global add-ons
 */

.sub-header {
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}

/*

/*
 * Placeholder dashboard ideas
 */

.placeholders {
  margin-bottom: 30px;
  text-align: center;
}
.placeholders h4 {
  margin-bottom: 0;
}
.placeholder {
  margin-bottom: 20px;
}
.placeholder img {
  display: inline-block;
  border-radius: 50%;
}

/* kanaele transition */

#kanal_0 {
    display: none;
    transition: all 3s ease-out
    opacity: 0;
}
#kanal_0.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_2 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_2.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_3 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_3.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_4 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_4.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_5 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_5.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_6 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_6.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#med_einlage1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#med_einlage1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#med_einlage2 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#med_einlage2.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#med_einlage3 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#med_einlage3.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#med_einlage4 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#med_einlage4.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#remove_med_einlage {
    opacity: 0;
}
#remove_med_einlage.active {
    opacity: 1;
}

/*kanal1_0*/

#kanal1_0 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_0.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_2 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_2.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_3 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_3.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_4 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_4.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_5 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_5.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_6 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_6.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_7 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_7.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_8 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_8.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal1_9 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal1_9.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_7 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_7.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_8 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_8.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kanal_9 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kanal_9.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}

/* Kontrolle */
#kontrolle1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kontrolle1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kontrolle2 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kontrolle2.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kontrolle3 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kontrolle3.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#kontrolle4 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#kontrolle4.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#remove_kontrolle {
    opacity: 0;
}
#remove_kontrolle.active {
    opacity: 1;
}

#raucher1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#raucher1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#remove_raucher {
    opacity: 0;
}
#remove_raucher.active {
    opacity: 1;
}

#rauchert1 {
    display: none;
    transition: all 3s ease-out;
    opacity: 0;
}
#rauchert1.active {
    opacity: 1;
    transition: all 3s ease-in;
    display: block;
}
#remove_rauchert {
    opacity: 0;
}
#remove_rauchert.active {
    opacity: 1;
}


#ui-datepicker-div{
    z-index: 3 !important;
}
 

	 /*---------------------------------------
  Range              
-----------------------------------------*/

	 

input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 8.4px;
  cursor: pointer;
  background: #c52222;

}

input[type=range]:focus::-webkit-slider-runnable-track {
  background: #367ebd;
}

input[type=range]::-moz-range-track {
  width: 100%;
  height: 2px;
  cursor: pointer;
  background: #c52222;
}

input[type=range]::-ms-track {
  width: 100%;
  height: 2px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2a6495;
}
input[type=range]:focus::-ms-fill-lower {
  background: #c52222;
}
input[type=range]::-ms-fill-upper {
  background: #c52222;
}
input[type=range]:focus::-ms-fill-upper {
  background: #367ebd;
}

.slider-container {
  width: 300px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.slider-container .back-bar {
  height: 10px;
  position: relative;
}
.slider-container .back-bar .selected-bar {
  position: absolute;
  height: 100%;
}
.slider-container .back-bar .pointer {
  position: absolute;
  width: 10px;
  height: 10px;
  background-color: red;
  cursor: col-resize;
  opacity: 1;
  z-index: 2;
}
.slider-container .back-bar .pointer.last-active {
  z-index: 3;
}
.slider-container .back-bar .pointer-label {
  position: absolute;
  top: -17px;
  font-size: 8px;
  background: white;
  white-space: nowrap;
  line-height: 1;
}
.slider-container .back-bar .focused {
  z-index: 10;
}
.slider-container .clickable-dummy {
  cursor: pointer;
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.slider-container .scale {
  top: 2px;
  position: relative;
}
.slider-container .scale span {
  position: absolute;
  height: 5px;
  border-left: 1px solid #999;
  font-size: 0;
}
.slider-container .scale ins {
  font-size: 9px;
  text-decoration: none;
  position: absolute;
  left: 0;
  top: 5px;
  color: #999;
  line-height: 1;
}
.slider-container.slider-readonly .clickable-dummy,
.slider-container.slider-readonly .pointer {
  cursor: auto;
}
.theme-green .back-bar {
  height: 5px;
  border-radius: 2px;
  background-color: #eeeeee;
  background-color: #e7e7e7;
  background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
  background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
  background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
}
.theme-green .back-bar .selected-bar {
  border-radius: 2px;
  background-color: #a1fad0;
  background-image: -moz-linear-gradient(top, #bdfade, #76fabc);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bdfade), to(#76fabc));
  background-image: -webkit-linear-gradient(top, #bdfade, #76fabc);
  background-image: -o-linear-gradient(top, #bdfade, #76fabc);
  background-image: linear-gradient(to bottom, #bdfade, #76fabc);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbdfade', endColorstr='#ff76fabc', GradientType=0);
}
.theme-green .back-bar .pointer {
  width: 14px;
  height: 14px;
  top: -5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 10px;
  border: 1px solid #AAA;
  background-color: #e7e7e7;
  background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
  background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
  background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
}
.theme-green .back-bar .pointer-label {
  color: #999;
}
.theme-green .back-bar .focused {
  color: #333;
}
.theme-green .scale span {
  border-left: 1px solid #e5e5e5;
}
.theme-green .scale ins {
  color: #999;
}
.theme-blue .back-bar {
  height: 5px;
  border-radius: 2px;
  background-color: #eeeeee;
  background-color: #e7e7e7;
  background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
  background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
  background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
}
.theme-blue .back-bar .selected-bar {
  border-radius: 2px;
  background-color: #92c1f9;
  background-image: -moz-linear-gradient(top, #b1d1f9, #64a8f9);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b1d1f9), to(#64a8f9));
  background-image: -webkit-linear-gradient(top, #b1d1f9, #64a8f9);
  background-image: -o-linear-gradient(top, #b1d1f9, #64a8f9);
  background-image: linear-gradient(to bottom, #b1d1f9, #64a8f9);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb1d1f9', endColorstr='#ff64a8f9', GradientType=0);
}
.theme-blue .back-bar .pointer {
  width: 14px;
  height: 14px;
  top: -5px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 10px;
  border: 1px solid #AAA;
  background-color: #e7e7e7;
  background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd));
  background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
  background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
  background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
}
.theme-blue .back-bar .pointer-label {
  color: #999;
}
.theme-blue .back-bar .focused {
  color: #333;
}
.theme-blue .scale span {
  border-left: 1px solid #e5e5e5;
}
.theme-blue .scale ins {
  color: #999;
}

/*---------------------------------------
  option section              
-----------------------------------------*/

#option{
  display: -webkit-box;
  display: -webkit-flex;
   display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
   align-items: center;
  height: 100vh;
  position: relative;
  top:-55px;
}
#option .option-thumb {
  border-radius: 5px;
  margin-bottom: 15px;
  padding: 0;
  overflow: hidden;
  position: relative;
  -webkit-transition: all ease-in-out 0.4s;
  transition: all ease-in-out 0.4s;
	  display: -webkit-box;
  display: -webkit-flex;
  /*  display: -ms-flexbox; */
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
   align-items: center;

}

#option .option-thumb:hover {
  background: #ffffff;
  box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
  top: -5px;
}

#option .option-thumb img {
  border-radius: 5px;
}


	 /*---------------------------------------
          FOOTER              
-----------------------------------------*/


footer {
  border-top: 1px solid #f9f9f9;
  padding: 10px 0 10px 0;
   left:0px;
   bottom:0px;
   width:100%;
	
}

.footer p {
  font-size: 10px;
  padding-top: 6px;
font-family: 'Lato', sans-serif;


}

.footer span {
  display: inline-block;
  padding: 0 4px 0 4px;
}

	 /*---------------------------------------
          BGS               
-----------------------------------------*/


svg {
    position: absolute;
    height: 100%
}

svg path {
    fill: #e3e3e3
}

#hero svg {
    left: 10px
}

#about svg, #featured svg, #three-slide svg {
    left: 90px
}

#full-slide svg {
    left: 0;
    opacity: .1;
    z-index: 9
}

#contact svg {
    left: 0
}

@media (max-width: 640px) {
    #hero svg, #about svg, #featured svg, #three-slide svg, #full-slide svg,
    #contact svg {
        left: 0
    }
}


#search {
    position: relative;
    width: 1440px;
    max-width: 95%;
    height: 600px;
    margin: 30px auto;
    background-color: #efefef;
    overflow: hidden
}

@media (max-width: 768px) {
    #search {
        margin: 15px auto
    }
}

#tobi {
	color: red;
}

	

/* Trigger
------------------------------ */
.s-header__trigger {
  position: relative;
  z-index: 9999;
  width: 3.125rem;
  height: 3.125rem;
  float: right;
  overflow: hidden;
  transition-duration: 500ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}

/* Trigger Icon */
.s-header__trigger-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: 1.375rem;
  height: 0.0625rem;
  background: #fff;
  -webkit-transform: translate3d(-50%, -50%, 0);
  transform: translate3d(-50%, -50%, 0);
  transition-duration: 500ms;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.7, 1, 0.7, 1);
}

.s-header__trigger-icon:before, .s-header__trigger-icon:after {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  content: " ";
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: transform 0.5s, width 0.5s, top 0.3s;
  transition: transform 0.5s, width 0.5s, top 0.3s;
}

.s-header__trigger-icon:before {
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transform: translate3d(0, 0.4375rem, 0);
  transform: translate3d(0, 0.4375rem, 0);
}

.s-header__trigger-icon:after {
  -webkit-transform-origin: left top;
  transform-origin: left top;
  -webkit-transform: translate3d(0, -0.4375rem, 0);
  transform: translate3d(0, -0.4375rem, 0);
}

.s-header__trigger--dark .s-header__trigger-icon {
  background: #222324;
}

.s-header__trigger svg {
  position: absolute;
  top: 0;
  left: 0;
}

.s-header__trigger circle {
  -webkit-transition: stroke-dashoffset 0.4s 0s;
  transition: stroke-dashoffset 0.4s 0s;
}

/* Trigger Is Active Style */
.-is-active.s-header__trigger {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.-is-active .s-header__trigger-icon {
  background: #fff;
}

.-is-active .s-header__trigger-icon:before, .-is-active .s-header__trigger-icon:after {
  width: 50%;
  -webkit-transition: transform 0.5s, width 0.5s;
  transition: transform 0.5s, width 0.5s;
}

.-is-active .s-header__trigger-icon:before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

.-is-active .s-header__trigger-icon:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.-is-active.s-header__trigger circle {
  stroke-dashoffset: 0;
  -webkit-transition: stroke-dashoffset 0.4s 0.3s;
  transition: stroke-dashoffset 0.4s 0.3s;
}

/* Overlay
------------------------------ */
.s-header-bg-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  background: rgba(34, 35, 36, 0);
  visibility: hidden;
  -webkit-transition: all 1s ease-in 0.4s;
  transition: all 1s ease-in 0.4s;
}

.s-header-bg-overlay.-is-open {
  background: rgba(34, 35, 36, 0.99);
  visibility: visible;
  -webkit-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}


/* Checkbox
------------------------------ */
 .big-checkbox {font-size:350%; border-radius: 50%;}

.big-checkbox input[type="checkbox"]:checked + label::before {
  background-color: #5bc0de;
  border-color: #5bc0de; }
.big-checkbox input[type="checkbox"]:checked + label::after {
  color: #fff; }