/* 
    Document   : styles
    Created on : 16.09.2025, 11:00:00
    Author     : jseitz
    Description:
        Purpose of the stylesheet follows.
*/

* {
    margin:0;
    padding:0;
}
root { 
    display: block;
    width: 100%;
    height: 100%;
}
html, body, #wrapper {
    height: 100%;
    font-family:  Arial, sans-serif;
    font-size: 18px;
    color: #065346;
}
/*html {
    background-color: #0059a3;
    background: linear-gradient(to left bottom, #0059a3, #102250); /* zeichnet die Hintergrundfarbe */
/*    background-attachment:fixed;
    height: 100%;
    behavior: url(scripte/PIE.htc);
}*/
#alt {
    display: none;
}

.alt {
    display: none;
}
body {

    background-image: -ms-linear-gradient(to bottom, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 15%),linear-gradient(to left, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 12%);
    background-image: -o-linear-gradient(to bottom, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 15%),linear-gradient(to left, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 12%);
    background-image: -moz-linear-gradient(to bottom, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 15%),linear-gradient(to left, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 12%);
    background-image: linear-gradient(to bottom, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 15%), linear-gradient(to left, hsl(167.4, 63.9%, 38%), hsla(87,30%,70%, .1) 12%);
    behavior: url(../scripts/PIE.htc);
}

header {
    /*position: fixed;
    top: 0;
    width: 100%;
    height: 15%;
    /*height: 175px;
    margin: 5px 0 5px 0;*/
}

#wrapper {
    width: 99%;
    margin: 0 auto;
    border: solid red;


}
#main {
    position: fixed;
    width: 100%;
    top:10%;
    
    bottom: 4em;
    overflow: auto;
    margin: 0 0 0 0 ;
    border: 0;
}
.tabmenu {
    background: transparent;
    width: 85%;
    min-width: 640px;
    margin: 0 auto;
}
.eins {
    display: none;


}
a {
    text-decoration:none;
    border: 0;
    border:none;
    outline:none;
    color: #098B4A;
    /*color: rgba(8, 203, 196, .8);*/
}
a.Link2 {
        text-decoration:none;
    border: 0;
    border:none;
    outline:none;
    color: #30AC95;
    color: rgba(8, 203, 196, .8);
}
a:hover {
    border:none;
    border: 0;
    outline:none;
    color: #09F9F1;
}
.jens {
    width: 20%;
    height: auto;
    float: right;
    padding:0px;
    margin: 20px;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: -5px 0px 31px #196b39;
    /* webkit browser*/ 
    -moz-box-shadow: -5px 0px 31px #196b39; 
    /* firefox */ 
    box-shadow: -5px 0px 31px #196b39;
}
.gsp {
    width: 10%;
    height: auto;
    float: right;
    padding:0px;
    margin: 20px;
    rigth: 5em;
    bottom: 5em;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
    -webkit-box-shadow: -5px 0px 31px #196b39;
    /* webkit browser*/ 
    -moz-box-shadow: -5px 0px 31px #196b39; 
    /* firefox */ 
    box-shadow: -5px 0px 31px #196b39;
}
.gsp_1 {
    width: 2%;
    height: auto;
/*    padding:0px;
    margin: 20px;*/
/*    rigth: 5em;
    bottom: 5em;*/
    -webkit-border-radius: .1em;
    -moz-border-radius: .1em;
    border-radius: .1em;
    -webkit-box-shadow: -2px 0px 5px #196b39;
    /* webkit browser*/ 
    -moz-box-shadow: -2px 0px 5px #196b39; 
    /* firefox */ 
    box-shadow: -2px 0px 5px #196b39;
}
.rechts {
    text-align: right;
}
.links {

    text-align: left;

}


blockquote, blockquote p {
    margin: 5px;
    padding: 10px 0 0 0;
}
table {
    padding: 0;
    margin: 0;
    width: 100%;
}
blockquote {
    text-align: right;
    clear: left;
}
blockquote p {
    /*font:  Molengo, Arial, Helvetica, sans-serif;*/
    text-align: left;
    line-height: 1.5;
}
.h-menu {
    left: 13%;
    top: 48%;
    width: 90%;
    position: absolute;

}

ul.menu {
    list-style-type: none;
    margin: 0px;
}

ul.menu li {
    float:left;
    position:relative;
    margin: 0 17% 0 5%;
    padding:0px;
    /*background-color: rgba(10, 10, 10, .0);*/
    font: 24px 'Lato', arial;
    font-weight: bolder;
    color: #08CBC4;
    -webkit-transition: background-colorr 0.8s;
    transition: background-color 0.8s;
    /*border: 1px solid green;*/
}
ul.menu li+li {
    margin: 0 0 0 13%;
}


