/* Willkommen bei Personal Outfit*/
/** * Look and Style Anpassungen
 * @author Look and Style
 * @version 1.0
 */
:root {
    --default-color: #c29e75;
    --style-background: #c29e75;
    --style-border: #c29e75;
    --style-background-grey: #b6b6b6;
    --style-border-grey: #b6b6b6;
    --graucolor: #b6b6b6;
}
/** * Look and Style Anpassungen
 * @author Look and Style
 * @version 1.0
 */


h1 {
    font-size: 40px !important;
}
@media(min-width: 390px) {
    .stepElements > .stepContainerInner > .stepContent .firstName {
        padding-right: 15px;
    }
}

.buttonBack, .buttonForward {
    background-color:var(--style-background);
    border-color:var(--style-border);
    border-radius: 20px;
    font-style: normal;
    background-image: none;
}
.buttonBack:hover, .buttonForward:hover {
    font-style: normal;
    background-color:var(--style-background);
    border-color:var(--style-border);
}
div#genderButtons {
    width: 66.66%;
    padding: 5px 0px;
}
.stepElements > .stepContainerInner > .stepContent button.active:focus {
    outline: none;
}
div#genderWrapper {
    display: flex;
    display: -webkit-flex;
    margin-top: 20px;
    margin-bottom: 20px;
}
.stepElements .stepContainerInner > .stepTitle > h1 {
    font-style: normal;
}
.stepElements > .stepContainerInner > .stepContent button.normal:hover, .stepElements > .stepContainerInner > .stepContent button.active, .stepElements > .stepContainerInner .mistake2colum button.active {
    background-color: var(--style-background);
    border-color: var(--style-border);
    color: #fff;
    border-radius: 20px;
    border: 1px solid var(--style-border);
}
.stepElements > .stepContainerInner > .stepContent button.normal, .stepElements > .stepContainerInner .mistake2colum button.normal {
    background-color: #ffffff;
    border-color: #000000;
    color: #707070;
    border-radius: 20px;
}
.stepElements > .stepContainerInner > .stepContent .presentButtons button {
    min-width: 48%;
    margin-right: 3%;
}
.stepElements > .stepContainerInner > .stepContent .genderButtons button {
    min-width: 30.7%;
    margin-right: 3%;
    margin-bottom: 4px;
}
@media (max-width: 991px) and (min-width: 769px){
    .stepElements > .stepContainerInner > .stepContent .genderButtons button {
        min-width: 30%;
    }
}

.container.firstSite {
	/*height: 90vh !important;*/
}

@media (max-width: 400px){
    .container.firstSite {
        height: 130vh !important;
    }
}
#button2Back {
	display: none;
}
#button2Send2Shop {
	margin: 0 !important;
}

@media (max-width: 768px){
    div#genderWrapper {
        flex-wrap: wrap;
    }
    .stepContent.border.occasion .rechteSeite {
        margin-top: 3rem;
    }
    .stepElements > .stepContainerInner > .stretch > .demo-wrapper .panel.panel-default {
        margin-top: 3rem;
    }
    .kreditkarteWrapper.checked .rechteSpalte {
        margin-top: 0.5rem;
    }
}
.stepElements > .stepContainerInner > .stepContent .label > p {
    line-height: 25px;
}
input#firstName, input#lastName, input#firstNamechild, input#lastNamechild, input#firstNamechild2, input#lastNamechild2 {
    border-radius: 20px;
    border: 1px solid #000000;
}
button:focus {
    outline: none;
}
.stepElements > .stepContainerInner.personalData > .stepContent {
    margin: 30px 0;
    width: 100%;
}
.personalData .genderWrapper button#\33 {
    margin-right: 0!important;
}
.firstNamechild, .lastNamechild {
    min-width: 30.7%;
    margin-right: 3%;
    margin-bottom: 4px;
}
.firstNamechild2, .lastNamechild2 {
    min-width: 48.5%;
    margin-right: 3%;
    margin-bottom: 4px;
}
.agechild {min-width: 32.7%;}


