#hhpt-layoutinstructions .hhpt-closecircle:after,
.hhpt-centerbuttonwrap:after,
.hhpt-compare-band .hhpt-button span:after,
.hhpt-compare-band .hhpt-close:after,
.hhpt-configuratorbody h2#hhpt-menutitle:after,
.hhpt-filter-group-wrapper li:before,
.hhpt-filter-group > header:after,
.hhpt-filter-summary > div > div span:after,
.hhpt-icon-off-left:after,
.hhpt-jquery-modal .hhpt-modal a.hhpt-close-modal:after,
.hhpt-layoutopencircle:after,
.hhpt-navarrow i:after,
.hhpt-navarrow i:before,
.hhpt-no-icon:after,
.hhpt-sizitem .hhpt-sizSel:before,
.hhpt-sort-controls .hhpt-arrow:after,
.hhpt-StepDot span:after,
.hhpt-StepDot span:before,
.hhpt-yes-icon:after,
.sda-table .hhpt-delete:after,
[class*=" hhpt-icon-"],
[class*=" hhpt-instruct-icon-"]:after,
[class*=" hhpt-instruct-icon-"]:before,
[class^="hhpt-icon-"],
[class^="hhpt-instruct-icon-"]:after,
[class^="hhpt-instruct-icon-"]:before,
input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before,
input[type="radio"] + span:after,
input[type="radio"] + span:before,
nav.hhpt-primary > ul > li.menu-item-has-children > a:after {
font-family: hhpt-icons !important;
speak: none;
font-style: normal;
font-weight: 400;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.hhpt-nowrap {
white-space: nowrap;
}

.hhpt-clickable {
cursor: pointer;
}

.hhpt-mobileonly {
display: none;
}
@media only screen and (max-width: 999px) {
	#hhpt-magicrightcol{
		top: 110px !important;
	}
	#hhpt-magicleftcol{
		padding-top: 35px;
	}
	body.admin-bar #hhpt-magicrightcol {
		top: 142px !important;
	}
}
@media only screen and (max-width: 767px) {
	#hhpt-magicleftcol{
		max-width:100%;
		margin-right:0px;
		margin-left:0px;
		display: none;
	}
	body.admin-bar #hhpt-magicrightcol,
	#hhpt-magicrightcol{
		position: relative;
		left: auto;
		right: auto;
		margin-right:0px;
		margin-left:0px;
		top: auto !important;
		bottom: auto;
		width:100%;
		display:block;
		clear:none;
		
	}	
	.hhpt-sidepadmobile{
		margin-left:15px !important;
		margin-right:15px !important;
	}
	#hhpt-topsavebuttons.hhpt-sidepadmobile{
		margin-left:0 !important;
	}
}
@media only screen and (max-width: 767px) {
.hhpt-mobileonly {
display: block;
}
}

@media only screen and (max-width: 767px) {
.hhpt-notformobile {
display: none;
}
}

@media only screen and (min-width: 768px) {
.hhpt-hideondesktop {
display: none !important;
}
}

@font-face {
font-family: hhpt-icons;
src: url(../fonts/hhpt-icons.eot);
src: url(../fonts/hhpt-icons.eot#iefix) format("embedded-opentype"),
url(../fonts/hhpt-icons.ttf) format("truetype"),
url(../fonts/hhpt-icons.svg#hhpt-icons) format("svg"),
url(../fonts/hhpt-icons.woff) format("woff");
font-weight: 400;
font-style: normal;
}

.hhpt-icon-close:before {
content: "\e902";
}
.hhpt-icon-arrow-long-left:before {
content: "\e900";
}
.hhpt-icon-arrow-long-right:before {
content: "\e901";
}
.hhpt-icon-arrow-down:before {
content: "\e908";
}
.hhpt-icon-arrow-left:before {
content: "\e909";
}
.hhpt-icon-arrow-right:before {
content: "\e90a";
}
.hhpt-icon-arrow-up:before {
content: "\e90b";
}
.hhpt-icon-arrow-solid-down:before {
content: "\e90f";
}
.hhpt-icon-arrow-solid-left:before {
content: "\e910";
}
.hhpt-icon-arrow-solid-right:before {
content: "\e911";
}
.hhpt-icon-arrow-solid-up:before {
content: "\e912";
}
.hhpt-icon-center:before {
content: "\e913";
}
.hhpt-icon-center-vert:before {
content: "\e944";
}
.hhpt-icon-remove:before {
content: "\e91b";
}
.hhpt-icon-gear:before {
content: "\e945";
}
.hhpt-icon-move:before {
content: "\e946";
}
.hhpt-icon-list:before {
content: "\e90e";
}
.hhpt-icon-reset-3d-view:before {
content: "\e91c";
}
.hhpt-icon-toggle:before {
content: "\e91d";
}
.hhpt-icon-checkbox-unchecked:before {
content: "\e91e";
}
.hhpt-icon-checkbox-checked:before {
content: "\e91f";
}
.hhpt-icon-radio-unchecked:before {
content: "\e91e";
}
.hhpt-icon-radio-checked:before {
content: "\e920";
}
.hhpt-icon-3d:before {
content: "\e922";
}
.hhpt-icon-edit:before {
content: "\e923";
}
.hhpt-icon-tractor:before {
content: "\e924";
}

.hhpt-icon-fullscreen:before {
content: "\e92b";
}
.hhpt-icon-file:before,
.hhpt-icon-pdf:before {
content: "\e92d";
}
#hhpt-btnPdfDownload .hhpt-icon-file:before,
.hhpt-icon-pdf-download:before {
content: "\e93f";
}
.hhpt-icon-fullscreen:before {
content: "\e92b";
}
.hhpt-icon-file:before,
.hhpt-icon-pdf:before {
content: "\e92d";
}
#hhpt-btnPdfDownload .hhpt-icon-file:before,
.hhpt-icon-pdf-download:before {
content: "\e93f";
}
.hhpt-icon-circle:before {
content: "\e92f";
}
.hhpt-icon-circle-help:before {
content: "\e939";
}
.hhpt-icon-circle-icon-help:before {
content: "\e93a";
}
.hhpt-icon-circle-check:before {
content: "\e93b";
}
.hhpt-icon-circle-icon-check:before {
content: "\e93c";
}
.hhpt-icon-circle-bullet:before {
content: "\e93d";
}
.hhpt-icon-circle-icon-bullet:before {
content: "\e93e";
}
.hhpt-icon-circle-gear:before {
content: "\e940";
}
.hhpt-icon-circle-icon-gear:before {
content: "\e941";
}
.hhpt-icon-circle-move:before {
content: "\e942";
}
.hhpt-icon-circle-icon-move:before {
content: "\e943";
}
.hhpt-icon-circle-info:before {
content: "\e90c";
}
.hhpt-icon-circle-icon-info:before {
content: "\e937";
}
.hhpt-icon-circle-warning:before {
content: "\e90d";
}
.hhpt-icon-circle-icon-warning:before {
content: "\e936";
}
.hhpt-icon-circle-rotate-ccw:before {
content: "\e914";
}
.hhpt-icon-circle-icon-rotate-ccw:before {
content: "\e930";
}
.hhpt-icon-circle-rotate-cw:before {
content: "\e915";
}
.hhpt-icon-circle-icon-rotate-cw:before {
content: "\e931";
}
.hhpt-icon-circle-add:before,
.hhpt-fa-plus-circle::after {
content: "\e916";

}
.hhpt-icon-circle-icon-add:before {
content: "\e932";
}
.hhpt-icon-circle-remove:before {
content: "\e919";
}
.hhpt-icon-circle-icon-remove:before {
content: "\e935";
}
.hhpt-icon-circle-arrow-left:before {
content: "\e917";
}
.hhpt-icon-circle-icon-arrow-left:before {
content: "\e933";
}
.hhpt-icon-circle-arrow-right:before {
content: "\e918";
}
.hhpt-icon-circle-icon-arrow-right:before {
content: "\e934";
}
.hhpt-incbox .hhpt-icon-circle-subtract:before,
.hhpt-icon-circle-remove:before {
content: "\e91a";
}
.hhpt-icon-circle-icon-subtract:before {
content: "\e938";
}

.hhpt-clear:after,
.hhpt-clear:before {
content: "";
display: table;
table-layout: fixed;
}

.hhpt-clear:after {
clear: both;
}

.hhpt-clear {
*zoom: 1;
}

.hhpt-configuratorbody .hhpt-btn.hhpt-btn-secondary {
font-size: 15px;
padding: 5px 10px;
border-radius: 0;
border: 0;
}

.hhpt-configuratorbody label {
position: relative;
line-height: 1.3;
cursor: pointer;
}

#hhpt-finalform label,
#hhpt-savescreensummary label {
font-weight: 600;
margin-bottom: 3px;
font-size: 14px;
border: none;
}

#hhpt-finalform input[type="number"],
#hhpt-finalform input[type="text"],
#hhpt-finalform select,
#hhpt-finalform textarea,
.hhpt-configuratorbody input[type="number"],
.hhpt-configuratorbody input[type="text"],
.hhpt-configuratorbody select,
.hhpt-configuratorbody textarea {
padding: 7px 14px;
font-weight: 300;
border: 1px solid #ddd;
background-color: #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 100%;
margin-bottom: 10px;
font-size: 14px;
}

#hhpt-finalform input[type="number"],
#hhpt-finalform input[type="text"],
#hhpt-finalform select,
.hhpt-configuratorbody input[type="number"],
.hhpt-configuratorbody input[type="text"],
.hhpt-configuratorbody select {
min-height: 30px;
line-height: 30px;
}

#hhpt-finalform textarea,
.hhpt-configuratorbody textarea {
min-height: 100px;
}

#hhpt-finalform select,
.hhpt-configuratorbody select {
display: block;
max-width: 200px;
background: #fff url(../../public/img/select-arrow-admin.png) 100%;
background-size: contain;
background-repeat: no-repeat;
}

#hhpt-finalform input[type="button"] {
margin-bottom: 10px;
cursor: pointer;
}

#hhpt-finalform input:disabled {
opacity: 0.5;
}

#hhpt-finalform label#hhpt-lblFinalMessage {
font-size: 15px;
line-height: 1;
}

#hhpt-finalform label#hhpt-lblFinalMessage.hhpt-alert {
color: red;
}

#hhpt-finalform .column {
margin-left: 4%;
}

#hhpt-finalform .column.one-half {
width: 48%;
float: left;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

