@import url('https://fonts.googleapis.com/css?family=Nunito+Sans|Syncopate&display=swap');
@import url(https://weloveiconfonts.com/api/?family=entypo);

/* entypo */
[class*="entypo-"]:before {
  font-family: 'entypo', sans-serif;
  color:inherit;
  font-size:1.7em;
}

*{
    font-size:14px;
    font-family:Verdana;
    margin:0px;
    padding:0px;
    text-decoration:none;
    color:#fff;
}
html,body{
    min-height:100%;
    background: rgb(247,165,23);
    background: -moz-linear-gradient(top,  rgba(247,165,23,1) 0%, rgba(255,255,255,1) 73%);
    background: -webkit-linear-gradient(top,  rgba(247,165,23,1) 0%,rgba(255,255,255,1) 73%);
    background: linear-gradient(to bottom,  rgba(247,165,23,1) 0%,rgba(255,255,255,1) 73%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7a517', endColorstr='#ffffff',GradientType=0 );

    background-position:fixed;
    overflow:hidden;
}
body > header{
    margin-top:30px;
    background-color:#fff/*#32553B*/;
    box-shadow:0px 0px 7px #333333;
    height:80px;
    line-height:80px;
    border-bottom:1px solid #f7a517;
    border-top:1px solid #f7a517;
    font-family: 'Montserrat', sans-serif;
    font-size:2.8em;
    text-align:center;
    font-weight:bolder;
    color:#000;
    text-shadow:2px 2px 4px #000;
    position:relative;
}
body > header > span{
    display:none;
}
body > header > figure{
    display:block;
    position:absolute;
    top:-95px;
    left:60%;
    background-color:#f7a517;
    width:370px;
    height:180px;
    transform:rotate(-4deg);
    box-shadow:4px 4px 8px #000;
}
body > header .slogan{
    display:block;
    /*font-family: 'Syncopate', sans-serif;
    color:#f7a517;*/
    font-family: 'Nunito Sans', sans-serif;
    font-size:1.4em;
    position:absolute;
    top:100px;
    left:14px;
    color:#fff;
    font-weight:normal;
    transform:rotate(4deg);
}
body > figure{
    position:absolute;
    top:0px;
    left:50%;
    z-index:1000;
    margin-left:-505px;
    width:250px;
    height:135px;
    background-size:contain;
    background-image:url(../image/logo.png);
    cursor:pointer;
    background-position:center center;
    background-repeat:no-repeat;

    -webkit-filter: drop-shadow(5px 5px 3px rgba(0,0,0, 0.7));
    filter: drop-shadow(5px 5px 3px rgba(0,0,0, 0.7));
}
menu{
    margin-top:32px;
    background-color:#fff;
    box-shadow:0px 0px 7px #333333;
    height:40px;
    line-height:40px;
    border-bottom:1px solid #333333;
    border-top:1px solid #fff;
}
menu > a{
    display:none;
}
menu > ul{
    margin:auto;
    width:auto;
    text-align:center;
}
menu > ul > li{
    height:40px;
    line-height:40px;
    display:inline-block;
    margin:0px 5px;
    vertical-align:middle;
}
menu > ul > li:nth-of-type(even){
    background-color:#333333;
    width:1px;
}
menu > ul > li > a{
    display:block;
    height:40px;
    line-height:40px;
    font-weight:bold;
    text-transform:uppercase;
    font-size:1.1em;
    color:#000;
}
menu > ul > li:hover > a,menu > ul > li.aktiv > a{
    text-shadow:2px 2px 4px #000;
    color:#fff;
}
section{
    position:absolute;
    /*font-size:1.1em;*/
    left:50%;
    margin-left:-492px;
    margin-top:20px;
    width:945px;
    padding:20px;
    background-color:#333333;
    box-shadow:2px 2px 7px #000;
    min-height:60%;
    border:1px solid #333333;
    color:#fff;
    border-radius:15px;
    opacity:0;
    transition:all 1s,height 2s;
}
section.aktiv{
    display:block;
    height:auto;
    max-height:60%;
    opacity:1;
    z-index:2;
}
section > figcaption{
    float:right;
    display:table-cell;
    max-width:350px;
    margin-top:0px;
}
section > figcaption > img{
    max-width:320px;
    margin-bottom:20px;
    margin-left:10px;
    box-shadow:4px 4px 8px #000;
    border-radius:20px;
    opacity:0.7;
    transition:opacity 0.7s;
}
section > figcaption > img:hover{
    opacity:1;
}
section > ul{
    color:inherit;
    margin:20px 30px;
}
body > footer{
    position:fixed;
    bottom:0px;
    left:0px;
    background-color:#f7a517;
    height:30px;
    width:100%;
    line-height:30px;
    border-top:1px solid #fff;
    border-bottom:5px solid #262626;
    box-shadow:0px 0px 7px #333333;
}
footer > ul{
    line-height:inherit;
    color:#fff;
    list-style-type:none;
    width:95%;
    margin:auto;
}
footer > ul > li{
    float:right;
    display:inline-block;
    margin:0px 5px;
    vertical-align:middle;
}
footer > ul > li > a{
    text-transform:capitalize;
    font-size:0.9em;
}
h2{
    color:inherit;
    font-weight:normal;
    font-size:1.1em;
    margin-bottom:4px;
    margin-top:6px;
}
form,li,address,a,p,label,span{
    color:inherit;
    font-size:inherit;
}
a,.sortiment{
    cursor:pointer;
}
#gocontact{
    font-style:italic;
}
.nicescroll-rails{
    z-index:1000 !important;
}
#alpha,#loading{
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.8);
    z-index:1010;
    display:none;
}
#loading{
    background-image:url(../image/loading.gif);
    background-position:center center;
    background-repeat:no-repeat;
    background-size:120px 120px;
}
#upload{
    position:fixed;
    top:50%;
    left:50%;
    width:450px;
    height:200px;
    border-radius:10px;
    padding:10px;
    margin-left:-235px;
    margin-top:-110px;
    background:rgba(255,255,255,1);
    z-index:1100;
    display:none;
}
input[name=userfile]{
    display:none;
}
#upload figure{
    display:inline-block;
    width:250px;
    height:200px;
    vertical-align:middle;
}
#upload figure img{
    max-width:250px;
    max-height:200px;
}
#selfile{
    display:inline-block;
    border-radius:10px;
    padding:10px 30px;
    background:rgba(0,0,0,0.3);
    border:3px dotted #808080;
    color:#fff;
    margin-top:30px;
}
.fehler{
    color:#FF6600;
}
#meldung{
    font-weight:bold;
}
form > iframe{
    position:absolute;
    top:80px;
    right:50px;
	border-radius:10px;
}
#team aside{
    width:95%;
    margin:auto;
    border-radius:10px;
    display:table;
    vertical-align:top;
    background-color:rgba(0,0,0,0.1);
    padding:15px;
}
#team aside,h1,h4,span,form,label{
    color:inherit;
}
#team > aside > figure{
    display:table-cell;
    width:33%;
    vertical-align:top;
}
#team > aside > figure > img{
    box-shadow:4px 4px 8px #000;
    border-radius:20px;
    opacity:0.7;
    transition:opacity 0.7s;
    max-width:100%;
}
#team > aside:hover > figure > img{
    opacity:1;
}
#team > aside > span{
    display:table-cell;
    vertical-align:top;
    padding-left:15px;
}
td{
    color:#969696;
}
table{
    width:95%;
    margin:auto;
}
table tr:nth-of-type(even) td{
    background-color:rgba(0,0,0,0.1);
}
table tr:hover td{
    color:#efefef;
}
#angebote aside{
    width:55%;
    margin:auto;
    margin-bottom:10px;
    border-radius:10px;
    display:table;
    vertical-align:top;
    background-color:rgba(0,0,0,0.1);
    padding:15px;
    float:left;
}
#angebote aside ul{
    height:70px;
    overflow:hidden;
}
#angebote .rememberlink,#merkliste .merkerlink{
    float:right;
}
.smaller{
    font-size:0.9rem;
}
#merkliste aside{
    width:95%;
    margin:auto;
    border-radius:10px;
    display:table;
    vertical-align:top;
    background-color:rgba(0,0,0,0.1);
    padding:15px;
}
div.artikel{
    display:inline-block;
    width:56%;
    padding:3px 8px;
    vertical-align:top;
}
div.artikel a{
    float:right;
    vertical-align:top;
}
div.artikel:nth-of-type(odd){
    background-color:rgba(0,0,0,0.2);
}
div.artikel:nth-of-type(even){
    background-color:rgba(0,0,0,0.1);
}
div.artikel:hover{
    background-color:#32553b;
}
div.artikel:first-of-type{
    border-radius:7px 7px 0px 0px;
}
div.artikel:last-of-type{
    border-radius:0px 0px 7px 7px;
}
.entypo-reply{
    float:right;
}
#artikeldetail aside{
    width:55%;
    margin:auto;
    margin-bottom:10px;
    border-radius:10px;
    display:table;
    vertical-align:top;
    background-color:rgba(0,0,0,0.1);
    padding:15px;
    float:left;
}
#artikeldetail .rememberlink{
    float:right;
}
#dialog{
    display:block;
    position:fixed;
    background-color:rgba(255,255,255,0.99);
    height:450px;
    width:550px;
    top:50%;
    left:50%;
    margin-left:-295px;
    margin-top:-245px;
    padding:20px;
    border-radius:20px;
    color:#000;
    z-index:10001;
    transition:all 1s;
    box-shadow:4px 4px 8px #000;
}
#dialog .close{
    display:block;
    width:30px;
    height:30px;
    line-height:30px;
    background-color:#B54040;
    color:#fff;
    text-align:center;
    position:absolute;
    right:-15px;
    top:-15px;
    border-radius:15px;
}
#dialog.hide{
    height:0px;
    width:0px;
    overflow:hidden;
    padding:0px;
}
#dialog h1{
    font-family: 'Dancing Script', sans-serif;
    font-size:1.7rem;
    font-style:italic;
}
#dialog pre{
    font-family: 'Montserrat', sans-serif;
    font-size:1.8rem;
    color:#FF0000;
}
#dialog ul{
    color: inherit;
    margin-left:30px;
    margin-top:15px;
    margin-bottom:15px;
}