@media (min-width: 1720px) {
    .container {
        max-width: 1140px;
    }
}

#c118 .row {
    padding: 0;
    max-width: 100vw;
}

div#c156 {
    background-color: transparent;
    height: 8rem;
}
.footer {
    background-color: transparent;
}
.footerbar2 {
    background-color: #fff;
}

@media (min-width: 992px){
    .stepElements > .stepContainerInner.personalData > .stepTitle {
        margin-bottom: 6rem;
    }
}
.firstNamechild, .lastNamechild, .agechild {max-width: 30.7%!important;}

.child {width: 66.66%;
    padding: 5px 0px;display: flex;}

.presentDataWrapper .nameWrapper {display: flex;
    display: -webkit-flex;}
@media (max-width: 767px) and (min-width: 396px) {
    div#genderButtons, .stepElements > .stepContainerInner > .stepContent .nameWrapper > .name {
        width: 100%;
    }
    .stepElements > .stepContainerInner > .stepContent .genderButtons button {
        min-width: 30%;
    }
    .child {
        width: 100%;
    }
}
@media (max-width: 395px) {
    div#genderButtons, .stepElements > .stepContainerInner > .stepContent .nameWrapper > .name {
        width: 100%;
    }
    .stepElements > .stepContainerInner > .stepContent .genderButtons button {
        min-width: 30%;
    }
    .child {
        width: 100%;
    }
}
/*Welche Outfits würden Sie in Ihrer Freizeit tragen?*/
#processNumber span {
    color: var(--default-color);
}
#processLineRed {
    background-color: var(--default-color);
}

