html, body  {
 width: 100%; 
 height: 100%; 
 margin: 0px; 
 padding: 0px;
 background-repeat: no-repeat;
 background-attachment:  fixed;
 background-size:100%;
background-color: #F0F0F0;
}


select {
 -moz-border-radius: 10px 10px 10px 10px;
 -webkit-border-radius: 10px 10px 10px 10px;
 -html-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
 behaviour:url(border-radius.htc);
-webkit-transition: all 0.7s ease;
 transition: all 0.7s ease;
 box-shadow: 3px 3px 5px #9C9CF0;
 
}
select:focus {
 -moz-border-radius: 0px 0px 0px 0px;
 -webkit-border-radius: 0px 0px 0px 0px;
 -html-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 behaviour:url(border-radius.htc);
 background-color: #2EF5EE;
 font-size:18px;
box-shadow: 6px 6px 10px #9C9CF0;
}


option  {
   color: white;
    box-shadow: 0 0 10px 100px  #2EF5EE inset;
 font-size: 20px;
}

option:hover {
      box-shadow: 0 0 10px 100px  #0A8A86 inset;


}


input{
 -moz-border-radius: 10px 10px 10px 10px;
 -webkit-border-radius: 10px 10px 10px 10px;
 -html-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
 behaviour:url(border-radius.htc);
 box-shadow: 3px 3px 5px #9C9CF0;
 }

textarea{
 -moz-border-radius: 10px 10px 10px 10px;
 -webkit-border-radius: 10px 10px 10px 10px;
 -html-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
 behaviour:url(border-radius.htc);
 box-shadow: 3px 3px 5px #9C9CF0;
 margin-bottom: 10px;
 }

input[type=text] {
 -webkit-transition: all 0.7s ease;
 transition: all 0.7s ease;
}

input[type=text]:focus {
 -webkit-transform:scale(1.4);
 transform:scale(1.4);
 background-color: #2EF5EE;
-moz-border-radius: 0px 0px 0px 0px;
 -webkit-border-radius: 0px 0px 0px 0px;
 -html-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 behaviour:url(border-radius.htc);
  box-shadow: 6px 6px 10px #9C9CF0;
}



textarea:focus {
   -moz-border-radius: 0px 0px 0px 0px;
 -webkit-border-radius: 0px 0px 0px 0px;
 -html-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 behaviour:url(border-radius.htc);
 -webkit-transform:scale(1.4);
 transform:scale(1.4);
 background-color: #2EF5EE;
box-shadow: 6px 6px 10px #9C9CF0;
}
textarea {
 -webkit-transition: all 0.7s ease;
 transition: all 0.7s ease;
}



.slideshow {
position: relative; width:100%; height:200px; margin-bottom: 1%;

}


.slideshow img {
position:absolute;
top:0;
left:0;
overflow: hidden;
}




.slideshow img {
-webkit-animation-name: slider;
-webkit-animation-timing-function: ease-out;
-webkit-animation-duration: 35s;
-webkit-animation-iteration-count: infinite;
animation-name: slider;
animation-timing-function: ease-out;
animation-duration: 35s;
animation-iteration-count: infinite;
}

@-webkit-keyframes slider {
0% {opacity:1;} 20% {opacity:0;} 80% {opacity:0; -webkit-transform: scale3d(3, 3, 3);} 100% {opacity:1; }

}

@keyframes slider {
0% {opacity:1;} 20% {opacity:0;} 80% {opacity:0;  transform: scale3d(3, 3, 3);} 100% {opacity:1; }
   
}

.slideshow img:nth-child(1) {
-webkit-animation-delay: 35s; animation-delay: 35s;
}

.slideshow img:nth-child(2) {
-webkit-animation-delay: 28s; animation-delay: 28s;
}

.slideshow img:nth-child(3) {
-webkit-animation-delay: 21s; animation-delay: 21s;

}

.slideshow img:nth-child(4) {
-webkit-animation-delay: 14s; animation-delay: 14s;

}

.slideshow img:nth-child(5) {
-webkit-animation-delay: 7s; animation-delay: 7s;

}






@-webkit-keyframes slidemenubody {
  from {
 opacity: 1;
 -webkit-transform: translate3d(0, 0, 100%);
 transform: translate3d(0, 0, 100%);
    }    
  
     to {
 -webkit-transform: perspective(2000px) rotateY(-25deg);
 transform: perspective(2000px) rotateY(-25deg);
  }
}

