* {
    /*background-color: white;*/
    font-family: Roboto;
/*    link rel="favicon" href="/optosoft.png" type="image/png";*/
    meta name="description" content="Das ist die OptoSoft Internetseite"
    A:link { text-decoration: none; }
    margin: 0;
    padding: 0;
}


/* Allgemeines */

body {
    margin: 0;
    padding: 0;
    line-height: 1.5;
    background-image: linear-gradient(to bottom, #98ABFA 20%, #FFFFFF 100%);
    background-repeat: no-repeat;
}

p {
   /* width: 80%;*/
    text-align: justify;
    font-size: 1.07em;
}

h1 {
    font-size: 1.5em;
    color: #0000FF;
    text-decoration-style: 
    font-weight: 200;
    margin: 0px 0px 23px 13px;
}

h2 {
    font-size: 2.5em;
    color: #0000FF;
    text-align: center;
    text-decoration: overline;
}

hr { 
	width: 90%; 
    height: 2px; 
    margin: 60px auto;
    background-color: black;
}

textarea {
    width: 97%;
    margin: 15px 14.7px 30px 14.7px;
}

btn {
    border-radius: 7px;
    color: #000000;
    font-size: 16px;
    background: #E5E6E9;
    padding: 8px 20px;
    text-decoration: none;
    margin: 3px; 
}

btn:hover {
    background: #1e72c8;
    text-decoration: none;
    color: #fff;
}

.tab {
    text-indent: 20px;
}


/* Template */

#container {
    width: 980px;
    margin: auto;
}

#kopf {
    padding: 0;
    margin: 0;
    background: url(../pictures/medizin.jpg) no-repeat left top;
    height: 200px;
    width: 100%;
}

#language img {
    padding: 0;
    float: right;
    margin-right: 5px;
    margin-left: 5px;
    margin-top: 171px;
    margin-bottom: 5px;
}

#navigation {
    width: 980px;
    margin: 0 auto;
}

#navigation li {
    width: 14.285714286%;
    float: left;
    border: 10px;
}

#navigation ul {
    width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#navigation a:link,
a:visited {
    /*box-shadow:inset 3px 3px 10px #666;*/
    float: left;
    display: block;
    width: 100%;
    /*font-weight: ;*/
    color: #0000FF;
    text-align: center;
    padding: 4px;
    text-decoration: none;
}

#index #navigation li a:link,
#index #navigation li a:visited {
    background: #E5E6E9 ;
    color: #0000FF;
}

#index #navigation li a:hover,
#index #navigation li a:active,
#index #navigation li#current a:link,
#index #navigation li#current a:visited {
    background: #1e72c8;
    color: #fff;
}

#index #navigation li a:active,
#index #navigation li a:link {
    color: 0000ff;
}

#underline {
    width: 980px;
    margin: 0% auto;
}

#underline li {
    width: 14.285714286%;
    float: left;
    border: 0;
    padding: 0;
    margin: 0;
    height: auto;
    height: 3px;
}

#underline ul {
    width: 100%;
    list-style-type: none;
    margin: 0;
    overflow: hidden;
    border: 0;
    padding: 0;
    margin: 0;
}

#currentpage {
    width: 140px; 
    height: 4px; 
    background: yellow; 
}


/* Home */

#startseite {
    margin: 0 98px;
}

#oem {
    width: 332px;
    float: left;
    margin: 0 30px 30px 30px;
}

#oem1 {
    width: 332px;
    color: #0000ff;
}

#oem2 {
    width: 332px;
}

#projekte {
    width: 332px;
    float: left;
    margin: 0 30px 30px 30px;
}

#projekte1 {
    width: 332px;
    color: #0000ff;
}

#projekte2 {
    width: 332px;
}

#news {
    width: 460px;
    height: 180px; 
    margin: 0 5px 10px 5px;
    background-color: aqua;
    float: left;
    background-color: #D0D4FB;
    padding: 10px;
}


/* Kontakt */

.address1 {
    width: 220px;
    margin: 35px 230px 0 0;
    float: right;
    font-size: 1em;
}

.address2 {
    font-size: 0.9em;
    width: 430px;
    height: 253px;
    float: left;
    padding: 0;
    margin: 25px;
}


#intro {
    clear: left;
}


/* Service */
#servicetext {
    width: 700px;
    float: left;
}

a#infobox { 
    text-decoration: none; 
    float: right;
}
a#infobox:hover { 
    cursor: help; 
    color: #c30; 
}
a#infobox span { 
    visibility: hidden; 
    position: absolute; 
    left: -99em;
    margin-top: 1.5em; 
    padding: 1em; 
    text-decoration: none; 
}
a#infobox:hover span, a.infobox:focus span, a.infobox:active span {
    visibility: visible; 
    left: 1em;
    border: 1px solid #c30; 
    color: blue; 
    background: white; 
}

#serviceelement {
    width: 306.6px;
    height: 80px;
    float: left;
    margin: 10px;
}

#serviceelemente {
    width: 306.6px;
    height: 80px;
    float: left;
}


/* Impressum */

#imprint {
    text-align: center;
    margin-top: 100px;
}


/* Produkte */

#funktionsbeschreibung {
    color: black;
    width: 200px;
}

* {
    margin: 0;
    padding: 0;
}




