body {

width:100vw;

color:var(--textschwarz);

}



.administratorbereich{

display:none;

}

.falschmeldung {
margin: 2vw 0px -3vw 0px;
color: rgba(219,14,33,1);
}

.administratorbereichiphone{



}



#content {
max-width: 100vw;
overflow: hidden;
}



#footer{

margin-top: 0px;

padding: 0px 0px 5vw 0px;



margin-bottom: calc(var(--siteverhaeutnis) * 12vw);

}



#footer.hinterlegt, #footertext.hinterlegt{

background-color: var(--blau1) !important;

}



#footerhaupttitel{

width:98%;

}



#footerhaupttitel .footerelementtitelbox{

flex-direction: row;

display: flex;

align-items: center;

margin-top: 3vw;

}



.footericon{

width: 40%;

}



#footerhaupttitel .footericon{

margin: 0px 3vw;

flex-shrink: 0;

width:20%;

}





.hinterlegt #footerhaupttitel h1{

font-family:Roboto;

font-size:6vw;

color:rgba(255,255,255,1) !important;

text-align:left !important;

}



p.footertext{

display:none;

}



#mainbox{

width:100vw;

position:absolute;

left: 0vw;

}



#footertext{

display: flex;

flex-direction: column;

}



.footerspalte{

    display: flex;

    flex-wrap: wrap;

    margin:0px auto;

    justify-content: center;

}



.footertextitem:not(.spaltentitel) .footerelementtitelbox{

display:flex;

flex-direction: column-reverse;

align-items: center;

}



.footertextitem:not(.spaltentitel) .footerelementtitelbox h1{

text-align:center;

}



.footertextitem{

 display: flex;

width: 47vw;

}



.spaltentitel{

width:100%;

justify-content: center;

}



.spaltentitel h1::after{

content:"";

display:block;

width:110%;

height:0.4vw;

background-color:rgba(255,255,255,1);

position:relative;

left:-5%;

top:0.2em;

}





.footericon img{

width:100%;

}



.footericonfarbe{

fill:rgba(255,255,255,1);

stroke:rgba(255,255,255,1);

}







h1{

}



h2{

}



h3{

}



h4{

}



p{

}



ul{

}



li{

}



a{

}



.listenbutton{

display:inline;

}





#iphonebox{

display:inline;



position:fixed;

top: 22vw;

height:calc(100vh - 22vw);

left:0vw;

width:100vw;

overflow-y: scroll;

z-index: 0;

-webkit-overflow-scrolling:touch;

}



#listenbildli{

-webkit-transform: scale(1,1);

-ms-transform: scale(1,1);

-moz-transform: scale(1,1);

-o-transform: scale(1,1);

transform: scale(1,1);

position: relative;

height: 100%;

width: 100%;

top: 0px;

}



#hamburger {

position: absolute;

top: 4vw;

left: 83vw;

width: 14.5vw;

height: 13.5vw;

}

	

.listenstrichli{

position: absolute;

width: 100%;

height: 13%;

background-color: var(--blau1);

border-radius: 1vw;

}

	

#listenstrichli1{

top:0px;

}

#listenstrichli2{

top:42.5%;

}

#listenstrichli3{

top:87%;

}





#menu{

position:fixed;

-webkit-transform: scale(1,0);

-ms-transform: scale(1,0);

-moz-transform: scale(1,0);

-o-transform: scale(1,0);

transform: scale(1,0);

-webkit-user-select: none;

top: 22vw;

transform-origin:top;

width: 100vw;

background-color: rgba(255,255,255,1);

}



#menukasten{

height: calc(100vh - 28vw);

margin:0px 0px 0px 1.5vw;

background-color: rgb(255, 255, 255);

transform-origin-x: center;

transform-origin-y: top;

}



#listenstrichli1.geaendert{

-webkit-transform:rotate(45deg) translateY(calc(var(--breite) / 5),calc(var(--versatz) * 0.85)) scale(1.2,1);

-moz-transformm:rotate(45deg) translateY(calc(var(--breite) / 5),calc(var(--versatz) * 0.85)) scale(1.2,1);

-ms-transform:rotate(45deg) translateY(calc(var(--breite) / 5),calc(var(--versatz) * 0.85)) scale(1.2,1);

-O-transform=:rotate(45deg) translateY(calc(var(--breite) / 5),calc(var(--versatz) * 0.85)) scale(1.2,1);

transform:rotate(45deg) translate(calc(var(--breite) / 5),calc(var(--versatz) * 0.85)) scale(1.2,1);

}



#listenstrichli2.geaendert{

-webkit-transform:scale(0,0);

-Moz-transformm:scale(0,0);

-ms-transform:scale(0,0);

-O-transform=:scale(0,0);

transform:scale(0,0);

}



#listenstrichli3.geaendert{

-webkit-transform:rotate(-45deg) translateY(calc(var(--breite) / 4),calc(calc(var(--versatz) * 0.85) * -1)) scale(1.2,1);

-Moz-transformm:rotate(-45deg) translateY(calc(var(--breite) / 4),calc(calc(var(--versatz) * 0.85) * -1)) scale(1.2,1);

-ms-transform:rotate(-45deg) translateY(calc(var(--breite) / 4),calc(calc(var(--versatz) * 0.85) * -1)) scale(1.2,1);

-O-transform=:rotate(-45deg) translateY(calc(var(--breite) / 4),calc(calc(var(--versatz) * 0.85) * -1)) scale(1.2,1);

transform:rotate(-45deg) translate(calc(var(--breite) / 4),calc(calc(var(--versatz) * 0.85) * -1)) scale(1.2,1);

}



#menu.geaendert, .formulardrin #menu.geaendert{

-webkit-transform:scale(1,1);

-Moz-transformm:scale(1,1);

-ms-transform:scale(1,1);

-O-transform:scale(1,1);

transform:scale(1,1);

}



#menukasten.geaendert, .formulardrin #menukasten.geaendert{

-webkit-transform:scale(1,1);

-Moz-transformm:scale(1,1);

-ms-transform:scale(1,1);

-O-transform:scale(1,1);

transform:scale(1,1);

}



.navicontainers{

top: 0vw;

width: 90%;

position: relative;

left:8vw;

}



#unteremenuzeile{

position:relative;

border-top:solid 0.4vw var(--blau1);

}



/*2*/


.navicontainers{

height:calc((85vh - 22vw) / (6));
}


.hauptitem{

height:calc((85vh - 22vw) / (6));

display: flex;

align-items: center;

width: 80%;

justify-content: space-between;

}










.hauptitem a{

position: absolute;

top: 6vw;

left: 20vw;

font-size: 6vw;

font-weight: lighter;

color: var(--textschwarz);

font-weight: lighter;

display:block;

margin-top:calc((0.07vh * var(--siteverhaeutnis) * var(--siteverhaeutnis) * var(--siteverhaeutnis) * var(--siteverhaeutnis) * var(--siteverhaeutnis)) - 0.2vh);

}



#unteremenuzeile .hauptitem a{

color: rgba(90,90,90,1);

}



.aktiv .hauptitem a{

color: var(--textschwarz);

}



.aktiv .hauptitem a::after{

content:"";

display:block;

background-color:rgba(219,14,33,1);

height:0.4vw;

}





.icon{

display: flex;

width: 12vw;

height: 12vw;

border: solid 0.2vw rgba(33,140,216,1);

border-radius: 20%;

justify-content: center;

align-items: center;

left: 5vw;

position: relative;

}



#unteremenuzeile .icon{

display:none;

}



.rotgut .icon{

border:none 0px;

}



.farbig{

fill:var(--blau1);

}



.hingergrundig{

fill:rgba(44,131,197,1);

}



.icon svg{

display:block;

width: 9vw;

}



.rotgut .icon svg{

width:11vw;

}





.pluszeichen{

position: absolute;

top: 6vw;

left: 36vw;

font-weight:bold;

}



.popups{

background-color: rgba(241, 236, 229, 0.15);

position: relative;

left: 50vw;

height: calc(100vh - 35vw);

transform-origin:left;

}



.popup{

position: relative;

display: block;

width: 45vw;

left: 2vw;

top: 5.3vw;

margin-bottom: 2vw;

font-size: 5vw;

font-weight: normal;

color: rgba(77,77,77,1);

transform-origin:left;

}



.aktiv.popup{

font-weight: bold;

}



.transform{

transition: -webkit-transform 0.5s;

transition: -ms-transform 0.5s;

transition: -moz-transform 0.5s;

transition: -o-transform 0.5s;

transition: transform 0.5s;

}







#header{

position:fixed;

height: 22vw;

width:100vw;