#hhpt-finalform .column:first-child {
margin-left: 0;
}

input[type="checkbox"],
input[type="radio"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
cursor: pointer;
opacity: 0;
}

input[type="checkbox"] + span,
input[type="radio"] + span {
position: relative;
display: block;
padding-left: 22px;
}

@media only screen and (max-width: 767px) {
input[type="checkbox"] + span,
input[type="radio"] + span {
padding-top: 2px;
padding-left: 28px;
}
}

input[type="checkbox"] + span > span,
input[type="radio"] + span > span {
display: block;
margin: -0.2em 0 0.25em;
}

input[type="checkbox"] + span .small,
input[type="radio"] + span .small {
font-size: 12px;
font-weight: 400;
}

input[type="checkbox"],
input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before,
input[type="radio"],
input[type="radio"] + span:after,
input[type="radio"] + span:before {
position: absolute;
left: 0;
top: 0;
display: block;
width: 18px;
height: 18px;
}

@media only screen and (max-width: 767px) {
input[type="checkbox"],
input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before,
input[type="radio"],
input[type="radio"] + span:after,
input[type="radio"] + span:before {
width: 24px;
height: 24px;
}
}

input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before,
input[type="radio"] + span:after,
input[type="radio"] + span:before {
font-size: 16px;
text-align: left;
vertical-align: text-top;
color: #777;
z-index: 1;
}

@media only screen and (max-width: 767px) {
input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before,
input[type="radio"] + span:after,
input[type="radio"] + span:before {
font-size: 22px;
}
}
input[type="checkbox"] + span:before,
input[type="radio"] + span:before {
color: #fff;
content: "\e91e";
z-index: 0;
}

.hhpt-choicewrapper label input[type="checkbox"],
.hhpt-choicewrapper label input[type="radio"] {
top: 15px;
left: 15px;
}

input[type="checkbox"]:active + span:after,
input[type="radio"]:active + span:after {
color: #000;
}

input[type="checkbox"]:focus + span:before,
input[type="radio"]:focus + span:before {
text-shadow: 0 0 8px #5e9ed6;
}

input[type="checkbox"]:disabled + span:after,
input[type="radio"]:disabled + span:after {
opacity: 0.5;
}

input[type="checkbox"],
input[type="checkbox"] + span:after,
input[type="checkbox"] + span:before {
top: 1px;
}

input[type="checkbox"] + span:after {
content: "\e920";
}

input[type="checkbox"]:checked + span:after {
content: "\e921";
}

input[type="radio"] + span:after,
input[type="radio"] + span:before {
font-size: 18px;
}

@media only screen and (max-width: 767px) {
input[type="radio"] + span:after,
input[type="radio"] + span:before {
font-size: 24px;
}
}

input[type="radio"] + span:after {
content: "\e920";
}

input[type="radio"]:checked + span:after {
content: "\e93b";
}

.hhpt-wallbox input[type="radio"] {
vertical-align: top;
}

.hhpt-required {
color: red;
}

.hhpt-choicewrapper label {
display: block;
background: #f4f4f4;
color: #555;
padding: 15px 30px 15px 15px;
font-size: 16px;
}

.hhpt-choicewrapper + .hhpt-choicewrapper label {
padding-top: 0;
margin-top: -8px;
}

.hhpt-choicewrapper + .hhpt-choicewrapper label input[type="checkbox"],
.hhpt-choicewrapper + .hhpt-choicewrapper label input[type="radio"] {
top: 0;
}

.hhpt-choicewrapper label.hhpt-cbx_15,
.hhpt-choicewrapper label.hhpt-cbx_17,
.hhpt-choicewrapper label.hhpt-cbx_19 {
background: transparent;
padding-bottom: 5px;
}

.hhpt-choicewrapper label.hhpt-cbx_15 .hhpt-infocornerhigher,
.hhpt-choicewrapper label.hhpt-cbx_17 .hhpt-infocornerhigher,
.hhpt-choicewrapper label.hhpt-cbx_19 .hhpt-infocornerhigher {
top: 10px;
}

.hhpt-choicewrapper.hhpt-disabled label {
opacity: 0.65;
font-style: italic;
}

.hhpt-choicewrapper#hhpt-wainsholder label {
padding-top: 10px;
padding-bottom: 15px;
}

.hhpt-choicewrapper#hhpt-wainsholder label input[type="checkbox"],
.hhpt-choicewrapper#hhpt-wainsholder label input[type="radio"] {
top: 10px;
}

.hhpt-choicewrapper#hhpt-wainsholder label:before {
content: "";
position: absolute;
top: 0;
left: 10px;
right: 10px;
height: 1px;
background: #e2e2e2;
}

.hhpt-wrapper {
padding-bottom: 75px;
}

.hhpt-hide-page-footer .hhpt-wrapper {
padding-bottom: 21px;
}

@media only screen and (min-width: 768px) {
.hhpt-wrapper {
position: absolute;
z-index: auto;
}
}

.hhpt-wrapper .hhpt-container {
margin: 0;
padding: 0;
}

.hhpt-wrapper .hhpt-container.pdfPrinting {
margin: 0 auto;
max-width: 1150px;
padding: 0 35px;
}

.hhpt-wrapper .single-text h3 {
line-height: 1.3;
}

.hhpt-modal,
.hhpt-wrapper {
font-size: 14px;
line-height: 1.5;
}

.hhpt-modal h2,
.hhpt-wrapper h2 {
margin-bottom: 0;
}

.hhpt-modal hr,
.hhpt-wrapper hr {
-webkit-box-sizing: content-box;
box-sizing: content-box;
border: 0;
color: #ddd;
background-color: #ddd;
height: 1px;
}

#hhpt-magicleftcol {
display: none;
}

@media only screen and (min-width: 768px) {
#hhpt-magicleftcol {
float: left;
display: block;
width: 400px;
margin-left: 20px;
padding-bottom: 90px;
}

.hhpt-hide-page-footer #hhpt-magicleftcol {
padding-bottom: 0;
}
}

#hhpt-magicrightcol {
position: relative;
width: 100%;
padding-top: 100px;
}

#hhpt-magicrightcol {
padding-top: 20px;
}

@media only screen and (min-width: 768px) {
#hhpt-magicrightcol {
position: fixed;
padding-top: 0 !important;
bottom: 20px;
left: 440px;
right: 20px;
width: auto;
clear: both;
overflow: hidden;
}

.hhpt-read-only #hhpt-magicrightcol > .hhpt-row:first-child {
min-height: 40px;
padding-bottom: 10px;
}
}

@media only screen and (min-width: 768px) {
.hhpt-wrapper,
.hhpt-wrapper {
top: 100px;
}

.hhpt-wrapper,
.hhpt-wrapper {
top: 20px;
}
}

@media only screen and (min-width: 783px) {
.hhpt-wrapper {
top: 100px;
}

.hhpt-wrapper,
.hhpt-wrapper {
top: 20px;
}
}

@media only screen and (min-width: 1000px) {
.hhpt-wrapper,
.hhpt-wrapper {
top: 65px;
}

.hhpt-wrapper,
.hhpt-wrapper {
top: 20px;
}
}

@media only screen and (min-width: 768px) {
#hhpt-magicrightcol {
top: 100px;
}

#hhpt-magicrightcol {
top: 145px;
}

#hhpt-magicrightcol {
top: 20px;
}

#hhpt-magicrightcol {
top: 65px;
}
}

@media only screen and (min-width: 783px) {
#hhpt-magicrightcol {
top: 132px;
}

#hhpt-magicrightcol {
top: 20px;
}

#hhpt-magicrightcol {
top: 52px;
}
}

@media only screen and (min-width: 1000px) {
#hhpt-magicrightcol {
top: 65px;
}

#hhpt-magicrightcol {
top: 97px;
}

#hhpt-magicrightcol {
top: 20px;
}

#hhpt-magicrightcol {
top: 52px;
}
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol,
.hhpt-sidepadmobile .hhpt-alwayshalfcol h2 {
line-height: 1.1;
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol h2 {
margin-right: 1px;
margin-bottom: 3px;
}

@media only screen and (min-width: 768px) and (max-width: 999px) {
.hhpt-sidepadmobile .hhpt-alwayshalfcol h2 {
font-size: 20px;
line-height: 20px;
}
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol h2.hhpt-lblstylesize {
margin-right: 10px;
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol {
font-size: 20px;
}

@media only screen and (min-width: 1000px) {
.hhpt-sidepadmobile .hhpt-alwayshalfcol {
font-size: 15px;
}
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol + .hhpt-alwayshalfcol {
text-align: right;
}

@media only screen and (max-width: 767px) {
.hhpt-sidepadmobile {
margin-left: 15px !important;
margin-right: 15px !important;
}

.hhpt-sidepadmobile#hhpt-topsavebuttons {
margin-left: 0 !important;
}
}

.hhpt-configuratorbody,
.hhpt-pdfPrinting {
display: none;
}

.hhpt-configuratorbody h1,
.hhpt-configuratorbody h2,
.hhpt-configuratorbody h4,
.hhpt-configuratorbody h5 {
margin: 0;
}

.hhpt-configuratorbody h2 {
font-size: 30px;
}

.hhpt-configuratorbody h2#hhpt-menutitle {
padding-top: 5px;
}

.hhpt-configuratorbody h3 + p {
font-size: 15px;
color: #666;
margin-top: 0.5em;
margin-bottom: 1em;
}

.hhpt-configuratorbody p a {
text-decoration: underline;
}

.hhpt-configuratorbody img {
display: block;
min-height: 30px;
min-width: 30px;
background-color: #ccc;
background-image: url(../img/loader-sd-grey-rev.gif);
background-repeat: no-repeat;
background-position: 50%;
background-size: 15px 15px;
}

.hhpt-configuratorbody,
.hhpt-configuratorbody img {
user-drag: none;
}

.hhpt-configuratorbody a,
.hhpt-configuratorbody canvas,
.hhpt-configuratorbody div,
.hhpt-configuratorbody span {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
user-drag: none;
}

.hhpt-configuratorbody canvas {
display: block;
}

.hhpt-configuratorbody #hhpt-listings > p:first-child {
margin: 0;
padding: 17px 15px;
text-align: center;
font-weight: 700;
font-size: 17px;
line-height: 1.4;
background-color: #e4ebdb;
border: 3px solid #cddbc5;
}

.hhpt-configuratorbody #hhpt-listings > p:first-child + h3 {
margin-top: 20px;
}