a.back-to-top {
    display: none!important;
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper {
    max-width: 22%;
}
@media(max-width: 767px){
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper {
        max-width: 44%;
    }
    .stepElements > .stepContainerInner.color > .stepContent > .imageWrapper {
        max-width: 22%;
    }
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper > .image img {
    border: 1px solid #70707000;;
    border-radius: 10px;
    max-width: 100%;
}
.stepElements > .stepContainerInner > .stepContent .imageWrapper > .image > .hook, .stepElements > .stepContainerInner > .stepContent > .imageWrapper > .image > .cross {
    border: 1px solid #707070;
    border-radius: 10px;
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper > .image img {
    width: 235px;
    height: auto;
}
/*Was würden Sie niemals tragen?*/
.stepElements > .stepContainerInner > .stepContent > .imageWrapper > .description > p {
    text-transform: none;
    /*font-family: 'Futura Std'!important;*/
    font-style: normal;
    font-size: 14px!important;
}
/*Welche Farben gefallen Ihnen?*/
.stepElements > .stepContainerInner > .stepContent > .imageWrapper > .color {
    border-radius: 200px;
    width: 120px;
    height: 120px;
}
.stepElements .stepContainerInner > .stepTitle > p {
    text-align: left;
    font-style: normal;
    /*font-family: 'Futura Std'!important;*/
    margin-bottom: 0px;
}
.stepElements > .stepContainerInner > .stepContent.colors {
    margin: 15px 0px;
    width: 100%;
}
.colors .textAreaWrapper {
    width: 100%;
}
textarea#colorsNotice, textarea#brandsNotice, textarea#brands-businessNotice {
    width: 100%;
    height: 40px!important;
    border-radius: 20px;
    resize: none;
}
@media (min-width:1200px){
    .imageWrapper.abstand {
        margin-right: 60px!important;
    }
}
@media (max-width: 1199px) and (min-width: 992px){
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper {
        width: 33%;
    }
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper > .color {
        margin: 0 auto;
    }
}
@media(max-width: 501px){
    .stepElements > .stepContainerInner.color > .stepContent > .imageWrapper {
        margin: 15px!important;
    }
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper > .color {
        width: 20vw;
        height: 20vw;
    }
}
/*Welche dieser Freizeit-Marken entsprechen Ihrem Stil am ehesten?*/
.stepElements > .stepContainerInner > .stepContent > .imageWrapper.brands {
    width: 22%;
}
@media(max-width: 767px){
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper.brands {
        max-width: 44%;
        width: 44%;
    }
}
.stepElements > .brands > .stepContent > .imageWrapper.brands > .image img {
    margin: 0;
    width: 100%!important;
}
textarea#brandsNotice, textarea#brands-businessNotice {
    width: 73%;
}
.stepElements > .brands > .stepContent > .imageWrapper > .image {
    height: auto;
}
.stepElements > .stepContainerInner.brands > .stepContent > .imageWrapper > .image img {
    border: 1px solid #707070;
}
.stepElements > .stepContainerInner.brands-business > .stepContent > .imageWrapper > .image img {
    border: 1px solid #707070;
}
.stepElements > .stepContainerInner > .stepContent.hosenform > .imageWrapper > .image img {
    border: 1px solid #707070;
}
.stepElements > .stepContainerInner > .stepContent.hosenform .imageWrapper > .image > .hook{
    border-radius: 14px;
}
/*Welche dieser Business-Marken entsprechen Ihrem Stil am ehesten?*/
/*Aus welchem Grund möchten Sie unseren Service nutzen?*/
.stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage {
    width: 22%;
}
@media(max-width: 767px){
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage {
        max-width: 44%;
        width: 44%;
    }
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage > .image {
    border: 1px solid #707070;
    border-radius: 14px;
    min-height: 100px;
    display: table;
    min-width: 100%;
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage > .image > p {
    text-align: center;
    /*margin: 24px 10px;*/
    display: table-cell;
    vertical-align: middle;
    font-size: 16px;
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper {
    margin: 1.5%;
}
.stepElements > .stepContainerInner > .stepContent.usage {
    margin: 30px 0px 0px 0px;
    width: 100%;
}
@media (max-width: 1199px) {
    .stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage > .image {
        min-height: 100%;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}
/*Wonach suchen Sie?*/
.occasion .linkeSeite label {
    margin-left: 25px;
    margin-bottom: 21px;
}

.stepContent.border.occasion .imageWrapper {
	cursor: pointer;
}

input[type=checkbox] {
    width: 24px;
    height: 24px;
    accent-color: #707070;
    vertical-align: middle;
}

input#komplett-outfit, input#einzelteile, input#telefon, input#videotelefonie, input#facetime, input#whatsapp {
    display: none;
}

input#komplett-outfit[type="radio"] + label, input#einzelteile[type="radio"] + label, input#telefon[type="radio"] + label, input#videotelefonie[type="radio"] + label, input#facetime[type="radio"] + label, input#whatsapp[type="radio"] + label {
    position: relative;
    cursor: pointer;
}

input#komplett-outfit[type="radio"] + label:before, input#einzelteile[type="radio"] + label:before, input#telefon[type="radio"] + label:before, input#videotelefonie[type="radio"] + label:before, input#facetime[type="radio"] + label:before, input#whatsapp[type="radio"] + label:before {
    left: -1.2em;
    color: #707070;
    display: inline-block;
    position: absolute;
    right: 0em;
    top: 0em;
    width: 0.8em;
    text-align: left;
    font-size: 1.2em;
    line-height: 1em;
    content: '\f0c8';
    font-weight: 100;
    font-family: 'Font Awesome 5 Free';
}

input#komplett-outfit[type="radio"]:checked + label:before, input#einzelteile[type="radio"]:checked + label:before, input#telefon[type="radio"]:checked + label:before, input#videotelefonie[type="radio"]:checked + label:before, input#facetime[type="radio"]:checked + label:before, input#whatsapp[type="radio"]:checked + label:before {
    content: "\f0c8";
    font-family: 'Font Awesome 5 Free';
    font-weight: 1000;
}
input#telefon[type="radio"] + label, input#videotelefonie[type="radio"] + label, input#facetime[type="radio"] + label, input#whatsapp[type="radio"] + label {
    margin-left: 36px;
}
.stepElements > .stepContainerInner > .stepContent.occasion > .rechteSeite > .occasionsWrapper > .imageWrapper > .image > p {
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}