/*background-color: rgba(241, 236, 229, 1);*/

top:0px;

}



#logo{

position: absolute;

height: 20vw;

width: 78vw;

left: 2vw;

top: 2vw;



}



.logobild{

width: 100%;

position: absolute;

top: 0px;

left: 0px;

}



.logostrich{

stroke-width:0.3vw;

}







#hauptbild, .keinbild, .bildbutton{

display:none;

}



.headersticky{

position: -webkit-sticky;

position: sticky;

top: calc(90vw - 100vh);

}



.headerrelativ{

position: relative;

top: 0vw;

}



#headerbild{

height: calc(100vh - 24vw);

width: 100vw;

left: 0vw;

z-index:200;

background-color: rgba(255,255,255,1);

}



#headerbildbox{

position: relative;

width: 100%;

height: 100%;

overflow: hidden;

}



.headerbildbild{

width: 400%;

position: absolute;

left: -230%;

top: calc(-10vw + (1 / var(--siteverhaeutnis) * -12vw));

}



-home .headerbildbild{

width: 400%;

position: absolute;

left: -230%;

top: calc(-10vw + (1 / var(--siteverhaeutnis) * -12vw));

}



.umzug .headerbildbild{

width: 450%;

position: absolute;

left: -258%;

top: calc(-50vw + (1 / var(--siteverhaeutnis) * -12vw));

}



.reinigung .headerbildbild{

width: 300%;

position: absolute;

left: -130%;

top: 0px;

}



.malerei .headerbildbild{

width: 300%;

position: absolute;

left: -110%;

top: calc(-20vw + (1 / var(--siteverhaeutnis) * -12vw));

}



.sanitaer .headerbildbild{

width: 400%;

position: absolute;

left: -47%;

top: calc(-126vw + (1 / var(--siteverhaeutnis) * -12vw));

}



.tipps .headerbildbild, .tipps2 .headerbildbild{

width:  calc(var(--siteverhaeutnis) * 200%);

position: absolute;

left: calc(((0.2 * var(--siteverhaeutnis)) * var(--siteverhaeutnis) * -190%) - 50%);

top: calc(-31vh + (1 / var(--siteverhaeutnis) * -19vw));

}



.landingpage .headerbildbild {

width: 300%;

position: absolute;

left: calc((1 / var(--siteverhaeutnis) * -10vw) - 82vw);

top: calc(-10vw + (1 / var(--siteverhaeutnis) * -12vw));

}



.firmenstart .headerbildbild {

width: 400%;

position: absolute;

left: -190%;

top: calc(-10vw + (1 / var(--siteverhaeutnis) * -70vw));

}



.headerbildbild.defaultbild {

width: calc(var(--siteverhaeutnis) * 190%);

position: absolute;

left: calc(((0.2 * var(--siteverhaeutnis)) * var(--siteverhaeutnis) * -70%) - 50%);

top: calc(-5vh + (1 / var(--siteverhaeutnis) * -19vw));

}

.typ3 #headerbildbild{
width: 250%;
left: -100%;
}

.widgetblocktitel {
font-size: 5vw;
color: var(--blau1);
text-align: center;
width: 94vw;
left: 4vw;
position: relative;
margin-top: -8vw;
}

#headerbildbanner{

position: absolute;

background-color: rgba(44,131,197,1);

width: 88vw;

bottom: 0px;

padding-top: 3.5vw;

padding-right: 3vw;

padding-bottom: 3.5vw;

padding-left: 3vw;

font-weight: 500;

left: 3vw;

display:none;

}







.trennlinie{

display:none;

}



.hauptbildbanner{

display: flex;

width: 100%;

position: absolute;

margin: 0px;

padding: 2vw;

box-sizing: border-box;

top: 0px;

flex-direction: column;

left: 0px;

height: 100%;

background-color: rgba(5, 11, 24, 0.29);

}







.hauptbildbanner.bannertext h1, .hauptbildbanner.bannertext h1 a {
font-family: Roboto-medium;
color: rgba(255,255,255,1);
font-size: 10vw;
margin: 0 0 -0.5em 0;
line-height: 1em;
letter-spacing: -2px;
text-align: center;
}



.hauptbildbanner.bannertext h2, .hauptbildbanner.bannertext h2 a {
font-family: Roboto-bold;
color: rgba(255,255,255,1);
text-align: center;
font-size: 7vw;
margin-top: calc(((var(--siteverhaeutnis) * var(--siteverhaeutnis) * var(--siteverhaeutnis) * 1vh) + (4 * var(--siteverhaeutnis) * var(--siteverhaeutnis) * 1vh)) - var(--titelabstandminus));
letter-spacing: -2px;
}



#sprachen{

position:absolute;
    left: 41%;
    top: 55.5%;
    z-index: 20;

}


.sprachbutton{

float: left;
background-color: rgba(255,255,255,1);
    text-align: center;
    
    padding:0px 0.5em;
margin-right: 3vw;
font-size: 6vw;

}



#siegel{



width: 20vw;

height: 20vw;

display: block;

position: absolute;

display:none;

}



#siegel img{

width:100%;

}



.textbox, .unterseitenwidgetblock .teiltext{



width: 94vw;

margin: 0px 3vw;

font-size: 5vw;

font-weight:lighter;

}

.unterseitenwidgetblock {
flex-wrap: wrap;
max-width: 80vw;
}



.textboxinhalt2{

margin-top:10vw;

}



.textboxtext{

width: 94vw;

font-size: 5vw;

font-weight:lighter;

}



.textboxtext h1, #google h1{

font-weight: normal;

color: var(--blau1);

font-size: 8.6vw;

text-align: center;

width: 100%;

font-style: normal;

}





.textboxtext p, .textboxtext h4, .textboxtext h5, .textboxtext a{

margin:1vw 0px;

font-size: 5vw;

font-weight:lighter;

}



.textboxtext h2{

margin:1vw 0px;

font-size: 7vw;

font-weight:lighter;

color:var(--titelschwarz);

}



.textboxtext h3{

margin:1vw 0px;

font-size: 7vw;

font-weight:lighter;

color:var(--titelschwarz);

}



.textboxtext img{

width:100%;

}



.bildlegende{

font-weight: lighter;

font-style: italic;

font-size: 4vw;

margin: -1vw 0px 1vw 0px;

}



.textkasten{

width:86vw;

padding:4vw;

border-radius:4vw;

margin:3vw 0px;

}



.textboxwidgetblock {

display: flex;

flex-direction: column;

max-width: 100%;

flex-wrap: wrap;

position: relative;

margin-top: 12vw;

}



.textboxwidgetblockheader{

display: flex;

flex-direction: column;

align-items: center;

}



.textboxwidgetheaderbildkasten{



}



.textboxwidgetblock h1{

margin-bottom: 15vw;

margin-top:-5vw;

font-size:6vw;

}





.textboxwidget {

display: flex;

width: 95%;

margin-bottom: 10vw;

align-items: center;

position: relative;

margin-left: 5vw;

}



.textboxwidgetbildkasten {

display: block;

width: 20vw;

height: 20vw;

margin-bottom: 8vw;

flex-shrink: 0;

}



.textboxwidgeth3 {

margin: 1vw 0px;

font-size: 6vw !important;

font-weight: lighter;

color: var(--rotgut) !important;

position: absolute !important;

top: -10vw;

left: 0px;

width: 90%;

}



.textboxwidgetp{

margin: 1vw auto 6vw auto !important;

font-size: 4.5vw !important;

font-weight: lighter;

max-width: 60%;

text-align: left;

}



.textboxwidgetbildkasten img {

border: none;

width: 100%;

}







#bewertungsmainbox {

display:flex;

flex-wrap: wrap;

margin: 2vw auto 4vw auto;

transform: translate(0,0); 
justify-content: space-around;

}



.bewertungsboxtitel h3{

margin: 1vw 0px;

font-size: 5vw;

font-weight: lighter;

color: var(--titelschwarz);

}



.bewertungswidget {

padding: 2vw 2vw 2vw 2vw;

border: 0.3vw solid var(--blau1) !important;

display: flex;

flex-direction: column;

align-items: center;

overflow:hidden;

}



.bewerterinfos {

display: flex;

font-size: 0.8em;

padding: 1vw 0px;

}



.bewertungstitel {

font-family: Roboto-Medium;

font-size:6vw;

}



.bewertungstext {

margin-bottom: 3vw;

font-family: Roboto-Light;

}



.firmenkasten{

display: flex;

align-items: center;

align-self: flex-start;

}



.firmenlogo {

width: 10vw;

height:10vw;

display: block;

border: 0.01vw solid var(--blau1);

margin-right:1vw;

}