h3.hhpt-active {
border: 1px solid red;
}

.hhpt-btn-secondary {
background-color: #8da676;
}

.hhpt-bodLoad,
.hhpt-bodLoad * {
cursor: progress;
}

#hhpt-visualizer {
position: relative;
background-color: #ddd;
}

#hhpt-visualizer.hhpt-fs {
width: 100vw;
height: 100vh;
}

#hhpt-visualizer.hhpt-printsize {
width: 800px !important;
width: 600px !important;
}

#hhpt-visualizerWidth {
width: 100%;
}

#hhpt-visualizerWidth.hhpt-printsize {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 800px !important;
}

#hhpt-floorplan,
#hhpt-listings {
width: 100%;
min-height: 300px;
}

#hhpt-floorplan {
background-color: #f4f4f4;
position: relative;
}

#hhpt-floorplan.hhpt-printsize {
position: absolute !important;
top: 0 !important;
left: 0 !important;
width: 800px !important;
}

.hhpt-colorbox {
width: 33.3%;
min-height: 100px;
display: inline-block;
background-size: cover;
background-position: 50% 50%;
vertical-align: top;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

.hhpt-colorbox label {
display: inline-block;
width: 70%;
margin: 0 auto;
padding: 0 0 2px;
}

@media only screen and (max-width: 767px) {
.hhpt-colorbox label {
padding-bottom: 5px;
}
}

.hhpt-colorbox.hhpt-roofbox {
border: 5px solid #fff;
}

.hhpt-colorbox.hhpt-roofbox.hhpt-active {
border: 5px solid #8da676;
}

.hhpt-colorbox.hhpt-tiny {
position: relative;
cursor: pointer;
min-height: 50px;
width: 13%;
border: 5px solid #ddd;
margin: 2px;
}

.hhpt-colorbox.hhpt-tiny span {
position: absolute;
top: 115%;
width: 80px;
left: 50%;
-webkit-transform: translate(-50%);
transform: translate(-50%);
text-align: center;
line-height: 14px;
vertical-align: middle;
display: none;
}

.hhpt-colorbox.hhpt-tiny.hhpt-active {
border: 5px solid #8da676;
}

.hhpt-colorbox.hhpt-tiny.hhpt-active span {
display: block;
}

.hhpt-colorbox.hhpt-wallbox {
border: 5px solid #fff;
padding: 10px 0;
margin-right: 3px;
margin-bottom: 3px;
width: 32%;
}

.hhpt-colorbox.hhpt-wallbox.hhpt-active {
border: 5px solid #8da676;
}

.hhpt-colorboxthumb {
position: relative;
cursor: pointer;
width: 80%;
height: 60px;
margin-left: auto;
margin-right: auto;
background-size: cover;
background-position: 50% 50%;
z-index: 1;
}

.hhpt-rooftitle {
display: block;
text-align: center;
font-weight: 600;
line-height: 1.2;
padding: 4px 0;
}

.hhpt-incbox {
padding-bottom: 5px;
margin-bottom: 5px;
margin-left: 15px;
}

.hhpt-incbox span {
line-height: 22px;
}

.hhpt-incbtn {
cursor: pointer;
display: inline-block;
color: #fff;
padding-left: 5px;
padding-right: 5px;
height: 20px;
color: #8da676;
}

.hhpt-incbtn:hover {
color: #555;
}

.hhpt-incnum {
text-align: center;
min-width: 25px;
display: inline-block;
font-size: 22px;
}

.hhpt-propbox {
position: relative;
width: 31%;
min-height: 100px;
display: inline-block;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: #fafafa;
border: 1px solid #e0e0e0;
padding: 10px 0;
margin: 5px 5px 0 0;
vertical-align: top;
line-height: 1.3;
}

.hhpt-propbox img {
margin-bottom: 5px;
min-width: 40px;
min-height: 40px;
}

.hhpt-propbox.hhpt-disabled {
opacity: 0.5;
}

.hhpt-configuratorbody .hhpt-propbox img {
background-color: transparent;
background-image: url(../public/img/loader-sd-grey.gif);
background-size: 25px 25px;
}

.hhpt-configuratorbody #hhpt-storageListing .hhpt-propbox img {
background-image: none;
}

.hhpt-propbox .hhpt-choicewrapper {
text-align: center;
padding-left: 0;
}

.hhpt-propbox .hhpt-infocornerprop {
cursor: pointer;
top: 4px;
right: 4px;
}

.hhpt-propbox .hhpt-infocornerlower {
cursor: pointer;
right: 4px;
}

.hhpt-propbox .hhpt-infocornerprop .hhpt-icon-circle-info:before {
position: absolute;
top: 0;
right: 0;
color: #8da676;
z-index: 1;
}

.hhpt-propbox
.hhpt-infocornerprop
.hhpt-icon-circle-info.hhpt-primary-color:before {
color: #8da676;
}

.hhpt-propbox .hhpt-infocornerprop .hhpt-icon-circle-info:after {
content: "\e92f";
color: #fafafa;
opacity: 0.8;
position: absolute;
top: -2px;
right: -3px;
font-size: 28px !important;
z-index: 0;
}

#hhpt-dropDragger {
visibility: hidden;
display: none;
width: 150px;
height: 150px;
position: absolute;
pointer-events: none;
background-size: contain;
background-position: 50%;
background-repeat: no-repeat;
z-index: 50;
}

.hhpt-choicewrapper {
position: relative;
}

h3 + .hhpt-choicewrapper {
margin-top: 10px;
}

.hhpt-choicewrapper .hhpt-infocornerhigher {
top: 10px;
right: 7px;
}

.hhpt-choicewrapper + .hhpt-choicewrapper .hhpt-infocornerhigher {
top: -5px;
}

.hhpt-choicewrapper#hhpt-wainsholder .hhpt-infocornerhigher {
top: 6px;
}

.hhpt-choicewrapperinline {
position: relative;
display: inline-block;
}

.hhpt-incbtn > [class*=" hhpt-icon-"]:before,
.hhpt-incbtn > [class^="hhpt-icon-"]:before,
.hhpt-infocorner > [class*=" hhpt-icon-"]:before,
.hhpt-infocorner > [class^="hhpt-icon-"]:before,
.hhpt-infocornerhigher > [class*=" hhpt-icon-"]:before,
.hhpt-infocornerhigher > [class^="hhpt-icon-"]:before,
.hhpt-infocornerleft > [class*=" hhpt-icon-"]:before,
.hhpt-infocornerleft > [class^="hhpt-icon-"]:before,
.hhpt-infocornerlower > [class*=" hhpt-icon-"]:before,
.hhpt-infocornerlower > [class^="hhpt-icon-"]:before,
.hhpt-infocornerprop > [class*=" hhpt-icon-"]:before,
.hhpt-infocornerprop > [class^="hhpt-icon-"]:before {
font-size: 22px;
}

.hhpt-infocornerprop {
position: absolute;
top: 1px;
right: 0;
}

.hhpt-infocorner {
position: absolute;
top: 14px;
right: 0;
}

.hhpt-infocornerhigher {
position: absolute;
top: 0;
right: 0;
}
a.hhpt-infocornerleft{
	display:none;
}
a.hhpt-infocorner,
a.hhpt-infocornerhigher,
a.hhpt-infocornerleft,
a.hhpt-infocornerlower {
text-decoration: none !important;
}

.hhpt-colSidebar {
margin-left: auto;
margin-right: auto;
max-width: 450px;
}

.hhpt-colSidebar > h2:first-child {
line-height: 1;
margin-bottom: 10px;
}

@media only screen and (min-width: 768px) {
.hhpt-read-only .hhpt-colSidebar > h2:first-child {
min-height: 40px;
padding-bottom: 10px;
margin-bottom: 0;
}
}

.hhpt-infocornerlower {
position: absolute;
bottom: 1px;
right: 0;
}

.hhpt-infocornerleft {
position: absolute;
left: 15px;
top: 4px;
font-size: 18px !important;
}

@media only screen and (min-width: 350px) {
.hhpt-infocornerleft {
top: 1px;
font-size: 22px !important;
}
}

@media only screen and (min-width: 768px) {
.hhpt-infocornerleft {
left: 0;
}
}

.hhpt-navarrow {
font-size: 30px;
top: 5px;
position: relative;
}

.hhpt-mobileHandle {
width: 12%;
height: 100%;
position: absolute;
top: 0;
}

#hhpt-mobileHandleLeft {
left: 0;
}

#hhpt-mobileHandleRight {
right: 0;
}

#hhpt-btnReset:active,
.desktop #hhpt-btnReset:hover,
.desktop .hhpt-alertred,
.hhpt-alertred:hover {
color: red;
}

#hhpt-btnReset i,
.hhpt-btnPdfDownload i {
vertical-align: middle;
}

.hhpt-help-links {
width: 100%;
}

#hhpt-backtohome,
.hhpt-help-links {
position: relative;
display: inline-block;
}

#hhpt-backtohome {
float: left;
font-weight: 700;
}

#hhpt-backtohome i {
vertical-align: bottom;
font-weight: 400;
font-size: 0.9em;
}

.hhpt-btnPdfDownload {
display: inline-block;
}

.hhpt-btnPdfDownload span {
display: inline-block;
font-size: 16px;
font-weight: 700;
padding-right: 5px;
vertical-align: middle;
}

.hhpt-btnPdfDownload i {
font-size: 32px;
}

.hhpt-forceleft {
text-align: left !important;
}

.hhpt-forceright {
text-align: right !important;
}

.hhpt-boxThumb {
max-height: 70px;
display: block;
margin-left: auto;
margin-right: auto;
}

.hhpt-XLTable td,
.hhpt-XLTable th {
padding: 10px;
border: 1px solid #000;
text-align: center;
font-size: 15px;
}

.hhpt-sizitem {
width: 100%;
max-width: 380px;
}

@media only screen and (min-width: 768px) {
.hhpt-sizitem {
max-width: 500px;
}
}

.hhpt-sizitem td {
width: 40%;
}

.hhpt-sizitem td:first-child {
padding-left: 38px;
white-space: nowrap;
}

@media only screen and (min-width: 350px) {
.hhpt-sizitem td:first-child {
padding-left: 42px;
}
}

.hhpt-sizitem td:last-child {
width: 20%;
padding-right: 15px;
text-align: right;
}

@media only screen and (min-width: 768px) {
.hhpt-sizitem td:last-child {
padding-right: 0;
}
}

