html, body {margin:0px; padding:0px; background:#000; font-family:verdana; font-size:1.1em; background:black;}

img {border:none;}

ol {
list-style-type:none;
}

.head {
display:inline-block;
text-align:center;
width:66%;
}

.main {
background:#fff;
margin:0 auto;
width:66%;
overflow:hidden;
margin-top:15px;
}

footer {
display:inline-block;
color:#fff;
text-align:center;
width:100%;
overflow:hidden;
}

footer span {
width:100%;
text-align:center;
}

footer p {
color:white;
float:right;
}

footer a {
outline:none;
font-size:16px;
line-height:22px;
color:#73bd33;
}

footer img {
width:120px;
height:34px;
aspect-ratio: auto 120 / 34;
}



.recipe-image, iframe {
width:100%;
display: inline-block;
text-align: center;
}

.recipe-image img, .ingredients img, iframe {
aspect-ratio: auto 640 / 360;
}



.recipe-info {
width:100%;
display:block;
text-align:center;
}

.recipe-info a {
display:inline-block;
}

.recipe-info img{
width:50px; height:50px;
margin: 5px 20px;
aspect-ratio: auto 50 / 50;
}



.navigation {
width:100%;
text-align:center;
}

.navigation a, input[type=submit] {
-moz-box-shadow:inset 3px 8px 8px -3px #e9f0e4;
-webkit-box-shadow:inset 3px 8px 8px -3px #e9f0e4;
box-shadow:inset 3px 8px 8px -3px #e9f0e4;
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #557338), color-stop(1, #73bd33) );
background:-moz-linear-gradient( center top, #557338 5%, #73bd33 100% );
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#557338', endColorstr='#73bd33');
background-color:#557338;
-webkit-border-top-left-radius:18px;
-moz-border-radius-topleft:18px;
border-top-left-radius:18px;
-webkit-border-top-right-radius:18px;
-moz-border-radius-topright:18px;
border-top-right-radius:18px;
-webkit-border-bottom-right-radius:18px;
-moz-border-radius-bottomright:18px;
border-bottom-right-radius:18px;
-webkit-border-bottom-left-radius:18px;
-moz-border-radius-bottomleft:18px;
border-bottom-left-radius:18px;
text-indent:0;
border:1px solid #1b5c10;
display:inline-block;
color:black;
font-family:Arial;
font-size:20px;
font-weight:bold;
font-style:normal;
height:36px;
line-height:36px;
width:auto;
text-decoration:none;
padding:0 25px;
margin:4px 6px;
z-index:999;

}

.logo {
display:block;
float:left;
overflow:hidden;
font-family: 'Arial';
font-style: italic;
font-weight: 900;
font-size:90px;
line-height:90px;

background: -webkit-linear-gradient(90deg, rgba(58,156,5,1) 0%, rgba(110,163,75,1) 73%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

letter-spacing:-6px;
text-indent:0;
margin:0px;
padding:0;
width:100%;
text-align:center;
}

.subheadline {
display:block;
font-family: Verdana;
font-size:24px;
line-height:24px;
width:100%;
text-align:center;
color:yellow;
margin-bottom:15px;
}

a {
color: #CA3535;
text-decoration: underline;
}

a hover {
color: #CA3535;
text-decoration: underline;
}


#none {
display:none;
}

.recipe-title {
font-family: Trebuchet MS;
font-size: 2em;
font-weight: bold;
text-align: center;
color: #CA3535;
vertical-align: top;
margin-top: 10px;
margin-bottom: 0px;
}



h3 {
width:95%;
margin:15px 2%;
color:white;
text-align:center;
text-decoration:none;
font-style:italic;
font-size:20px;
line-height:32px;
background:#3C3C3C;
border-top:inset 1px black;
border-bottom:solid 1px black;
border-radius:16px;
}

.reviewSubRight span {
display:block;
width:50%;
float:left;
padding: 0;
color: white;
font-size: 1em;
font-weight: bold;
text-decoration:none;
}



p {
font-family: Verdana;
text-align: justify;
color: #000;
vertical-align: top;
margin: 0px 10px;
}


.review {
display:block;
line-height:40px;
font-size:20px;
color:#fff;
font-weight:bold;
text-decoration:none;
background:black;
width:100%;
padding:0;
margin:0;
}

.reviewSubLeft {
float:left;
position:relative;
background:white;
margin:0;
margin-top:25px;
padding:0 2%;
width:45%;
}

.reviewSubLeft p {
font-size: 0.9em;
font-family: Verdana;
font-style:italic;
margin:10px 0 10px 10px;
}

.reviewSubRight {
float:right;
position:relative;
background:#e48888;
margin:0;
margin-top:25px;
padding:0 2%;
width:45%;
}



.result {
width:98%;
margin:0 1%;
padding:0;
-moz-column-count:2;
-moz-column-gap:2%;
-webkit-column-count:2;
-webkit-column-gap:2%;
column-count:2;
column-gap:2%;
column-break-inside:avoid;
}

.result li {
display:block;
min-height:100px;
border:1px solid grey;
overflow:hidden;
margin:0 0 20px 0;
padding:0;
width:99%;
-moz-border-radius:8px;
-webkit-border-radius:8px;
border-radius:8px;
-webkit-column-break-inside:avoid;
break-inside:avoid;
}

.result a {
display:inline-block;
width:100%;
text-decoration:none;
color:#6D5229;
margin:0;
padding:0;
}

.result li img {
display:block;
height:auto;
width:45%;
float:left;
margin:0;
padding:0;
aspect-ratio: auto 640 / 360;
}

.result li div {
width:50%;
float:right;
text-align:center;
margin:0;
padding:0;
}

.result li h4 {
display:block;
width:50%;
float:right;
text-align:center;
margin:0;
padding:0;
}

.result p {
display:block;
width:50%;
float:right;
text-align:center;
margin:0;
padding:0;
}


.sitemap {
width:100%;
column-count: 2;
column-gap: 10px;
}


.sitemap ul {
list-style-type:square;
color:#6D5229;
padding-left: 5%;
margin-left: 5%;
width:90%;
}

.sitemap li a {
display: block;
color:#6D5229;
width:100%;
font-weight: bold;
line-height:26px;
text-decoration:none;
font-style:normal;
}


.search {
display:block;
width:95%;
height:auto;
padding:5px;
margin:10px 2% 0 2%;
background:white;
border-radius: 12px;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border:solid 1px #568a37;
}

.island form {
display:inline-block;
width:96%;
margin:3px 2%;
padding:0;
}

.island select {
float:left;
width:75%;
height:40px;
margin:0 0 10px 10px;
padding:0;
border-radius: 20px;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
}


.search p {
display:block;
width:90%;
line-height:17px;
color:#2F6D25;
font-weight:bold;
text-decoration:underline;
margin:0 0 5px 0;
}



/* für comment form */

label {
display:inline-block;
width:100%;
margin-top:10px;
}


input[type=text], select, textarea {
float:right;
width:98%;
margin: 4px 2% 8px 0;
height:35px;
border: 1px solid #cfcfcf;
font-size:18px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
-moz-box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}



textarea {
height:100px;
}

input[type=text]:focus, textarea:focus {
outline:0;
border:1px solid #cfcfcf;
-webkit-box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
-moz-box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
}



.star-rating-l {
width: 125px;
height: 25px;
position: relative;
float:right;
margin-right:10px;
margin-bottom:15px;
}


.radio-wrap {
width: 100%;
height: 100%;
margin:0; padding:0;

}
.star-rating-l input[type=radio] {
display: inline-block;
position: relative;
z-index: 2;
margin: 0;
width: 15%;
height: 100%;
opacity: 0;

}
.star-rating-l .filled {
width: 0;
height: 100%;
background-image: url("star-l.png");
background-position: 0 -25px;
background-repeat: repeat-x;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.star-rating-l input[value="5star"]:checked + .filled {
width: 100%;
}
.star-rating-l input[value="4star"]:checked + .filled {
width: 80%;
}
.star-rating-l input[value="3star"]:checked + .filled {
width: 60%;
}
.star-rating-l input[value="2star"]:checked + .filled {
width: 40%;
}
.star-rating-l input[value="1star"]:checked + .filled {
width: 20%;
}
.star-rating-l input[value="5star"]:hover + .filled {
width: 100%;
background-position: 0 -25px;
}
.star-rating-l input[value="4star"]:hover + .filled {
width: 80%;
background-position: 0 -25px;
}
.star-rating-l input[value="3star"]:hover + .filled {
width: 60%;
background-position: 0 -25px;
}
.star-rating-l input[value="2star"]:hover + .filled {
width: 40%;
background-position: 0 -25px;
}
.star-rating-l input[value="1star"]:hover + .filled {
width: 20%;
background-position: 0 -25px;
}
.star-rating-l .empty {
width: 100%;
height: 100%;
background-image: url("star-l.png");
background-position: 0 0;
background-repeat: repeat-x;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.star-rating-l .cover {
width: 100%;
height: 100%;
background-image: url("star-cover-l.png");
background-position: 0 0;
background-repeat: repeat-x;
position: absolute;
top: 0;
left: 0;
z-index: -1;
}

/* rating stars für comments */

.fullstar {
display:inline-block;
width:25px;
height:25px;
background-image:url("star-l.png");
background-position: 0 -25px;
}

.nostar {
display:inline-block;
width:25px;
height:25px;
background-image:url("star-l.png");
background-position: 0 0;
}

.halfstar {
display:inline-block;
width:25px;
height:25px;
background-image:url("half-min.png");
background-position: 0 0;
}


/* rating stars für google */


.ratings {
position: relative;
vertical-align: left;
display: inline-block;
color: #b1b1b1;
overflow: hidden;
}

.full-stars{
position: absolute;
left: 0;
top: 0;
white-space: nowrap;
overflow: hidden;
color: yellow;
}

.empty-stars:before,
.full-stars:before {
content: "\2605\2605\2605\2605\2605";
font-size: 16pt;
}

.empty-stars:before {
-webkit-text-stroke: 1px #848484;
}

.full-stars:before {
-webkit-text-stroke: 1px #fde16d;
}









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


.logo {
font-weight: 600;
font-size:50px;
line-height:50px;
-webkit-text-stroke: 0px #51662f;
letter-spacing:-2px;
}

.main {
width:98%;
margin:15px 1%;
}



p {
padding:0 5px;
}

.recipe-image img {
object-fit: cover;
width: 90%;
}

.ingredients img {
width:70%;
margin:2px auto;
display: flex;
justify-content: center;
align-items: center;
}

.reviewSubLeft, .reviewSubRight, #center1 {
width:96%;
margin:5px 0 0px 2%
}

.result {
-moz-column-count:1;
-webkit-column-count:1;
column-count:1;
}



#comment input[type=text], select, textarea {
float:left;
width:100%;
margin:0;
padding:0;
height:35px;
border: 1px solid #cfcfcf;
font-size:18px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
-moz-box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
box-shadow: inset 0px 4px 4px 2px rgba(0,0,0, 0.1);
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}

#comment input[type=text]:focus, select:focus, textarea:focus {
outline:0;
border:1px solid #cfcfcf;
-webkit-box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
-moz-box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
box-shadow: 0 0 5px 4px rgba(0,0,0, 0.1);
}

textarea {
height:150px;
}


.foot a {
font-size:18px;
line-height:30px;
}


.sitemap {
column-count: 1;
}




}