/* -------------------------- FORMULAR -------------------------------------- */

form{
    line-height:32px;
    position:static;
}
form > label{
	vertical-align:top;
	display:inline-block;
	margin-left:50px;
	width:130px;
}
#detailcalc label{
	vertical-align:top;
}
form > input, input[type=text],input[type=number],select,option{
	padding:3px 5px;
	border-radius:5px;
	background-color:rgba(255,255,255,0.4);
	border:1px dashed #666666;
	width:355px;
    color:#000;
}
form > input[type=submit],form > input[type=reset]{
	width:180px;
}
form > input[name=plz],form > input[name=hausnr]{
	width:57px;
}
form > input[name=ort],form > input[name=strasse]{
	width:280px;
}
form > input[name=firstname]{
	width:0px;
    height:0px;
    display:none;
}
textarea{
	padding:3px 5px;
	margin-top:5px;
	resize:none;
	width:357px;
	border-radius:5px;
	background-color:rgba(255,255,255,0.4);
	border:1px dashed #666666;
    color:#000;
}
textarea:focus,input:focus{
	background-color:rgba(255,255,255,0.6);
}
/* -------------------------- FORMULAR -------------------------------------- */
/* -------------------------- [+] Cookiehinweis -------------------------------------- */
#cookiehinweis{
    position:fixed;
    bottom:0px;
    left:0px;
    min-height:120px;
    width:100%;
    background-color:rgba(0,0,0,0.8);
    z-index:10000;
    padding:20px 50px;
    padding-left:30px;
    padding-bottom:50px;
    transition:all 1s;
}
#cookiehinweis.accept{
    bottom:-500px;
}
#cookiehinweis button{
    background-color:#f7a517;
    border:1px solid #fff;
    padding:10px 20px;
    border-radius:10px;
    position:absolute;
    right:120px;
    bottom:30px;
}

/* -------------------------- [-] Cookiehinweis -------------------------------------- */