.firmenlogo img {

width: 100%;

}



.ratingkasten {

display: flex;

align-items: center;

margin: 1vw 0px 0vw 0px;

position: relative;

}



.sterne {

display: block;

width: 100%;

position: relative;

}



.sternenbar {

display: block;

width: 66%;

height: 75%;

background-color: rgba(219,14,33,1);

transform-origin: left;

top: 5%;

position: absolute;

}



.sternebild {

position: relative;

top: 0px;

left: -4%;

width: 74%;

}



.notenschnitt {

display: flex;

padding: 0.5vw 0.5vw 0.3vw 0.5vw;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

}







.hauptwidgetblocktitel h1, .unterseitenwidgetblocktitel h1 {

font-weight: normal;

color: var(--blau1);

font-size: 8.6vw;

text-align: center;

width: 100%;

font-style: normal;

}



.gutzeichenliste {

list-style-type: none;

margin-left: 4vw;

}



.gutzeichenkasten{

margin:0px auto;

}



.gutzeichenitem::before {

content: "";

display: inline-block;

width: 1.5em;

height: 1.5em;

background-image: url('../kleinbilder/icon_gutpunkt.png');

background-repeat: no-repeat;

background-position: center;

background-size: 100%;

margin-right: 0.5em;

margin-left: -12vw;

}



.absolutisiert {

position: relative;

width: 100%;

margin-top: 4vw;

background-color: var(--textboxen);

}



.einfachmachbox {

display:inline-block;

margin-left: 4vw;

}



.anpreisung {

width: 96%;

margin:0px auto;

}



.anpreisungsheader h1 {

font-size: 6vw;

color: var(--textschwarz) !important;

font-family: Roboto-medium !important;

}



.anpreisungsheader h2 {

margin: 4vw 0px 0px 0px !important;

font-size: 5vw;

font-weight: lighter;

color: var(--blau1) !important;

}



.anpreisungsbox p {

line-height: initial;

font-family: Roboto-light !important;

font-size: 5vw;

}



.schritte {

margin-top: 3vw;

width: 96%;

margin-bottom: 4vw;

}



.teilschritt {

min-height:5em;

display: flex;

align-content: space-between;

}



.teilschrittbeschriftig {

max-width: 75%;

display: block;

margin-top: 5vw;

}



.teilschrittbeschriftig h2 {

font-size: 5vw !important;

color: var(--textschwarz) !important;

font-family: Roboto-bold !important;

}



.teilschrittbeschriftig p {

margin: 0px 0px;

font-size:4.5vw;

}



.teilschrittgrafik {

padding-left: 4%;

padding-right: 4%;

min-width: 5vw;

margin-top: 5vw;

}



.nuemmerli {

width: 8vw;

height: 8vw;

padding-top: 0px;

background-color: var(--blau1);

display: flex;

justify-content: center;

align-items: center;

color: rgba(255,255,255,1);

border-radius: 50%;

font-size: 5vw;

margin-right: 8vw;

flex-shrink: 0;

}



.linie {

margin-left: calc(4vw - 0.25vw);

border-left: 0.5vw solid #2b65d9;

height: 100%;

}



#textboxinhalt2kontakt{

position:relative;

top:calc(var(--kontaktformhoch) + 4em);

}



#kontaktbody, #berstaetigungstext{

position:relative;

top:calc(0px - var(--kontakthoch));

}



.hauptwidgetbildkasten, .widgetbildkasten{

max-width:95%;

}



.hauptwidgetblock, .unterseitenwidgetblock {

position: relative;

display: flex;

justify-content: space-between;

margin: 4vw;

}



.hauptwidgetblocktitel, .widgettitel {

position: relative;

width: 100%;

flex-shrink: 0;

}



.hauptwidgetblocktitel h3, .widgettitel h3{

font-family: Roboto;

font-size: 5vw;

text-align: center;

}



.hauptwidget, .widget {

width: 25%;

padding: 2vw;

cursor: pointer;

border: 0.01vw solid var(--blau1);

flex: 0 1 auto;

}

.widget {
width: 90%;
}



.hauptwidgetbildkasten, .widgetbildkasten {

position: relative;

max-width: 100%;

overflow: hidden;

height: 14.55vw;

border: 0.01vw solid var(--blau1);

}



.hauptwidgettitel, .widgettitel {

margin: 2vw auto 3vw auto;

text-align: center;

}



.hauptwidget .teiltext.lang {

display: none;

}

.unterseitenwidgetblock .teiltext.lang {
display: block;
max-width: 95%;
}

.unterseitenwidgetblock .widgettitel{
font-size:5vw;
}





.teiltext.kurz {

display: block;

}



.hauptwidget .mehrbutton, .unterseitenwidgetblock .mehrbutton {

width: 30vw;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 90% center;

background-size: 16%;

padding: 0.8vw 1.4vw 0.6vw 3vw;

font-size: 1.3em;

margin: 2vw 0px 0vw 0px;

text-align: left;

border-radius: 1vw;

margin-left: 57%;

flex-shrink: 0;

display: block;

}



.hauptwidgetbild, .widgetbild{

position: relative;

width:100%;

}



/*.formularinputs p{

margin:4vw 0px 0px 0px;

}



.formularinputs textarea{

height:8em;

}



.formularinputs textarea, .formularinputs input{

color: rgba(96,96,96,0.5);

font-size:0.8em;

padding-top:0.4em;

width:92vw;

}



.formularfelder h2{

font-size: 6vw;

color: rgba(44,131,197,0.8);

margin:6vw 0px 0px 0px;

}



.kontaktbutton {

background-color: rgba(44,131,197,0.7);

display: block;

position: relative;

color: rgba(255,255,255,1);

border: solid 0.12vw rgba(96,96,96,0.7);

border-radius: 0.7em;

height: 10vw;

font-size: 6vw;

text-align: center;

cursor: pointer;

font-family: Roboto;

margin-top:2vh;

}



#google{

width: 96vw;

height: 60vw;

position: relative;

display: flex;

flex-direction:column;

margin:20vh auto 4vh auto;

}



#google iframe{

width:100%;

height:100%;

}*/



.hinterlegt{

background-color: var(--textboxen);

color:var(--textschwarz);

}



.hinterlegt > *,.hinterlegt li{

color:var(--textschwarz) !important;

}



.footerspalte p, .footerspalte a, .footerspalte li, .footerspalte h1, .footerspalte h2, .footerspalte h3, .footerspalte h4, .footerspalte h5, .footerspalte h6{ 

color:rgba(255,255,255,1);

font-size: 6vw;

}



.footerspalte{

font-size: 6vw;

}



#spruch {

width: 100vw;

background-color: rgba(255,255,255,1);

margin: -4vw 0px 0px -4vw;

padding: 2vw 0px 4vw 0px;

text-align: center;

line-height: 1.5em;

font-size: 7vw;

font-weight: lighter;

font-style:italic;

color: rgba(11,116,120,1) !important;

}



.spruchtext{

color: rgba(11,116,120,1) !important;

}



#spruch::after{

content: "";

display: block;

width: 65%;

height: 1px;

background-color: rgba(247,105,55,1);

border: none 0px;

margin: 3vw auto;

}



#seitentitel{

position:relative;

left: 3vw;

max-width:96vw;

}



.titellink, #seitentitel h1{

font-size: 6vw;

font-weight: normal;

color: #877717;

}





.navicontainers{



}



.navibackground{



}



.adresstext{

font-size: 5vw;

font-weight: normal;

}



.copyright{

font-size: 5vw;

font-weight: normal;

}



.adresstext h2{

margin:0px;

padding:0px;

font-weight: bold;

}





.hauptwidget {

width: 91vw;

margin: 3vw auto 3vw auto;

border: 0.3vw solid var(--blau1);

}

.unterseitenwidgetblock .widget{

width: 100%;

margin: 3vw auto 3vw 4vw;

border: 0.3vw solid var(--blau1);

}







.widgettitel, .hauptwidgettitel{

font-weight:bold;

padding: 1vw 1vw 0px 1vw;

}



.widgetbildkasten, .hauptwidgetbildkasten{

position:relative;

max-width: 100%;

overflow: hidden;

height: 43vw;

}

.unterseitenwidgetblock .widgetbildkasten{
margin-bottom:4vw;
}



.widgetbild, .hauptwidgetbild{

width: 100%;

top:-6vw;

position:relative;

}



.teiltext{

padding: 0px 1vw 1vw 1vw;

}



.teiltext.lang{

display:none;

}





.teiltext::after{

content:"...";

}