.stepElements > .stepContainerInner > .stepContent.occasion > .rechteSeite > .occasionsWrapper > .imageWrapper > .image {
    border: 1px solid #707070;
    border-radius: 14px;
    min-height: 65px;
    display: table;
    min-width: 100%;
}

.stepElements > .stepContainerInner > .stepContent.occasion > .rechteSeite > .occasionsWrapper > .imageWrapper {
    width: 30%;
    margin: 1.5%;
}
.occasionsWrapper {
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    margin: 15px auto 15px auto;
    justify-content: center;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
}
textarea#occasionNotice, textarea#einzelteileNotice, textarea#modeberatungNotice {
    border: 1px solid grey;
    border-radius: 20px;
    margin: 5px;
    resize: none;
}
.stepElements > .stepContainerInner > .stepContent.occasion .imageWrapper > .image > .hook {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url(../images/hook2.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #747373;
    opacity: 0.7;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
}
/*Wir möchten Sie kennenlernen!*/
.stepElements > .stepContainerInner .mistake2colum.haircolorbuttons button {
    min-width: 16%;
    margin-right: 1%;
    padding: 5px;
}
.stepElements > .stepContainerInner .mistake2colum button.normal {
    background-color: #ffffff;
    color: #707070;
    border-radius: 20px;
    box-shadow: none;
    border: 1px solid #707070;
}
select#koerpergr, select#gewicht, select#kragenweite, select#hosenbreite, select#hosenlaenge, select#shoesize, select#clothingsize,  select#agechild, input[type=number]#gewicht, input[type=number]#koerpergr {
    padding: 5px;
    text-align: center;
    text-align-last: center;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
	color: #707070;
	border: 1px solid #707070;
	border-radius: 20px;
	background-color: white;
}
.stepElements > .stepContainerInner .mistake2colum.clothingsizebuttons button {
    min-width: 60px;
    padding: 5px;
    margin-right: 10px;
}
.trenner {
    padding: 5px !important;
    margin-bottom: 3rem;
    flex: 0 0 100%;
}
.mistake2colum.haircolorbuttons.right, .mistake2colum.heightselect.right, .mistake2colum.weightselect.right {
    margin-bottom: 1rem;
}
p.fullwidth.hosenform {
    margin-top: 3rem;
}
select#kragenweite, select#hosenbreite, select#hosenlaenge {
    min-width: 135px;
}
input#hosenbreite, input#hosenlaenge, select#shoesize {
    width: 25%;
    border: 1px solid #707070;
    border-radius: 20px;
    text-align: center;
}
.hosengroesse {
    margin-bottom: 3rem;
}
.fullwidth.stepContent.border.hosenform {
    margin-top: 0px;
    margin-bottom: 1rem;
}
p.fullwidth.hosenform {
    margin-bottom: 0px;
}
.stepElements > .stepContainerInner > .stepContent.hosenform > .imageWrapper {
    width: 28%;
}
.stepElements > .stepContainerInner > .stepContent.hosenform > .imageWrapper > .image img {
    width: 100%;
}
.stepElements > .stepContainerInner > .stepContent.hosenform > .imageWrapper > .description > p {
    font-size: 1rem!important;
    /*font-family: 'Futura Std'!important;*/
    text-transform: none;
    font-style: normal;
    color: #707070;
}
.mistake h2 {
    font-weight: normal;
    color: #707070;
}
.mistake2colum.shoesizeselect.right {
    margin-bottom: 3rem;
}
.stepElements > .stepContainerInner > .stepTitle.border h1 {
    margin-bottom: 2rem!important;
    margin-top: 1rem!important;
}
.mistake2colum.left {
    width: 20%;
}
.mistake2colum.right {
    width: 79%;
}
p, h1 {
    color: #707070;
}
.personalData h1, .personalData p {
    color: #000000;
}
.uploader div.browser label span {
    background-color:var(--style-background);
    border-radius: 20px;
    padding: 6px 10px;
    font-weight: 100;
}
.uploader div.browser label {
    background-color: #fff;
}
.uploader div.browser label:hover {
    background-color: #fff;
}
.uploader {
    border: 1px solid #ccc;
    border-radius: 14px;
}
.panel.panel-default {
    border: 1px solid #ccc;
    border-radius: 14px;
}
.panel-heading {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.panel-title {
    text-align: center;
}
.uploader div.browser label span {
    text-transform: initial;
}
.stepElements > .stepContainerInner > .stepContent > .imageWrapper.usage > .image > p {font-size: 16px;}

@media (max-width: 991px) and (min-width: 768px){
    .mistake2colum.right {width: 69%;}
    .mistake2colum.left {width: 30%;}
    .stepElements > .stepContainerInner .mistake2colum.clothingsizebuttons button {min-width: 12%;}
}
@media (max-width: 767px) and (min-width: 500px){
    .mistake2colum.right {width: 59%;}
    .mistake2colum.left {width: 40%;}
    .stepElements > .stepContainerInner .mistake2colum.clothingsizebuttons button {min-width: 21%;margin-bottom: 3px;}
}

@media (max-width: 499px) {
    .mistake2colum.right {width: 100%;}
    .mistake2colum.left {width: 100%;}
    .stepElements > .stepContainerInner .mistake2colum.clothingsizebuttons button {max-width: 11%!important;min-width: 11%;}
}
select#koerpergr, select#gewicht, select#kragenweite, select#hosenbreite, select#hosenlaenge, select#shoesize, select#clothingsize {color: #707070;}
.mistakes > label {max-width: 87%; /*font-size: 13px;*/}

/*Foto Upload*/
.stepElements > .stepContainerInner > .stepContent > .demo-wrapper > .row > .col-md-6 > div > div {color: #000;}
.nebeneinander {display: flex;flex-flow: wrap;max-width: 177px;}
#step-price-range input {
    max-width: 80%;
    width: 80%;
    min-width: 80%;
    height: 27px;
    color: #707070;
    border: 1px solid #707070;
    border-radius: 3px;
}
p.euro {
    max-width: 20%;
    width: 20%;
    height: 20px;
}


.nebeneinander {width: 100%;margin: 0!important;}

.ui-widget.ui-widget-content {margin-left: 0px!important;}

/*Price Range */
.price_range div {max-width: 170px;}
.schuhe, .jacken-blazer, .jeans-hosen, .t-shirts, .kleider, .hemden, .pullover{
    max-width: 16%!important;
    width: 16%!important;
    margin: 0% 2%!important;
}
@media (max-width: 991px) and (min-width: 567px){
    .schuhe, .jacken-blazer, .jeans-hosen, .t-shirts, .kleider, .hemden {
        max-width: 29%!important;
        width: 29%!important;
        margin: 0% 2%!important;
    }
}
@media (max-width: 566px){
    .schuhe, .jacken-blazer, .jeans-hosen, .t-shirts, .kleider, .hemden {
        max-width: 46%!important;
        width: 46%!important;
        margin: 0% 2%!important;
    }
}
@media (max-width: 699px){
    div#buttonsborder {
        background-image: none!important;
    }
}
div#step-price-range {
    width: 100%;
}

