/*@import url(http://fonts.googleapis.com/css?family=Montserrat);*/

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

/* work around Divi */
#main-content .container {
	width: 100% !important;
}

#hsc-quote-form {
	font-family: verdana;
}

#summary {
  max-width: 100%;
  margin: 25px auto 50px;
  text-align: left;
  position: relative;
  color: #666;
}

#profile {
  margin: 20px 0 0;
}

/* progress tracker */

.progress-wrapper {
	overflow: hidden;
	margin: 3% 8% 0;
	padding: 2% 0 0;
    /*width: 100%;
    position: relative;
    left: 0;*/
}

ol#progress-tracker {
  margin: 0;
  padding: 3% 0 0;
  /*width: 1485px;*/
}

#progress-tracker li {
  list-style-type: none;
  display: inline-block;

  position: relative;
  margin: 0;
  padding: 0;

  text-align: center;
  line-height: 30px;
  height: 30px;
  
  /*background-color: rgba(132,194,234,0.5);*/
  background-color: rgba(221, 221, 221, 0.9);
}

#progress-tracker[data-steps="6"] li { width: 16.66%; }
#progress-tracker[data-steps="9"] li { width: 11.11%; }

#progress-tracker li > span {
  display: block;

  color: #fff;
  font-size: 12px;
  text-indent: 27px;
  text-align: center;
  padding: 0 0 0 0 ;
  
  /*font-weight: bold;*/
  /*text-transform: uppercase;*/
}

#progress-tracker li.done > span {
  color: #fff;
  /*background-color: #84c2ea;*/
  background-color: rgba(132, 194, 234, 1);
  cursor: pointer;
}

/*
#progress-tracker li:nth-child(1) { background-color: #636393; }
#progress-tracker li:nth-child(2) { background-color: #B5222D; }
#progress-tracker li:nth-child(3) { background-color: #D4953C; }
#progress-tracker li:nth-child(4) { background-color: #609491; }
#progress-tracker li:nth-child(5) { background-color: #87A248; }
#progress-tracker li:nth-child(6) { background-color: #B5222D; }
#progress-tracker li:nth-child(7) { background-color: #D4953C; }
#progress-tracker li:nth-child(8) { background-color: #609491; }
#progress-tracker li:nth-child(9) { background-color: #87A248; }

#progress-tracker li:nth-child(1) > span:before {
  border-left-color: #609491;
}

#progress-tracker li:nth-child(2) > span:before {
  border-left-color: #636393;
}
#progress-tracker li:nth-child(3) > span:before {
  border-left-color: #B5222D;
}
#progress-tracker li:nth-child(4) > span:before {
  border-left-color: #D4953C;
}
#progress-tracker li:nth-child(5) > span:before {
  border-left-color: #609491;
}
#progress-tracker li:nth-child(6) > span:before {
  border-left-color: #87A248;
}
#progress-tracker li:nth-child(7) > span:before {
  border-left-color: #B5222D;
}
#progress-tracker li:nth-child(8) > span:before {
  border-left-color: #D4953C;
}
#progress-tracker li:nth-child(9) > span:before {
  border-left-color: #609491;
}*/

#progress-tracker li > span:after,
#progress-tracker li > span:before {
  content: "";
  display: block;
  width: 0px;
  height: 0px;

  position: absolute;
  top: 0;
  left: 0;

  border: solid transparent;
  /*border-left-color: rgba(132,194,234,0.5);*/
  border-left-color: rgba(221, 221, 221, 0.9);
  border-width: 15px;
}

#progress-tracker li > span:after {
  top: -5px;
  z-index: 1;
  border-left-color: white;
  border-width: 20px;
}

#progress-tracker li > span:before {
  z-index: 2;
}

#progress-tracker li.done + li > span:before {
  border-left-color: rgba(132, 194, 234, 1);
}

#progress-tracker li:first-child > span:after,
#progress-tracker li:first-child > span:before {
  display: none;
}

#progress-tracker li:last-child > span {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

#progress-tracker li:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