ul.menu li:hover {
    background-color: rgba(10, 10, 10, .2);
}



.logo {
    /*background: url(images/Vorlagen/Logo-3-gesamt.png);*/
    width: 950px;;
    height: 450px;
    top: 50%;
    left:  50%;
    margin: -230px 0 0 -500px;
    position: absolute;
    border: red;

}
.logo_2 {
    background: url(images/Vorlagen/Logo-3-gesamt.png);
    width: 333px;
    height: 150px;
    left:  50%;
    margin: 0 0 0 -175px;
    position: absolute;
}
.logo_3{
    width: 15%;
    height: 50%;
    /*width: 333px;
    height: 150px;*/
    left:  50%;
    margin: 0 0 0 -0px;
    position: absolute;
    border: black 2px;
}
#Logo_klein{
    position: inherit;
    top: 0;
    /*right: 10px;*/
    left: 10px;
    width: 10%;
/*    height: 8%;*/
    margin:  0 ;
    /*background-color: gray;*/
}
.Teile{
    position: absolute;
    /* border: solid 1px gray;*/
}
#teil1 {
    height: 40%;
    width:65%;
    top: 2%;
    left: 2%;
    /*    margin: 0 0 0 10%;*/
}
#teil2 {
    height: 26%; /*#20%*/
    width: 45%; /*#29%*/
    left:  50%;
    top: 19%;
    /*margin: 8% 48% 0 0;*/
}
#teil3 {
    height: 41%;
    width: 65%;
    top: 60%;
    left: -10%;
    /*
    margin: 200px 0 0 75px;*/
}
#teil4 {
    height: 20%;  /*#26%;*/
    width: 26%;  /*39%;*/
    top: 61%;
    left: 57%;
}
#balken {
    width: 110%;
    height: 13%;
    top:45%;
    left: -5%;
    /*margin: 140px 0 0 75px;*/
}
#it-logo {

}
.it-logo1{
    width: 30%;
    height: 30%;
    left: 20%;
    top: 7%;
    /*z-index: 10;*/
    background: url(../images/Vorlagen/Logo-3-IT-Logo.png)left bottom/contain no-repeat;
    /*background-repeat: no-repeat;*/
    opacity: 0.8;


}

.it-logo3 {
    display:none;
    width: 30%;
    height: 30%;
    left: 20%;
    top: 7%;
    background: url(../images/Vorlagen/Logo-3-IT-Logo-helle-Farbe.png)left bottom/contain no-repeat;
    /*background-repeat: no-repeat;*/
}




#e-logo {

}
.e-logo1{
    width: 28%;
    height: 28%;
    left: 23%;
    top: 65%;
    /*z-index: 10;*/
    background: url(../images/Vorlagen/Logo-3-Gitarre.png)left bottom/contain no-repeat;
    /*background-repeat: no-repeat;*/
    opacity: 0.4;



}
.e-logo2 {
    display: none;
    width: 28%;
    height: 28%;
    left: 23%;
    top: 65%;
    background: url(../images/Vorlagen/Logo-3-Gitarre-helle-Farbe.png)left bottom/contain no-repeat;
    /*background-repeat: no-repeat;*/
}
.logo-klein {
    opacity: 1;
}

ul.tab-1 {
    /*width:450px;*/
    list-style-type:none;
    margin:10px 0 0 30px;
    /* background-color:#fff;*/
    overflow:hidden;

}
ul.tab-2 {
    list-style-type:none;
    margin:10px; /* 0 20px 40px;*/
    background-color:#EEEEEE;
    overflow:hidden;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

}
li.tab-3 {
    float:left;
    cursor:pointer;
    padding:7px 5px 0 5px;
    margin: 0 5px 0 0;
    background-color: #DDEADC;
    -moz-border-top-right-radius: 5px;
    -moz-border-top-left-radius:  5px;
    -web-border-top-right-radius: 5px;
    -webkit-border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
    font-weight: bolder;
    color: #065346;

}
li.tab-3.current  {
    background-color:#CAEAC7;
    border-bottom:3px solid #DDDDDD;
}


ul.tab-2 li.current {
    background-color:#C7EACA;
    border-bottom:3px solid #DDDDDD;
}
.current {
    background-color:#C7EACA;
    border-bottom:3px solid #30AC95;
}
ul li {
    padding: 0 0 0 10px;

}


