@charset "UTF-8";

/* https://www.youtube.com/watch?v=8JRchWACddc */

/* body, html { margin: 0; padding: 0; width: 100%; height: 100%; color: #34efa7; }  */
body, html { margin: 0; padding: 0; width: 100%; height: 100%; font-family: 'Roboto', sans-serif; color: #ffffff;}

#ud_slider { position: absolute; top: 0; left: 0; bottom: 0; right: 0; width:100%; height:100%; background: #110000; font-family: 'Roboto', sans-serif; overflow: hidden; z-index: -1;}
#ud_slider .ud_slide { background-size: cover; position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; display: none;}
#ud_slider .ud_slide img {opacity: 0; width: 100%;}
#ud_slider .ud_slide h3 { background-color: rgba(190, 140, 0, 0.4); color: #ffffff; margin: 0; padding: 7px; padding-top: 2px; border-radius: 3px 3px 3px 3px; position: absolute; left: -800px; bottom: 102px; font-size: 18px; font-weight: 500; letter-spacing: 0.5px; z-index: 1;}
#ud_slider .ud_slide h4 { background-color: rgba(5, 3, 0, 0.6); color: #ffffff; margin: 0; padding: 8px; padding-bottom: 6px; border-radius: 3px 3px 3px 3px; position: absolute; left: -800px; bottom: 78px; font-size: 15px; font-weight: 100; letter-spacing: 0.5px}
.slider_img { position: absolute; top:0; left:0;}
/* progress bar */
#ud_slider #ud_load { position: absolute; left: 0; bottom: 0; background: rgba(230, 230, 230, 0.3); border-right: 7px solid rgba(255, 255, 255, 0.6); width: 0; height: 4px;}

/*  Image Crossfade        190, 140, 0, 0.4   */
/* cf7 */
#cf7_controls {
  text-align:center;
}
#cf7_controls span {
  cursor:pointer;
}
#cf7 {
  position:relative;
  top: 0;
  left: 0;
  width:100%;
  margin:0 auto 10px;
}
#cf7 div img {
  position:absolute;
  left:0;
  -webkit-transition: opacity 15s ease-in-out;
  -moz-transition: opacity 15s ease-in-out;
  -o-transition: opacity 15s ease-in-out;
  transition: opacity 15s ease-in-out;
  opacity:0;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}

#cf7 div img.opaque {
  opacity:1;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=1);
}



a:link {
    text-decoration: none;
    color: rgba(240, 240, 240, 0.7);
}

a:visited {
    text-decoration: none;
    color: rgba(240, 240, 240, 0.7);
}

a:hover {
    text-decoration: none;
    color: rgba(240, 240, 240, 0.7);

}

a:active {
    text-decoration: none;
    color: rgba(240, 240, 240, 0.7);
}

/* MENU */

.hidden {
  visibility: hidden;
  padding-left: 20px;
  -moz-transition: 1s;
  -ms-transition: 1s;
  -webkit-transition: 1s;
  -o-transition: 1s;
  transition: 1s;
}

.hidden:hover {
  visibility: visible;
}

.about {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  font-weight: lighter;
  color: #fff;
  display: none;

  background: rgba(30, 30, 30, 0.7);
  border: 4px solid #000;
  border-radius: 25px 25px 25px 25px;
  position: absolute;
  top: 25%;
  left: 25%;
  right: 25%;
  width: 50%;
  padding: 30px;

}

.contact {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  font-weight: lighter;
  color: #fff;
  display: none;

  background: rgba(30, 30, 30, 0.7);
  border: 4px solid #000;
  border-radius: 25px 25px 25px 25px;
  position: absolute;
  top: 25%;
  left: 25%;
  right: 25%;
  width: 50%;
  padding: 30px;

}

.impressum {
  font-family: 'Roboto', sans-serif;
  font-size: 13px;
  font-weight: lighter;
  text-align: center;
  color: #fff;
  display: none;

  background: rgba(30, 30, 30, 0.7);
  border: 2px solid #000;
  border-radius: 25px 25px 25px 25px;
  position: absolute;
  top: 10%;
  left: 25%;
  right: 25%;
  width: 50%;
  padding: 30px;
}

h5 {margin: 0; padding: 0; margin-bottom: 0; padding-top: 0;}
a {margin: 0; padding: 0; margin-bottom: 0; padding-top: 0;}