/*
#progress-tracker li:first-child i,
#progress-tracker li:last-child i {
  display: block;
  height: 0;
  width: 0;

  position: absolute;
  top: 0;
  left: 0;

  border: solid transparent;
  border-left-color: white;
  border-width: 15px;
}

#progress-tracker li:last-child i {
  left: auto;
  right: -15px;

  border-left-color: transparent;
  border-top-color: white;
  border-bottom-color: white;
}

/* headings */
#hsc-quote-form .fieldset-clean-frequency-header,
#hsc-quote-form .fieldset-clean-type-header,
#hsc-quote-form .fieldset-header {
  font-size: 20px;
  text-transform: uppercase;
  color: #2C3E50;
  margin: 20px 0 10px;
}

#hsc-quote-form .fieldset-title {
  font-size: 15px;
  color: #2C3E50;
}

#hsc-quote-form .fieldset-description {
  font-weight: normal;
  font-size: 11px;
  color: #666;
  margin: 20px 10% 25px;
}

#hsc-quote-form .fieldset-subtitle {
  font-weight: normal;
  font-size: 13px;
  color: #666;
  margin: 10px 20px 10px 20px;
}

/* buttons */

#hsc-quote-form .action-button {
  width: 100px;
  background: #84c2ea;
  font-weight: bold;
  color: white;
  border: 0 none;
  border-radius: 3px;
  cursor: pointer;
  padding: 10px 5px;
  margin: 30px 5px;
}

#hsc-quote-form .action-button.previous:hover {
	opacity: 0.8;
}

#hsc-quote-form .action-button.previous {
	opacity: 0.6;
}

#hsc-quote-form .action-button:hover,
#hsc-quote-form .action-button:focus {
  box-shadow: 0 0 0 2px white, 0 0 0 3px #84c2ea;
}

/*form styles*/

#hsc-quote-form {
  width: 1000px;
  max-width: 90%;
  margin: 0 auto 30%;
  text-align: center;
  position: relative;
  border-radius: 5px;
  box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
}

#hsc-quote-form fieldset {
  background: white;
  border: 0 none;
  /*border-radius: 5px;
  box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);*/
  padding: 20px 2%;
  margin: 0 2%;
  
}

/*Hide all except first fieldset*/
#hsc-quote-form fieldset:not(:first-of-type) {
  display: none;
}

/*inputs*/

#hsc-quote-form input {
  padding: 15px;
  border: 1px solid #e7e7e7;
  border-radius: 3px;
  margin-bottom: 10px;
  font-family: verdana;
  color: #2C3E50;
  font-size: 13px;
  width: 75%;
}

#hsc-quote-form textarea {
  padding: 15px;
  border: 1px solid #84c2ea;
  border-radius: 3px;
  margin-bottom: 10px;
  font-family: verdana;
  color: #2C3E50;
  font-size: 13px;
  width: 75%;
  height: 10em;
  
}

#hsc-quote-form input[type=date] {
  width: 65%;
}

/*
#hsc-quote-form input[type=text],
#hsc-quote-form input[type=email] {
  width: 60%;
}*/

input[type=range] {
  padding: 10px;
  margin: 30px 40px 40px 30px;
}

input[type=radio]{
  /* no overrides */
}

input[type=checkbox]{
  /* no overrides */
}

input[type=number]{
  padding: 15px;
  width: 8%;
}

/* icons */

.question{
	background-image:url("../img/question.png");
	cursor: pointer;
	opacity: 0.7;
}

.plus{background-image:url("../img/plus-128.png");}
.minus{background-image:url("../img/minus-128.png");}

.one{background-image:url("../img/one-128.png");}
.two{background-image:url("../img/two-128.png");}
.three{background-image:url("../img/three-128.png");}
.four{background-image:url("../img/four-128.png");}
.five{background-image:url("../img/five-128.png");}

.six{background-image:url("../img/six-128.png");}
.seven{background-image:url("../img/seven-128.png");}
.eight{background-image:url("../img/eight-128.png");}
.nine{background-image:url("../img/nine-128.png");}
.ten{background-image:url("../img/ten-128.png");}

.all{background-image:url("../img/all-128.png");}
.none{background-image:url("../img/none-128.png");}

.regular{background-image:url("../img/regular-128.png");}
.one-off{background-image:url("../img/one-off-128.png");}