.mehrbutton{

width: 30vw;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 90% center;

background-size: 16%;

padding: 0.8vw 1.4vw 0.6vw 3vw;

font-size: 1.3em;

margin: 2vw 0px 0vw 0px;

text-align: left;

border-radius: 1vw;

margin-left: 57%;

flex-shrink: 0;

display: block;

}

.unterseitenwidgetblock .mehrbutton{
margin-left: 54%;
}



.offen{

-webkit-transform: scale(1,1);

-ms-transform: scale(1,1);

-moz-transform: scale(1,1);

-o-transform: scale(1,1);

transform: scale(1,1);

}



.zu{

-webkit-transform: scale(0,1);

-ms-transform: scale(0,1);

-moz-transform: scale(0,1);

-o-transform: scale(0,1);

transform: scale(0,1);

}



#logintable{

display:none;

}





#loginerscheinbutton{

display:none;

}





.fortschrittsbar {



width: 100%;

position: relative;

top: 8vw;

z-index: 1;

}



.bar2{

width:40%;

}



bar3{

width:60%;

}



bar4{

width:80%;

}



.stepfortschritt{

display:flex;

align-items:center;

}



.landingpageinhalt .stepfortschritt {

display: none;

}





.fortschrittnummer{

width: 8vw;

height: 8vw;

padding-top: 0px;

background-color: var(--blau140);

display: flex;

justify-content: center;

align-items: center;

color: rgba(255,255,255,1);

border-radius: 50%;

font-size: 5vw;

flex-shrink: 0;

}



.aktiv .fortschrittnummer{

background-color: var(--blau1);

}



.aktiv .linienboexli{

display:none; 

}



.fortschritttext{

display:none;

}



.landingpageinhalt .fortschrittsbar::after{

content:"Sie werden die Offerten demnächst erhalten. Wir empfehlen es sehr eine Besichtigung mit unseren Qualitätsgeprüften Firmen zu organisieren. Bei einer Besichtigung können Sie sicher gehen, dass Sie eine exakte Offerte erhalten. Somit haben Sie eine 100% Sicherheit, dass der Preis während dem gesamten Umzug unverändert bleibt.";
display: block;

font-family: Roboto-bold;

color: rgba(255,255,255,1);

position: absolute;

top: -65vh;

width: 95vw;

}



.landingpage .hauptbildbanner.bannertext h2,.landingpage .hauptbildbanner.bannertext h2 a{

margin-top:calc(((var(--siteverhaeutnis) * var(--siteverhaeutnis) * var(--siteverhaeutnis) * 1vh) - (1.2 * var(--siteverhaeutnis) * var(--siteverhaeutnis) * 1vh)));

text-align:left;

} 



#berstaetigungstext{

position:relative;

top: calc(50vh - (var(--kontakthoch) * var(--siteverhaeutnis)));

color:rgba(255,255,255,1);

font-size:6vw;

font-family:Roboto-medium;

}



.bestellbody {

padding-top: 11vw;

margin: 0vw 0px 20vw 0px;

width: 100%;

position: relative;

}



.landingpage .bestellbody {

padding-top: 0px;

margin: 0px;

width: 90%;

position: absolute;

top: 62vh;

left: 5%;

}



.bestellbody.altescss {

padding-top: 0px;

margin: 0vw 0px 20vw 0px;

width: 99%;

position: relative;

top: initial;

left: initial;

}



select, input, textarea{

width:93%;

}



.formularfelder {

display: flex;

flex-direction: column;

background-color: rgba(193,226,242,1);

position: relative;

padding: 0px 0px 4vw 4vw;

border-radius: 8vw;

}



.landingpage .formularfelder {

display: flex;

flex-direction: column;

background-color: var(--blau160);

position: relative;

padding: 0px;

border-radius: 0px;

}



.landingpage .inputvortext{

color:rgba(255,255,255,1);

font-size:4vh;

}



.altescss .formularfelder {

display: flex;

flex-direction: column;

background-color: rgba(193,226,242,1);

position: relative;

padding: 0px 0px 4vw 4vw;

border-radius: 8vw;

}





.bestellbody .formularfelder h2 {

font-size: 5vw;

color: rgba(44,131,197,0.8);

margin: 6vw 0px 4vw 0px;

}



.landingpage .bestellbody .formularfelder h2 {

display: none;

}



.altescss .bestellbody .formularfelder h2 {

display:block;

}



select {

margin-right: 2vw;

background-image: url('../kleinbilder/icon_pfeilrund_unten.png');

background-repeat: no-repeat;

background-position: 95% center;

background-size: 6%;

background-color: rgba(255,255,255,1);

height: 12vw;

width: 95%;

padding-right: 20%;

}



.selectinputfeld input{

width:80%;

}



.selecttrigger {

width: 12%;

background-size: 45%;

}



.triggerkasten {

max-height: 57vw;

overflow-y: scroll;

-webkit-oveflow-scrolling: touch;

width: 95%;

margin-top: 0.6vw;

border: solid 0.3vw var(--blau1);

}



.triggefeld {

background-color: rgba(255,255,255,1);

width: 100%;

border-bottom: 0.6vw solid var(--blau140);

height: 10vw;



align-items: center;

padding-left: 1vw;

}



.triggefeld.unsichtbar{

border:none 0px;

}







.formularinputs {

margin-bottom: 3vw;

}



.landingpage .formularinputs {

margin-bottom: initial;

}



.altescss .formularinputs {

margin-bottom: 3vw;

}



.inputvortext {

margin-bottom:1vw;

}



.pickerfeld {

width: 50vw;

background-color: rgba(255,255,255,1);

margin-bottom: 1vw;

color: rgba(255,255,255,1);

}



#erwuenscht{

margin: 1vw 0px;

font-size: 3vw;

}