@keyframes slidemenubody {
  from {
 opacity: 1;
 
 -webkit-transform: translate3d(0, 0, 100%);
 transform: translate3d(0, 0, 100%);
  }
 
 to {
 
 -webkit-transform: perspective(2000px) rotateY(-25deg);
 transform: perspective(2000px) rotateY(-25deg);
 
  }
}


@-webkit-keyframes fadeInRight {
  from {
 opacity: 0;
 -webkit-transform: translate3d(100%, 0, 0);
 transform: translate3d(100%, 0, 0);
  }

  to {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
  }
}

@keyframes fadeInRight {
  from {
 opacity: 0;
 -webkit-transform: translate3d(100%, 0, 0);
 transform: translate3d(100%, 0, 0);
  }

  to {
 opacity: 1;
 -webkit-transform: none;
 transform: none;
  }
}




@-webkit-keyframes fadeInLeft {
  from {

 -webkit-transform: translate3d(-100%, 0, 0);
 transform: translate3d(-100%, 0, 0);
  }

  to {

 -webkit-transform: none;
 transform: none;
  }
}

@keyframes fadeInLeft {
  from {

 -webkit-transform: translate3d(-100%, 0, 0);
 transform: translate3d(-100%, 0, 0);
  }

  to {

 -webkit-transform: none;
 transform: none;
  }
}



@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
 -ms-transform: rotate(0deg);
 -moz-transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
 -o-transform: rotate(0deg);
 transform: rotate(0deg);
  }
  to {
 -ms-transform: rotate(-360deg);
 -moz-transform: rotate(-360deg);
 -webkit-transform: rotate(-360deg);
 -o-transform: rotate(-360deg);
 transform: rotate(-360deg);
  }}

@keyframes rotating {
  from {
 -ms-transform: rotate(0deg);
 -moz-transform: rotate(0deg);
 -webkit-transform: rotate(0deg);
 -o-transform: rotate(0deg);
 transform: rotate(0deg);
  }
  to {
 -ms-transform: rotate(-360deg);
 -moz-transform: rotate(-360deg);
 -webkit-transform: rotate(-360deg);
 -o-transform: rotate(-360deg);
 transform: rotate(-360deg);
  }}

@-webkit-keyframes rotateInDownLeft {
  from {
 -webkit-transform-origin: left bottom;
 transform-origin: left bottom;
 -webkit-transform: rotate3d(0, 0, 1, -45deg);
 transform: rotate3d(0, 0, 1, -45deg);
 opacity: 0;
  }

  to {
 -webkit-transform-origin: left bottom;
 transform-origin: left bottom;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
 -webkit-transform-origin: left bottom;
 transform-origin: left bottom;
 -webkit-transform: rotate3d(0, 0, 1, -45deg);
 transform: rotate3d(0, 0, 1, -45deg);
 opacity: 0;
  }

  to {
 -webkit-transform-origin: left bottom;
 transform-origin: left bottom;
 -webkit-transform: none;
 transform: none;
 opacity: 1;
  }
}    