.weekly{background-image:url("../img/weekly-128.png");}
.fortnightly{background-image:url("../img/fortnightly-128.png");}
.moving{background-image:url("../img/moving-128.png");}
.spring{background-image:url("../img/spring-128.png");}
.window{background-image:url("../img/window-128.png");}
.carpet{background-image:url("../img/carpet-128.png");}
.oven{background-image:url("../img/oven-128.png");}

/* flip switch */

.toggle {
  position: absolute;
  margin-left: -9999px;
  visibility: hidden;
}

.toggle + label {
  display: block;
  position: relative;
  cursor: pointer;
  outline: none;
  user-select: none;
}

input.toggle-yes-no + label {
  padding: 2px;
  width: 100px;
  height: 36px;
}
input.toggle-yes-no + label:before,
input.toggle-yes-no + label:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  color: #fff;
  font-size: 14px;
  text-align: center;
  line-height: 36px;
}
input.toggle-yes-no + label:before {
  background-color: #ddd;
  content: attr(data-off);
  transition: transform 0.5s;
  backface-visibility: hidden;
  border-radius: 3px;
}
input.toggle-yes-no + label:after {
  background-color: #84c2ea;
  content: attr(data-on);
  transition: transform 0.5s;
  transform: rotateY(180deg);
  backface-visibility: hidden;
  border-radius: 3px;
}
input.toggle-yes-no:checked + label:before {
  transform: rotateY(180deg);
}
input.toggle-yes-no:checked + label:after {
  transform: rotateY(0);
}