.hhpt-sizitem h3 {
margin: 0;
font-size: 18px;
}

@media only screen and (min-width: 350px) {
.hhpt-sizitem h3 {
font-size: 20px;
}
}

.hhpt-sizitem .hhpt-selbox {
margin-left: auto;
width: 85px;
position: relative;
background-color: #f0f0f0;
color: #999;
text-align: center;
}

@media only screen and (min-width: 350px) {
.hhpt-sizitem .hhpt-selbox {
width: 120px;
}
}
/* Bounce To Right */
.hhpt-sizUns {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hhpt-sizUns:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #2098D1;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 0 50%;
  transform-origin: 0 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hhpt-sizUns:hover, .hhpt-sizUns:focus, .hhpt-sizUns:active {
  color: white;
}
.hhpt-sizUns:hover:before,.hhpt-sizUns:focus:before, .hhpt-sizUns:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
}
.hhpt-sizitem .hhpt-sizSel,
.hhpt-sizitem  {
font-size: 13px;
line-height: 2;
}

@media only screen and (min-width: 350px) {
.hhpt-sizitem .hhpt-sizSel,
.hhpt-sizitem  {
font-size: 15px;
}
}

.hhpt-sizitem .hhpt-sizSel {
display: none;
}

@media only screen and (min-width: 350px) {
.hhpt-sizitem .hhpt-sizSel:before {
content: "\e93b";
display: inline-block;
font-size: 16px;
vertical-align: text-top;
padding-right: 7px;
margin-left: -7px;
}
}

.hhpt-sizitem .hhpt-sizUns {
display: block;
}

.desktop .hhpt-sizitem .hhpt-selbox:hover,
.hhpt-sizitem .hhpt-selbox:active {
background-color: #c5d3b7;
color: #fff;
}

.hhpt-sizitem.hhpt-active .hhpt-selbox {
background-color: #8da676 !important;
color: #fff;
font-weight: 700;
}

.hhpt-sizitem.hhpt-active .hhpt-sizSel {
display: block;
}

.hhpt-sizitem.hhpt-active .hhpt-sizUns {
display: none;
}

#hhpt-visualizerControls {
text-align: left;
width: 100%;
display: block;
position: absolute;
top: 20px;
font-size: 12px;
color: #fff;
}

#hhpt-visualizerControls .hhpt-btnboxy {
display: inline-block;
text-align: center;
position: relative;
margin-left: 15px;
}

@media only screen and (min-width: 400px) {
#hhpt-visualizerControls .hhpt-btnboxy {
margin-left: 25px;
}
}

#hhpt-visualizerControls i {
font-size: 25px;
width: 25px;
height: 25px;
margin-bottom: 2px;
display: inline-block;
margin-left: auto;
margin-right: auto;
vertical-align: top;
}

.desktop #hhpt-visualizerControls i:hover {
opacity: 0.5;
}

#hhpt-visualizerControls #hhpt-lblFullscreen,
#hhpt-visualizerControls i#hhpt-btnFullscreen {
display: none;
}

@media only screen and (min-width: 768px) {
#hhpt-visualizerControls i#hhpt-btnFullscreen {
display: inline-block;
}
}

@media only screen and (min-width: 768px) {
#hhpt-visualizerControls #hhpt-lblFullscreen {
display: block;
}
}

#hhpt-lblFullscreen,
#hhpt-lblHome,
#hhpt-lblRotate, #hhpt-lblSave {
position: relative;
pointer-events: none;
margin-left: auto;
margin-right: auto;
display: block;
width: 100%;
text-align: center;
}

#hhpt-btnFullscreen,
#hhpt-btnRotHome, #hhpt-btnSave {
position: relative;
cursor: pointer;
margin-left: auto;
margin-right: auto;
width: 100%;
text-align: center;
}

#hhpt-btnRotLeft {
cursor: pointer;
padding-right: 2px;
}

#hhpt-btnRotRight {
cursor: pointer;
padding-left: 2px;
}

.hhpt-primary-colorcirclebutton i {
font-size: 22px !important;
cursor: pointer;
}

.hhpt-housebox {
position: relative;
vertical-align: top;
margin-top: 5px;
padding-bottom: 5px;
border: 5px solid #fff;
}

.hhpt-housebox.hhpt-colorbox {
min-height: 0;
}

.hhpt-housebox.hhpt-active {
border: 5px solid #8da676;
}

.hhpt-housebox img.hhpt-housethumb {
cursor: pointer;
display: block;
min-height: 30px;
margin-bottom: 5px;
width: 100%;
}

.hhpt-housebox .hhpt-infocorner {
top: 0;
right: 3px;
opacity: 0.7;
cursor: pointer;
font-size: 22px !important;
}

.hhpt-housetitle {
position: relative;
text-align: center;
display: block;
font-weight: 600;
line-height: 1.2;
}

@media only screen and (min-width: 400px) {
.hhpt-housetitle {
padding-left: 5px;
padding-right: 5px;
}
}

.desktop .hhpt-housebox .hhpt-infocorner:active,
.desktop .hhpt-housebox .hhpt-infocorner:hover,
.hhpt-housebox .hhpt-infocorner {
color: #fff !important;
}

.desktop .hhpt-housebox .hhpt-infocorner:active,
.desktop .hhpt-housebox .hhpt-infocorner:hover {
opacity: 1;
}

.hhpt-g_wainscot {
white-space: nowrap;
}

#hhpt-sidebarForm p {
padding-top: 10px;
padding-bottom: 10px;
}

.hhpt-catbox h3 {
margin-top: 1em;
margin-bottom: 0.2em;
}

.hhpt-colHidden {
display: none !important;
}

.hhpt-extrahidden {
pointer-events: none;
position: absolute;
top: 0;
left: 0;
opacity: 0;
}

.hhpt-showPointer {
cursor: pointer;
}

.hhpt-summarytable {
width: 100%;
}

.hhpt-summarytable td:last-child {
text-align: right;
}

#hhpt-menutoggle,
#hhpt-menutoggle * {
padding-top: 0;
padding-bottom: 0;
margin-top: 0;
margin-bottom: 0;
}

.hhpt-intermodal {
display: none;
}

.hhpt-intermodal.hhpt-active {
display: block;
}

.hhpt-visdisclaimer {
display: block;
position: absolute;
padding: 0;
margin: 0;
bottom: 10px;
background-color: #000;
opacity: 0.6;
padding: 10px;
color: #fff;
text-align: center;
font-size: 1.5vh;
line-height: 14px;
font-style: bold;
}

@media only screen and (max-width: 499px) {
.hhpt-visdisclaimer {
color: #333;
bottom: auto;
top: calc(100% + 5px);
left: 15px;
right: 10px;
}
}

#hhpt-lbl_addhei_container {
background-color: #e5e5e5;
padding: 5px 5px 0;
display: block;
margin-bottom: 5px;
}

.hhpt-rbls_addhei input,
.hhpt-rbls_addhei input + span:after,
.hhpt-rbls_addhei input + span:before {
margin-left: -22px;
}

@media only screen and (max-width: 767px) {
.hhpt-rbls_addhei input,
.hhpt-rbls_addhei input + span:after,
.hhpt-rbls_addhei input + span:before {
margin-left: -26px;
}
}

.hhpt-rbls_addhei input[type="checkbox"] + span,
.hhpt-rbls_addhei input[type="radio"] + span {
padding-left: 0;
}

label.hhpt-rbls_addhei {
display: block;
}

.hhpt-colorbox label.hhpt-rbls_addhei {
margin-left: 40px;
}

@media only screen and (max-width: 767px) {
.hhpt-colorbox label.hhpt-rbls_addhei {
margin-left: 45px;
}
}

.hhpt-primary-color-header {
color: #fff;
padding: 10px;
display: block;
}

.hhpt-noleftmargin {
margin-left: 0;
}

img.hhpt-noleftmargin {
margin-left: 40px;
}

@media only screen and (max-width: 767px) {
img.hhpt-noleftmargin {
margin-left: 45px;
}
}

img.hhpt-magicsidewallclicker {
margin-top: 15px;
cursor: pointer;
}

.sizitem h3,
h2.lblprice {
font-family: Roboto, sans-serif;
font-weight: 700;
font-size: 2.2vh;
}

h2.hhpt-lblprice {
color: white;
float: right;
line-height: 1.1;
margin-left: 13px;
}

@media only screen and (min-width: 1000px) {
h2.hhpt-lblprice {
color: white;
margin-left: 8px;
}
}

#hhpt-btnReset {
float: right;
position: relative;
display: inline-block;
}

#hhpt-lofttoggle {
position: absolute;
left: 15px;
top: 15px;
z-index: 2;
}

.hhpt-needhelpoverpop {
margin: 0;
padding: 20px;
text-align: center;
background-color: #ededed;
border: 3px solid #dcdcdc;
color: #979797;
}

.hhpt-needhelpoverpop a {
display: block;
width: 100%;
color: #8da676;
font-weight: 600;
font-size: 17px;
padding-top: 10px;
}

#hhpt-btnCtaNext,
#hhpt-btnMobStorageItem {
text-align: center;
margin: 25px;
padding: 10px;
background-color: #8da676;
color: #fff;
font-weight: 600;
font-size: 17px;
border: 0;
outline: none;
}

#hhpt-btnCtaNext {
width: 100%;
margin: 10px 0;
text-align: left;
white-space: normal;
}

#hhpt-alsogohome,
h2.hhpt-lblstylesize {
float: left;
margin-right: 15px;
}

#hhpt-alsogohome,
.hhpt-alwayshalfcol {
display: inline-block;
}

.hhpt-alwayshalfcol {
width: 50%;
vertical-align: top;
}

.hhpt-row-alwayshalf {
white-space: nowrap;
}

.hhpt-row-alwayshalf > .hhpt-alwayshalfcol {
white-space: normal;
}

#hhpt-topsavebuttons,
.hhpt-bottom-buttons-right {
float: right;
padding-left: 8px;
padding-top: 5px;
}

#hhpt-topsavebuttons input[type="button"].hhpt-button {
text-transform: none;
font-size: 23px;
padding: 7px 18px;
border: 0;
font-weight: 700;
}

@media only screen and (min-width: 1150px) {
#hhpt-topsavebuttons {
position: absolute;
right: 0;
}
}

.hide-buy .hhpt-btnBuy {
display: none !important;
}