.a_underlined {text-decoration: underline; padding: 0; margin: 0; font-weight: lighter; display: inline-block;}

#a_impressum_in { font-size: 12px;}

.impressum_h1 {font-size: 16px; font-weight: 500; margin-bottom: 30px;}
.impressum_h2 {font-weight: 400; margin: 0px; padding: 0;}
.impressum_h3 {font-size: 14px; font-weight: 200; margin: 1px; margin-bottom: 10px;}




#menu-selector { position: relative; top: 15px; left: 27px; font-size: 52px; font-weight: 200; letter-spacing: 0.5px; font-family: 'Roboto', sans-serif;
      color: rgba(230, 230, 230, 0.7); text-align: left; line-height: 7px; padding-left: 10px; display: inline-block;}
#menu-selector:hover {color: rgba(20, 230, 230, 0.7);}

#menu-selector:hover ~ .hidden {visibility: visible;}

#menu-1 { position: relative; top: 0px; font-size: 52px; font-weight: 200; letter-spacing: 0.5px; font-family: 'Roboto', sans-serif;
      color: rgba(230, 230, 230, 0.7);}

#copyright { background-color: rgba(1, 0, 0, 0.5); margin: 20; padding: 4px; font-size: 10px; font-weight: 200;
      letter-spacing: 0.5px; font-family: 'Roboto', sans-serif; color: #dddddd; text-align: center; position: absolute;
      top: 97%; left: 43%; z-index: 1; }


nav { position: absolute; top: 30px; left: 50px; font-size: 24px; font-weight: 200; letter-spacing: 0.5px;
      font-family: 'Roboto', sans-serif; color: rgba(230, 230, 230, 0.8); text-align: left;}

nav div ul { margin: 0; padding: 0; float:left; font-size: 24px; font-weight: 200; letter-spacing: 0.5px;
        text-align: left; }  /* box-shadow: 0px 0px 5px 0px #111; */

nav div ul li { position: relative; border-right: 1px solid #444; list-style: none; float:left; font-size: 18px;
        font-weight: 200; letter-spacing: 0.5px; text-align: center; background: rgba(20, 20, 20, 0.5); padding: 10px;
        padding-top: 5px; padding-bottom: 5px; width:100px;
        -moz-transition: 0.6s;
        -ms-transition: 0.6s;
        -webkit-transition: 0.6s;
        -o-transition: 0.6s;
        transition: 0.6s;}
nav div ul li:hover { background: rgba(210, 150, 0, 0.5); color: #FFF;}
nav div ul li:hover #menu1-bold { font-weight: 400; color: #FFF;}
nav div ul li:first-child { border-radius: 4px 0 0 4px;}
nav div ul li:last-child { border-radius: 0 4px 4px 0; border-right: 0px solid #444;}

nav div ul li:hover ul { height: auto; opacity: 1;}

nav div ul li ul { height: 0; overflow: hidden; opacity: 0; position: absolute; top: 32px; left: 0; font-size: 10px;
    font-weight: 200; letter-spacing: 0.5px;
    -moz-transition: 0.6s;
    -ms-transition: 0.6s;
    -webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;}
nav div ul li ul li {border: none; border-radius: 0px 0px 0px 0px;
  -moz-transition: 0.6s;
  -ms-transition: 0.6s;
  -webkit-transition: 0.6s;
  -o-transition: 0.6s;
  transition: 0.6s;}

  nav div ul li ul li:first-child { border-radius: 4px 4px 0 0;}
  nav div ul li ul li:last-child { border-radius: 0 0 4px 4px; border-right: 0px solid #444;}

nav div ul li ul li:hover {
    background: rgba(180, 130, 0, 0.3);
    -moz-transition: 0.6s;
    -ms-transition: 0.6s;
    -webkit-transition: 0.6s;
    -o-transition: 0.6s;
    transition: 0.6s;}

nav div ul li ul li:hover div a { font-weight: 300; color: #fff}

#menu-2 {font-size: 12px; font-weight: 200;
      letter-spacing: 0.5px; font-family: 'Roboto', sans-serif; color: #ffffff; }

#pageOfAllPage {font-size: 14px; font-weight: 200; text-align: center;
      position: absolute;
      bottom: 5%;
      right: 5%;
    }
.pageOfAllPage_black {color: #000;}

#deg45 {font-size: 24px; font-weight: 100;
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  }