@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
 
  }

  to {
  
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
   
  }

  to {

   visibility: hidden; 
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@-webkit-keyframes fadeInclose {
  from {
   
   opacity: 0;
  }

  to {
   opacity: 1;
  
  }
}

@keyframes fadeInclose {
  from {
   
   opacity: 0;
  }

  to {
   opacity: 1;
   
  }
}




 @-webkit-keyframes blink {
  from {
 opacity: 0.8;

    }

     to {
 opacity: 0;
  }
}

@keyframes blink {
  from {
 opacity: 0.8;


  }

 to {

 opacity: 0;


  }
}

.rotating {
 -webkit-animation: rotating 360s 500ms /* ... zeit ... delay ms oder s */  linear infinite;
 -moz-animation: rotating 360s 500ms linear infinite;
 -ms-animation: rotating 360s 500ms linear infinite;
 -o-animation: rotating 360s 500ms linear infinite;
 animation: rotating 360s 500ms linear infinite;

}


.top_logo_fadeIn {
 -webkit-animation: rotateInDownLeft 1000ms linear;
 -moz-animation: rotateInDownLeft 1000ms linear;
 -ms-animation: rotateInDownLeft 1000ms linear;
 -o-animation: rotateInDownLeft 1000ms linear;
 animation: rotateInDownLeft 1000ms linear;

}


.contentslider {
 -webkit-animation: fadeInRight 1000ms linear  both;
 -moz-animation: fadeInRight 1000ms linear  both;
 -ms-animation: fadeInRight 1000ms linear  both;
 -o-animation: fadeInRight 1000ms linear  both;
 animation: fadeInRight 1000ms linear  both;

}

.content-top {
 -webkit-animation: fadeInLeft 1000ms linear  both;
 -moz-animation: fadeInLeft 1000ms linear  both;
 -ms-animation: fadeInLeft 1000ms linear  both;
 -o-animation: fadeInLeft 1000ms linear  both;
 animation: fadeInLeft 1000ms linear  both;

}

.content-top-button {
 -webkit-animation: fadeInLeft 1000ms 1100ms linear  both;
 -moz-animation: fadeInLeft 1000ms 1100ms linear  both;
 -ms-animation: fadeInLeft 1000ms 1100ms linear  both;
 -o-animation: fadeInLeft 1000ms 1100ms linear  both;
 animation: fadeInLeft 1000ms 1100ms linear  both;

}

.content-top-close {
 -webkit-animation: fadeInclose 2000ms 1100ms linear  both;
 -moz-animation: fadeInclose 2000ms 1100ms linear  both;
 -ms-animation: fadeInclose 2000ms 1100ms linear  both;
 -o-animation: fadeInclose 2000ms 1100ms linear  both;
 animation: fadeInclose 2000ms 1100ms linear  both;

}


.content-top-slidein {
 -webkit-animation: fadeInLeft 1000ms linear  both;
 -moz-animation: fadeInLeft 1000ms linear  both;
 -ms-animation: fadeInLeft 1000ms linear  both;
 -o-animation: fadeInLeft 1000ms linear  both;
 animation: fadeInLeft 1000ms linear  both;

}

.content-top-slideout {
 -webkit-animation: slideOutLeft 1000ms linear  both;
 -moz-animation: slideOutLeft 1000ms linear  both;
 -ms-animation: slideOutLeft 1000ms linear  both;
 -o-animation: slideOutLeft 1000ms linear  both;
 animation: slideOutLeft 1000ms linear  both;

}
.zoom:hover {
-webkit-transform:scale(1.3);
transform:scale(1.3);
}

.zoom {
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
}


  #bannertext{
 text-shadow: 0 0 0.4em #000000, 0 0 0.4em #000000, 0 0 0.4em #808080;
 position: absolute;
 vertical-align: middle;
 margin-left: auto;
 margin-right: auto;
 width: 100%;
 margin-top: 4.2em;
 z-index: 96;
-webkit-animation: fadeInclose 1200ms ease-in;
 -moz-animation: fadeInclose 1200ms ease-in;
 -ms-animation: fadeInclose 1200ms ease-in;
 -o-animation: fadeInclose 1200ms ease-in;
 animation: fadeInclose 1200ms ease-in;


}



.mail::after {
     font-weight: bold;
     content:'info@universal-pc.ch';
     -webkit-animation:none;
     animation:none;
}



.clr {
    clear: both;
}

.browser {
    display: none;
    color:red;
    text-align: center;
    font-weight: bold;
}

#content a {
 text-decoration: none;
 color: #FFFFFF;
 -webkit-transition: all 0.4s ease;
 transition: all 0.4s ease;
 text-shadow: 0 0 0.07em #000000, 0 0 0.07em #000000, 0 0 0.12em #808080;
 border-bottom: 1px inset #000000;


}

#content a:hover {
 border-bottom: 1px dotted  gray;
 text-shadow: 0 0 0.20em #000000, 0 0 0.20em #000000, 0 0 0.25em #808080;

}

img {
   border:none;
}

p.intro::first-letter {
    color: #000080;
    font-size:200%;
    font-family: Times;
   font-weight: bold;
}




#tips {
z-index: 11;
position: fixed;
max-height: 100px;
overflow: hidden;
width: 130px;
background-color: #F0F0F0;
bottom: 150px;
right: 5px;
 -moz-border-radius: 10px 10px 10px 10px;
 -webkit-border-radius: 10px 10px 10px 10px;
 -html-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
 behaviour:url(border-radius.htc);
 box-shadow: 3px 3px 5px #9C9CF0;
 border: inset 3px rgba(13,89,245,0.6);
 -webkit-transition: all 0.5s ease;