.hhpt-spinner-icon i {
display: block;
width: 40px;
height: 40px;
border: 6px solid hsla(0, 0%, 100%, 0.5);
border-top-color: #fff;
border-radius: 50%;
-webkit-animation-duration: 1s;
animation-duration: 1s;
}

.hhpt-spinner-icon.hhpt-btnboxy {
position: absolute;
left: 50%;
top: 50%;
margin: -30px 0 0 -20px;
}

.hhpt-spinanim {
-webkit-animation-name: spin;
animation-name: spin;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
}

@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}

to {
-webkit-transform: rotate(1turn);
transform: rotate(1turn);
}
}

@keyframes spin {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}

to {
-webkit-transform: rotate(1turn);
transform: rotate(1turn);
}
}

.hhpt-tabs-wrapper {
width: 100%;
border-bottom: 2px solid #8da676;
}

.hhpt-tabs {
position: relative;
display: table;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
table-layout: fixed;
margin: 0;
margin-bottom: -8px;
padding: 10px 0 0;
}
@media only screen and (max-width: 600px) {
.hhpt-tabs {
right: 36px;
    width: 100%;
}
}
@media only screen and (min-width: 768px) {
.hhpt-read-only .hhpt-tabs {
padding-top: 0;
}
}

.hhpt-tabs > li {
	position: relative;
display: table-cell;
width: 25%;
height: 30px;
vertical-align: middle;
text-align: center;
font-weight: 600;
overflow: visible;
font-size: 11px;
line-height: 1.2;
border: 2px solid rgba(141, 166, 118, 0.3);
border-bottom: 0;
border-left: 0;
margin-bottom: -7px;
padding: 0.85em 0.9em;
background: #ddd;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  overflow: hidden;
}
.hhpt-tabs > li:before {
  content: "";
  position: absolute;
  z-index: -1;
  left: 51%;
  right: 51%;
  bottom: 6px;
  background: #2098D1;
  height: 4px;
  -webkit-transition-property: left, right;
  transition-property: left, right;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.hhpt-tabs > li:hover:before, .hhpt-tabs > li:focus:before, .hhpt-tabs > li:active:before {
  left: 0;
  right: 0;
}
@media only screen and (min-width: 768px) {
li.hhpt-mobileonly {
display: none;
}
}

.hhpt-tabs > li.hhpt-active {
color: #fff;
background: #8da676;
}

.hhpt-tabs > li.hhpt-active,
.hhpt-tabs > li.hhpt-active a {
color: #fff;
}

@media only screen and (min-width: 360px) {
.hhpt-tabs > li {
font-size: 13px;
}
}

@media only screen and (min-width: 480px) {
.hhpt-tabs > li {
text-align: left;
}
}

@media only screen and (min-width: 600px) {
.hhpt-tabs > li {
width: auto;
}
}

@media only screen and (min-width: 1200px) {
.hhpt-tabs > li {
font-size: 13px;
}
}

.hhpt-tabs a {
display: inline-block;
text-decoration: none;
}

.desktop .hhpt-configuratorbody .hhpt-tabs a:hover,
.hhpt-configuratorbody .hhpt-tabs a {
color: #8da676;
}

.hhpt-tabs a span {
opacity: 0.75;
}

@media only screen and (min-width: 480px) {
.hhpt-tabs a span {
position: relative;
display: inline-block;
}
}

.hhpt-tabs a i {
display: block;
margin: 0 auto 4px;
font-size: 26px;
}

@media only screen and (min-width: 480px) {
.hhpt-tabs a i {
position: absolute;
top: 50%;
margin: -13px 0 0;
}
}

.desktop .hhpt-configuratorbody .hhpt-tabs .hhpt-active a:hover,
.hhpt-configuratorbody .hhpt-tabs .hhpt-active a {
color: #fff;
}

.hhpt-tabs:before {
left: 0;
top: 10px;
z-index: 1;
background: rgba(141, 166, 118, 0.4);
}

.hhpt-tabs #hhpt-pill-cfg i {
font-size: 18px;
margin-bottom: 8px;
}

@media only screen and (min-width: 480px) {
.hhpt-tabs #hhpt-pill-3dv span,
.hhpt-tabs #hhpt-pill-cfg span {
padding-left: 30px;
}

.hhpt-tabs #hhpt-pill-fpe span {
padding-left: 28px;
}

.hhpt-tabs #hhpt-pill-sv span {
padding-left: 30px;
}

.hhpt-tabs #hhpt-pill-cfg i {
margin-top: -9px;
margin-bottom: 4px;
margin-left: -32px;
}

.hhpt-tabs #hhpt-pill-3dv i,
.hhpt-tabs #hhpt-pill-fpe i {
margin-left: -32px;
}

.hhpt-tabs #hhpt-pill-sv i {
margin-left: -33px;
}
}

@media only screen and (min-width: 600px) {
.hhpt-tabs {
table-layout: auto;
}
}

@media only screen and (min-width: 1150px) {
.hhpt-tabs {
height: 55px;
}
}

.hhpt-tabs:before,
.hhpt-tabs > li.hhpt-active:before {
content: "";
position: absolute;
left: -2px;
top: -2px;
width: 2px;
bottom: 0;
background: #8da676;
}

@media only screen and (min-width: 768px) {
.hhpt-tabs > .hhpt-mobileonly:first-child + li.hhpt-active:before,
.hhpt-tabs > li.hhpt-active:first-child:before {
left: 0;
z-index: 1;
}
}

.desktop .hhpt-tabs > li:hover span,
.hhpt-tabs > li.hhpt-active span {
opacity: 1;
}

#hhpt-visualizer,
.hhpt-tab-pane {
min-height: 200px;
}

@media only screen and (max-width: 499px) {
#hhpt-pills-3dv {
margin-bottom: 40px;
}
}

.konvajs-content,
.hhpt-konvajs-content {
margin-left: auto;
margin-right: auto;
}

#hhpt-layoutwraphold {
position: relative;
width: 100%;
z-index: 1;
}

.hhpt-storageadder {
width: 100%;
text-align: center;
font-size: 36px;
color: #8da676;
}

.desktop .hhpt-storageadder:hover {
color: #555;
}
.hhpt-blocker {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
overflow: auto;
z-index: 1;
padding: 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
background-color: #000;
background-color: rgba(0, 0, 0, 0.75);
text-align: center;
}

.hhpt-blocker:before {
content: "";
display: inline-block;
height: 100%;
vertical-align: middle;
margin-right: -0.05em;
}

.hhpt-blocker.hhpt-behind {
background-color: transparent;
}

.hhpt-modal {
display: none;
vertical-align: middle;
position: relative;
z-index: 10;
max-width: 500px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 90%;
background: #fff;
padding: 15px 30px;
border-radius: 8px;
-webkit-box-shadow: 0 0 10px #000;
box-shadow: 0 0 10px #000;
text-align: left;
}

.hhpt-modal > p {
margin: 0;
padding: 20px;
background-color: #e4ebdb;
border: 3px solid #cddbc5;
font-weight: 700;
}

@media only screen and (min-width: 768px) {
.hhpt-modal > p {
padding: 30px;
}
}

.hhpt-modal .hhpt-liveSummary {
margin-left: 0;
margin-right: 0;
}

.hhpt-modal .hhpt-financing-options-wrapper h2 {
margin-top: 0;
}

.hhpt-modal a.hhpt-close-modal {
position: absolute;
top: -12.5px;
right: -12.5px;
display: block;
width: 30px;
height: 30px;
text-indent: -9999px;
background-size: contain;
background-repeat: no-repeat;
background-position: 50%;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==");
}

.hhpt-modal-spinner {
display: none;
position: fixed;
top: 50%;
left: 50%;
-webkit-transform: translateY(-50%) translateX(-50%);
transform: translateY(-50%) translateX(-50%);
padding: 12px 16px;
border-radius: 5px;
background-color: #111;
height: 20px;
}

.hhpt-modal-spinner > div {
border-radius: 100px;
background-color: #fff;
height: 20px;
width: 2px;
margin: 0 1px;
display: inline-block;
-webkit-animation: hhpt-stretchdelay 1.2s ease-in-out infinite;
animation: hhpt-stretchdelay 1.2s ease-in-out infinite;
}

.hhpt-modal-spinner .hhpt-rect2 {
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s;
}

.hhpt-modal-spinner .hhpt-rect3 {
-webkit-animation-delay: -1s;
animation-delay: -1s;
}

.hhpt-modal-spinner .hhpt-rect4 {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s;
}

@-webkit-keyframes hhpt-stretchdelay {
0%,
40%,
to {
transform: scaleY(0.5);
-webkit-transform: scaleY(0.5);
}

20% {
transform: scaleY(1);
-webkit-transform: scaleY(1);
}
}

@keyframes hhpt-stretchdelay {
0%,
40%,
to {
transform: scaleY(0.5);
-webkit-transform: scaleY(0.5);
}

20% {
transform: scaleY(1);
-webkit-transform: scaleY(1);
}
}

#hhpt-sidebarForm.hhpt-modal {
max-width: 100%;
}

.hhpt-jquery-modal.hhpt-blocker {
z-index: 100;
padding: 0;
}

.hhpt-jquery-modal #hhpt-sidebarForm.hhpt-modal {
max-width: 1000px;
}

.hhpt-jquery-modal .hhpt-modal {
padding: 0;
border-radius: 0;
width: 100%;
}

.hhpt-jquery-modal .hhpt-modal a.hhpt-close-modal {
top: 10px;
right: 10px;
background: transparent;
color: #fff;
cursor: pointer;
}

@media only screen and (min-width: 350px) {
.hhpt-jquery-modal .hhpt-modal a.hhpt-close-modal {
top: 15px;
right: 15px;
}
}

.hhpt-jquery-modal .hhpt-modal a.hhpt-close-modal:after {
position: absolute;
content: "\e902";
width: 30px;
height: 30px;
font-size: 20px;
line-height: 30px;
top: 0;
left: 0;
text-align: center;
text-indent: 0;
}

.hhpt-jquery-modal .hhpt-modal.hhpt-csb_pop a.hhpt-close-modal {
top: 8px;
right: 10px;
}

.hhpt-jquery-modal .hhpt-modal#hhpt-pop-monthlypayments {
width: 100%;
max-width: 700px;
}

.hhpt-jquery-modal .hhpt-modal#hhpt-pop-monthlypayments .hhpt-modal-header {
padding: 12px 40px 15px 10px;
}

.hhpt-jquery-modal .hhpt-modal#hhpt-pop-monthlypayments a.hhpt-close-modal {
top: 14px;
right: 14px;
}

