.hgbild {
    position: fixed;
    right: 0;
    top: 0;
    z-index: 5;
  width: 100%;
}
.hgbildcrem {
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    height:100vh;
    z-index: 5;
}
.hgbildcrem.weg, .hgbild.weg {
    z-index: 0;
}

.hgbildcrem .bild{
    width: 100%;
    height: 100%;
    background-size: 100% auto;
  background-size: cover;
    background-repeat: no-repeat;
    background-position: top right;
}
.hgbildcrem .text {
    position: absolute;
    top: 20vh;
    right: 10vw;
    max-width: 60vw;
    color: #FFFFFF;
}
.hgbildcrem .logoim {
    display: none;
}
.hgbildcrem .logoim img{width:100%; height:auto;}
@media print, screen and (min-width: 768px) {
.hgbildcrem .text {
    /* max-width: 61vw; */
    color: #FFFFFF;
}
}
@media print, screen and (min-width: 1010px) {
.hgbildcrem .text {
    max-width: 50vw;
    color: #FFFFFF;
}
}
@media print, screen and (min-width: 2560px) {
.hgbildcrem .bild{
    background-size: 2560px auto;
}
}

@media screen and (orientation: portrait) {
.hgbildcrem .bild{
    width: 100%;
    height: 100%;
    background-size: auto 100%;
  background-size: cover;
    background-repeat: no-repeat;
}
.hgbildcrem .text {
    right: 10vw;
    left: 10vw;
}
    
}
@media only screen and (min-width: 1024px) {
.hgbildcrem .logoim {
    display: block;
    position: absolute;
    top: 5vh;
    left: 5vw;
    max-width: 200px;
}
    
}
@media only screen and (min-width: 1200px) {
.hgbildcrem .logoim {
    top: 9vh;
    left: 3vw;
}
}

@media only screen and (min-width: 1680px) {
.hgbildcrem .logoim {
    top: 10vh;
    left: 6vw;
    max-width: 250px;
}
}