/*
#slideshow-wrap {
    display: block;
    height: 196.875px;
    min-width: 350px;
    max-width: 350px;
    margin: auto;
    -webkit-box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    box-shadow: 0px 0px 5px rgba(0,0,0,.8);
    margin-top: 20px;
    position: relative;
	margin: 50px;
	float: left;
}

#slideshow-inner {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

#slideshow-inner>ul {
    list-style: none;
    height: 100%;
    width: 500%;
    overflow: hidden;
    position: relative;
    left: 0px;
    -webkit-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -moz-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    -o-transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
    transition: left .8s cubic-bezier(0.77, 0, 0.175, 1);
}

#slideshow-inner>ul>li {
    width: 20%;
    height: 320px;
    float: left;
    position: relative;
}

#slideshow-inner>ul>li>img {
    margin: auto;
    height: 100%;
}

#slideshow-wrap input[type=radio] {
    position: absolute;
    left: 50%;
    bottom: 15px;
    z-index: 100;
    visibility: hidden;
}

#slideshow-wrap label:not(.arrows):not(.show-description-label) {
    position: absolute;
    left: 50%;
    bottom: -25px;
    z-index: 100;
    width: 12px;
    height: 12px;
    background-color: #0000ff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: background-color .2s;
    -moz-transition: background-color .2s;
    -o-transition: background-color .2s;
    transition: background-color .2s;
}

#slideshow-wrap label:not(.arrows):active { bottom: -46px }

#slideshow-wrap input[type=radio]#button-1:checked~label[for=button-1] { background-color: 
#FEF936; }

#slideshow-wrap input[type=radio]#button-2:checked~label[for=button-2] { background-color: #FEF936; }

#slideshow-wrap input[type=radio]#button-3:checked~label[for=button-3] { background-color: #FEF936; }

#slideshow-wrap input[type=radio]#button-4:checked~label[for=button-4] { background-color: #FEF936; }

#slideshow-wrap input[type=radio]#button-5:checked~label[for=button-5] { background-color: #FEF936; }

#slideshow-wrap label[for=button-1] { margin-left: -36px }

#slideshow-wrap label[for=button-2] { margin-left: -18px }

#slideshow-wrap label[for=button-4] { margin-left: 18px }

#slideshow-wrap label[for=button-5] { margin-left: 36px }

#slideshow-wrap input[type=radio]#button-1:checked~#slideshow-inner>ul { left: 0 }

#slideshow-wrap input[type=radio]#button-2:checked~#slideshow-inner>ul { left: -100% }

#slideshow-wrap input[type=radio]#button-3:checked~#slideshow-inner>ul { left: -200% }

#slideshow-wrap input[type=radio]#button-4:checked~#slideshow-inner>ul { left: -300% }

#slideshow-wrap input[type=radio]#button-5:checked~#slideshow-inner>ul { left: -400% }

label.arrows {
    font-family: 'WebSymbolsRegular';
    font-size: 30px;
    color: #0000ff;
    position: absolute;
    top: 50%;
    margin-top: -25px;
    display: none;
    opacity: 0.7;
    z-index: 1000;
    background-color: transparent;
    -webkit-transition: opacity .2s;
    -moz-transition: opacity .2s;
    -o-transition: opacity .2s;
    transition: opacity .2s;
    text-shadow: 0px 0px 3px rgba(0,0,0,.8);
}

label.arrows:hover { opacity: 1 }

label.arrows:active { margin-top: -23px }

input[type=radio]#button-1:checked~.arrows#arrow-2, input[type=radio]#button-2:checked~.arrows#arrow-3, input[type=radio]#button-3:checked~.arrows#arrow-4, input[type=radio]#button-4:checked~.arrows#arrow-5 {
    right: -30px;
    display: block;
}

input[type=radio]#button-2:checked~.arrows#arrow-1, input[type=radio]#button-3:checked~.arrows#arrow-2, input[type=radio]#button-4:checked~.arrows#arrow-3, input[type=radio]#button-5:checked~.arrows#arrow-4 {
    left: -30px;
    display: block;
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    -ms-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    transform: scaleX(-1);
}

input[type=radio]#button-2:checked~.arrows#arrow-1 { left: 5px }

input[type=radio]#button-3:checked~.arrows#arrow-2 { left: -12px }

input[type=radio]#button-5:checked~.arrows#arrow-4 { left: -100px }
*/



#slideshowauto {
    float: left;
    margin: 20px 30px;
    width: 350px;
    height: 196.875px;
    overflow: hidden;
}

#slideshowauto img {
    -webkit-transition: all 0.7s ease; /* Safari and Chrome */
    -moz-transition: all 0.7s ease; /* Firefox */
    -o-transition: all 0.7s ease; /* IE 9 */
    -ms-transition: all 0.7s ease; /* Opera */
    transition: all 0.7s ease;
    max-width: 100%;
    margin: 0 auto;
    display: block;
    margin: 0 auto;
}
#slideshowauto:hover img {
    -webkit-transform:scale(1.07); /* Safari and Chrome */
    -moz-transform:scale(1.07); /* Firefox */
    -ms-transform:scale(1.07); /* IE 9 */
    -o-transform:scale(1.07); /* Opera */
     transform:scale(1.07);
    cursor: zoom-in;
}


/* MeTIS */ /* HD-Doku */

#produkt-text {
    text-align: center;
    width: 850px;
    margin: 0 auto;
    font-size: 1.1em;
}


/* Fußzeile */

#footer {
    clear: left;
    margin-top: 2em;
    background: #B1B1B1;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
    width: 980px;
    margin: 0% auto;
    padding-bottom: 8px;
    padding-top: 8px;
}

#footer_element {
    width: 326.6px;
    float: left;
    text-align: center;
    color: white;
    text-decoration: none;
}