/* 
Wenn das Suchergebnis in einer eigenen Seite ausgegeben wird,
sollten mindestens die folgenden Style Angaben übernommen werden,
um die Ergebnisseite entsprechend dieser Musterdatei zu gestalten.
*/

#output p, #output li {
	font-size: 1em;
	line-height: 1.2em;
}
#output li {margin: .8em 2.5em;}

#search input {font-size:1rem;margin-bottom: 1em}
#search input[type=text] {width: 12em;max-width: 70%}
 
em {font-style: normal;}

#output a {font-weight: normal;}

.searchword  {color: #222; background-color: #ffd; border: 1px dotted #ffd;}
.searchword0 {color: #222; background-color: #ff0; border: 1px dotted #ff0;}
.searchword1 {color: #222; background-color: #0f0; border: 1px dotted #0f0;}
.searchword2 {color: #222; background-color: #0ff; border: 1px dotted #0ff;}
.searchword3 {color: #222; background-color: #fbb; border: 1px dotted #fbb;}
.searchword4 {color: #222; background-color: #dfd; border: 1px dotted #dfd;}
.searchword5 {color: #222; background-color: #faf; border: 1px dotted #faf;}
.searchword6 {color: #222; background-color: #ccc; border: 1px dotted #ccc;}

#output .mod {font-size: .85em;}
#output .mod1 {font-size: .85em;}
#output .treffer{font-size: .85em; color: red;}

/* Zeilenumbrueche einfuegen: */
/* .treffer:before,  vor der Trefferanzahl */
#output .mod:before, /* vor der URL */
#output .mod1:before { /* vor dem Aenderungsdatum */
content: ".";
display:block;
visibility:hidden;
height: 0;
}	

#searchfooter {
font-size: .8em;
margin-top: 1em;
}

#suchtipheader {display:inline-block;}

#klapp0 {
text-decoration: none;
color: #333;
font-size: .8em;
font-weight:normal !important;
outline:none 0;
}

#suchtipps a:focus, #suchtipps a:hover, #suchtipps a:active {text-decoration: underline;}

#output li {margin: 1em 2.5em ; clear:left;}

#output li img {
	float:left;
	max-width: 120px;
	margin: 0 1em 1em 0;
}

.weiter, #searchfooter, #output h3 {display:block; clear:left}

/*eigene deklarationen hinzugefügt*/
.popup-box-on {
    display: block !important;
}
.off {
    display: none;
}
#search.open {
    opacity: 1;
    transform: translate(0px, 0px) scale(1, 1);
}
#search {
    background-color: #fff;
    height: 15%;
    left: 37.5%;
    position: fixed;
    top: 42.5%;
    transition: all 2.5s ease-in-out 2s;
    width: 25%;
    z-index: 2000;
	 -webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    border-radius:5px;}	    

@media screen and (min-width: 768px) and (max-width: 1400px) {
  #search{
    background-color: #fff;
    height: 20%;
    left: 25%;
    position: fixed;
    top: 40%;
    transition: all 2.5s ease-in-out 2s;
    width: 50%;
    z-index: 2000;
	 -webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    border-radius:5px;
   }  
}

@media screen and (min-width: 0px) and (max-width: 767px) {
  #search{
    background-color: #fff;
    height: 40%;
    left: 10%;
    position: fixed;
    top: 30%;
    transition: all 2.5s ease-in-out 2s;
    width: 80%;
    z-index: 2000;
	 -webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    box-shadow: 0 0 5px 2px rgba(0, 0, 0, .5);
    border-radius:5px;
   }  
}





#search .close {
    color: #be5254;
    font-size: 30px;
    opacity: 1;
    padding: 10px 10px;
    position: fixed;
    right: 5px;
    top: 5px;
}
#search .close:hover {
    color: #be5254;	
    font-size: 30px;
    opacity: .5;
    padding: 10px 10px;
    position: fixed;
    right: 5px;
    top: 5px;
}

button.close {
    background: transparent none repeat scroll 0 0;
    border: 0 none;
    cursor: pointer;
}

form .close {
    float: right;
    font-weight: bold;
    line-height: 1;
    text-shadow: 0 1px 0 #fff;
}

#search input[type="text"] {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 1px solid grey;
    color: #333;
    font-family: "Open Sans",sans-serif;
    font-size: 20px;
    font-weight: 300;  
    outline: medium none;
    left: 15%;
    position: absolute;
    text-align: left;
    top: 25%;
    width: 100%;
}
#search .btn {
    left: 50%;
    margin-top: 15px;
    padding: 10px 10px;
    position: absolute;
    top: 50%;
    transform: translateX(-50%);
}

.btn-site {
    background: #be5254 none repeat scroll 0 0;height: 36px;
    color: #fff !important;
}
.btn-site:hover {
    background: #fff none repeat scroll 0 0;height: 36px;
    color: #be5254 !important;
	border: 1px solid #be5254;
}