.bestellbutton {

color: rgba(255,255,255,1);

background: none;

background-color: var(--blau1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 90% center;

background-size: 12%;
padding-left: 2vw;

display: flex;

padding-bottom: 4vw;

align-items: center;

align-content: center;

position: relative;

cursor: pointer;

width: 39vw;

font-size: 8vw;

height: 10vw;

border-radius: 0px;

border: none 0px;

text-align: left;

border: none 0px;

font-family: Roboto-medium;

letter-spacing: -0.2vw;

box-shadow: none;

margin-top: 0vw;

margin-bottom: 1vw;

left: 47vw;

}



.landingpageinhalt .bestellbutton {

display: none;

}



.altescss .landingpageinhalt .bestellbutton {

display: none;

}



.formularfelder h2 {

font-size: 5vw;

color: rgba(44,131,197,0.8);

margin: 6vw 0px 0px 0px;

}



.custom-checkbox {

display: flex;

align-items: baseline;

justify-content: space-between;

width: 60%;

}



.custom-checkbox-decker {

display: block;

height: 8vw;

width: 8vw;

border: solid 1px var(--blau1);

}



.custom-checkbox-decker::before {

content: " ";

width: 8vw;

height: 8vw;

display: block;

position: relative;

background-color: rgba(255,255,255,1);

}



.checkbox:checked ~ .custom-checkbox-decker::after {

background-image: url('../kleinbilder/icon_gut_check.png');

background-size: 100%;

background-repeat: no-repeat;

}



.custom-checkbox-decker::after {

content: " ";

width: 12vw;

height: 12vw;

display: block;

position: relative;

top: -12vw;

}



.radiofeld{



display: flex;

flex-wrap: wrap;



}



.radiofeld .inputvortext:first-child{

width:100%;

}



.landingpage .radiofeld .inputvortext:first-child {

width: 100%;

margin-right: 4vw;

margin-left:4vw;

}



.landingpage .radiofeld > div:first-of-type {

width: 95%;

flex-shrink:0;

font-size:5.8vw;

white-space:nowrap;

margin-top: 2vh;

}



.landingpage .altescss .radiofeld > div:first-of-type {

width: 100%;

margin-right: 4vw;

position: relative;

top: -5vh;

margin-top:0px;

}



.custom-radiobox {

display: flex;

align-items: center;

max-width: 30%;

margin-right: 18vw;

}



.landingpage .custom-radiobox {

display: flex;

align-items: center;

width: 20vw;

margin-right: 18vw;

}



.custom-radiobox-decker {

display: block;

height: 8vw;

width: 8vw;

border: solid 1px var(--blau1);

}



.custom-radiobox-decker::before {

content: " ";

width: 8vw;

height: 8vw;

display: block;

position: relative;

background-color: rgba(255,255,255,1);

}



.radiobox:checked ~ .custom-radiobox-decker::after {

background-image: url('../kleinbilder/icon_gut_check.png');

background-size: 100%;

background-repeat: no-repeat;

}



.custom-radiobox-decker::after {

content: " ";

width: 12vw;

height: 12vw;

display: block;

position: relative;

top: -12vw;

}









.step1 {

left: 10vw;

width: 80vw;

position: absolute;

bottom: 15vh;

margin: 0px 0px 0px 0px;

}



.step1.gescrollt{

width: 100vw;

left:0vw;

top: 20vw;

position: fixed;

z-index:5;

bottom:initial;

}



.step1 .formularfelder{

	display: flex;

background-color: var(--blau180);

box-sizing: border-box;

position: relative;

padding: 1.5vw;

border: 1px solid rgba(166, 166, 166, 1);

border-radius: 1vw;

margin: 0px;

font-family: Roboto;

font-size: 8vw;

flex-direction: column;

	}

	

	.step1 .formularinputs{

align-items: center;

font-family: Roboto;

font-weight: 600;

font-size: 1.35vw;

color: rgba(96,96,96,0.7);

margin-top: 4vw;

width: 70%;

margin-left: 15%;

}

.step1.gescrollt .formularinputs{

margin-top: 2vw;

margin-left: 3.2vw;

}



	.step1 select, .step1 input, .step1 textarea, .step1 button{

-webkit-appearance: none;

-moz-appearance: none;

appearance: none;

border: none 0px;

height: 12vw;

font-size: 6vw;

border-radius: 0px;

flex-grow: 0;

color: var(--textschwarz);

width: 100%;

}



.step1 input{

font-family: Roboto;

font-weight: 600;

color: rgba(96,96,96,0.5);

padding: 0.05vw 0.2vw 0px 0.4vw;

}



.step1 .erstoption{

font-family: Roboto;

font-weight: 600;

color: rgba(96,96,96,0.5);

}



.step1 select::-ms-expand{

display:none;

}



.step1 select option:first-child{

font-family: Roboto;

font-weight: 600;

color: rgba(96,96,96,0.5);

}



.step1 input::-webkit-input-placeholder { /* Chrome/Opera/Safari */

  font-size: 6vw;

text-align: center;

}

.step1 input::-moz-placeholder { /* Firefox 19+ */

  font-size: 6vw;

text-align: center;

}

.step1 input:-ms-input-placeholder { /* IE 10+ */

  font-size: 6vw;

text-align: center;

}

.step1 input:-moz-placeholder { /* Firefox 18- */

  font-size: 6vw;

text-align: center;

}



.step1 input:placeholder-shown, .step1 input::placeholder{

font-size: 6vw;

text-align: center;

}



.step1 select {

width: 132%;

box-sizing: border-box;

padding-right: 10vw;

background-image: url('../kleinbilder/icon_pfeilrund_unten.png');

background-repeat: no-repeat;

background-position: 95% center;

font-size:5vw;

background-size: 6%;

background-color: rgba(255,255,255,1);

margin-left: -16%;

}



	

.step1 .anderesfeld {

display: block;

}

	

	.step1 .inputvortext{

	display:none;

	}

	

	.step1 .bestellbutton {



}





	

.step1 .selectfeld{

	

}



.step1 .bitteausfuellen{

margin: 2.2vw 0px 1.8vw 0px !important;

font-size: 5.5vw !important;

font-family:Roboto-light !important;

color: white !important;

}



.step1.gescrollt .bitteausfuellen {

margin: -0.5vw 0px 0px 0px !important;

color: white;

}



.step1.gescrollt #formularfeld0{

margin-top:0px;

margin-left: 15%;

}



.step1 #erwuenscht{

display:none;

position: absolute;

font-size: 6vw;

bottom: -18vw;

}







.step1 button{

display: block;

position: relative;

cursor: pointer;

margin: 4vw auto 1vw auto;

width: 40%;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 80% center;

background-size: 15%;

padding-left: 1vw;

font-size: 1.2em;

text-align: left;

left:0px;

}



.step1.gescrollt button{

margin: -16vw auto 1vw 74vw;

width: 20%;

background-position: 95% center;

background-size: 25%;

padding-left: 0.5vw;

height: 14vw;

}

.step8 .bestellbutton {
color: rgba(255,255,255,1);
background: none;
background-color: var(--blau1);
background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');
background-repeat: no-repeat;
background-position: 99% center;
background-size: 7%;
padding-left: 2vw;
display: flex;
padding-bottom: 0vw;
align-items: center;
align-content: center;
position: relative;
cursor: pointer;
width: 88vw;
font-size: 6vw;
height: 10vw;
border-radius: 0px;
border: none 0px;
text-align: left;
border: none 0px;
font-family: Roboto-medium;
letter-spacing: -0.2vw;
box-shadow: none;
margin-top: 0vw;
margin-bottom: 1vw;
left: 0px;
}



#textboxfirmenstart::before{

content: "";

position: relative;

height: calc(380vh / var(--siteverhaeutnis));

width: 100vw;

background-color: var(--blau1);

display: block;

left: -3vw;

}



.partnerbody{

position: absolute;

top: calc(40vw * var(--siteverhaeutnis));

left: 10vw;

width: 80vw;

}



.partnerbody .formularfelder h2, .partnerbody .formularfelder p{

color:rgba(255,255,255,1);

}



.partnerbody .formularfelder{

background-color:var(--blau160);

}



.partnerbody #erwuenscht {

margin: 1vw 0px;

font-size: 5vw;

}



.partnerbody button {

color: rgba(255,255,255,1);

background: none;

background-color: var(--blau1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 90% 20%;

background-size: 6%;

padding-left: 1vw;

display: flex;

align-items: center;

align-content: center;

position: relative;

cursor: pointer;

width: 85vw;

font-size: 6vw;

height: 7vw;

border-radius: 0px;

border: none 0px;

text-align: left;

border: none 0px;

font-family: Roboto, sans-serif;

font-weight: 600;

box-shadow: none;

margin-top: 2vw;

margin-bottom: -1vw;

}



#passwortvergessen {

position: relative;

color: white;

}



#buttonblock .firmenbuttonbutton{

display:none;

}



#auswahlschaltenselect {

margin-right: 0px;

width: 100%;

font-size: 1.2em;

background-position: 100% center;

padding: 0px;

padding-right: 0px;

color: var(--blau1);

background-color: var(--blau110);

padding-top: 6vw;

height: 14vw;

}



#auswahlschaltenlabel {

display: block;

margin-bottom: -8vw;

margin-top: -2vw;

}



#seitenwechsler {

font-size: 1em;

position: relative;

top: -7vw;

left: 40vw;

max-width:55vw;

overflow:hidden;

}



#seitenwechsler::after{

content:" \2192"

}





#tabellentitel h1 {

text-align: left;

}



.guthabenkasten.pc{

display:none;

}



.firmenloginseite .hellblau, .administratorbereich .hellblau{

background-color:var(--blau120);

}



.firmenloginseite .dunkelblau, .administratorbereich .dunkelblau{

background-color:var(--blau140);

}



.kundenzeile {

position: relative;

top: 0px;

z-index:0;

padding:1vw;

border-bottom:solid 2vw white;

}



.buttonmehr {

position: absolute;

left: 70vw;

max-width: 25vw;

overflow-x: hidden;

bottom: 0px;

}



#umseitenschalteriphone{

position:-webkit-sticky;

position:-sticky;

background-color:white;

display:block;

top:28vw;

z-index:1;

padding-bottom:2vw;

}



#tabellentitel{

position:-webkit-sticky;

position:-sticky;

background-color:white;

top:0px;

z-index:1;

}



.firmenloginseite .allesgezeigt{

padding-top:34vw;

}



.nuemmerzahl{

display:none;

}



.restguthaben{

display:none;

}



.kundenzeile.partnerbody {

width: 100%;

left: 0px;

}



.kundenzeile.partnerbody #formularfelder {

border-radius: 2vw;

left: -1vw;

}



.firmenloginseite .drueckdinger {

width: 30%;

margin: 2vw auto;

}



.firmenloginseite .kaufbuttons .kleingedrucktes {

font-size: 4vw;

font-family: Roboto-light;

padding: 1vw;

text-align: center;

}



.firmenloginseite .kaufbuttons span:first-of-type  {

width: 80%;

margin: 0px auto;

text-align: center;

}



.firmenloginseite .annehmen.kaufbuttons{

background-color:var(--blau1);

}



.firmenloginseite .annehmen.kaufbuttons{

color: white;

position: relative;

display: flex;

flex-direction: column;

padding: 3vw 0px;

border-radius: 3vw;

}



.firmenloginseite .positivbuttontext{

color: white;

}



.firmenloginseite .buttonmehr{

position: absolute;

right: 1vw;

top: 1vw;

}