.onoffswitch {
    position: relative; width: 90px;
    -webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;
}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block; overflow: hidden; cursor: pointer;
    border: 2px solid #FFFFFF; border-radius: 22px;
}
.onoffswitch-inner {
    display: block; width: 200%; margin-left: -100%;
    transition: margin 0.3s ease-in 0s;
}
.onoffswitch-inner:before, .onoffswitch-inner:after {
    display: block; float: left; width: 50%; height: 36px; padding: 0; line-height: 36px;
    font-size: 14px; color: white; /*font-family: Trebuchet, Arial, sans-serif;*/ font-weight: bold;
    box-sizing: border-box;
}
.onoffswitch-inner:before {
    content: "Yes";
    padding-left: 15px;
    background-color: #84C2EA; color: #FFFFFF;
	text-align: left;
}
.onoffswitch-inner:after {
    content: "No";
    padding-right: 15px;
    background-color: #DDDDDD; color: #FFFFFF;
    text-align: right;
}
.onoffswitch-switch {
    display: block; width: 32px; margin: 4px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 50px;
    border: 2px solid #FFFFFF; border-radius: 22px;
    transition: all 0.3s ease-in 0s; 
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {
    right: 0px; 
}

/* selectable labels */

.selectable-label.small-label {
	width: 45px;
	height: 45px;
	margin: 0;
	/*-webkit-filter: opacity(.2);
       -moz-filter: opacity(.2);
            filter: opacity(.2);*/
			opacity: 0.2;
}

.selectable-labels input {
	margin:0;
	padding:0;
	display: none;
}

.selectable-labels input:active +.selectable-label{opacity: 1;}

.selectable-labels input:checked +.selectable-label{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
			opacity: 1;
}

.selectable-label{
	flex: 1;
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    width:80px;
	height:100px;
	margin: 2% 3% 1%;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    /*-webkit-filter: opacity(.4);
       -moz-filter: opacity(.4);
            filter: opacity(.4);*/
			opacity: 0.4;
}

.selectable-label:hover{
    /*-webkit-filter: opacity(.7);
       -moz-filter: opacity(.7);
            filter: opacity(.7);*/
			opacity: 0.7;
}

/* section colors */

.feature-section-dark {
	/*background-color:rgba(132,194,234,0.4);*/
	background-color: #51a7e1;
    padding:5px;
}

.feature-section-light {
	background-color: #84c2ea;
    padding:5px;
}

.dark-section {
	background-color:rgba(132,194,234,0.1);
    padding:5px;
}

.light-section {
    background-color:#ffffff;
    padding:5px;
}

/* field groups */

.field-group {
    display: flex;
	flex-direction: row;
}

.field-item-label {
  flex: 0.7;
  display: flex;
  justify-content: flex-start;
  
  margin: 10px 10px 0 10px;
  padding: 10px;
  border: 1px solid transparent;
  background-size:contain;
  background-repeat:no-repeat;
  /*background-position: 60%;*/
}

.field-item-help-spacer {
  flex: 0.5;
  display: flex;
  
  margin: 10px 5px 0 5px;
  padding: 10px 5px 10px 5px;
  border: 1px solid transparent;
}

.field-item-help {
  flex: 0.25;
  display: flex;
  
  margin: 10px 5px 0 5px;
  padding: 10px 5px 10px 5px;
  border: 1px solid transparent;
  background-repeat:no-repeat;
  background-position: 100% 0;
}

.field-item-title {
  flex: 0.7;
  display: flex;
  justify-content: flex-start;
  
  font-size: 13px;
  color: #2C3E50;
  margin: 20px 0 20px 20px;
  padding: 10px 0 10px 20px;
  border: 1px solid transparent;
}

.field-item-radio {
	flex: 2.5;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap; 

	margin: 10px 10px 0 10px;
	padding: 10px; 
	border: 1px solid transparent;	

}

.field-section-title {
  flex: 1;
  display: block;
  
  font-size: 13px;
  text-transform: uppercase;
  color: #2C3E50;
  margin: 10px;
  padding: 10px;
  border: 1px solid transparent;
}

.field-section-question {
  flex: 6;
  display: block;
  
  font-size: 13px;
  text-align: left;
  color: #2C3E50;
  border: 1px solid transparent;
}

.field-item-question {
	flex: 1.5;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap; 
	
	font-size: 13px;
	align-items: flex-start;
	justify-content: flex-start;

	margin: 10px 10px 0 10px;
	padding: 10px; 
	border: 1px solid transparent;	

}

.field-item-answer {
	flex: 1;
	display: flex;

	align-items: center;
	margin: 5px 10px 5px 10px;
	padding: 10px;
	border: 1px solid transparent;
	
}

.field-item-detail-question {
	flex: 1;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap; 
	
	font-size: 13px;
	align-items: center;
	justify-content: flex-end;

	margin: 10px 10px 0 10px;
	padding: 10px; 
	border: 1px solid transparent;	

}

.field-item-detail-answer {
	flex: 2;
	display: block;

	margin: 10px 10px 0 10px;
	padding: 10px;
	border: 1px solid transparent;
	
}

.field-item-detail-radio {
	flex: 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	
}

.field-item-detail-radio label {
    width:31%;
	height:36px;
    margin:4px 1%;
	cursor: pointer;
    background-color:#EFEFEF;
    border-radius:3px;
    overflow:hidden;
       
}

.field-item-detail-radio label span {
    text-align:center;
    font-size: 13px;
	width:100%;
    padding:6px 0 7px 0;
    display:inline-block;
	background-color:#ddd;
	-webkit-transition: all 100ms ease-in;
	   -moz-transition: all 100ms ease-in;
		    transition: all 100ms ease-in;
    color:#fff;
}

.field-item-detail-radio label span:hover {
	background-color: #84c2ea;
    /*-webkit-filter: opacity(.6);
       -moz-filter: opacity(.6);
            filter: opacity(.6);*/
			opacity: 0.6;
}

.field-item-detail-radio label input {
    display: none;
}

.field-item-detail-radio input:checked + span {
    background-color:#84c2ea;
    color:#F7F7F7;
	/*-webkit-filter: opacity(1);
       -moz-filter: opacity(1);
            filter: opacity(1);*/
			opacity: 1;
}

/* details formatting */

#detail-note,
#detail-state,
#detail-time,
#detail-date {
	flex: 1;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	margin: 0 20px 0 20px;
	padding: 0 5px 0 5px;
}

#detail-date input[type=date]{
	display: flex;
	width: 100%;
	margin-bottom: 0;
}

#detail-note .field-item-detail-textarea {
	width: 100%;
	/*background-color: rgba(132,194,234,0.3);
	border: 1px solid #fff;*/
}

#detail-note .field-item-detail-label,
#detail-time .field-item-detail-label,
#detail-date .field-item-detail-label {
	display: flex;
	width: 100%;
	font-size:13px;
	margin-bottom: 5px;
}

#detail-date .field-item-detail-surcharge-label {
	display: flex;
	width: 100%;
	font-size:9px;
	margin-bottom: 5px;
	text-align: left;
}