transition: all 0.5s ease;

}

#tips:hover {
    overflow-y: scroll;
   -webkit-transform:scale(1.3);
transform:scale(1.3);
right:30px;
}


#textDestination {
 position: relative;
 width: 90%;
 height: 90%;
 text-align: left;
 font-size:15px;
 margin-left:5%;
 margin-right: 5px;
 margin-top: 5px;
 margin-bottom: 5px;

 font-weight: bold;

    
}

#textDestination::after {
    content: ".";
 -webkit-animation-name: blink;
-webkit-animation-timing-function: ease-in;
-webkit-animation-duration: 1s;
-webkit-animation-delay: 0s;
-webkit-animation-iteration-count: infinite;
animation-name: blink;
animation-timing-function: ease-in;
animation-duration: 1s;
animation-delay: 0s;
animation-iteration-count: infinite;
padding-top: 0px;
margin: 0px;
padding-bottom: 0px;
padding-left: 1px;
padding-right: 0px;


}

#tipsimage {
bottom:  0px;
 right: 10px;
 position: fixed;
 z-index: 11;
 height: 150px;
 width: 125px;

}


#opentips {
    width: 40px;
    height: 20px;
    display: none;
    bottom: 5px;
    right:  5px;
    position: fixed;
      background: rgba(12,134,245, 0.5);
   -webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
     z-index: 11;
    -moz-border-radius: 10px 10px 10px 10px;
 -webkit-border-radius: 10px 10px 10px 10px;
 -html-border-radius: 10px 10px 10px 10px;
 border-radius: 10px 10px 10px 10px;
 behaviour:url(border-radius.htc);

 color: white;
 text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000;
text-align: center;
     
}

#opentips:hover {
    width: 100px;
 box-shadow: -3px -3px 5px #9C9CF0;
}

#logoimage {
    width: 70%;
    margin-left: 3px;
    margin-right: auto; 
    margin-top:3px;
    z-index:100;
    height: auto;
   border: none;
}



#slideout {
 position: fixed;
 display: block; 
 z-index:100; 
 width: 5%;
 top:0;
}

#slideout img:hover {
 box-shadow: 5px/* X-axis */ 5px /* Y-axis */ 10px /* 'blur' */ #888888;
  -moz-box-shadow: 5px 5px 10px #888888;
  -webkit-box-shadow: 5px 5px 10px #888888;
   -moz-border-radius: 5px 10px 10px 10px;
 -webkit-border-radius:  5px 10px 10px 10px;
 -html-border-radius:  5px 10px 10px 10px;
 border-radius:  5px 10px 10px 10px;
 behaviour:url(border-radius.htc);
    
}


#slidein  {
     position: fixed;
 display: none;
 z-index:100;
 width: 15px;         
  top:0;

}

#slidein img {

    box-shadow: 2px/* X-axis */ 2px /* Y-axis */ 1px /* 'blur' */ #888888;
  -moz-box-shadow: 2px 2px 1px #888888;
  -webkit-box-shadow: 2px 2px 1px #888888;
     -moz-border-radius: 3px 3px 3px 3px;
 -webkit-border-radius: 3px 3px 3px 3px;
 -html-border-radius: 3px 3px 3px 3px;
 border-radius: 3px 3px 3px 3px;
 behaviour:url(border-radius.htc);


}



#indexmenu {
 display: none;
 width: 300px; 
 background-color: #E8E4F5;
 height: 100%; 
 position: fixed; 
 overflow-y:scroll; 
 overflow-x: hidden;
 float:left;
 z-index:199;
 text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000;
   text-align:center;
  box-shadow: 5px/* X-axis */ 0px /* Y-axis */ 10px /* 'blur' */ #888888;
  -moz-box-shadow: 5px 0px 10px #888888;
  -webkit-box-shadow: 5px 0px 10px #888888;

scrollbar-face-color: #EFEFEF;
scrollbar-3dlight-color: #C0DCC0;
scrollbar-arrow-color: #FFFFFF;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: #FFFFFF;
scrollbar-base-color: #FFFFFF;
scrollbar-track-color: #000000;
scrollbar-highlight-color: #000000;
  top:0;
}

