input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; } /* FF 4-18 */
input:focus::-moz-placeholder { color:transparent; } /* FF 19+ */
input:focus:-ms-input-placeholder { color:transparent; } /* IE 10+ */

.searchContainer {
    margin: 0 auto 0 auto;
    width: 900px;
    top: -140px;
}

.searchContainer.openbox {
    background: none repeat scroll 0 0 #ffffff;
    /*
    position: absolute;
    right: 0px;
    top: 100px;
    */
}

.searchContainer #searchbox {
    position: absolute;
    top: 0;
    margin: 0 auto 0 auto;
    width: 900px;
    height: auto;
    margin-top: 20px;
    cursor: pointer;
}

.searchContainer #searchbox #searchinput {
    background: none repeat scroll 0 0 #ffffff;
    border: 1px solid rgb(0,105,190);
    text-align: center;
    margin-bottom: 0;
    float: left;
    margin-left: 45px;
    width: 75.7%;
    position: relative;
}

.searchContainer #searchbox .icon {
    display: block;
    float: left;
    background-color: rgb(0,105,190);
    background-size: 100% auto;
}

.searchContainer.openbox #searchbox #suchErgebnisse {
    background: none repeat scroll 0 0 #ffffff;
    box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.8);
    min-height: 70px;
    position: absolute;
    top: 44px;
    left: 0px;
    z-index: 99;
    width: 90%;
    display: block;
    border: 1px solid rgb(0, 105, 190);
    border-top: none;
}

.searchContainer.openbox #searchbox #suchErgebnisse.loading {
    background: #ffffff url("../img/loading.gif") center no-repeat;
}

.searchContainer #suchErgebnisse {
    display: none;
}

.searchContainer.openbox #searchbox #suchErgebnisse .innerwrap {
    padding: 13px;
    text-align: center;
    color: rgb(0, 105, 190);
}

.searchContainer.openbox #searchbox #suchErgebnisse .innerwrap span {
    padding-top: 20px;
}

.searchContainer.openbox #searchbox #suchErgebnisse h3 {
    color: rgb(0, 105, 190);
    padding-bottom: 5px;
    cursor: auto;
    text-align: center;
}

.searchContainer.openbox #searchbox #suchErgebnisse .searchResultGroup h4 {
    display: block;
    background: #ffffff;
    color: rgb(0, 105, 190);
    border-top: 1px solid rgb(0, 105, 190);
    border-bottom: 1px solid rgb(0, 105, 190);
    padding: 5px 10px;
    font-size: 16px;
    cursor: auto;
    text-align: center;
}

.searchContainer.openbox #searchbox #suchErgebnisse .searchResultGroup a.searchLink {
    display: block;
    padding: 6px 30px 6px 15px;
    text-align: left;
    white-space: normal;
    font-weight: normal;
    position: relative;
    font-size: 16px;
    text-decoration: none;
    background-color: #fff;
    color: rgb(0, 105, 190);
}

.searchContainer.openbox #searchbox #suchErgebnisse .searchResultGroup a.searchLink:hover {
    color: #ffffff;
    background-color: rgb(0, 105, 190);
}

.searchContainer.openbox #searchbox #suchErgebnisse .searchLink.alleAnzeigen {
    display: block;
    background: #C1D23C;
    border-top: 1px solid #BF1E48;
    border-bottom: 1px solid #BF1E48;
    padding: 8px 10px;
    font-size: 16px;
    font-weight: normal;
    text-align: center;
    color: #BF1E48;
}

.searchContainer.openbox #searchbox #suchErgebnisse .searchLink.alleAnzeigen:hover {
    background: #C1D23C;
}

.searchContainer #close {
    background: url("../img/close-blue.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    float: right;
    height: 15px;
    position: absolute;
    right: 15px;
    top: 10px;
    width: 15px;
}

.search.searchContainer {
    position: relative;
    z-index: 1;
    top: -74px;
}
.search.searchContainer #searchbox input {
    height: 45px;
}

.search.searchContainer #searchbox .icon {
    height: 45px !important;
    width: 45px !important;
}