#detail-state .field-item-detail-label {
	display: flex;
	width: 100%;
	font-size:13px;
}

#detail-state .field-item-detail-surcharge-label {
	display: flex;
	width: 100%;
	font-size:9px;
	margin-bottom: 5px;
	text-align: left;
}

.field-item-detail-date {
	flex: 1;
	margin: 10px 10px 10px 10px;
	padding: 5px;
}

.field-item-detail-note,
.field-item-detail-state,
.field-item-detail-time {
	flex: 1;
	flex-direction: column;
	margin: 10px 10px 10px 10px;
	padding: 5px;
}

.field-item-detail-spacer {
	flex: 0.25;
	display: flex;
	margin: 10px 10px 10px 10px;
	padding: 5px;
}

/* contact details formatting */

#contact-email,
#contact-phone,
#contact-suburb-city,
#contact-street,
#contact-name {
	flex: 1;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	margin: 0 20px 0 20px;
	padding: 0 5px 0 5px;
}

#contact-email input,
#contact-phone input,
#contact-suburb-city input,
#contact-street input,
#contact-name input{
	display: flex;
	width: 100%;
	margin-bottom: 0;
	border: 1px solid #fff;
	background-color: rgba(132,194,234,0.3);
}

#contact-email label,
#contact-phone label,
#contact-suburb-city label,
#contact-street label,
#contact-name label{
	display: flex;
	width: 100%;
	font-size:13px;
	margin-bottom: 5px;
}

.field-item-contact-phone,
.field-item-contact-city,
.field-item-contact-suburb,
.field-item-contact-street,
.field-item-contact-name {
	flex: 1;
	display: flex;
	flex-direction: column;
	margin: 0 10px 0 10px;
	padding: 5px;
}

.field-item-contact-email {
	flex: 1;
	display: flex;
	flex-direction: column;
	margin: 0 10px 20px 10px;
	padding: 5px;
}

#hsc-quote-form .field-group .field-item-input {
	display: block;
  
	width: 25%;
	color: #2C3E50;
	margin: 20px 2%;
	padding: 10px 2%;
	border: 1px solid #fff;
	background-color: rgba(132,194,234,0.3);
	
	text-align: center;  
}

/* show hide toggle */

.toggle-line-items {
	cursor: pointer;
}

#confirmation {
	padding: 10px;
	margin: 10px;
	text-align: center;
}

#summary-footer {
	text-align: center;
	/*font-size: 75%;*/
	margin: 5% 15%;
}

.summary-footer-price-disclaimer {
  font-size: 75%;
  font-style: italic;
}

.summary-footer-form-disclaimer {
	font-weight: bold;
	font-size: 85%;
}

#summary-header {
	text-align:center;
	font-size: 85%;
	margin: 2% 0 2%;
}

#details-contents,
#summary-contents {
  border: 1px solid #84c2ea;
  border-radius: 5px;
  margin: 2% 2% 5%;
}
			
#summary-title {
  font-size: 20px;
  text-transform: uppercase;
  color: #2C3E50;
  margin: 20px 0 10px;
}

#thank-you-section {
	margin: 2%;
}

.thank-you-description {
  font-weight: normal;
  color: #666;
  margin: 3% 2% 6%;
}

.thank-you-description-emphasis {
  font-weight: bold;
  color: #666;
  margin: 3% 2% 6%;
}

#details-title-section,
#clean-title-section {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 0;
}

#digital-section,
#schedule-section,
#detail-section ,
#info-section {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 0;
	padding: 10px;
}

#total-section {
	flex: 1;
	flex-direction: column;
	margin: 0 0 0;
}

#line-item-section {
	margin: 0 0;
}

#note-section,
#cleanliness-section,
#date-section {
	flex: 1;
	flex-direction: column;
	margin: 0 7% 0;
	padding: 0 0 2%;
}

#email-section,
#contact-section,
#address-section {
	flex: 1;
	flex-direction: column;
	margin: 0 7% 0;
	padding: 0 0 1%;
}

#time-section,
#cost-section {
	display: flex;
	flex: 1;
	margin: 5px 10% 5px 7%;
}

#details-title,
#clean-title {
	display: flex;
	flex: 1;
	margin: 5px 10% 5px 7%;
}