.hhpt-jquery-modal .hhpt-modal#hhpt-pop-morehelp a.hhpt-close-modal {
top: 7px;
right: 7px;
}

#hhpt-sidebarForm.hhpt-modal h2,
#hhpt-sidebarStorage.hhpt-modal h2,
.hhpt-modal-header h1,
.hhpt-modal-header h2,
.hhpt-modal-header h3,
.hhpt-modal-header h4,
.hhpt-modal-header h5,
.hhpt-modal-header h6 {
color: #fff;
margin-top: 0;
margin-bottom: 0;
text-align: center;
font-weight: 700;
font-size: 24px;
}

.hhpt-modal-header h4,
.hhpt-modal-header h5,
.hhpt-modal-header h6 {
font-size: 18px;
}

.hhpt-modal-header {
background: #222;
color: #fff;
padding: 10px 40px;
}

.hhpt-modal-header input[type="text"] {
padding: 8px 10px;
min-height: 20px;
}

.hhpt-modal-header span + input[type="text"] {
margin-left: 5px;
}

.hhpt-configuratorbody .hhpt-modal-header span,
.hhpt-configuratorbody .hhpt-modal-title {
font-size: 20px;
}

.hhpt-modal-body,
.hhpt-modal > div > .hhpt-row {
padding: 15px 20px 20px;
}

@media only screen and (min-width: 768px) {
.hhpt-modal-body,
.hhpt-modal > div > .hhpt-row {
padding: 25px 30px 30px;
}
}

.hhpt-modal-body img {
margin-top: 10px;
max-width: 100%;
height: auto;
}

#hhpt-lblTax {
white-space: nowrap;
margin: 5px;
display: inline-block;
}

ul.hhpt-topchangerright {
background-color: #000;
padding: 0;
margin-bottom: 0;
}

ul.hhpt-topchangerright * {
color: #fff !important;
line-height: 39px;
}

ul.hhpt-topchangerright .hhpt-forceleft a {
padding-left: 10px;
}

ul.hhpt-topchangerright .hhpt-forceright a {
padding-right: 10px;
}

.hhpt-modal ul.hhpt-topchangerright {
margin-top: 0;
display: block;
list-style: none;
background: #222;
}

.hhpt-modal ul.hhpt-topchangerright * {
line-height: 1;
}

.hhpt-modal ul.hhpt-topchangerright h2 {
padding: 0.6em 40px;
margin-bottom: 0;
}

.hhpt-read-only #hhpt-sidebarConfiguring,
.hhpt-read-only #hhpt-sidebarStorage {
margin-top: 0 !important;
}

#hhpt-sidebarConfiguring ul.hhpt-topchangerright,
#hhpt-sidebarStorage ul.hhpt-topchangerright {
display: table;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
width: 100%;
margin-top: 0;
}

.hhpt-read-only #hhpt-sidebarConfiguring ul.hhpt-topchangerright,
.hhpt-read-only #hhpt-sidebarStorage ul.hhpt-topchangerright {
margin-top: 0;
}

#hhpt-sidebarConfiguring ul.hhpt-topchangerright *,
#hhpt-sidebarStorage ul.hhpt-topchangerright * {
line-height: 1;
}

#hhpt-sidebarConfiguring ul.hhpt-topchangerright > li,
#hhpt-sidebarStorage ul.hhpt-topchangerright > li {
display: table-cell;
vertical-align: middle;
height: 62px;
text-align: center;
padding-top: 2px;
padding-bottom: 1px;
}

@media only screen and (min-width: 1150px) {
.hhpt-read-only #hhpt-sidebarConfiguring ul.hhpt-topchangerright > li,
.hhpt-read-only #hhpt-sidebarStorage ul.hhpt-topchangerright > li {
padding: 0;
}
}

#hhpt-sidebarStorage.hhpt-modal ul.hhpt-topchangerright > li {
display: block;
height: auto;
padding-top: 0;
padding-bottom: 0;
}

#hhpt-sidebarConfiguring {
position: relative;
}

.hhpt-read-only #hhpt-sidebarConfiguring {
margin-top: 0 !important;
}

#hhpt-sidebarConfiguring ul {
margin-left: 0;
}

@media only screen and (min-width: 768px) {
.hhpt-read-only #hhpt-sidebarConfiguring ul.hhpt-topchangerright {
margin-top: 0;
}
}

#hhpt-sidebarConfiguring ul.hhpt-topchangerright > li.hhpt-forceleft,
#hhpt-sidebarConfiguring ul.hhpt-topchangerright > li.hhpt-forceright {
width: 30px;
}

a.hhpt-navarrow {
display: block;
top: auto;
text-decoration: none !important;
}

.hhpt-navarrow i {
position: relative;
display: block;
width: 30px;
height: 30px;
}

.hhpt-navarrow i:before {
z-index: 1;
content: "\e92f";
color: #8da676;
}

.hhpt-navarrow i:after {
z-index: 2;
}

.hhpt-navarrow i:after,
.hhpt-navarrow i:before {
top: 0;
left: 0;
font-size: 25px;
}

.hhpt-centerbuttonwrap:after,
.hhpt-navarrow i:after,
.hhpt-navarrow i:before {
position: absolute;
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
}

@media only screen and (min-width: 350px) {
.hhpt-centerbuttonwrap:after,
.hhpt-navarrow i:after,
.hhpt-navarrow i:before {
font-size: 30px;
}
}

.hhpt-centerbuttonwrap {
position: relative;
text-align: center;
margin-left: 15px;
margin-right: 15px;
}

.hhpt-centerbuttonwrap:after {
right: 5px;
left: auto;
top: 50%;
margin-top: -15px;
content: "\e918";
color: #fff;
font-size: 22px;
pointer-events: none;
}

.hhpt-centerbuttonwrap:last-child {
margin-bottom: -10px;
}

#hhpt-menuprev i:after {
content: "\e933";
color: #fff;
}

#hhpt-menunext i:after {
content: "\e934";
color: #fff;
}

#hhpt-menunext:after,
#hhpt-menuprev:after {
font-size: 11px;
display: block;
margin-top: 5px;
font-weight: 700;
color: #fff;
}

.desktop #hhpt-menunext:hover:after,
.desktop #hhpt-menuprev:hover:after {
color: #fff;
}

#hhpt-menuprev:after {
content: "PREV";
padding-left: 2px;
}

#hhpt-menunext:after {
content: "NEXT";
padding-right: 1px;
}

.hhpt-configuratorbody h2#hhpt-menutitle {
padding: 0.4em 0 0.3em;
font-size: 24px;
cursor: pointer;
}

.hhpt-configuratorbody h2#hhpt-menutitle:after {
content: "\e90f";
font-size: 0.5em;
display: inline-block;
padding-left: 0.3em;
vertical-align: top;
line-height: 2em;
}

.hhpt-configuratorbody h2#hhpt-menutitle.hhpt-nomoredropdown {
cursor: auto;
}

.hhpt-configuratorbody h2#hhpt-menutitle.hhpt-nomoredropdown:after {
display: none !important;
}

@media only screen and (min-width: 350px) {
#hhpt-sidebarForm.hhpt-modal h2,
#hhpt-sidebarStorage.hhpt-modal h2,
.hhpt-configuratorbody h2#hhpt-menutitle,
.hhpt-modal-header h1,
.hhpt-modal-header h2,
.hhpt-modal-header h3 {
font-size: 28px;
}
}

#hhpt-dropdownjumper {
    position: absolute;
    top: 68px;
    left: 0;
    width: 100%;
    background-color: #000;
    z-index: 2;
    opacity: 0.9;
}

#hhpt-dropdownjumper ul {
list-style: none;
padding: 0;
margin: 0;
}

#hhpt-dropdownjumper ul li {
color: #bbbdbf;
text-align: center;
padding: 5px;
margin: 0;
font-size: 20px;
cursor: pointer;
}

.desktop #hhpt-dropdownjumper ul li:active,
.desktop #hhpt-dropdownjumper ul li:hover {
color: #fff;
background-color: #777;
}

#hhpt-dropdownjumper ul li.hhpt-active {
color: #fff;
background-color: #8da676;
}

.hhpt-hrdivider {
padding: 0;
border-bottom: 1px solid #e7e7e8;
background-color: #e7e7e8;
margin: 20px 0 15px;
}

#hhpt-layoutinstructions {
max-width: 400px;
background-color: #e2e2e2;
position: absolute;
right: 0;
top: 0;
min-height: 150px;
z-index: 50;
line-height: 1.1;
}

#hhpt-layoutinstructions .hhpt-boxhead {
background-color: #878787;
color: #fff;
font-size: 15px;
font-weight: 600;
padding: 14px 15px;
position: relative;
}

#hhpt-layoutinstructions .hhpt-boxbody {
padding: 10px 15px 20px;
position: relative;
display: none;
}

#hhpt-pills-fpe.hhpt-fpe .hhpt-floorplan-instructions,
#hhpt-pills-fpe.hhpt-sv .hhpt-storage-instructions {
display: block;
}

#hhpt-layoutinstructions .hhpt-closecircle,
.hhpt-layoutopencircle {
right: 10px;
top: 9px;
font-size: 25px;
cursor: pointer;
}

.hhpt-layoutopencircle {
color: #777;
z-index: 10;
}

#hhpt-layoutinstructions .hhpt-closecircle {
color: #ccc;
}

#hhpt-layoutinstructions .hhpt-closecircle,
#hhpt-layoutinstructions .hhpt-closecircle:after,
.hhpt-layoutopencircle,
.hhpt-layoutopencircle:after {
position: absolute;
width: 25px;
height: 25px;
}

#hhpt-layoutinstructions .hhpt-closecircle:before {
position: absolute;
font-size: 15px;
content: "Close";
width: 50px;
text-align: right;
line-height: 25px;
margin-left: -56px;
}

@media only screen and (min-width: 768px) {
#hhpt-layoutinstructions .hhpt-closecircle:before {
display: none;
}
}

.desktop #hhpt-layoutinstructions .hhpt-closecircle:active,
.desktop #hhpt-layoutinstructions .hhpt-closecircle:hover {
color: #fff;
}

.desktop .hhpt-layoutopencircle:active,
.desktop .hhpt-layoutopencircle:hover {
color: #8da676;
}

.hhpt-layoutopencircle:after {
content: "\e939";
}

#hhpt-layoutinstructions .hhpt-closecircle:after {
content: "\e919";
}