.firmenloginseite .annehmen.kaufbuttons .iconbutton{

background-image: url('../kleinbilder/icon_gut_check.png');

background-repeat: no-repeat;

width: 16vw;

height: 16vw;

position: absolute;

top: 0px;

left: -5vw;

background-size: 100%;

}



.firmenloginseite .ablehnen.kaufbuttons .iconbutton{

border: solid 0.02vw;

border-radius: 50%;

text-align: center;

width: 6vw;

height: 6vw;

margin: 8vw auto 2vw auto;

}



.firmenloginseite .ablehnen.kaufbuttons.buttonteil {

position: relative;

display: flex;

flex-direction: column;

}



#tabellenzeilenzahl {

border: solid 0.02vw;

border-color: var(--blau1);

border-radius: 2vw;

width: 60vw;

margin: 2vw auto 0px auto;

}



#tabellenzeilenanzahl {

width: 80%;

margin: 0px auto;

background-size: 10%;

}



.nullobjekt {

margin: 0px auto !important;

width: 5vw;

text-align: center;

}

#pwsender {
height: 7vw;
font-size: 6vw;
width: 60vw;
background-size: 8%;
background-position: 98% center;
}



.seitenschaltungsfeld {

display: flex;

width: 100%;

margin: 0px auto;

justify-content: space-around;

align-items: center;

}



.seitenschaltungsfeld select {

width: 36%;

flex-shrink: 0;

background-size: 20%;

margin-right: initial;

height: initial;

}



.schaltpfeil {

display: block;

width: 32%;

height: 4vw;

background-repeat: no-repeat;

background-size: 30%;

background-position: 50% center;

}



.bewertungstabellen .widget{

    width: 91vw;

    width: 90%;

    margin: 3vw auto 3vw auto;

    border: 0.3vw solid var(--blau1);

}



.bewertungstabellen .sterne{

width:60%;

}



.bewertungstabellen .buttonmehr {

position: absolute;

left: 68vw;

bottom: 7vw;

width: 25vw;

top: initial;

}



.aufgemacht .ratingkasten {

display: flex;

align-items: center;

margin: 1vw auto 0vw auto;

position: relative;

justify-content: space-around;

}



.unsichtbar {

display: none;

}



.firmenstartinhalt #titellinks h2 {

font-family: Roboto;

font-size: 6vw;

margin-top: calc(8vw / var(--siteverhaeutnis));

}



.bewertungszeile {

margin: 5vw auto;

position: relative;

border-bottom: solid 1px var(--rotgut);

padding-bottom: 3vw;

top:calc(var(--bewerterhoch) + 15vw);

}



.notenbeschriftung {

margin: 3vw auto 8vw auto;

}



.sliderproperties {

display: flex;

position: relative;

width: 80%;

margin:4vw auto;

}



.flexibleselement{

position: absolute;

top: -230%;

left: 48%;

height: 500%;

width: 10%;

border: solid 1px;

background-color: rgba(217, 237, 244, 1);

}



.sliderproperties > div {

height: 2vw;

width: 100%);

position: relative;

}



.wertanzeiger {

position: absolute !important;

border: none 0px !important;

height: initial !important;

width: initial !important;

top: -14.5vw;

left: 96%;

font-size: 1.5em;

}



#rechtsspalte #bewertungstitel {

position:relative;

height: 4em;

border: solid 1px var(--blau1);

width: 97%;

top:calc((var(--reglerhoch) * -1) - 5vw);

}



.bewertung #bestellbody{

display:none;

}



#rechtsspalte #bewertungstitel::placeholder{

font-size: 1.5em;

}



#rechtsspalte #bewertungstext {

position:relative;

top:calc((var(--reglerhoch) * -1) - 5vw);

height: 6em;

margin-top: 1vw;

border: solid 1px var(--blau1);

width: 97%;

}



#bewertungszeilenote1::before{

content:"Vergeben Sie Noten:";

color:#999999;

font-size:1.5em;

}



.bewertungsbutton.keineauswahl {

width: 96%;

height: 10vw;

font-size: 1.5em;

background-size: 8%;

background-position: 98% center;

padding-left: 5%;

}

.region1.region{
fill:#B5DBC6;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region2.region{
fill:#AAD2A1;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region3.region{
fill:#D6DF79;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region4.region{
fill:#D9D3E8;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region5.region{
fill:#F7C5DA;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region6.region{
fill:#F5C48F;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region7.region{
fill:#F6C7BB;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region8.region{
fill:#C5E2DD;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}

	.region9.region{
fill:#CBDAEF;
stroke:#343434;
stroke-width:1.5;
stroke-linecap:round;
stroke-linejoin:round;
}


.region{
fill:rgba(210,210,210,1) !important;
}

.region.gewaehlt{
fill:var(--blau1) !important;
}



	.huelle{
fill:none;
stroke:rgba(255,255,255,1);
stroke-width:6;
stroke-miterlimit:10;
}

.huellegewaehlt{
stroke:rgba(255,255,255,1);
}

	.gewaesserstil{
fill:#B0DDE8;
stroke:#010202;
stroke-width:0.1382;
}



	.namen{
font-family:'Roboto';
font-size:30px;
fill:rgba(180,180,180,1);
}

.namengewaehlt{
fill:white;
}

#svgkarte {
width: 100%;
}

#schweizerkarte{
background-color: rgba(193,226,242,1);
display: block;
height: 75vw;
overflow: hidden;
}

.regionenmodell {

}

.regionenformular {

}

#regionenfelder {
display: block;
margin: 3vw 0px 0px 1vw;
}

.regionenfeld {
display: flex;
align-items: center;
margin-bottom: 0.5vw;

}

.kantonsbezeichnungen {
margin-right: 1vw;
}

.wahlbox{
display:block;
width:5vw;
height:5vw;
border:solid 0.1vw var(--blau1);
background-color:rgba(255,255,255,1);
margin-top: -1.2vw;
}

.regfeldgewaehlt .wahlbox{
background-color:var(--blau1);
}

.regfeldgewaehlt .wahlbox::after, .regfeldgewaehlt .wahlbox::after{
content: " ";
width: 6vw;
height: 6vw;
display: block;
position: relative;
top: -0.8vw;
left:-0.1vw;
background-image: url('../kleinbilder/icon_gut_check.png');
background-size: 100%;
background-repeat: no-repeat;
}
/*Umzugsrechner*/

#umzugskostenrechner {
width: 100%;
position: relative;
display: flex;
flex-direction: column;
background-color:white;
}

#eingabeelemente {
position: relative;
width: 100%;
flex-shrink: 0;
height: 50vw;
}

#ausgabeelemente {
position: relative;
width: 100%;
flex-shrink: 0;
margin-top: 12vw;
}

#rechnerelemente {
display: flex;
position: relative;
width: 100%;
flex-wrap: wrap;
margin-top: 2vw;
}

#kostenpunktwahl {
margin-left: 0px;
background-size: 6%;
}

.rechenschieber {
position: relative;
width: 100%;
height: 20vw;
}

.schieberumfeld {
position: absolute;
left: 0px;
top: 3vw;
width: 100%;
height: 8vw;
}

.schiebergriff {
width: 8%;
position: absolute;
height: 100%;
border: 1px solid;
background-color: rgba(255,255,255.1);
border-radius: 50%;
}

.schieberschatten {
position: absolute;
width: 160%;
height: 160%;
top: -30%;
left: -30%;
border-radius: 50%;
}

.preisanzeige {
position: relative;
width: 100%;
text-align: right;
}

.anzeige {
width: 100%;
text-align: right;
}

.kleinlegendencontainer {
width: 100%;
display: flex;
justify-content: space-between;
position: absolute;
top: 12vw;
left: -10%;
}

.kleinlegenden {
font-size: 0.7em;
color: rgb(119, 119, 119);
}

#eingabeauswahl {
text-align: center;
border: solid 1px var(--blau1);
margin-bottom: 7vw;
}

#umzugsrechnertitel {
font-weight: normal;
color: var(--blau1);
font-size: 8.6vw;
text-align: center;
width: 100%;
font-style: normal;
margin-bottom: 3vw;
}

#bezahlen {
width: 100%;
font-size: 6vw;
height: 1.2em;
}

#buttonfeld {
width: 100%;
height: 60vh;
position: fixed;
left: 0px;
top: calc(22vw + 8vh);
display: flex;
flex-wrap: wrap;
background-color: white;
z-index: 100;
}

#auswahllayer {
position: fixed;
width: 100vw;
height: 100vh;
background-color: rgba(48,48,56,.7);
top: 22vw;
left: 0px;
z-index: 10;
}

#zeileguthaben.ganzganzvorne {
z-index: 10000;
}