.custom-label {
	flex: 3;
	display: flex;
	justify-content: flex-start;
}

.cost-label,
.time-label {
	flex: 3;
	display: flex;
	justify-content: flex-start;
	font-weight: bold;
	margin: 5px 0 5px 0;
	color: #fff;
}

.title-label {
	flex: 1;
	display: flex;
	justify-content: flex-start;
	font-weight: bold;
	margin: 15px 0 10px 0;
	color: #fff;
}

.reveal-toggle {
	flex: 1;
	margin: 15px 0 10px 0;
}

#line-item-reveal-label {
	cursor: pointer;
	font-size: 75%;
	color: #fff;
	border-bottom: 1px dashed #fff;
	text-decoration: none; 
}

.note-label {
	flex: 1;
	display: flex;
	justify-content: flex-start;
	font-weight: bold;
	margin: 15px 0 10px 0;
	color: #2592da;
}

.note-label,
.cleanliness-label,
.date-label,
.email-label,
.contact-label,
.address-label {
	flex: 1;
	display: flex;
	justify-content: flex-start;
	font-weight: bold;
	margin: 5px 0 5px 0;
	color: #2592da;
}

.custom-value {
	flex: 1;
	display: flex;
	justify-content: flex-end;
}

.cost-value,
.time-value {
	flex: 1;
	display: flex;
	justify-content: flex-end;
	margin: 5px 0 5px 0;
	color: #fff;
	font-weight: bold;
}

.email-value,
.date-value {
	flex: 1;
	display: flex;
	justify-content: flex-start;
	font-size: 90%;
}

.contact-value,
.address-value{
	flex: 3;
	display: flex;
	justify-content: flex-start;
	font-size: 90%;
}

.note-value,
.cleanliness-value{
	font-size: 90%;
}

.line-item-group {
	padding-bottom: 4%;
}

.line-item-header {
	display: flex;
	margin: 15px 10% 20px 8%;
}

.line-item-header-label {
	flex: 1;
	display: flex;
	justify-content: flex-start;
	font-weight: bold;
	color: #2592da;
}

.custom-line-item {
	font-style: italic;
	font-size: 90%;
	/*color: red;*/
	display: flex;
	margin: 15px 10% 20px 8%;
}

.window-line-item,
.line-item {
	display: flex;
	margin: 10px 10% 5px 8%;
	font-size: 90%;
}

.window-line-item-value,
.line-item-value {
	flex: 1;
	display: flex;
	justify-content: flex-start;
}

.line-item-label {
	flex: 2.5;
	display: flex;
	justify-content: flex-start;
}

.underlined-label {
	cursor: pointer;
	border-bottom: 1px dashed #666;
	text-decoration: none; 
}

.hidden-line-item {
	display: flex;
	font-size: 80%;
	margin: 2px 10% 0 10%;
}

.hidden-line-item-value {
	flex: 1;
	display: flex;
	justify-content: flex-start;
}

.hidden-line-item-label {
	flex: 1;
	display: flex;
	justify-content: flex-start;
}

.line-item-empty-small {
	flex: 1;
}

.line-item-empty-medium {
	flex: 3;
}

.line-item-empty-large {
	flex: 6;
}

.toggle-window-section,
.toggle-fridge-section,
.toggle-oven-section,
.toggle-room-section {
	flex: 1;
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-end;
}

.toggle-label {
	text-align: right;
    width: 100%;
    margin: 0 50px 0 0;
    font-size: 11px;
    text-decoration: underline;
	cursor: pointer;
}

.measurement-section {
    display: flex;
    flex-flow: row nowrap;
}

.measurement-guide {
	display: flex;
    margin: 0 50px 0 0;
    font-size: 11px;
	border-bottom: 1px dashed;
	color: #2ea3f2;
	cursor: pointer;
}

.measurement-spacer {
	flex: 3;
	display: flex;
}

.bedroom-label {	background-image: url("../img/bedroom-128.png");}
.bathroom-label {background-image: url("../img/bathroom-128.png");}
.kitchen-label {	background-image: url("../img/kitchen-128.png");}
.general-label {	background-image: url("../img/lounge-128.png");}
.carpet-label {	background-image: url("../img/steam-clean-128.png");}
.hard-floor-label {	background-image: url("../img/mop-128.png");}
.window-label {	background-image: url("../img/window-128.png");}
.fridge-label {	background-image: url("../img/fridge-128.png");}
.oven-label {	background-image: url("../img/oven-128.png");}