span.ui-slider-handle.ui-corner-all.ui-state-default {
    width: 0.7em;
    height: 1.7em;
    margin-top: -3px;
    border-radius: 10px;
    background: #fff;
}
.ui-widget.ui-widget-content {
    margin-left: 0px!important;
    margin-right: 33px;
    border-radius: 20px;
}

/*Modeberatung*/
.modeberatung input, .modeberatung select {
    text-align: center;
    text-align-last: center;
    margin: 0.2rem;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
	color: #707070;
	border: 1px solid #707070;
	border-radius: 20px;
	background-color: white;
}
.modeberatung {display: flex;width: 100%;flex-wrap: wrap;}

textarea#modeberatungNotice {width: 100%;}
.modeberatungNoticeBox {width: 100%;}
label#whatsapp_two:before, label#facetime_two:before {
    color: var(--graucolor)!important;
}
label#whatsapp_two, label#facetime_two {
    color: var(--graucolor)!important;
}

/*Ihre Kundendaten*/
.kundendaten > div {
    width: 100%;
}
select#selectSalutation {
    width: auto;
}
@media (min-width: 600px){
    .linkeSpalte {width: 48%; margin-right: 2%;}
    .rechteSpalte {width: 50%;}
    .twocolumnsdiv {
        display: flex;
        flex-flow: wrap;
    }
}
.kundendaten input, .kundendaten select, select#kreditkartentyp, input#kreditkartennr, input#ccv {
    color: #707070;
    border: 1px solid #707070;
    border-radius: 20px;
    text-align: center;
}
input#formHouseNumber, input#formHouseNumber1 {
    margin-right: 5%;
}
input#formHouseNumber, input#formZip, input#formHouseNumber1, input#formZip1 {
    width: 45%;
}
.kundendaten input#lastName, .kundendaten input#firstName {
    border: 1px solid #707070;
}
select#selectSalutation {
    margin-bottom: 15px;
}
input#birthday, input#birthmonth, input#birthyear {
    width: 30%;
    margin-right: 3%;
}
.linkeSpalte.threecolumndiv {
    display: flex;
    flex-flow: wrap;
}
.kundendaten input#alternativeAddress {
    margin-left: 0%;
}
.kundendaten > .twocolumnsdiv {
    margin-bottom: 15px;
}
.alternativeShippingAddress .twocolumnsdiv {
    margin-bottom: 15px;
}
input#formZip1, input#formZip {
    width: 50%;
}



