
.formContainer {width:100%;max-width: 450px;}
.required::before, .vehicleInfo label::before {
    content: "*";
    color:var(--color-red);

}

.dividerCircle_white{width:100%;position:relative;margin:5px 0;height:35px;display:flex;justify-content:center;align-items:center}
.dividerCircle_white .dividerLine{width:100%;height:1px;background:var(--color-grey);margin:10px 0}
.dividerCircle_white .labelCircle{color:var(--color-white);text-align:center;width:40px;height:40px;background:var(--color-black);border-radius:50%;-moz-border-radius:50%;-webkit-border-radius:50%;-ms-border-radius:50%;position:absolute;left:0;right:0;font-family:var(--font-family-primary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-xs);margin:2px auto;border:5px solid #fff;display:flex;justify-content:center;align-items:center}

.tireSize p {
	font-family: gibson;
	line-height: 50px;
	border: 1px solid #CECECE;
	border-radius: 3px;
	position: relative;
	height: 50px;
	padding: 0 10px;
	width: 100%;
	background: #eaeaea;
	margin: 20px 0 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.formRow.greyBox p {font-family:var(--font-family-primary);}
.category.item {
    font-weight: 500;
}
.formRow.catRating {
    margin:0 0 25px;
}
.catRating .category.item .clarify {font-weight:400;}
.catRating .desc {
	font-family: gibson;
    font-weight: 500;
	font-size: 14px;
	margin: 5px 0 25px;
	display: block;
}

.catRating p {
    margin: 0 0 10px;
}

.category.selector {
	font-family: gibson;
    font-weight: 500;
	font-size: 16px;
	margin: 0 0 5px;
}
.formNote.raterNote {
    display:flex;
    justify-content: space-between;
}
.rater.selector {
	display: flex;
	flex-wrap: wrap;
}

.rater .squareRadio {
	flex: 0 1 8.33%;
}
.rater .squareRadio.elevenSquares {
    flex:0 1 9.09%;
}
@media only screen and (max-width: 600px) {
  .rater .squareRadio, .rater .squareRadio.elevenSquares {
    flex: 0 1 16.66%;
  }
}

.rater .squareRadio input {
	display: none;
}

.rater .squareRadio label {
  font-weight: 500;
	background: #eaeaea;
	height: 40px;
	line-height: 40px;
	text-align: center;
	margin: 2px;
	display: block;
  width: auto;
}

.rater .squareRadio label::before, .rater .squareRadio input[type="radio"]:checked + label::after {
	content: none;
}

.squareRadio input:checked ~ label {
	background: #CCC;
}

.squareRadio:nth-child(n+2) input:checked ~ label {
	background: #EF5134;
}

.squareRadio:nth-child(n+5) input:checked ~ label {
	background: #F39526;
}

.squareRadio:nth-child(n+7) input:checked ~ label {
	background: #fee34c;
}

.squareRadio:nth-child(n+9) input:checked ~ label {
	background: #b8ec80;
}

.squareRadio:nth-child(n+11) input:checked ~ label {
	background: #75c63b;
}

.noRatings {
	font-family: gibson;
    font-weight: 400;
}

.review textarea, .explanationTA {
	padding: 10px;
	box-sizing: border-box;
	width: 100%;
	font-family: gibson;
    font-weight: 400;
}

.explanationTA .srCharacterCount {
    margin: 0 0 25px;
}

.srCharacterCount {
	font-family: gibson;
    font-weight: 400;
	font-size: 12px;
	margin: 0 0 5px;
	display: block;
}

.formRow.greyBox {padding:20px;}
.formRow.greyBox h3 {margin-top:0;}
.formRow.greyBox input[type="checkbox"] + label {align-items:flex-start;}
.formRow.greyBox input[type="checkbox"] + label::before {min-width:24px;}

#productChoice .formRow {margin:8px 0;}
.surveyRowOther {margin:5px 0 0 15px;}
#mods textarea, #hrdw textarea {width:100%;max-width:450px;}


.backNext {
	display: flex;
    align-items:center;
}

.backNext .redLesser {
	white-space:nowrap;
	margin-right:50px;
}

.tireSize {
    display: flex;
    flex-wrap: wrap;
    max-width: calc(40ch + 2.75rem);
    justify-content: space-between;
}

.tireSize label {
    width: 100%;
}

.tireSize .megaMenuDropdownContainer {
    width: 32%;
}

.tireSize .megaMenuDropdownContainer button {
    width: 100%;
}

/* Installer Rating */

.stars {
    display:flex;
    flex-direction:row-reverse;
    justify-content:flex-end;
}
div.stars > label {
    cursor:pointer;
    height:35px;
    margin:0 15px 0 0;
    position:relative;
    width:35px;
}
div.stars > label::before, div.stars > label::after {
    display: none;
}
.starFull {
    background:url(/images/icons/starFull.svg) no-repeat;
    background-size:35px auto;
    display:inline-block;
    height:35px;
    left:0;
    position:absolute;
    top:0;
    width:35px;
}
.starNone {
    background:url(/images/icons/starNone.svg) no-repeat;
    background-size:35px auto;
    display:inline-block;
    height:35px;
    left:0;
    position:absolute;
    top:0;
    width:35px;
}
.stars input:not(:checked) ~ label > .starFull {
    display:none;
}
.stars label:hover > .starNone, .stars label:hover ~ label > .starNone, .stars input:checked ~ label > .starNone {
    display:none;
}
.stars label:hover > .starFull, .stars label:hover ~ label > .starFull, .stars input:checked ~ label > .starFull {
    display:block !important;
}
.stars.grey .starFull, .stars.grey label:hover > .starFull, .stars.grey label:hover ~ label > .starFull, .star.grey input:checked ~ label > .starFull{
    display:none !important;
}
.stars.grey .starNone, .stars.grey label:hover > .starNone, .stars.grey label:hover ~ label > .starNone, .star.grey input:checked ~ label > .starNone{
    display:block !important;
}
.ratingMessage {
    color:var(--color-darkgrey);
    font-size:var(--font-size-sm);

}
.reviewInstaller_Write textarea {
  width: 100%;
}
 
/*Customer Satisfaction Survey*/
.surveyStarRatings {height:60px;}

/* Package Counter */
.packageCounter {margin-bottom: 50px;}


label.eleError {border:none !important;}
.formNote, .formNote a {font-family:var(--font-family-primary) !important;font-size:var(--font-size-sm) !important;line-height:var(--line-height-sm) !important}

/*Installer Survey*/
.instSurveyHead .flexRow {
    display:flex;
}
.instSurveyHead .flexRow input {
    width:100%;
    margin-right:15px;
}
.installerList {
    display:flex;
    margin-top:20px;
}
.installerList div {
    flex:1 100%;
}
.installerList li {
    margin:5px 0;
    line-height:var(--line-height-primary);
}
.installerList li a {font-weight:400;cursor:pointer;}
.installerList li a span {display:block;font-weight:500;color:var(--color-blacktext);}
.yourInstaller {
    margin-bottom:1.2em;
}
h3.installerName {
    font-family: var(--font-family-primary);
    font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-xl);
    line-height: 20px;
    margin-bottom: 5px;
}
.installerRating {margin-top:20px;}

@media only screen and (max-width:767px) {
    .instSurveyHead .flexRow {display:block;}
    .instSurveyHead .flexRow input {margin:0 0 15px 0;}
    .installerList {flex-direction:column;}
    #saved {margin-top:25px;}
}

.contactForm .contentWrapper > div { flex: 1; }
.contactForm input[type=text],
.contactForm select,
.contactForm textarea { width: 100%; }
.newVehicle, .manualVehicle {margin-left: 8%;}
.inputContainer.assignVehicle { display: inline-block; margin: 8px auto 7px; }
.vehicleOptions input[type='text'], .contactForm .vehicleOptions .dropdownButton select { margin-bottom: 10px; }
.contactForm .primaryBtn { margin-top: 20px; }

.contactForm .vehicleOptions .dropdownButton button { display: none; }