.search.searchContainer #searchbox .icon img {
    height: 35px;
    width: auto;
    padding: 4px;
    margin: auto;
}

@media screen and (max-width: 1478px) {
    .searchContainer #searchbox #searchinput {
        margin-left: 42px;
    }
}

@media screen and (max-width: 1649px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        width: 75.4%;
    }
}


@media screen and (max-width: 1023px) {
    .search.searchContainer {
        position: relative;
        transition: all ease-in-out .5s;
        width: 100%;
        background: #fff;
        height: 50px;
    }

    .searchContainer.openbox {
        background: none repeat scroll 0 0 #ffffff;
    }

    .search.searchContainer.active {
        position: relative;
        top: 0px;
        width: 100%;
        background: #fff;
        height: 70px;
		box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.6);
		-moz-box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.6);
		-webkit-box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.6);
    }

    .searchContainer #searchbox #searchinput {
        float: none;
        margin-left: 7px;
    }

    .search.searchContainer #searchbox {
        position: relative;
        margin: auto;
        cursor: pointer;
        width: 96.8%;
        padding-top: 13px;
    }

    .search.searchContainer #searchbox #searchinput {
        background: none repeat scroll 0 0 #ffffff;
        border: 1px solid rgb(0,105,190);
        text-align: center;
        position: relative;
        margin: auto;
        width: 100%;
    }

    .search.searchContainer #searchbox .icon {
        display: block;
        height: 3rem;
        width: 5rem;
        float: left;
        background-color: rgb(0,105,190);
        background-size: 100% auto;
    }

    .searchContainer.openbox #searchbox #suchErgebnisse {
        background: none repeat scroll 0 0 #ffffff;
        border: none;
        box-shadow: 0 4px 4px -2px rgba(0, 0, 0, 0.8);
        min-height: 70px;
        position: absolute;
        transition: all ease-in-out .5s;
        top: 65px;
        left: 0px;
        z-index: 15;
        width: 113%;
        display: block;
        margin-left: -6%;
    }

    div#searchContainer #searchbox .icon {
        display: none;
    }

}

@media screen and (min-width: 470px) and (max-width: 553px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        left: 5px;
        width: 111%;
    }
}

@media screen and (min-width: 554px) and (max-width: 685px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        left: 20px;
        width: 105%;
    }
}
@media screen and (min-width: 686px) and (max-width: 850px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        left: 20px;
        width: 106%;
    }
}

@media screen and (min-width: 850px) and (max-width: 1023px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        left: 30px;
        width: 105%;
    }
}

@media screen and (max-width: 850px) {
    .search.searchContainer #searchbox {
        width: 95.8%;
    }
}

@media screen and (max-width: 550px) {
    .search.searchContainer #searchbox {
        width: 93.8%;
    }
}

@media screen and (max-width: 450px) {
    .search.searchContainer #searchbox {
        width: 92.8%;
    }
}

@media screen and (max-width: 350px) {
    .search.searchContainer #searchbox {
        width: 89.8%;
    }

    div#searchContainer #searchbox .icon {
        height: 1.2rem;
        width: 4%;
        padding: 0.3rem;
    }
}

@media screen and (min-width: 1024px) {
    .searchContainer #searchbox {
        top: -65px;
    }
}

@media screen and (min-width: 1024px) and (max-width: 1478px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        left: 42px;
    }

    .searchContainer #searchbox {
        left: 210px;
        width: 640px;
    }
}

@media screen and (min-width: 1479px) {
    .searchContainer #searchbox #searchinput {
        margin-left: 49px;
        width: 75.1%;
    }

    .searchContainer.openbox #searchbox #suchErgebnisse {
        width: 74.9%;
        left: 49px;
    }

    .searchContainer #searchbox {
        left: 7px;
        width: 100.54%;
    }
}

@media screen and (min-width: 1890px) {
    .searchContainer.openbox #searchbox #suchErgebnisse {
        width: 87%;
        left: 0px;
    }

    .searchContainer #searchbox #searchinput {
        margin-left: 0;
        width: 87.3%;
    }
}