/*
"Harvey Norman NZ" skin.
*/

/* Links. [order-dependent] */

@font-face
{
 font-family: 'AvenirLTStd-Black';
 src: url("/content/skin-00016/AvenirLTStd-Black.otf") format('opentype'); 
 font-style: bold;
}

@font-face
{
 font-family: 'AvenirLTStd-Book';
 src: url("/content/skin-00016/AvenirLTStd-Book.otf") format('opentype'); 
 font-style: normal;
}

/* Other. */

.skin-wrap { font-family:"AvenirLTStd-Book", sans-serif; color:#015b99; }

h1 { font-weight:normal; font-size:30px; margin:50px 0 20px 0; }

.steps-options-wrap { margin:auto; max-width:1200px; padding:30px; position:relative; } 

.output-question-wrap div { float:left; margin:0 4px 4px 0; overflow:hidden; position:relative; width:calc(25% - 4px); }

.output-question-wrap div input[type="radio"], .output-question-wrap div input[type="checkbox"] { display:none; }
.output-question-wrap div input[type="checkbox"] + label, .output-question-wrap div input[type="radio"] + label { display:block; height:100%; width:100%; }

.output-question-wrap div:hover, .output-question-wrap:active { opacity:0.8; }

.output-question-wrap div input[type="checkbox"] + label img, .output-question-wrap div input[type="radio"] + label img { height:auto; width:100%; }
.output-question-wrap div input[type="checkbox"] + label span, .output-question-wrap div input[type="radio"] + label span { color:#fff; font-size:18px; font-family:"AvenirLTStd-Black", sans-serif; font-weight:700; padding:40px 30px; position:absolute; top:0; left:0; text-shadow:0 0 4px #000; text-transform:uppercase; }

.output-question-wrap ~ div { position:absolute; top:30px; right:30px; }
ul.steps { list-style:none; padding:0; }
ul.steps li { border-radius:50%; border:1px solid #e4eff3; color:#777; float:left; font-size:14px; font-weight:normal; height:40px; line-height:40px; margin:0 5px 5px 0; text-align:center; width:40px; }
ul.steps li.current-step { background:#e9f3f5; color:#015b9c; }
ul.steps li a:link, ul.steps li a:visited { display:block; height:100%; }

.results-wrap { background:#f2f7fd; margin:30px 0 0 0; padding:30px; }
.results-label { font-size:30px; margin:auto; max-width:1200px; padding:35px 0 20px 0; }
.results-frame { margin:auto; max-width:1200px; padding:0; }

.productwrap { background:#fff; float:left; margin:0 25px 25px 0; width:calc(25% - 19px); }
.productwrap:nth-child(4n) { margin-right:0; }
.product-name { font-size:14px; font-weight:normal; line-height:18px; min-height:55px; padding:16px 20px; }
.product-hover, .product-price { display:none; }

#contact-form-wrap { background:none; margin-bottom:0; padding:0; width:auto; }
div#shop-assistant-small { clear:both; position:relative; }

#back-next-wrap a.btn, input[type="submit"], #back-next-wrap button { background:#e9f3f5; border:1px solid #e4eff3; border-radius:33px; color:#015b99; font-size:13px; line-height:40px; padding:0 15px; }

/* Responsive.*/

@media (max-width:1024px)
{
 .product-name { min-height:75px; }
}

@media (max-width:868px)
{
 .output-question-wrap div input[type="checkbox"] + label span, .output-question-wrap div input[type="radio"] + label span { padding:20px; }
 .results-label { font-size:24px; padding-top:0; }
 .productwrap { width:calc(50% - 13px); }
 .productwrap:nth-child(4n) { margin-right:25px; }
 .productwrap:nth-child(even) { margin-right:0; }
}

@media (max-width:740px)
{
 .output-question-wrap div input[type="checkbox"] + label span, .output-question-wrap div input[type="radio"] + label span { font-size:16px; padding:15px; }
}

@media (max-width:680px)
{
 .output-question-wrap div { width:calc(33.3% - 4px); }
 ul.steps li { font-size:12px; height:30px; line-height:30px; width:30px; }
 #back-next-wrap a.btn, input[type="submit"], #back-next-wrap button { line-height:30px; }
}

@media (max-width:600px)
{
 .output-question-wrap ~ div { top:-10px; }
 div#contact-form-wrap input[type=text], #contact-form-wrap textarea  { width:95%; }
}

@media (max-width:440px)
{
 .output-question-wrap div { width:calc(50% - 4px); }
}