/*zahlungsart*/
.stepContainerInner.zahlungsart > div {
    width: 100%;
}
.kreditkarteWrapper.checked {
	display: block;
}
input#kreditkarte,
input#vorkasse,
input#paypal,
input#rechnung,
input#garhammerCard {
    display: none;
}
input#kreditkarte[type="radio"] + label,
input#vorkasse[type="radio"] + label,
input#paypal[type="radio"] + label,
input#rechnung[type="radio"] + label,
input#garhammerCard[type="radio"] + label {
    position: relative;
    cursor: pointer;
    margin-left: 36px;
}
input#kreditkarte[type="radio"] + label:before,
input#vorkasse[type="radio"] + label:before,
input#paypal[type="radio"] + label:before,
input#rechnung[type="radio"] + label:before,
input#garhammerCard[type="radio"] + label:before {
    left: -1.2em;
    color: #707070;
    display: inline-block;
    position: absolute;
    right: 0em;
    top: 0em;
    width: 0.8em;
    text-align: left;
    font-size: 1.2em;
    line-height: 1em;
    content: '\f0c8';
    font-weight: 100;
    font-family: 'Font Awesome 5 Free';
}
input#kreditkarte[type="radio"]:checked + label:before,
input#vorkasse[type="radio"]:checked + label:before,
input#paypal[type="radio"]:checked + label:before,
input#rechnung[type="radio"]:checked + label:before,
input#garhammerCard[type="radio"]:checked + label:before {
    content: "\f0c8";
    font-family: 'Font Awesome 5 Free';
    font-weight: 1000;
}
select#kreditkartentyp {
    width: 100%;
    margin-top: 2rem;
    height: 35px;
}
.zahlungsart .twocolumnsdiv {
    margin-top: 1rem;
}
input#ccv {
    width: auto;
}
.kreditkarteWrapper {
	display: none;
}