#menuslider {
z-index: 100;

}


#indexmenu a {
    color: #FFFFFF; 
     margin-left:5px;
}





#text {

 font-size:1.5em;
 margin:5%;
  padding: 0;
}


#menubutton {
 display: none;
}

#top {
 height: 355px;
 width: 100%;
  background-color: #F0F0F0;
 position: absolute;
 margin-left: auto;
 margin-right: auto;
 z-index: 0;
 top: 0px;


  }

.top_logo {
 position:fixed;
 top: 4%;
 margin-left:10%;
 margin-right: auto;
 width: 80%;
 background: #F0F0F0;
 z-index: 0;
 
}


.universal {
 position:relative;
 width:100%; 
 height: 200px;
 margin-bottom: 0;
 margin-left: auto;
 margin-right: auto; 
z-index: 55;
 overflow: hidden;
 z-index: 10;

}



#content {
 width: 100%;
 height: auto;
top: 50%;
 position: relative;
 color: #000000;
 margin-left: auto;
 margin-right: auto;
 background-color: transparent;
 z-index: 10;
 text-align: center;
 font-size: 17px;
 font-family: serif;
 line-height: 1.4;
font-weight: bold;
  background-color: #F7F3F7;
 padding-bottom: 20px;
 padding-top: 20px;

}


#inhalt {
 width: 80%;
 height: auto;
 margin-right: auto;
 margin-left: auto;
 position: relative;
 padding: 0px;
 padding-bottom: 15px;
  text-shadow: 0 0 0.2em #F0F0F0, 0 0 0.2em #F0F0F0, 0 0 0.2em #F0F0F0;
}



#content img {
 width: 220px;
 height: 220px;
 border: none;
}

#div {
 height: auto;
 margin-right: auto;
 margin-left: auto;
 width: 100%;
  background: #000000;
  background-repeat: repeat;
  background-attachment: fixed;
  background-position: center center;
 text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000;
  text-align: center;
   z-index: 11;
  margin-top: 25%;
position: relative;
 box-shadow: 10px/* X-axis */ 0px /* Y-axis */ 10px /* 'blur' */ #888888;
  -moz-box-shadow: 10px 0px 10px #888888;
  -webkit-box-shadow: 10px 0px 10px #888888;


  }

#div a {
 text-decoration: none;
 color: #FFFFFF;
 font-size: 20px;
 padding: 15px;
 display:inline-block;
 font-family: sans-serif;
 margin-right: auto;

}
.active a {
     background: rgba(24,39,50,0.7);
     padding: 15px;

}

ul {
 display: inline;
 margin: 0;
 padding: 0;
}

ul li {
 display: inline-block;
}

#div a:hover {
  background: rgba(24,39,50,0.7);

}

ul li:hover ul {
 display: block;

}

ul li ul {
 position: absolute;
 width: 100%;
 display: none;
 z-index: 11;
 background: #000000;

}







ul li ul li {

 display: block;
}

ul li ul li a {
 display:block;
}

ul li ul li:hover {
 background: #808080;
}





 #content-top  {
 text-align: center;
 width: 100%;
 margin-right: auto;
 margin-left: auto;
  position: relative;
 height: 200px;
 margin-top: 0;
z-index:9;
overflow: hidden;
background-color: white;
}







  .text{
 font-family: sans-serif;
 font-size: 23px;
  margin-top: 0;
 margin-bottom: 0;
 padding-top: 20px;
padding: 0px;
  }
                                                                                   
  .bannertext{
 font-family: sans-serif;
 font-size: 23px;
 color: #FFFFFF;

  }


 
 .footer {
 text-decoration: none;

 
 }
 
#footer {
  /* text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000; */

 height: auto;
 position: absolute;
 color: #000000;
 width: 100%;
 text-align: center;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 0px;
    clear: both;
   z-index: 11;
 font-family: sans-serif;
 box-shadow: 0px -5px 5px #888888;
   -moz-box-shadow: 0px -5px 5px #888888;
   -webkit-box-shadow: 0px -5px 5px #888888;
     background-color:#F7F3F7;
     padding: 0px;
     padding-bottom: 0px;
}



@media screen and (max-width:800px) {

  

 #bannertext{
 margin-top: 3.2em;
 -webkit-animation: none;
 -moz-animation: none;
 -ms-animation: none;
 -o-animation: none;
 animation: none;

  }
  
 #content a {

 -webkit-transition: none;
 transition: none;
}