.help-me {
	text-decoration: underline;
	margin: 10px 10px 25px;
	color: #2ea3f2;
}

.is-required:before {
	color: red;
	content: "*";
	margin-right: 10px;
	font-size: 14px;
	font-weight: bold;
	position: relative;
	top: 1px;
}

.error {
	color: red;
}

input[type=number]:disabled {
	/*-webkit-filter: opacity(.5) !important;
		-moz-filter: opacity(.5) !important;
			filter: opacity(.5) !important;*/
			opacity: 0.5 !important;
	pointer-events: none;
}

.disabled {
	/*-webkit-filter: opacity(.3) !important;
		-moz-filter: opacity(.3) !important;
			filter: opacity(.3) !important;*/
			opacity: 0.3 !important;
	pointer-events: none;
}

.in-active {
	/*-webkit-filter: opacity(.05) !important;
		-moz-filter: opacity(.05) !important;
			filter: opacity(.05) !important;*/
			opacity: 0.05 !important;
	pointer-events: none;
}

.hidden {
	display: none !important;
}

@media screen and (max-width: 760px) {

	.progress-wrapper {
	  display: none;
	}

	#hsc-quote-form .fieldset-clean-frequency-header,
	#hsc-quote-form .fieldset-clean-type-header,
	#hsc-quote-form .fieldset-header {
	  font-size: 100%;
	}

	#hsc-quote-form .fieldset-title {
	  font-size: 90%;
	}

	#hsc-quote-form .fieldset-description,
	#hsc-quote-form .fieldset-subtitle {
	  font-size: 70%;
	}
	
	#hsc-quote-form .field-item-title {
	  font-size: 80%;
	  margin: 5% 0 5% 5%;
	  padding: 2% 0 2% 0%;
	  
	}
	
	#hsc-quote-form .field-group .field-item-input {
	  display: none;
	  margin: 0;
	}
	
	#hsc-quote-form .field-group .field-item-label {
	  margin: 0;
	}
	
	#hsc-quote-form .help-me {
	  font-size: 90%;
	}

	#hsc-quote-form .field-group input[type=range] {
		display: none;
	}

	#hsc-quote-form .field-group .field-item-radio {
		margin: 0;
	}
	
	#hsc-quote-form .selectable-label.small-label {
		width: 25px;
		height: 25px;
	}

	input.toggle-yes-no + label {
		width: 100%;
	}
	
	.onoffswitch-inner:before,
	.onoffswitch-inner:after {
		font-size: 90%;
	}

	.field-item-help-spacer,
	.field-item-help.empty {
		display: none;
	}
	
	#contact-email,
	#contact-phone,
	#contact-suburb-city,
	#contact-street,
	#contact-name {
		margin: 0 1%;
		padding: 0 1%;
	}
  
	.field-item-contact-email,
	.field-item-contact-phone,
	.field-item-contact-city,
	.field-item-contact-suburb,
	.field-item-contact-street,
	.field-item-contact-name {
		margin: 0;
		padding: 1%;
	}
	
	.field-item-detail-note,
	.field-item-detail-state,
	.field-item-detail-time,
	.field-item-detail-date {
		margin: 0;
	}
	
	.field-item-detail-spacer {
		display: none;
	}
	
	#summary {
		font-size: 90%;
	}
	
	.line-item-header {
		margin: 10px 3%;
	}
	
	.custom-line-item {
		margin: 10px 3%;
	}
	
	.window-line-item,
	.line-item {
		margin: 5px 5%;
	}
	
	.line-item-value {
		flex: 0.5;
	}
	
	.line-item-label {
		flex: 2;
	}
	
	.window-line-item-label p,
	.line-item-label p {
		margin: 0;
	}
	
	.line-item-empty-medium {
		flex: 0;
	}
	
	.line-item-empty-large {
		flex: 0;
	}
	
	.hidden-line-item-label {
		flex: 2;
	}
	
	.field-item-help {
		flex: 0.1;
		margin: 10px 2% 0 2%;
		padding: 10px 2%;
		background-size: 80%;
	}
	
	.custom-label {
		flex: 1.5;
		margin: 5px;
	}
	
	.custom-value {
		margin: 5px;
	}
	
	.cost-label,
	.time-label {
		flex: 1.5;
	}
	
	.measurement-guide {		
		font-size: 75%;
		margin: 0 10% 5px 0;
	}
	
	.toggle-label {
		width: 100%;
		margin: 2% 10% 0 0;
		font-size: 75%;
	}
	
	.field-item-question {
		margin: 10px 2% 0 2%;
		padding: 10px 2%; 
		font-size: 85%;
	}

	.field-item-answer {
		margin: 5px 2%;
		padding: 10px 2%;
	}
	
	.thank-you-description {
		margin: 5% 2% 10%;
	}

	#details-title-section,
	#clean-title-section {
		margin: 0 0 0;
		padding: 0 5px 5px;
	}

	#digital-section,
	#schedule-section,
	#detail-section ,
	#info-section {
		margin: 0 0;
		padding: 5px 0;
	}

	#total-section {
		margin: 0;
	}

	#line-item-section {
		margin: 0;
	}

	#email-section,
	#note-section,
	#date-section,
	#contact-section,
	#address-section {
		margin: 0 5%;
	}

	#details-title,
	#clean-title {
		margin: 5px 3%;
	}
	
	#time-section,
	#cost-section {
		margin: 5px 3%;
	}

}