/*Bestellzusammenfassung*/
#shopform .linkeSpalte p {
    font-weight: bold;
    text-align: right;
    color: #000;
}
@media (max-width: 599px){
    #shopform .linkeSpalte p {
        text-align: left;
    }
    .kundendaten > .form-group {margin-bottom: 0px;}
    .kundendaten input, .kundendaten select {margin-bottom: 1rem;}
}
#edit-icon-adress {
	float: right;
}

/* responsive */
@media only screen and (max-width: 400px) {
    #processLine {
        width: 85%;
    }
    #processNumber {
        width: 15%;
    }
    #buttonBack {
        margin-left: 1rem !important;
    }
    .buttonForward {
        margin-right: 1rem !important;
    }
}

@media only screen and (max-width: 700px) {
    .stepButtons > div:first-child {
        float: right;
    }
    .stepButtons > div:last-child {
        float: left;
    }
    #buttonBack {
        margin-left: 1rem !important;
    }
}

.mistake2colum.heightselect.right input, .mistake2colum.weightselect.right input {
    max-width: 16%;
}
/*Schieberegler bei Price Range*/
span.ui-slider-handle.ui-corner-all.ui-state-default.ui-state-hover {
    border: 1px solid #cccccc!important;
    background: #fff!important;
}
/*----------------------------*/
@media (min-width: 576px) {
    .container {
      max-width: 540px;
    }
}
@media (min-width: 768px) {
    .container {
      max-width: 720px;
    }
}
@media (min-width: 992px) {
    .container {
      max-width: 960px;
    }
}
@media (min-width: 1200px) {
    .container {
      max-width: 1140px;
    }
}
.uploader{
    border: 2px dotted #A5A5C7;
    width: 100%;
    color: #92AAB0;
    text-align: center;
    vertical-align: middle;
    padding: 30px 0px;
    font-size: 200%;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.uploader div.or {
    font-size: 50%;
    font-weight: bold;
    color: #C0C0C0;
    padding: 10px;
}
.uploader div.browser label {
    padding: 5px 15px;
    color: white;
    padding: 6px 0px;
    font-size: 40%;
    font-weight: bold;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    display: block;
    width: 100%;
    margin: 20px auto 0px auto;
    text-transform: uppercase ;
      /* 	box-shadow: 2px 2px 2px #888888; */
}
.uploader div.browser span {
    cursor: pointer;
}
.uploader div.browser input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    border: solid transparent;
    border-width: 0 0 100px 200px;
    opacity: .0;
    filter: alpha(opacity= 0);
    -o-transform: translate(250px,-50px) scale(1);
    -moz-transform: translate(-300px,0) scale(4);
    direction: ltr;
    cursor: pointer;
}
.uploader div.browser label:hover {
    background-color: #7a9eca;
}
input#phoneDate {
    width: inherit!important;
}
.datepicker.datepicker-inline {
    display: none!important;
}
div#ihrtermin {
    width: 100%;
}
/*footer#page-footer {
    display: none;
}*/
.stepElements > .stepContainerInner.location > .stepContent {
    width: 100%;
}
.stepElements > .location > .stepContent > .imageWrapper > .image {
    height: auto;
}
.stepElements > .location > .stepContent > .imageWrapper.location > .image img {
    width: 100%!important;!importan;!importa;!import;!impor;!impo;!imp;!im;!i;!;
    margin: 0;
}
.stepElements > .location> .stepContent > .imageWrapper > .image {
    width: auto;
    border-bottom: none;
    display: -webkit-flex;
}
@media (max-width:442px) {
    .exitWrapper #buttonBack {
        margin-left: 0.1rem !important;
        margin-right: 0.1rem;
    }
    .exitWrapper #buttonBack, #createStylcardButton, #exitButton {
        width: 100%;
        margin-bottom: 1rem;
    }
    .exitButtons{
        display:block!important
    }
}

.buttonGreyedout {
    background-color:var(--style-background-grey);
    border-color:var(--style-border-grey);
}

.buttonNotGreyedout {
    background-color:var(--style-background);
    border-color:var(--style-border);
}