#content-top  {
 width: 100%;
 margin-left: auto;
 margin-right: auto;
 padding: 0;
 height: 170px;
 margin-top: 45%;
 background-color: white;
box-shadow: -5px/* X-axis */ 0px /* Y-axis */ 5px /* 'blur' */ #808080;
  -moz-box-shadow: -5px 0px 5px #808080;
  -webkit-box-shadow: -5px 0px 5px #808080; 
}

#content {


 height: auto;
 padding-top: 20px;
 text-align: center;
}

#text {
 font-size:1.5em;
 margin-left:15%;
}

#content img {
 width: 250px;
 height: 250px;
}


 


.rotating {
 -webkit-animation: rotating 180s linear infinite;
 -moz-animation: rotating 180s linear infinite;
 -ms-animation: rotating 180s linear infinite;
 -o-animation: rotating 180s linear infinite;
 animation: rotating 180s linear infinite;

}


.contentslider {

 -webkit-animation: none;
 -moz-animation: none;
 -ms-animation: none;
 -o-animation: none;
 animation: none;
}

.top_logo_fadeIn {
 -webkit-animation: none;
 -moz-animation: none;
 -ms-animation: none;
 -o-animation: none;
 animation: none;

}
.content-top {
 -webkit-animation: none;
 -moz-animation: none;
 -ms-animation: none;
 -o-animation: none;
 animation: none;
}



#footer{
 width: 100%;
 box-shadow: 0px -5px 5px #888888;
   -moz-box-shadow: 0px -5px 5px #888888;
   -webkit-box-shadow: 0px -5px 5px #888888;



}


  
#div {
display:none;


  }




 #centerdiv{
 margin-right: auto;
 margin-left:  auto;
 width: 100%;
 position: relative;
 height: auto;
}

.universal {
 position:relative; width:100%; height:170px; margin-bottom: 0;
 z-index: -1;
 }
 
 .slideshow img {
     height: 170px;
 }

#top{
 height:auto;
 width: 100%;
 background-color: #FFFFFF;
   z-index: 0;
}

.top_logo {
 position:fixed;
 margin-left:10%;
 margin-right: auto;
 top: 8%;
 height: auto;

 
 
}

#slideout    {
 width: 50px;
top: 0;
 max-height: 50px;
 margin-bottom: 0;
 padding-bottom: 0;
}
#slidein    {
 width: 40px;
 max-height: 40px;
}


#slideout img, #slidein img {
     max-height: 40px;
}

#logoimage {

    margin-left: 5px;
     margin-top:5px;
     height:100%;

}


#inhalt {
    margin-top: 0;
    padding-top: 0;
}





.text {
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-bottom: 20px;
}







input[type=text]:focus {
 -webkit-transform:scale(1.0);
 transform:scale(1.0);
 background-color: #2EF5EE;
-moz-border-radius: 0px 0px 0px 0px;
 -webkit-border-radius: 0px 0px 0px 0px;
 -html-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 behaviour:url(border-radius.htc);

}



textarea:focus {
   -moz-border-radius: 0px 0px 0px 0px;
 -webkit-border-radius: 0px 0px 0px 0px;
 -html-border-radius: 0px 0px 0px 0px;
 border-radius: 0px 0px 0px 0px;
 behaviour:url(border-radius.htc);
 -webkit-transform:scale(1.0);
 transform:scale(1.0);
 background-color: #2EF5EE;
}





 #tips {
display:none;

}




#textDestination {
display:none;

}


#tipsimage {
display:none;

}


#opentips {
   display:none;

}



}


@media screen and (max-height:450px) {

.top_logo {
 position:fixed;
 margin-left:10%;
 margin-right: auto;
 top: 10%;

 height: auto;
  }
  
#slideout    {
 width: 12%;

 margin-bottom: 0;
 padding-bottom: 0;
}  

 #content a {

 -webkit-transition: none;
 transition: none;
}


#content-top  {
    
box-shadow: -5px/* X-axis */ 0px /* Y-axis */ 5px /* 'blur' */ #808080;
  -moz-box-shadow: -5px 0px 5px #808080;
  -webkit-box-shadow: -5px 0px 5px #808080;
   margin-top: 40%;


}
  

#div {
display:none;


  }



}