#anderwertbutton {
width: 10em;
background-size: 8%;
background-position: 95% center;
font-size: 6vw;
height: 1.3em;
}

/*////////////////////////////////////////////////////////////*/



@media only screen and (orientation : portrait){

#nulltag{
display:none;
}

.vormittag::before {
content: "07.00 - 12.00:";
}

.nachmittag::before {
content: "12.00 - 18.00:";
}

.abend::before {
content: "18.00 - 20.00:";
}

.kleineranzeigen {
display: none;
}

.freietermine::after {
content: "Termine";
}


#textboxpasswortseite .passworth1, #textboxloginseite .mitabstand{

margin-top: calc((-40vw * var(--siteverhaeutnis)) + calc(-40vh / var(--siteverhaeutnis)));

color: white;

position: relative;

font-size: 1.8em;

}



#textboxpasswortseite #passwortzurueck .formularfelder, #textboxloginseite #logform .formularfelder{

background-color: var(--blau180);

border-radius: 4vw;

}



#logform #absender, #logform #absendermail {

width: 95%;

height: 1.2em;

font-size: 1.8em;

margin-bottom: 2vw;

background-size: 8%;

background-position: 95% center;

}



#passwortvergessen {

font-size: 1.4em;

height: 2em;

}



#logform .inputvortext{

color:white;

font-size:1.5em;

}



#logform #formularfeld1 .inputvortext{

margin-top:4vw;

}





#logform #formularfeld2 .inputvortext{

margin-top:-1vw;

}



#logform #absendermail{

font-size: 1.25em;

background-position: 98% center;

}



.pwtablecell #abbrecher {

background-color: transparent;

border: none;

background-image: initial;

margin: 4vw auto 0px auto;

cursor: pointer;

font-size:1em;

width:30%;

text-align:center;

height:1.2em;

}

.firmenloginseite .allesgezeigt {
padding-top: initial;
}

.firmenloginseite .drueckdinger {
display: flex;
flex-direction: column;
width: 40%;
margin-top: 1em;

}

.firmenloginseite .gekauft .service, .firmenloginseite .erledigt .vorschauservice {
width: 100%;
margin-top:1em;
}

.firmenloginseite .branche {
width: initial;
}

.bewerterbutton{
margin-top:initial;
margin-bottom:1em;
}

.tabellenzeile table{
table-layout:fixed;
width: 100%;
}

.tabellenzeile table td{
vertical-align:text-top;
}

.bewerterbutton {
margin-top: 3vw;
margin-bottom: 8vw;
width: 100%;
height: 8vw;
font-size: 6vw;
background-size: 6%;
background-position: 98% center;
}

.bestellbutton {
color: rgba(255,255,255,1);
background: none;
background-color: var(--blau1);
background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 90% center;

background-size: 12%;padding-left: 2vw;
display: flex;
padding-bottom: initial;
align-items: flex-start;
align-content: center;
position: relative;
cursor: pointer;
width: 39vw;
font-size: 8vw;
height: 10vw;
border-radius: 0px;
border: none 0px;
text-align: left;
border: none 0px;
font-family: Roboto-medium;
letter-spacing: -0.2vw;
box-shadow: none;
margin-top: 0vw;
margin-bottom: 1vw;
left: 47vw;
}


.firmenloginseite .branche {
width: initial;
}

.bewerterbutton{
margin-top:initial;
margin-bottom:2vw;
}

}

/*////////////////////////////////////////////////////////////*/



@media only screen and (orientation : landscape){ 



.formulardrin #menu {

position: fixed;

-webkit-transform: scale(1,0);

-ms-transform: scale(1,0);

-moz-transform: scale(1,0);

-o-transform: scale(1,0);

transform: scale(1,0);

-webkit-user-select: none;

top: 22vh;

transform-origin: top;

width: 100vw;

background-color: rgba(255,255,255,1);

}



#menu {

top:22vw;

}

#sprachen {
position: absolute;
left: 59%;
top: 72%;
z-index: 20;
}

.sprachbutton {
float: left;
background-color: rgba(255,255,255,1);
text-align: center;
padding: 0px 0.5em;
margin-right: 3vw;
font-size: 6vh;
}

#menukasten {

height: 78vh;

margin: 0px 0px 0px 1.5vw;

background-color: rgb(255, 255, 255);

transform-origin-x: center;

transform-origin-y: top;

}



.navicontainers {

top: 0vw;

width: 90%;

height: calc(90vh - 28vw);

position: absolute;

left: 0px;

}



.icon {

display: flex;

width: 12vh;

height: 12vh;

border: solid 0.2vh rgba(33,140,216,1);

border-radius: 20%;

justify-content: center;

align-items: center;

left: 5vh;

position: relative;

}



.icon svg {

display: block;

width: 9vh;

}





.formulardrin .navicontainer2 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (1));
}


.formulardrin .navicontainer3 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (1));
}


.formulardrin .navicontainer4 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (3));
}


.formulardrin .navicontainer5 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (3));
}


.formulardrin .navicontainer6 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (5));
}


.formulardrin .navicontainer7 .hauptitem{


position:absolute;


top:calc(((85vh - 22vh) / (6)) * (5));
}


.formulardrin .hauptitem{

height:calc((85vh - 22vh) / (6));


z-index:1000;

left:calc(35% / var(--siteverhaeutnis));

display: flex;

align-items: center;

width: 60%;

justify-content: space-between;

}





.navicontainer2 .hauptitem{


position:absolute;
left:5%;
top:calc(((85vh - 25vw) / (6 - 1)) * (0 - 1));
}


.navicontainer3 .hauptitem{


position:absolute;
left:55%;
top:calc(((85vh - 25vw) / (6 - 1)) * (1 - 1));
}


.navicontainer4 .hauptitem{


position:absolute;
left:5%;
top:calc(((85vh - 25vw) / (6 - 1)) * (2 - 1));
}


.navicontainer5 .hauptitem{


position:absolute;
left:55%;
top:calc(((85vh - 25vw) / (6 - 1)) * (3 - 1));
}


.navicontainer6 .hauptitem{


position:absolute;
left:5%;
top:calc(((85vh - 25vw) / (6 - 1)) * (4 - 1));
}


.navicontainer7 .hauptitem{


position:absolute;
left:55%;
top:calc(((85vh - 25vw) / (6 - 1)) * (5 - 1));
}


.hauptitem{

height:calc((85vh - 22vw) / (6 - 1));


z-index:1000;

display: flex;

align-items: center;

width: 80%;

justify-content: space-between;

}



#unteremenuzeile {

display:none;

}





.hauptitem a {

position: absolute;

top: 2vh;

left: 20vh;

font-size: 6vh;

font-weight: lighter;

color: var(--textschwarz);

font-weight: lighter;

display: block;

margin-top: calc(2vw * var(--siteverhaeutnis) * var(--siteverhaeutnis));

}





.formulardrin #header {

position: fixed;

height: 22vh;

width: 60vw;

top: 0px;

left: 40vw;

background-color: rgba(255,255,255,1);

z-index: 1;

}



.formulardrin #logo {

position: absolute;

height: 20vh;

width: 78vh;

left: calc(60vw - 98vh);

top: 2vh;

}





.formulardrin #hamburger {

position: absolute;

top: 4vh;

left: calc(60vw - 17vh);

width: 14.5vh;

height: 13.5vh;

}



.formulardrin #iphonebox{

top: 0px;

height:100vh;

padding-top:22vh;

}



.formulardrin #headerbild{

height: 200vh;

width: 100vw;

left: 0vw;

z-index: 200;

background-color: rgba(255,255,255,1);

}

#unterheader{

display:none;

}



#headerbild {

height: 100vh;

width: 100vw;

left: 0vw;

z-index: 200;

background-color: rgba(255,255,255,1);

}



.landingpage #headerbild {

height: 100vh;

}



.formulardrin .tipps .headerbildbild, .formulardrin .tipps2 .headerbildbild{

width:  calc(var(--siteverhaeutnis) * 200%);

position: absolute;

left: calc(((0.2 * var(--siteverhaeutnis)) * var(--siteverhaeutnis) * -190%) - 30%);

top: 0vw;

}



.formulardrin #titellinks{

position:absolute;

top:80vh;

}



titellinks{

position:absolute;

top:20vh;

}



.hauptbildbanner.bannertext h2, .hauptbildbanner.bannertext h2 a {

font-family: Roboto-bold;

color: rgba(255,255,255,1);

text-align: center;

font-size: 7vw;

margin-top:30vh;

letter-spacing: -2px;

}





.step1{

width: 90vw;

left: 5vw;

top: 35vh;

position: absolute;

z-index: 5;

bottom: initial;

}