[class*=" hhpt-instruct-icon-"],
[class*=" hhpt-instruct-icon-"]:after,
[class*=" hhpt-instruct-icon-"]:before,
[class^="hhpt-instruct-icon-"],
[class^="hhpt-instruct-icon-"]:after,
[class^="hhpt-instruct-icon-"]:before {
position: absolute;
width: 25px;
height: 25px;
top: 0;
left: 0;
font-size: 25px;
text-align: center;
line-height: 25px;
}

[class*=" hhpt-instruct-icon-"],
[class^="hhpt-instruct-icon-"] {
top: 5px;
}

[class*=" hhpt-instruct-icon-"]:before,
[class^="hhpt-instruct-icon-"]:before {
content: "\e92f";
color: #8da676;
}

[class*=" hhpt-instruct-icon-"]:after,
[class^="hhpt-instruct-icon-"]:after {
color: #fff;
}

.hhpt-instruct-icon-draggable:before {
color: #fff !important;
}

.hhpt-instruct-icon-draggable:after {
content: "\e943";
color: #8da676;
}

.hhpt-instruct-icon-settings:after {
content: "\e941";
}

.hhpt-instruct-icon-remove:before {
content: "\e91b";
font-size: 20px;
}

.hhpt-instruct-icon-move-up:after {
content: "\e912";
font-size: 10px;
-webkit-transform: translateY(-1px);
transform: translateY(-1px);
}

.hhpt-instruct-icon-move-down:after {
content: "\e90f";
font-size: 10px;
-webkit-transform: translateY(1px);
transform: translateY(1px);
}

.hhpt-instruct-icon-rotate-ccw:after {
content: "\e931";
}

.hhpt-instruct-icon-circle-remove:after {
content: "\e935";
}

.hhpt-instruct-icon-centerer,
.hhpt-instruct-icon-centerer:after,
.hhpt-instruct-icon-centerer:before {
width: 35px;
height: 35px;
font-size: 33px;
line-height: 35px;
}

.hhpt-instruct-icon-centerer {
left: -5px;
top: 0;
}

.hhpt-instruct-icon-centerer:after {
content: "\e944";
font-size: 20px;
}

.hhpt-instruct-icon-image {
-webkit-transform: translateX(-2px);
transform: translateX(-2px);
}

.hhpt-instruct-icon-image:before {
content: "";
}

.hhpt-instruct-icon-image img {
height: 35px;
width: auto;
background: transparent;
}

#hhpt-layoutinstructions hr {
padding: 0;
border: 0;
border-bottom: 1px solid #d2d2d2;
margin: 5px 0;
}

#hhpt-layoutinstructions ul {
padding: 0;
margin: 0;
list-style: none;
}

#hhpt-layoutinstructions li {
position: relative;
padding: 10px 0 10px 35px;
font-weight: 700;
}

#hhpt-layoutinstructions li span {
font-weight: 700;
}

#hhpt-layoutinstructions li span small {
font-weight: 400;
}

#hhpt-layoutinstructions .hhpt-tab-in {
padding-left: 35px;
margin-top: -5px;
}

#hhpt-StepTimeline {
position: relative;
display: inline-block;
height: 7vw;
margin-left: 12px;
margin-top: 15px;
}

#hhpt-StepTimeline:before {
content: "";
display: block;
position: absolute;
height: 2px;
margin-top: -1px;
top: 50%;
right: 2px;
left: 2px;
background: #e7e7e8;
}

.hhpt-StepDot {
position: relative;
color: #ccc;
display: inline-block;
margin: 0 2vw 0 0;
padding: 0;
}

.hhpt-StepDot,
.hhpt-StepDot span {
position: relative;
width: 7vw;
height: 7vw;
cursor: pointer;
}

.hhpt-StepDot span:after,
.hhpt-StepDot span:before {
position: absolute;
top: 0;
left: 0;
width: 7vw;
height: 7vw;
font-size: 7vw;
line-height: 7vw;
text-align: center;
}

.hhpt-StepDot span:before {
content: "\e92f";
color: #ccc;
}

.hhpt-StepDot span:after {
color: #fff;
opacity: 1;
}

.desktop .hhpt-StepDot:hover span:after,
.hhpt-StepDot.hhpt-active span:after,
.hhpt-StepDot:active span:after {
content: "\e93e";
}

.desktop .hhpt-StepDot:hover span:after,
.hhpt-StepDot:active span:after {
opacity: 0.8;
}

.hhpt-StepDot.hhpt-active span:after {
opacity: 1 !important;
content: "\e93e";
}

.desktop .hhpt-StepDot:hover span:before,
.hhpt-StepDot:active span:before {
color: #bbb;
}

.hhpt-StepDot.hhpt-active span:before {
color: darkgreen !important;
}

.hhpt-StepDot.hhpt-done span:before {
color: green !important;
opacity: 1 !important;
}

.desktop .hhpt-StepDot.hhpt-done span:hover:before,
.hhpt-StepDot.hhpt-done span:active:before {
color: #fff;
opacity: 1;
}

.desktop .hhpt-StepDot.hhpt-done:hover span:after,
.hhpt-StepDot.hhpt-done:active span:after,
.hhpt-StepDot.hhpt-done span:after {
opacity: 1 !important;
content: "\e93c";
}

.hhpt-StepDot:last-child {
margin-right: 0;
}

@media only screen and (min-width: 450px) {
#hhpt-StepTimeline {
height: 28px;
}

.hhpt-StepDot {
margin-right: 12px;
}

.hhpt-StepDot,
.hhpt-StepDot span {
width: 28px;
height: 28px;
}

.hhpt-StepDot span:after,
.hhpt-StepDot span:before {
width: 28px;
height: 28px;
font-size: 28px;
line-height: 28px;
}
}

@media only screen and (min-width: 768px) {
#hhpt-StepTimeline {
margin-left: 5px;
margin-bottom: 12px;
}
}

.hhpt-shed-summary > div,
.hhpt-shed-summary > header {
display: table;
border-spacing: 0;
}

.hhpt-shed-summary > div > div,
.hhpt-shed-summary > header > div {
display: table-row;
}

.hhpt-shed-summary > div > div > div,
.hhpt-shed-summary > header > div > div {
display: table-cell;
vertical-align: top;
}

.hhpt-shed-summary > div > div > div {
padding-right: 15px;
}

.hhpt-shed-summary > div > div.hhpt-balance-block > div,
.hhpt-shed-summary > div > div.hhpt-subtotal-block > div,
.hhpt-shed-summary > div > div.hhpt-total-block > div {
font-weight: 700;
}

.hhpt-shed-summary > div > div.hhpt-subtotal-block > div {
color: #999;
}

.hhpt-shed-summary > div > div > div + div {
text-align: right;
padding-right: 0 !important;
}

.hhpt-shed-summary > header > div > div {
padding-right: 10px;
}

.hhpt-shed-summary > header + div {
margin-top: 0.5em;
padding-top: 0.5em;
border-top: 1px solid #ccc;
}

.hhpt-shed-summary > div > div.hhpt-divider > div:after {
position: absolute;
content: "";
top: 50%;
left: 0;
right: 0;
height: 1px;
border-top: 1px solid #ccc;
}

.hhpt-shed-summary > div > div.hhpt-divider > div {
position: relative;
padding-top: 1em;
}

.hhpt-shed-summary > header > div > div + div {
padding-right: 0 !important;
font-weight: 700 !important;
}

.hhpt-single-product-summary {
padding-bottom: 1em;
}

.hhpt-price-table {
display: table;
font-size: 13px;
margin-bottom: 15px;
min-width: 220px;
}

.hhpt-price-table > div,
.hhpt-price-table > header {
display: table-row;
}

.hhpt-price-table > div > div,
.hhpt-price-table > header > div {
display: table-cell;
}

.hhpt-price-table > div.link-row > div a,
.hhpt-price-table > div > div,
.hhpt-price-table > header > div {
padding: 6px 20px;
}

.hhpt-price-table > div.link-row > div {
-webkit-transition: background 0.15s;
transition: background 0.15s;
padding: 0;
}

.hhpt-price-table > header {
background: #898989;
color: #fff;
font-weight: 700;
}

.hhpt-price-table > div {
background: #fbfbfb;
}

.hhpt-price-table span {
white-space: nowrap;
}

.hhpt-price-table s {
font-size: 12px;
color: #aaa;
}

.hhpt-price-table > div:nth-child(odd) {
background: #f2f2f2;
}

.hhpt-price-table > div.link-row:hover > div {
background: #e4ebdb;
}

.hhpt-price-table .link-row a {
display: block;
color: #777;
}

.hhpt-StepDot[data-label] {
position: relative;
z-index: 2;
cursor: pointer;
}

.hhpt-StepDot[data-label]:after,
.hhpt-StepDot[data-label]:before {
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
pointer-events: none;
}

.hhpt-StepDot[data-label]:before {
position: absolute;
bottom: 110%;
left: 50%;
margin-bottom: 5px;
margin-left: -50px;
padding: 7px;
width: 100px;
border-radius: 3px;
background-color: #000;
background-color: rgba(30, 30, 30, 0.9);
color: #fff;
content: attr(data-label);
text-align: center;
font-size: 14px;
line-height: 1.2;
}

.hhpt-StepDot[data-label]:first-child:before {
left: 45px;
}

.hhpt-StepDot[data-label]:last-child:before {
left: auto;
right: -10px;
}

.hhpt-StepDot[data-label]:after {
position: absolute;
bottom: 110%;
left: 50%;
margin-left: -5px;
width: 0;
border-top: 5px solid #000;
border-top: 5px solid rgba(30, 30, 30, 0.9);
border-right: 5px solid transparent;
border-left: 5px solid transparent;
content: " ";
font-size: 0;
line-height: 0;
}

.hhpt-StepDot[data-label]:first-child:after {
left: 13px;
}

.hhpt-StepDot[data-label]:last-child:after {
left: auto;
right: 8px;
}

.desktop .hhpt-StepDot[data-label]:hover:after,
.desktop .hhpt-StepDot[data-label]:hover:before {
visibility: visible;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}

.hhpt-catbox > h3,
.hhpt-configuratorbody h3 + p,
.hhpt-liveSummary {
margin-left: 15px;
margin-right: 15px;
}

.hhpt-colorbox.hhpt-tiny {
margin-left: 15px;
}

#hhpt-btnReset {
margin-right: 15px;
}