div.tabs {
    height: 80%;
    /*width:100%;*/
    padding: 0 0 20px 0;
    margin: 0 0 10px 10px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;

    -webkit-box-shadow: 13px 12px 22px #196b39; /* webkit browser*/ 
    -moz-box-shadow: 13px 12px 22px #196b39; /* firefox */ 
    box-shadow: 13px 12px 22px #196b39;
}
div.dyn-tabs {
    /*width:100%;*/
    padding:5px;
    /*	height:100px;
            overflow:auto;*/
    background-color:#C7EACA;
    display:none;
}
div.cal{
    width: 70%;
        text-align: center;

}
.bar {
    background-color: #C7EACA;
    cursor: pointer;
    margin: 10px;
    color: #065346;
}

.content {
    padding: 10px;
    color: #065346;
}
.contend {
    padding: 10px;
    color: #065346;
}

div h1 {
    padding: 0 0 0 20px;
    font-size: 1.4em;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
}

.cal h1 {
    padding: 2em 2em;
}
.cal h3{
    padding: 2em 2em;
}
.cal p {
    padding: 1em 1em;
}

.tab-2
{
    font-size: 18px;
}
div h2 {
    font-size: 1.2em;
    padding: 10px;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
}
div h3{
    font-size: 1em;
    padding: 10px 30px;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
}
div h4{
    font-size: 1em;
    padding: 10px 30px;
    -webkit-border-radius: .5em;
    -moz-border-radius: .5em;
    border-radius: .5em;
}

div p {
    line-height: 1.5em;
    margin: 0 20px;

}

div.content p{
    padding-left: 20px;
}


.einfach {
    list-style-type: disc;
    margin:0 0 0 80px;
    background-color:#EEEEEE;
}
.Liste {
    list-style-type: circle ;
    margin:0 0 0 80px;
    /*background-color:#EEEEEE;*/
}
.Liste_1 {
    list-style-type: ' - ';
    margin:0 0 0 100px;
    font-size: 0.9em
    /*background-color:#EEEEEE;*/
}
.Liste_2 {
    list-style-type: none;
    margin:0 0 0 100px;
    font-size: 1.0em
    /*background-color:#EEEEEE;*/
}
.unter {
    list-style-type: circle;
    margin:0 0 0 20px;
    background-color:#EEEEEE;
}
td {
    width: 25%;
    vertical-align: top;
    padding: .5em 0 0 0;
}
td+td {
    width: 75%;
}
td.master{
    width: 50%;
    vertical-align: bottom;
    text-align: center;


}
td img {

    padding: 30px;

}
.portfolio {
    float: left;
    list-style: none;
    border:0;
    padding:0;
    margin:0;	

}
.portfolio li {
    float:left; 
    text-align:left;
    width:300px; 
    height:191px;
    margin:20px 40px; 
    padding:15px;
    position: relative;

}


.portfolio li a img {
    border:10px solid rgb(150,140,130);
    border-color:rgba(150,140,130,.5) rgba(150,140,130,.505);
}
.portfolio div {
    opacity:0;
    position:absolute; 
    left:0;
    bottom:30px;
    height:170px; 
    width:300px;
    overflow:hidden;
    color:#FFF;
}

.portfolio li:hover div,
.portfolio li:active div,
.portfolio li:focus div {
    opacity:1;
    position:absolute; 
    left:25px;	
    bottom:5px;
    height:190px; 
    width:300px;
    text-align:left;
    background: rgb(150,140,130);
    background: rgba(150,140,130,.90); 	
    color:#FFF;
    -moz-animation-name:slide;
    -moz-animation-duration:10s;
    -moz-animation-iteration-count:1;
    -webkit-animation-name: slide;
    -webkit-animation-duration:10s;
    -webkit-animation-iteration-count:1;
    animation-name: slide;
    animation-duration:10s;
    animation-iteration-count:1;
}
@-webkit-keyframes slide {
    0% {		height:0px;		}
25% {		height:190px;	}
75% {		height:190px;	}
100% {	height:0px;	}	
}
@-moz-keyframes slide {
    0% {		height:0px;		}
25% {		height:190px;	}
75% {		height:190px;	}
100% {	height:0px;	}	
}
.portfolio div h3,
.portfolio div p {
    color:#FFF;
    margin: 10px 20px 20px 20px;
    padding:0;
}
.portfolio div h3 {
    margin-top:30px;
}

/* Begin Entertain popup */
#entertain_hintergrund {
    display:none;
    z-index:1;
    position: fixed;
    height:100%;
    width:100%;
    top:0px;
    left:0px;
    background:#065346;
}

#entertain_popup {
    display: none;
    z-index: 7;
    position: absolute;
    width:900px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -450px;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 8px solid #ccc;
    border-radius: 5px 5px 5px 5px;
    z-index: 9;
}

div.entertain_schliessen {
    position: relative;
    height: 30px;
    width: 30px;
    left: 27px;
    bottom: 24px;
    background: url("../images/close.png") no-repeat scroll 0 0 transparent;
    float: right;
    cursor: pointer;
}