.step1.gescrollt{

width: 100vw;

left:0vw;

top: 22vh;

position: fixed;

z-index:5;

bottom:initial;

}



.step1 .formularfelder {

display: flex;

background-color: var(--blau180);

box-sizing: border-box;

position: relative;

padding: 0px;

border: 1px solid rgba(166, 166, 166, 1);

border-radius: 1vw;

margin: 0px;

font-family: Roboto;

font-size: 8vw;

flex-direction: initial;

padding: calc(7vh * var(--siteverhaeutnis));

padding-bottom: calc(9vh * var(--siteverhaeutnis));

}



.step1.gescrollt .formularfelder {

display: flex;

background-color: var(--blau180);

box-sizing: border-box;

position: relative;

padding: 0px;

border: 1px solid rgba(166, 166, 166, 1);

border-radius: 1vw;

margin: 0px;

font-family: Roboto;

font-size: 8vw;

flex-direction: initial;

}



.step1 .bitteausfuellen{

margin: -0.2vh 0px 0px 0px !important;

font-size: 8vh !important;

font-family: Roboto-light !important;

color: var(--blau1) !important;

text-align: left !important;

width: 40vw;

height: 22vh;

background-color: rgba(255,255,255,1);

text-align: center !important;

position: fixed;

top: 0px;

left: 0px;

} 





.step1.gescrollt .bitteausfuellen{

margin: -0.2vh 0px 0px 0px !important;

font-size: 8vh !important;

font-family: Roboto-light !important;

color: var(--blau1) !important;

text-align: left !important;

width: 40vw;

height: 22vh;

background-color: rgba(255,255,255,1);

text-align: center !important;

position:absolute;

top: -22vh;

left:0vw;

}







.step1 .formularinputs{

padding-top: 4vh;

align-items: center;

font-family: Roboto;

font-weight: 600;

font-size: 4vh;

color: rgba(96,96,96,0.7);

margin: 0px;

width: 20%;

height: 11vh;

}





.step1.gescrollt .formularinputs {

padding-top:4vh;

align-items: center;

font-family: Roboto;

font-weight: 600;

font-size: 4vh;

color: rgba(96,96,96,0.7);

margin: 0px;

width: 30%;

height:11vh;

}



.step1 #formularfeld0{

width: 55%;

margin: 0px 0px 0px 4vh;

}





.step1.gescrollt #formularfeld0{

width:50%;

margin: 0px 0px 0px 4vh;

}



.step1 input, .step1.gescrollt input{

height:12vh;

}



.step1 select, .step1.gescrollt select {

width: 85%;

box-sizing: border-box;

padding-right: 10vh;

background-image: url('../kleinbilder/icon_pfeilrund_unten.png');

background-repeat: no-repeat;

background-position: 95% center;

font-size: 5.5vh;

background-size: 6%;

background-color: rgba(255,255,255,1);

margin:0px;

height:12vh;

}



.step1 button {

display: block;

position: relative;

cursor: pointer;

margin: 3vh 0px 0px auto;

width: 15%;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 95% center;

background-size: 20%;

padding-left: 1vw;

font-size: 10vh;

text-align: left;

left: 0px;

height: 14vh;

}



.step1.gescrollt button{

display: block;

position: relative;

cursor: pointer;

margin: 01vh auto 0px auto;

width: 15%;

color: rgba(255,255,255,1);

background-color: rgba(48, 137, 201, 1);

background-image: url('../kleinbilder/icon_pfeilrund_rechts.png');

background-repeat: no-repeat;

background-position: 95% center;

background-size: 20%;

padding-left: 1vw;

font-size: 1em;

text-align: left;

left: 0px;

height: 18vh;

}

.step1 input::-webkit-input-placeholder { /* Chrome/Opera/Safari */

  font-size: 6vh;

text-align: center;

}

.step1 input::-moz-placeholder { /* Firefox 19+ */

  font-size: 6vh;

text-align: center;

}

.step1 input:-ms-input-placeholder { /* IE 10+ */

  font-size: 6vh;

text-align: center;

}

.step1 input:-moz-placeholder { /* Firefox 18- */

  font-size: 6vh;

text-align: center;

}



.step1 input:placeholder-shown, .step1 input::placeholder{

font-size: 6vh;

text-align: center;

}

.partnerbody{

position: relative;

top: initial;

left: initial;

width:initial;

}



#textboxfirmenstart::before{

content: "";

position: relative;

height: calc(8 * ((27vw / var(--siteverhaeutnis)) - 10vw));

width: 100vw;

background-color: var(--blau1);

display: none;

left: -3vw;

}



.landingpage .fortschrittsbar {

width: 100%;

position: relative;

top: -38vw;

z-index: 1;

}



.landingpage .bar2 {

width: 100%;

}



.landingpageinhalt .fortschrittsbar::after {

content:"Sie werden die Offerten demnächst erhalten. Wir empfehlen es sehr eine Besichtigung mit unseren Qualitätsgeprüften Firmen zu organisieren. Bei einer Besichtigung können Sie sicher gehen, dass Sie eine exakte Offerte erhalten. Somit haben Sie eine 100% Sicherheit, dass der Preis während dem gesamten Umzug unverändert bleibt.";display: block;

font-family: Roboto;

color: var(--textschwarz);

position: relative;

top: 2vw;

width: 195vw;

font-size: 4vw;

left:-1vw;

}



.landingpage .bestellbody {

padding-top: 0px;

margin: 0px;

width: 90%;

position: relative;

margin-top: -35vw;

left: 5%;

top:0px;

}



.landingpage .radiofeld .inputvortext:first-child {

width: 100%;

margin-right: 4vw;

margin-left: 4vw;

font-size: 4vw;

}



.landingpage .hauptbildbanner.bannertext h1, .hauptbildbanner.bannertext h1 a {

font-family: Roboto;

color: var(--blau1);

font-size: 4vw;

margin: 0px;

line-height: 1em;

letter-spacing: -2px;

margin-bottom: 2vw;

}



.landingpage .hauptbildbanner.bannertext h2, .hauptbildbanner.bannertext h2 a {

font-family: Roboto;

color: var(--blau1);

text-align: left;

font-size: 4vw;

margin-top: -2vw;

letter-spacing: -2px;

}



#textboxlandingpage {

position: relative;

}



.landingpage #titellinks {

position: relative;

display: block;

}



.landingpage #berstaetigungstext {

position: relative;

color: var(--textschwarz);

font-size: 4vw;

font-family: Roboto-medium;

margin-top: calc(var(--siteverhaeutnis) * 120vw * -1);

top: 0px;

left:-1vw;

}



.firmenstart .hauptbildbanner.bannertext h1, .firmenstart .hauptbildbanner.bannertext h1 a {

font-family: Roboto-medium;

color: var(--blau1);

font-size: 4vw;

margin: 0px;

line-height: 1em;

letter-spacing: -2px;

position: relative;

}



.firmenstartinhalt #titellinks h2 {

font-family: Roboto;

margin-top: calc(5vw * var(--siteverhaeutnis));

color: var(--textschwarz);

font-size: 4vw;

}



.firmenstart #headerbildbox{

display:none;

}



.firmenstart #headerbild {

height: calc(55vw * var(--siteverhaeutnis));

width: 100vw;

left: 0vw;

z-index: 200;

background-color: rgba(255,255,255,1);

position: relative;

}



.loginseite #headerbild{

display:none;

}



.loginseite #absender {

width: 20vw;

height: 6vw;

font-size: 4vw;

padding-top: 1vw;

padding-bottom: 1vw;

top: -1vw;

}



.loginseite h1.mitabstand {

font-size: 6vw;

}



.kundenzeile {

position: relative;

margin-top: 50vw;

z-index: 2;

padding: 1vw;

border-bottom: solid 2vw white;

display: flex;

}



#tabellentitel {

position: relative;

background-color: white;

top: 0px;

z-index: 1;

}



#tabellentitel h1 {

text-align: left;

font-size: 6vw;

}



#seitenwechsler {

font-size: 0.8em;

position: relative;

top: -3vw;

left: 50vw;

max-width: 55vw;

overflow: hidden;

}



.kundenzeile {

position: relative;

margin-top:initial;

z-index: 1;

padding: 1vw;

border-bottom: solid 2vw white;

display: flex;

font-size: 3.5vw;

}



.firmenloginseite .buttonmehr {

position: absolute;

left: 75vw;

bottom: 1vw;

}



#anfragen {

position: relative;

top: 0px;

}



#umseitenschalteriphone {

position: relative;

background-color: white;

display: block;

top: 0px;

z-index: 1;

padding-bottom: 2vw;

}



} /*wichtig*/