@media screen and (min-device-width: 300px) and (max-device-width: 400px) {
	.field-item-help {
		background-size: 100%%;
	}

	#hsc-quote-form .selectable-label.small-label {
		width: 25px;
		height: 25px;
	}
	
	#hsc-quote-form .field-group .field-item-radio {
		margin: 5px 0;
		padding: 10px;
	}
}

@media screen and (min-device-width: 400px) and (max-device-width: 500px) {
	.field-item-help {
		background-size: 75%;
	}

	#hsc-quote-form .selectable-label.small-label {
		width: 35px;
		height: 35px;
	}
	
	#hsc-quote-form .field-group .field-item-radio {
		margin: 10px 0;
		padding: 10px;
	}
}

@media screen and (min-device-width: 500px) and (max-device-width: 600px) {
	.field-item-help {
		background-size: 50%;
	}
	
	#hsc-quote-form .selectable-label.small-label {
		width: 40px;
		height: 40px;
	}
	
	#hsc-quote-form .field-group .field-item-radio {
		margin: 10px 0;
		padding: 10px;
	}

}

@media screen and (min-device-width: 600px) and (max-device-width: 760px) {
	.field-item-help {
		background-size: 50%;
	}
	
	#hsc-quote-form .selectable-label.small-label {
		width: 45px;
		height: 45px;
	}
	
	#hsc-quote-form .field-group .field-item-radio {
		margin: 10px 10px 0 10px;
		padding: 10px;
	}
	
	.field-item-help-spacer {
		flex: 0;
		display: flex;
	}
 
}

@media screen and (min-width: 760px) { 
  #hsc-quote-form .field-group .field-item-input {
	display: none;
  }
}

@media screen and (max-width: 1024px) { 
	.field-item-detail-radio label {
		width: 31%;
	}
}

@media screen and (min-device-width: 760px) and (max-device-width: 960px) {
	.line-item-empty-medium {
		flex: 1;
	}
	
	#progress-tracker li > span {
	  font-size: 10px;
	  text-indent: 20px;
	  text-align: center;
	}
}

/* divi workaround */
@media screen and (max-width: 980px) {
	.et_header_style_centered #et_mobile_nav_menu {
		margin: 20px 5%;
	}
	#main-content .container {
		padding-top: 200px !important;
	}
}

/* default styles here for older browsers. 
   I tend to go for a 600px - 960px width max but using percentages
*/
@media only screen and (min-width:960px){
	/* styles for browsers larger than 960px; */
}
@media only screen and (min-width:1440px){
	/* styles for browsers larger than 1440px; */
}
@media only screen and (min-width:2000px){
	/* for sumo sized (mac) screens */
}
@media only screen and (max-device-width:480px){
   /* styles for mobile browsers smaller than 480px; (iPhone) */
}
@media only screen and (device-width:768px){
   /* default iPad screens */
}
/* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}