#hhpt-listings > .hhpt-colorbox.hhpt-tiny + .hhpt-colorbox.hhpt-tiny {
margin-left: 2px;
}

@media only screen and (min-width: 470px) {
#hhpt-listings > h3 {
margin-left: 0;
margin-right: 0;
}
}

@media only screen and (min-width: 768px) {
#hhpt-backtohome,
.hhpt-centerbuttonwrap {
margin-left: 0;
}

#hhpt-btnReset,
.hhpt-centerbuttonwrap {
margin-right: 0;
}

h3.hhpt-clickable,
.hhpt-catbox > h3,
.hhpt-configuratorbody h3 + p,
.hhpt-liveSummary {
margin-left: 0;
margin-right: 0;
}

.hhpt-colorbox label.hhpt-rbls_addhei,
img.hhpt-noleftmargin {
margin-left: 25px;
}

.hhpt-colorbox.hhpt-tiny {
margin-left: 2px;
}

.hhpt-choicewrapper label.hhpt-cbx_15,
.hhpt-choicewrapper label.hhpt-cbx_17,
.hhpt-choicewrapper label.hhpt-cbx_19 {
padding-left: 2px;
}

.hhpt-choicewrapper label.hhpt-cbx_15 input[type="checkbox"],
.hhpt-choicewrapper label.hhpt-cbx_17 input[type="checkbox"],
.hhpt-choicewrapper label.hhpt-cbx_19 input[type="checkbox"] {
left: 0;
}
}

.hhpt-overlay-logo {
background-image: url("https://hhpricetools.com/wp-content/uploads/2021/03/logo-removebg-preview.png");
opacity: 0.6;
	display: block;
	position:absolute;
	right:15px;
	width:25%;
	height: 0;
	padding-top: 10%;
	text-indent: -9999px;
    background-repeat: no-repeat;
    -webkit-background-size: contain;
    background-size: contain;
	background-color: transparent;
}
.hhpt-overlay-logo {
	top:15px;
	max-width:160px;
}
@media only screen and (min-width:600px) {
	.hhpt-app-logo {
		padding-top: 0;
		width: 120px;
		height: 50px;
	}
}

body  #respond input#submit.alt,
body  a.button.alt,
body  button.button.alt,
body  input.button.alt,
body table.shop_table-checkout-review-order-table th.product-name,
body table.shop_table-checkout-review-order-table th.product-total,
body .hhpt-button,
body a.hhpt-button,
body div.hhpt-button,
body input[type="submit"].hhpt-button,
body input[type="button"].hhpt-button,
body  a.hhpt-button,
body.desktop a.hhpt-button.hhpt-grey-button:hover,
body.desktop div.hhpt-button.hhpt-grey-button:hover,
body.desktop .hhpt-button.hhpt-grey-button:hover,
body .hhpt-primary-color-header,
body .hhpt-primary-color-background,
body #hhpt-listings > h3.hhpt-clickable,
body .hhpt-tabs > li.hhpt-active,
body #hhpt-dropdownjumper ul li.hhpt-active,
body #hhpt-btnMobStorageItem,
body #hhpt-btnCtaNext,
body .hhpt-tabs > li.hhpt-active::before,
body .hhpt-filter-summary > div > div,
body.desktop .hhpt-nav-prompt:hover .hhpt-top-bar,
body.desktop .hhpt-nav-prompt:hover .hhpt-mid-bar,
body.desktop .hhpt-nav-prompt:hover .hhpt-btm-bar {
background-color: #0e2f44;
}

body .hhpt-sizitem.hhpt-active .hhpt-selbox {
background-color: #0e2f44 !important;
}

body -message::before,
body table.shop_table td.product-name,
html body -info::before,
body -thankyou-order-received,
body .hhpt-primary-color,
body .hhpt-btn-secondary,
body.desktop .hhpt-layoutopencircle:hover,
body .hhpt-layoutopencircle:active,
body .hhpt-modal > p,
body.desktop .hhpt-jquery-modal .hhpt-modal a.close-modal:hover,
body .hhpt-jquery-modal .hhpt-modal a.close-modal:active,
body .hhpt-configuratorbody a,
body.desktop .hhpt-configuratorbody a:hover,
body .hhpt-configuratorbody #hhpt-listings > p:first-child,
body .hhpt-tabs > li,
body.desktop .hhpt-configuratorbody .hhpt-tabs a:hover,
body .hhpt-configuratorbody .hhpt-tabs a,
body .hhpt-StepDot.hhpt-done span::before,
body [class^="hhpt-instruct-icon-"]::before,
body [class*=" hhpt-instruct-icon-"]::before,
body .hhpt-instruct-icon-draggable::after,
body .hhpt-configuratorbody #hhpt-listings > p:first-child,
body .hhpt-propbox .hhpt-infocornerprop .hhpt-icon-circle-info::before,
body
.hhpt-propbox
.hhpt-infocornerprop
.hhpt-icon-circle-info.hhpt-primary-color::before,
body a.hhpt-bordered.hhpt-button,
body div.hhpt-bordered.hhpt-button,
body .hhpt-inventory-listing section a h3,
body .hhpt-inventory-listing section a .hhpt-small,
body .hhpt-filter-summary > div > div.hhpt-clear-filters,
body .hhpt-incbtn,
body .hhpt-storageadder,
body p.hhpt-financing-base-price,
body .hhpt-price-table-2 > div > div:not(.ppt-size),
body.desktop nav.hhpt-primary a:hover,
body nav.hhpt-primary .current-menu-item > a,
body nav.hhpt-primary .current-menu-ancestor > a,
body nav.hhpt-primary li.current-menu-item > a > span,
body nav.hhpt-primary li.current-menu-ancestor > a > span,
body .hhpt-cart-button::before,
body.desktop > header.hhpt-header-info .hhpt-phone a:hover,
body.desktop > header.hhpt-header-info .hhpt-email a:hover,
body .hhpt-footer a:hover,
body .hhpt-footer .hhpt-footer-menu a:hover,
body .hhpt-zipcode-entry .hhpt-zip-submit::before {
color: #0e2f44;
}

body .hhpt-tabs > li.hhpt-active,
body .hhpt-housebox.hhpt-active,
body .hhpt-colorbox.hhpt-tiny.hhpt-active,
body .hhpt-colorbox.hhpt-wallbox.hhpt-active,
body.desktop a.hhpt-button.hhpt-grey-button:hover,
body.desktop div.hhpt-button.hhpt-grey-button:hover,
body.desktop  .hhpt-button.hhpt-grey-button:hover body .hhpt-button,
body  a.hhpt-button,
body a.hhpt-button,
body div.hhpt-button,
body input[type="button"].hhpt-button,
body input[type="submit"].hhpt-button,
body .hhpt-colorbox.hhpt-roofbox.hhpt-active {
border-color: #0e2f44;
}

body .hhpt-tabs-wrapper,
body nav.hhpt-primary > ul > li.current-menu-item > a > span,
body nav.hhpt-primary > ul > li.current-menu-ancestor > a > span {
border-bottom-color: #0e2f44;
}

body -message,
html body -info {
border-top-color: #0e2f44;
}

body .hhpt-configuratorbody .hhpt-tabs .hhpt-active a,
body.desktop .hhpt-configuratorbody .hhpt-tabs .hhpt-active a,
body.desktop .hhpt-configuratorbody .hhpt-active a:hover {
color: #fff;
}

body a,
body .hhpt-link {
color: #0e2f44;
}

body.desktop .hhpt-jquery-modal .hhpt-modal a.close-modal:hover {
color: #0e2f44;
}

body.desktop .hhpt-button:hover,
body.desktop a.hhpt-button:hover,
body.desktop div.hhpt-button:hover,
body.desktop input[type="submit"].hhpt-button:hover,
body.desktop input[type="button"].hhpt-button:hover,
body.desktop  a.hhpt-button:hover,
body.desktop #hhpt-btnCtaNext:hover {
background-color: #555555;
}

body.desktop .hhpt-incbtn:hover,
body.desktop .hhpt-storageadder:hover .hhpt-primary-color,
body.desktop .hhpt-incbtn:hover .hhpt-primary-color {
color: #555555;
}

body ul.hhpt-topchangerright {
background-color: #0e2f44;

}

body .hhpt-navarrow i::before {
color: #0e2f44 !important;
}

body .hhpt-tabs::before {
background-color: #d7ddd5;
}

body.desktop .hhpt-sizitem .hhpt-selbox:hover,
body .hhpt-sizitem .hhpt-selbox:active {
background-color: #d8ddcf;
}

body .hhpt-tabs > li {
border-color: #d7ddd5;
}

body .hhpt-configuratorbody #hhpt-listings > p:first-child,
body .hhpt-modal > p {
background-color: #9eabb4;
border-color: #09202f;
}

body .hhpt-tabs > li {
background: #ddd;
}
/* START CUSTOM CSS */

.one-container .site-content {
    -webkit-box-shadow: 0px 0px 11px 1px rgb(0 0 0 / 80%);
    box-shadow: 0px 0px 11px 1px rgb(0 0 0 / 80%);
    min-height: 300vh !important;
    overflow: hidden;
    display: block;
    position: relative;
    padding-bottom: 100px;
}
a#hhpt-lnkMontlypayments {
    display: none;
}
.hhpt-choicewrapper#hhpt-wainsholder label {
    padding-top: 10px;
padding-bottom: 15px;
display: none;
}

.hhpt-sidepadmobile .hhpt-alwayshalfcol h2 {
    margin-right: 0;
    margin-bottom: 3px;
 display: none;
}

.hhpt-livezip {
    display: none;
}
table {
  margin: 0 0 -0.5em;
 width: 100%;
}

div#hhpt-btnPdfDownload1 {
    font-size: 5vh;
}
.hhpt-bottom-buttons-right {
    display: none!important;
}
#hhpt-visualizerControls {
    text-align: left;
    width: 35%!important;
    display: block;
    position: absolute;
    top: 20px;
    font-size: 12px;
    color: #fff;
    background-color: #000;
    opacity: 0.6;
padding: 10px;
}
.hhpt-overlay-logo {
    opacity: 0.6;
}
h2.hhpt-lblstylesize {
    float: left;
    margin-right: 15px;
    font-size: 2.8vh!important;
}
#hhpt-sidebarStorage ul.hhpt-topchangerright {
    display: table;
    -ms-flex-wrap: nowrap!important;
    flex-wrap: nowrap;
    width: 100%;
    margin-top: 0.5em;
    margin-left: -2px!important;
}