#entertain_popup_inhalt {
    margin: 8px 14px;
}
/* Ende Entertain Popup */


ul.entertain {
    list-style-type: disc;
    padding-left: 5em;
    text-align: left;
}

/* begin Popup Kontakt allgemein */
#be7_hintergrund {
    display:none;
    z-index:1;
    position: fixed;
    height:100%;
    width:100%;
    top:0px;
    left:0px;
    background:#065346;
}

#be7_popup {
    display: none;
    position: absolute;
    width:900px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -450px;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 8px solid #ccc;
    border-radius: 5px 5px 5px 5px;
    z-index: 9;
}

div.be7_schliessen {
    position: relative;
    height: 30px;
    width: 30px;
    left: 27px;
    bottom: 24px;
    background: url("../images/close.png") no-repeat scroll 0 0 transparent;
    float: right;
    cursor: pointer;
}

#be7_popup_inhalt {
    margin: 8px 14px;
}
#form {
    background: #FFFCE1;
}
#form p{
    display: inline-block;
    padding: 10px;
    margin: 3px 0px;
    /*border: 1px #358FC9 solid ;*/

    /*color: #000;*/
}
#form input, #form textarea{
    background: #fff;
    /*color: #555;*/
    /*border: none;*/

    margin: 5px auto 0 0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;

}
#form textarea{
    width: 493px;
    height: 100px;
}
#form label{
    padding-right: 10px;
    float: left;
}
/* Ende Popup Kontakt allgemein */

/* begin Popup Impressum allgemein */
#be8_hintergrund {
    display:none;
    z-index:1;
    position: fixed;
    height:100%;
    width:100%;
    top:0px;
    left:0px;
    background:#065346;
}

#be8_popup {
    display: none;
    z-index: 7;
    position: absolute;
    width:900px;
    height: 600px;
    top: 50%;
    left: 50%;
    margin: -300px 0 0 -450px;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 8px solid #ccc;
    border-radius: 5px 5px 5px 5px;
    z-index: 9;
}

div.be8_schliessen {
    position: relative;
    height: 30px;
    width: 30px;
    left: 27px;
    bottom: 24px;
    background: url("../images/close.png") no-repeat scroll 0 0 transparent;
    float: right;
    cursor: pointer;
}

#be8_popup_inhalt {
    margin: 8px 14px;
}
/* Ende Popup Impressum */


/*footer {

    height: 45px;
    margin-top: -45px;
    padding: 0 5px 0 0;
    /*background: transparent; /*  url(images/bg_landscapeFooter.png) bottom left repeat-x;
    line-height: 50px;
    /*border: 1px solid green;
    text-align: right;
    border: 1px solid blue;
}*/
footer {
    position: fixed;
    width: 80%;
    /*height: 3em;*/
    bottom: 0;
}
footer-icon {
    width: 20px;
    height: 20px;
}

.Link {
    text-shadow:  rgba(1, 24, 20, .5) 2px 2px 2px, rgba(1, 24, 20, .5) -1px -1px 1px ;
    -webkit-transition: color 0.5s;
    transition: color 0.5s;
        padding-left: 5%;
    padding-right: 5%;
        /*border: 1px solid green;*/
}
.foot_a {
    /*display: block;*/
    outline: none;
    text-decoration: none;
    float: right;
    width: 80px;
    height: 10px;
    line-height: 39px;
    /*color: #94F3F0;*/
    /*-webkit-transition: color 0.2s;
    transition: color 0.2s;*/
    font-size: 24px;

    bottom: 0;

}

.foot_icon {
    display: block;
    outline: none;
    text-decoration: none;
    /*float: right;*/
    width: 50px;
    height: 10px;
    line-height: 39px;
    /*color: #94F3F0;*/
    /*-webkit-transition: color 0.2s;
    transition: color 0.2s;*/
    font-size: 28px;
    bottom: 0;
}
footer a {
    /*display: block;*/
    outline: none;
    text-decoration: none;
    float: right;

}

footer div{
        display: block;
    outline: none;
    text-decoration: none;
    float: right;
    width: 180px;
    height: 10px;
    line-height: 39px;
    font-size: 20px;
    
}
.halbe1 {
    float: left;
    width: 50%;
}
.halbe2 {
    width: 50%;
    float: right;
}

    



.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
/* IE-Patch f�r IE 7*/
*:first-child+html .clearfix { min-height: 0; } 
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/*footer a:hover {
    color: #30AC95;
}*/


/* "Invalid", but works in 6-8 */
/*filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB);

/* Valid, works in 8-9 */
/*-ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#1471da, endColorstr=#1C85FB)";*/