@charset "UTF-8";




.wrap {
	margin: 0 40px;
	position: relative;
}




.headcombo {
	margin: 0 auto;
	max-width: 640px;
	text-align: center;
}

.headcombo .h2-after {
	font-size: 16px;
	line-height: 30px;
	text-transform: uppercase;
	color: #999;
	margin-top: 12px;
	font-weight: 400;
}

.headcombo p {
	margin: 24px 0;
	font-size: 18px;
	line-height: 28px;
	font-weight: 400;
}





.PLATE.notypenav {
	padding-top: 0;
}


.doors header {
	margin-top: 50px;
}

.doors .wrap {
	margin: 0 40px;
	position: relative;
}

.doors .sectionhead {
	padding: 0 0 60px;
	text-align: center;
}

.doors .doorname {
	text-transform: uppercase;
	font-weight: 400;
}

.doors .sectionhead .doorname {
	font-size: 22px;
	margin-bottom: 8px;
}

.doors .doorname span {
	font-weight: 700;
}

.doors .infos {
	text-align: center;
	color: #999;
	max-width: 560px;
	padding: 20px 20px 40px;
	font-size: 15px;
	line-height: 22px;
	margin: 0 auto;
}

.doors .infos .doorname { color: #666; font-weight: 500; }


/* learn more */

.learn-more {
	display: inline-block;
	padding-left: 36px;
	color: #000;
	background: url(/images/images/doors/learn-more.png) no-repeat left center;
	background-size: 30px 30px;
	opacity: 0.4;
	margin-top: 8px;
	line-height: 30px;
	font-size: 15px;
	font-weight: 400;
	cursor: pointer;
}

.learn-more:hover { opacity: 0.8; }

.allsizes .learn-more {
	padding-left: 0;
	padding-right: 36px;
	background-position: right center;
}




/* typenav */




.typenav {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100px;
	background: #b6b6b6;
	text-align: center;
	z-index: 101;
}

.typenav .container {
	display: inline-block;
	overflow: hidden;
	margin: 0 20px;
	height: 112px;
}



.typenav a {
	position: relative;
	display: block;
	float: left;
	padding: 0 16px;
	font-size: 14px;
	color: #fff;
	padding-top: 66px;
	font-weight: 400;
	line-height: 20px;
	height: 34px;
	background-position: center 10px;
	background-repeat: no-repeat;
}

.typenav a.tp-full {
	background-image: url(/images/images/doors/navico-teli.png);
	background-size: 42px 48px;
}

.typenav a.tp-wind {
	background-image: url(/images/images/doors/navico-ablakos.png);
	background-size: 42px 48px;
}

.typenav a.tp-duo {
	background-image: url(/images/images/doors/navico-dupla.png);
	background-size: 42px 48px;
}

.typenav a.tp-light {
	background-image: url(/images/images/doors/navico-bevilagito.png);
	background-size: 42px 48px;
}

.typenav a.tp-comp {
	background-image: url(/images/images/doors/navico-compare.png);
	background-size: 42px 48px;
}

.typenav a.tp-fire {
	background-image: url(/images/images/doors/navico-fire.png);
	background-size: 42px 48px;
}

.tp-full .tp-full:after,
.tp-wind .tp-wind:after,
.tp-duo .tp-duo:after,
.tp-fire .tp-fire:after,
.tp-light .tp-light:after,
.tp-full .tp-full:after,
.tp-comp .tp-comp:after {
	display: block;
	position: absolute;
	width: 40px;
	height: 20px;
	bottom: -12px;
	left: 50%;
	margin-left: -20px;
	background: url(/images/images/doors/navico-trd.png) no-repeat center;
	content: '';
}




/* bread */



.bread {
	position: relative;
	webkit-position: sticky;
	position: sticky;
	top: -10px;
	font-weight: 400; 
	background: rgba(256,256,256,0.9);
	z-index: 100;
}

.bread .wrap {
	position: relative;
	padding: 30px 0 10px;
	margin: 0 20px;
}

.bread .wrap > a, .doors .bread .wrap > span {
	display: inline-block;
	position: relative;
	font-size: 15px;
	font-weight: 500;
	color: #333;
}

.bread .wrap > a.IN,
.bread .wrap > a.OUT { display: none }

.bread.IN .wrap > a.IN,
.bread.OUT .wrap > a.OUT { display: inline }

.bread .wrap > a {
	padding-right: 30px;
}


.bread .wrap > a:after {
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	height: 24px;
	width: 24px;
	background: url(/images/images/doors/bread.png) no-repeat center;
	content: '';
}

.bread .rightnav {
	position: absolute;
	top: 30px;
	right: 0;
}

.bread .rightnav a {
	font-size: 13px;
	text-transform: uppercase;
	display: inline-block;
	color: #777;
	margin: 0 8px;
}




/* doors list */


.doors-list {
	margin-top: 140px;
}

.doors-line {
	position: relative;
	padding-bottom: 50px;
}

.doors-line:nth-child(odd) {
	background: #f2f2f2;
}

.doors-line .box {
	position: relative;
	width: 900px;
	max-width: 100%;
	margin: 0 auto;
}



.doors-line .txtwrap {
	position: relative;
	padding: 70px 60px 50px;
}

.doors-line .title {
	font-size: 36px;
	line-height: 40px;
	font-weight: 400;
	text-transform: -1px;
}

.doors-line .title span {
	font-weight: 900;
}

.doors .price {
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	color: #999;
	margin: 6px 0 20px;
}

.doors .price span {
	font-weight: 700;
	color: #333;
}

.doors-line p {
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	color: #333;
	margin: 20px 0;
}



.doors-line .doordisp {
	position: relative;
	width: 208px;
	margin-top: -50px;
	transition: all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
}

.doors-line:nth-child(odd) .doordisp  { float: left; margin-left: 92px; margin-right: 60px;}
.doors-line:nth-child(even) .doordisp { float: right; margin-right: 92px; margin-left: 60px; }





.duolist .doors-line:nth-child(odd) .doordisp  { float: left; margin-left: 92px; margin-right: 112px;}
.duolist .doors-line:nth-child(even) .doordisp { float: right; margin-right: 92px; margin-left: 112px; }


.doors-line .doordisp img {
	position: relative;
	display: block;
	width: 100%;
}


.doors-line .duodisp {
	position: absolute;
	top: 0; 
	width: 38%;
	max-height: 100%;
	overflow: hidden;
}

.duolist .doors-line:nth-child(odd) .duodisp  { left: 95%; ;}
.duolist .doors-line:nth-child(even) .duodisp { right: 95%;  }


.doors-line:nth-child(even) .doordisp img { transform: scaleX(-1) }

.doors-line .doordisp:after {
	position: absolute;
	display: block;
	width: 100%;
	height: 30px;
	left: 0;
	bottom: 0;
	background: url(/images/images/doors/doorshade.png) repeat-x left top;
	content: '';
	opacity: 0.6;
}

.doors-line .badge {
	position: absolute;
	top: 64px;
	pointer-events: none;
}

.doors-line:nth-child(odd) .badge  { left: 112px; }
.doors-line:nth-child(even) .badge { right: 112px; }

.badge div {
	width: 60px;
	height: 60px;
	background: #24242b;
	 border: 2px solid #24242b;
	color: #fff;
	font-size: 11px;
	text-align: center;
	border-radius: 40px;
	margin-bottom: 8px;
	line-height: 20px;
	display: none;
}

.badge span {
	display: block;
	height: 24px;
	line-height: 24px;
	padding: 12px 0 0;
	font-size: 22px;
	width: 36px;
	margin: 0 auto;
	border-bottom: 1px solid rgba(256,256,256, 0.5);
	font-weight: 400;
}


.doors-line .pie {
	position: absolute;
	top: 64px;
}

.doors-line .pie, .doors-line .badge  {
	transform: scale(1.2);
}

.doors-line:nth-child(odd) .pie  { left: 12px; }
.doors-line:nth-child(even) .pie { right: 12px; }

.pie > div {
	position: relative;
	width: 64px;
	height: 64px;
	color: #333;
	font-size: 11px;
	text-align: center;
	border-radius: 40px;
	margin-bottom: 8px;
	line-height: 16px;
	font-weight: 400;
	cursor: pointer;
	display: none;
}


.pie .holder {
	display: block;
	position: relative;
	height: 36px;
	line-height: 18px;
	font-size: 16px;
	width: 30px;
	margin: 0 auto;
	border-bottom: 1px solid #ddd;
	font-weight: 600;
	font-family: 'Roboto Condensed';
	letter-spacing: -1px;
	margin-bottom: 4px;
	
}

.pie .doublenum, .pie .singlenum {
	display: block;
	position: relative;
	height: 16px;
	line-height: 16px;
	font-size: 14px;
	width: 30px;
	margin: 0 auto;
	border-bottom: 1px solid #ddd;
	font-weight: 600;
	font-family: 'Roboto Condensed';
	letter-spacing: -1px;
}

.pie .doublenum:nth-child(1) {
	padding: 14px 0 0;
}

.pie .singlenum {
	height: 64px;
	line-height: 64px;
	font-size: 18px;
	border: none;
}


.pie .doublenum:nth-child(2) {
	border-bottom: none;
	padding: 4px 0 0;
}

.pie .holder span {
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	padding-top: 18px;
	transform: translateX(-50%);
	white-space: nowrap;
}

.pie .holder span.larger {
	font-size: 20px;
}


.pie div.v2 {
	background-image: url(/images/images/doors/pie/v2.png);
	background-size: 100%;
}

.pie div.v3 {
	background-image: url(/images/images/doors/pie/v3.png);
	background-size: 100%;
}

.pie div.v4 {
	background-image: url(/images/images/doors/pie/v4.png);
	background-size: 100%;
}

.pie div.v5 {
	background-image: url(/images/images/doors/pie/v5.png);
	background-size: 100%;
}





.doors-line .box .buttonset div  { display: inline-block; }

.doors-line a.button {
	width: 180px;
	padding: 10px 0 6px;
	line-height: 24px;
	height: 24px;
	font-size: 15px;
	vertical-align: middle;
	margin-right: 10px;
	direction: ltr;
}

.doors-line:nth-child(even) .buttonset  { direction: rtl; }
.doors-line:nth-child(even) a.button  { margin-left: 10px; margin-right: 0; }

a.similar {
	display: inline-block;
	height: 32px;
	padding: 10px 0 6px 0;
	font-size: 11px;
	text-transform: uppercase;
	color: #fff;
	vertical-align: middle;
	filter: brightness(0);
	opacity: 0.3;
	line-height: 16px;
	margin: 0 6px;
	direction: ltr;
}

a.similar:hover {
	opacity: 0.6;
}


a.similar.samewind, a.similar.simwind {
	background: url(/images/images/doors/navico-ablakos.png) no-repeat -4px -3px;
	background-size: 42px 48px;
	padding-left: 38px;
}

a.similar.samefull, a.similar.simfull {
	background: url(/images/images/doors/navico-teli.png) no-repeat -4px -3px;
	background-size: 42px 48px;
	padding-left: 38px;
}

a.similar.duofull, a.similar.duowind {
	background: url(/images/images/doors/navico-dupla.png) no-repeat left -3px;
	background-size: 42px 48px;
	padding-left: 48px;
}







.size-light {
	padding: 50px 20px 40px;
	background: #dedede;
	text-align: center;
}

.size-light .box {
	position: relative;
	display: inline-block;
	vertical-align: top;
	max-width: 280px;
	padding: 20px 0;
	margin: 0 20px;
	min-height: 80px;
}

.size-light .box span {
	display: block;
	font-weight: 600;
	font-size: 18px;
	margin-bottom: 6px;
}

.size-light .box.allsizes {
	text-align: right;
	padding-right: 110px;
	background: url(/images/images/doors/allsizes.png) no-repeat right center;
	background-size: 92px auto;
}

.size-light .box.morelight {
	text-align: left;
	padding-left: 110px;
	background: url(/images/images/doors/morelight.png) no-repeat left center;
	background-size: 92px auto;
}

.size-light .box.morelightfull {
	text-align: left;
	padding-left: 300px;
	max-width: 400px;
	background: url(/images/images/doors/bevilagitok.png) no-repeat left center;
	background-size: 266px auto;
}

.size-light .box a {
	color: #333;
	font-weight: 500;
	font-size: 13px;
	display: inline-block;
	margin-left: 6px;
	vertical-align: middle;
}





.in-all-sizes {
	background: url(/images/images/doors/allsizes.png) no-repeat right top;
	padding-top: 36px;
	padding-bottom: 12px;
	background-size: 52px auto;
	padding-right: 64px;
	margin-top: 16px;
	font-weight: 600;
}

.in-all-sizes .sizes { margin-right: -64px; margin-top: 12px; }
.in-all-sizes .sizes > div {
	display: inline-block;
	width: 32px;
	height: 32px;
	line-height: 32px;
	border: 1px solid #bbb;
	color: #777;
	font-size: 13px;
	font-family: 'Oswald', sans-serif;
	font-weight: 300;
	text-align: center;
	border-radius: 20px;
}



/* left-right props */


.lr-properties {
	position: relative;
	margin: 100px auto;
}

.lr-line {
	position: relative;
	margin: 60px 0;
	text-align: center;
}

.lr-line .box {
	display: inline-block;
	vertical-align: middle;
	width: 560px;
	max-width: 50%;
	text-align: left;
}

.lr-line .box.imagebox { width: 380px; max-width: 40%; }
.lr-line:nth-child(odd) { direction: rtl;  }

.lr-line:nth-child(odd) .imagebox .wrap  { margin-left: 0;  }
.lr-line:nth-child(even) .imagebox .wrap {  margin-right: 0;  }

.lr-line .box.imagebox img { position: relative; display: block; max-width: 100%; }

.lr-line .box .wrap {
	position: relative;
	margin: 0 40px;
	direction: ltr;
}

.lr-line h2 {
	color: #2e2e38;
}

.lr-line .subtitle {
	display: block;
	font-size: 15px;
	line-height: 24px;
	font-weight: 400;
	text-transform: uppercase;
	color: #82b73a;
	margin: 6px 0;
}

.lr-line p {
	font-size: 16px;
	line-height: 24px;
	font-weight: 400;
	margin: 16px 0;
}

.lr-line .img {
	max-width: 340px;
	width: 100%;
}




/* unisec block */

.why-unisec {
	position: relative;
	margin: 100px 0 60px;
	padding: 60px 0;
	background: #2e2e38;
}

.why-unisec .texts {
	color: #fff;
	text-align: center;
	max-width: 760px;
	margin: 0 auto;
}

.why-unisec .texts .wrap {
	margin: 0 40px;
}

.unisec-block .why-unisec .texts h2 {
	letter-spacing: 0;
	font-weight: 600;
	color: #fff;
	margin: 16px 0 32px;
}

.unisec-block .why-unisec .texts .subtitle {
	display: block;
	font-size: 18px;
	line-height: 24px;
	font-weight: 400;
	text-transform: uppercase;
	color: #bbb;
	margin: 6px 0;
}

.unisec-block .why-unisec .texts p {
	font-size: 18px;
	line-height: 26px;
}

.why-unisec .steps {
	position: relative;
	width: 920px;
	margin: 64px auto 32px;
	overflow: hidden;
	color: #bbb;
	padding-top: 36px;
}

.why-unisec .steps .wrap {
	position: relative;
	margin: 0 10px;
	padding: 60px 30px 30px;
	background: rgba(0,0,0,0.1);
	border-radius: 6px;
}

.why-unisec .steps .wrap:after {
	position: absolute;
	width: 72px;
	height: 72px;
	line-height: 72px;
	font-size: 56px;
	font-weight: 600;
	text-align: center;
	top: 0;
	left: 50%;
	transform: translate(-50%,-50%);
	background-color: #8dc63f;
	color: #2e2e38;
	border: 8px solid #2e2e38;
	border-radius: 50px;
	content: attr(data-content);
}

.why-unisec h3 {
	font-weight: 500;
	color: #fff;
	text-align: center;
	margin-bottom: 8px;
}

.unisec-block .more {
	position: relative;
	display: inline-block;
	font-size: 15px;
	line-height: 24px;
	color: #8dc63f;
	font-weight: 400;
}

.why-unisec .steps .col-33 .wrap:before {
	position: absolute;
	left: -40px;
	top: 50%;
	transform: translateY(-50%);
	width: 60px;
	height: 40px;
	background: url(/images/images/doors/steps-arrow.png) no-repeat center;
	content: '';
}

.why-unisec .steps .col-33:first-child .wrap:before {
	display: none;
}




/* reviews block */

.unisec-block .reviews {
	position: relative;
	margin: 100px 0 60px;
}

.unisec-block .texts {
	text-align: center;
	max-width: 760px;
	margin: 0 auto;
}

.unisec-block .texts .wrap {
	margin: 0 40px;
}

.unisec-block .texts h2 {
	font-weight: 600;
	color: #2e2e38;
	margin: 16px 0 64px;
}

.unisec-block .texts .subtitle {
	display: block;
	font-size: 18px;
	line-height: 24px;
	font-weight: 400;
	text-transform: uppercase;
	color: #bbb;
	margin: 6px 0;
}

.unisec-block .reviews-list {
	position: relative;
	width: 980px;
	margin: 48px auto 32px;
	overflow: hidden;
	text-align: left;
}

.unisec-block .reviews-list .col-33:nth-child(2) {
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;	
	margin-left: -1px;
	margin-right: -1px;
	text-align: left;
}

.unisec-block .reviews-list .col-33 .wrap {
	position: relative;
}

.unisec-block .reviews-list .col-33 .userblock {
	position: absolute;
	left: 0;
}

.unisec-block .reviews-list .col-33 .wrap { padding-top: 72px; }
.unisec-block .reviews-list .col-33 .userblock { top: 0 }


.unisec-block .reviews-list .col-33 .name {
	font-size: 16px;
	font-weight: 400;
	color: #333;
	margin-left: 52px;
}

.unisec-block .reviews-list .col-33 .date {
	font-size: 13px;
	font-weight: 400;
	color: #999;
	margin-left: 52px;
}

.unisec-block .reviews-list .col-33 a {
	font-size: 14px;
	font-weight: 400;
}

.unisec-block .reviews-list img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 40px;
	border-radius: 24px;
	overflow: hidden;
}

.unisec-block .reviews-list p {
	font-size: 16px;
	line-height: 24px;
	font-style: italic;
	color: #666;
}



/* faq */

.unisec-block .faq {
	margin: 100px 0 60px;
}

.unisec-block .faq-list {
	position: relative;
	width: 980px;
	margin: 48px auto 32px;
	overflow: hidden;
	text-align: left;
}


/* warranty */


.warranties {
	padding-top: 60px;
	background: #8dc63f;
	color: #161626;
	text-align: center;
}

.warranties .bottom-cta {
	margin-top: 40px;
	padding: 40px 0px;
	background: #6fa12c;
}

.warranties .bottom-cta a.button {
	color: #fff;
	border: 2px solid #fff;
	font-size: 16px;
	background: none;
	padding: 10px 40px;
}

.unisec-block .warranties .fiveyears { background-image: url(/images/images/doors/ico-g-5years.png)   }
.unisec-block .warranties .deadline { background-image: url(/images/images/doors/ico-g-deadline.png) }
.unisec-block .warranties .noattack { background-image: url(/images/images/doors/ico-g-noattack.png) }
.unisec-block .warranties .unigar { background-image: url(/images/images/doors/ico-g-unique.png) }

.unisec-block .warranties .box {
	display: inline-block;
	vertical-align: top;
	position: relative;
	width: 180px;
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 144px auto;
	padding: 160px 40px 0;
	font-size: 18px;
	text-align: center;
	font-weight: 400;
}

.unisec-block .warranties .box:after {
	display: block;
	position: absolute;
	top: 80px;
	left: -23px;
	width: 46px;
	height: 46px;
	background: url(/images/images/doors/warranty-plus.png) no-repeat center;
	background-size: 46px 46px;
	content: '';
}

.unisec-block .warranties .box:first-child:after { display: none; }






/* COMPARE */



.compare-head {
	webkit-position: sticky;
	position: sticky;
	top: -306px;
	padding: 10px 0;
	margin-top: 40px;
	z-index: 10;
}

.compare-head:after {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 10px;
	background: rgba(256,256,256,0.7);
	content: '';
}

.compare-bg {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 120px;
	background: #f2f2f2;
}

.compare-holder {
	position: relative;
	max-width: 940px;
	margin: 0 auto;
}

.compare-holder .box {
	position: relative;
	width: 33.33%;
	float: left;
	min-height: 10px;
}

.compare-holder .wrap {
	position: relative;
	margin: 0 20px;
}

.fake-select {
	position: relative;
	width: 100%;
	height: 50px;
	z-index: 10;
}

.fake-container {
	position: absolute;
	width: 100%;
	border-radius: 4px;
	background: #fff;
	border: 1px solid #e2e2e2;
	color: #333;
	text-align: center;
	font-weight: 400;
}

.fake-container:hover {
	border-color: #c2c2c2;
}


.fake-select .selected {
	line-height: 40px;
	padding: 6px 0 2px;
	font-size: 18px;
	cursor: pointer;
}

.fake-select .selected span {
	font-weight: 900;
}

.fake-select .panel {
	display: none;
	padding: 12px 0;
	margin: 0 10px;
	border-top: 1px solid #ddd;
}

.fake-select .panel div {
	line-height: 36px;
	text-align: center;
	font-weight: 16px;
	cursor: pointer;
}

.fake-select .panel div.inact {
	opacity: 0.6;
	pointer-events: none;
}

.fake-select .panel div:hover {
	background: #f2f2f2;
}


.place-for-door {
	position: relative;
	min-height: 2px;
	margin-bottom: 10px;
}

.place-for-door .wrap {
	height: 290px;
	margin: 0 auto;
	width: 148px;
	position: relative;
	background: #e3e3e3;
	z-index: 1;
}



.place-for-door .shade, .door-mixer .shade {
	position: absolute;
	display: block;
	width: 148px;
	height: 10px;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	content: '';
	opacity: 0.6;
	box-shadow: 0 0 30px rgba(0,0,0,0.8);
	z-index: 0;
}

.place-for-door .wrap:after {
	position: absolute;
	display: block;
	width: 100%;
	height: 30px;
	left: 0;
	bottom: 0;
	background: url(/images/images/doors/doorshade.png) repeat-x left top;
	content: '';
	opacity: 0.2;
}

.place-for-door .wrap:before {
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	width:72px;
	height: 72px;
	line-height: 72px;
	border: 4px solid #fff;
	color: #fff;
	font-size: 48px;
	text-align: center;
	border-radius: 50px;
	transform: translate(-50%,-50%);
}

.place-for-door:nth-child(1) .wrap:before { content: '1' }
.place-for-door:nth-child(2) .wrap:before { content: '2' }
.place-for-door:nth-child(3) .wrap:before { content: '3' }

.place-for-door .doordisp {
	position: absolute;
	bottom:0;
	width: 100%;
	left: 0;
	display: none;
}

.place-for-door .doordisp img {
	display: block;
	width: 100%;
}





.comps { 
	position: relative;
	text-align: center;
	font-weight: 400;
	margin: 40px 0 80px;
}

.comps .infoitem {
	position: relative;
	font-size: 16px;
	line-height: 22px;
	margin-bottom: 16px;
}

.comps h2 {
	font-size: 30px;
	line-height: 36px;
	position: relative;
	overflow: hidden;
	font-weight: 500;
	letter-spacing: 0;
	margin: 36px 20px 36px;
	display: none;
}

.comps h2 .wrap {
	display: inline-block;
	margin: 0;
	padding: 0 20px;
}

.comps h2 .wrap:before,
.comps h2 .wrap:after  {
	display: block;
	position: absolute;
	top: 18px;
	width: 400px;
	height: 1px;
	background: #ddd;
	content: '';
}

.comps h2 .wrap:after { right: 100%; }
.comps h2 .wrap:before { left: 100%; }

.comps .pie { display: inline-block; margin: 12px 0 8px; }
.comps .pie div { transform: scale(1.2) }

.comps .largenum {
	font-size: 48px;
	line-height: 48px;
	font-family: 'Oswald';
	font-weight: 700;
	letter-spacing: -1px;
	margin: 6px 0;
}

.comps .largenum span {
	font-size: 18px;
	font-family: 'Oswald';
	font-weight: 400;
	letter-spacing: 0;
}

.comps .piped {
	position: relative;
	display: inline-block;
}

.comps .piped:after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: -30px;
	width: 20px;
	height: 20px;
	background: url(/images/images/doors/pipe.png) no-repeat right center;
	content: '';
}

.doors .comps a.button {
	display: inline-block;
	width: 180px;
	padding: 12px 32px 8px;
	font-size: 16px;
	margin: 0;
}

.COMP .bread { position: relative }




.doors .door-similars {
	margin: 0 0 0 32px;
	/*padding: 12px 0;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;*/
	font-weight: 400;
	color: #999;
	text-align: left;
	display: inline-block;
}

.doors .door-similars a {
	text-align: left;
}

.doors .door-similars span {
	margin-righ: 12px;
}




.doors .door-overview {
	max-width: 1040px;
	position: relative;
	margin: 100px auto 0;
	text-align: left;
	/*border-bottom: 1px dashed #ccc;*/
	
}



.door-left {
	min-height: 10px;
	width: 340px;
	float: right;
}

.door-right {
	width: 700px;
	float: right;
}


.doors .door-overview header {
	text-align: left;
	margin: 0;
}

.doors .door-overview .showmore  {
	display: none
}

.door-overview .doortitle {
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 700;
	margin: 32px 0;
	padding-left: 24px;
	border-left: 6px solid var(--green);
}


.doors .door-overview header { padding: 0;  }

.door-overview header h1 {
	font-size: 42px;
	letter-spacing: -1px;
	line-height: 48px;
	font-weight: 700;
}

.door-overview header p {
	font-size: 17px;
	line-height:28px;
	font-weight: 300;
	margin-top: 32px;
}

.door-overview header p a {
	font-size: 15px;
	line-height:28px;
}

.door-overview header p.morecont {
	display: none;
	margin-top: 0;
	font-weight: 300;
	font-size: 16px;
	line-height: 26px;
	
}

.door-overview .pie { padding: 4px 0 10px }
.door-overview .pie > div {
	margin-left: 15px;
	vertical-align: top;
	transform: scale(1.2);
}

/*.door-overview .pie:before {
	display: block;
	position: absolute;
	top: -20px;
	left: -20px;
	width: 28px;
	height: 28px;
	border-radius: 16px;
	border: 2px solid #ddd;
	content: '?';
	color: #999;
	line-height: 28px;
	text-align: center;
}*/

.door-overview .displayer {
	text-align: right;
	font-weight: 400;
}

.door-overview .displayer .item {
	margin: 16px 0;
	position: relative;
	line-height: 22px;
	font-size: 15px;
}

.door-overview .displayer .item.locks { overflow: hidden }
.door-overview .displayer .item.locks span {
	display: block;
	float: right;
	margin-left: 12px;
	font-size: 48px;
	line-height: 48px;
	font-weight: 700;
	font-family: 'Oswald';
	letter-spacing: -1px;
}

.door-overview .displayer .piped {
	background: url(/images/images/doors/pipe.png) no-repeat right center;
	padding: 4px 30px 4px;
}


.doors .sepline {
	height: 1px;
	background: #ddd;
}

.door-overview .price {
	margin: 6px 0;
	text-transform: none;
	color: var(--green);
	font-size: 18px;
}

.door-overview .price span {
	color: var(--green);
}

.door-overview .price, .door-overview .price-details {
	display: inline-block;
}

.door-overview .price-details {
	position: relative;
}

.door-overview .price, .door-overview .price-details .star {
	color: var(--green);
	cursor: pointer;
}

.door-overview .price-details .panel {
	display: none;
	position: absolute;
	bottom: 100%;
	left: -60px;
	width: 200px;
	margin-bottom: 10px;
	padding: 6px 12px;
	background: #f9f9f9;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 4px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 400;
	text-transform: none;
}




.door-overview .buttonset {
	margin: 40px 0 100px;
	text-align: center;
}

.door-overview .buttonset .button {
	padding: 8px 0;
	width: 240px;
}

.door-overview .door-left .buttonset {
	display: none;
}









.mixer-order {
	position: relative;
	font-weight: 400;
	font-size: 16px;
	margin-top: 32px;
	
}

.mixer-order .button {
	border-radius: 4px;
	vertical-align: middle;
	text-align: center;
	color: #fff;
	border: 1px solid #fff;
	padding: 6px 24px 4px;
	margin: 0 0 0 20px;
	background: #8dc63f;
}


.door-mixer {
	position: relative;
	background: #eee;
	margin-top: 70px;
	padding: 0 0 0;
	border-bottom: 8px solid #dedede;
}


.door-mixer .door-right {
	position: relative;
	float: left;
}



.door-mixer .door-left {
	position: webkit-sticky;
	position: sticky;
	top: 120px;
	margin-top: -60px;
	float: left;
}

.door-mixer .container {
	max-width: 1040px;
	margin: 0 auto;
	padding-bottom: 100px;
}

.door-mixer .wrap {
	margin: 0 40px;
}

.door-mixer .doordisp {
	position: relative;
	z-index: 1;
}

.door-mixer .doordisp .shade,
.popup-panel .door-viewer .wrap .shade {
	position: absolute;
	left: 0;
	bottom: 0;
	display: block;
	width: 100%;
	opacity: 1;
	transform: translate(0)
}

.duo-T .door-mixer .shade {
	width: 137%;
}


.door-mixer .doordisp img {
	position: relative;
	display: block;
	width: 100%;
}

.door-mixer .doordisp .image {
	position: relative;
	display: block;
	width: 100%;
}

.door-mixer .doordisp .image img {
	position: relative;
	display: block;
	width: 100%;
	height: auto;
}

.door-mixer .doordisp .image > img {
	z-index: 0;
}




.door-mixer .doordisp .badge {
	position: absolute;
	display: block;
	top: 52px;
	left: 32px;
	z-index: 2;
}

.door-mixer .doordisp .badge div {
	transform: scale(1.2);
	margin-bottom: 32px;
}




.doors .letsplan {
	margin: 72px 0 24px;
}

.doors .letsplan h2 {
	margin-bottom: 8px;
	padding-bottom: 0;
}

.doors .letsplan p {
	margin: 6px 0;
	font-weight: 300;
}

.door-mixer .buttonset {
	overflow: hidden;
	margin-top: -8px;
}

.door-mixer .buttonset .button {
	margin-top: 30px;
	display: none;
}

.mixer-counter {
	margin-top: 12px;
	font-size: 13px;
	text-align: center;
	width: 100%;
	height: auto;
	padding-bottom: 0;
	height: 24px;
}

.mixer-counter span {
	display: inline-block;
	margin: 0 0;
	width: 20px;
	font-weight: 400;
}

.mixer-counter div.designact { text-align: right }
.mixer-counter div.designall { text-align: left }



.mixer-plate {
	text-align: left;
	position: relative;
	padding: 0 0 12px;
}


.mixer-plate .box {
	position: relative;
	display: inline-block;
	margin: 2px;
}
.mixer-plate.colors .box { width: 48px; height: 48px; }


.mixer-plate .box.for-door-plus:after,
.mixer-designs .box.for-door-plus:after { 
	position: absolute;
	top: -8px;
	right: -2px;
	width: 20px;
	height: 20px;
	border-radius: 14px;
	background: #aaa url(/images/images/doors/plus-white.png) no-repeat center;	
	content: '';
	border: 2px solid #ededed;
	z-index: 10;
}

.mixer-designs .box.for-door-plus:after { 
	right: auto; 
	left: -8px;
	top: -12px;
	width: 24px;
	height: 24px;
}

.door-mixer .mixer-plate img {
	display: block;
	width: 100%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}


.mixer-plate .box > div {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}


.mixer-designs {
	position: relative;
	width: 70px;
	padding: 0 20px;
	float: left;
	margin-right: 60px;
}

.propdisp {
	position: relative;
	margin: 8px 0;
	padding-left: 20px;
	padding-right: 120px;
}

.propdisp:before {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 6px;
	height: 6px;
	background: #999;
	content: '';
	border-radius: 8px;
}

.propdisp > div {
	display: inline-block;
	font-weight: 500;
}

.propdisp > span {
	display: inline-block;
	font-weight: 400;
	color: #999;
	width: 50px;
}

.propdisp .showall {
	display: block;
	position: absolute;
	top: -2px;
	right: 0;
	font-size: 12px;
	padding: 1px 18px;
	border-radius: 20px;
	cursor: pointer;
	color: #fff;
	background: var(--green);
	width: 80px;
	text-align: center;
}





.mixer-designs .designs {
	position: relative;
	width: 60px;
	height: 120px;
	border: 1px solid #aaa;
	padding: 4px;
	
}

.mixer-designs .designs .box {
	display: none;
	width: 100%;
	height: 100%;
	position: relative;
	width: 60px;
	height: 120px;
	border-radius: 3px;
	transform: scaleX(-1)
}

.mixer-designs .designs .box.active {
	display: block;
}

.mixer-designs .designs .box > div {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.mixer-designs .designs .box img {
	display: block;
	width: 100%;
	height: 100%;
}


.mixer-designs .mixer-next,
.mixer-designs .mixer-prev {
	position: absolute;
	top: 40px;
	width: 40px;
	height: 40px;
	cursor: pointer;
	background: url(/images/images/doors/trd-ce.png) no-repeat center;
}

.mixer-designs .mixer-next { right: -20px; transform: rotate(-90deg)  }
.mixer-designs .mixer-prev { left: -20px; transform: rotate(90deg) }




.duo-T .door-mixer .door-right .wrap { padding-left: 60px }
.duo-T.hideduo .door-mixer .door-right .wrap { padding-left: 0 }



/*.DUO { display: none }
.duo-T .DUO {
	position: absolute;
	top: 0;
	right: -37%;
	width: 37%;
	height: 100%;
	background: #333
}*/







.doors .AREA, .doors .AREA div  {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.doors.duo-T .AREA div.DUO {
	position: absolute;
	top: 0;
	left: 100%;
	width: 37%;
	height: 100%;
}







.door-mixer .doordisp { padding-top: 210%; width: 100%; background: #24242b; }
 
.doors .AREA .frame { background: url(/images/images/door/frame.png) no-repeat top left;  background-size: 100% 100%; }
.doors.duo-T .AREA .frame { background: url(/images/images/door/frame.png) no-repeat top left;  background-size: 106% 100%; }
.doors.duo-T .AREA .duoframe { background: url(/images/images/door/frame.png) no-repeat top right;  background-size: 260% 100%; width: 37%; right: -37%; left: auto; border-left: 4px solid rgba(0,0,0,0.4) }

.doors .AREA .handy.rounded { background: url(/images/images/door/handy-rounded.png) no-repeat top left;  background-size: 100% 100%;  }
.doors .AREA .handy.oval { background: url(/images/images/door/handy-oval.png) no-repeat top left;  background-size: 100% 100%;  }
.doors .AREA .handy.square { background: url(/images/images/door/handy-square.png) no-repeat top left;  background-size: 100% 100%;  }


.doors .AREA .light { background: url(/images/images/door/light5.png) no-repeat top left; background-size: 100% 100%; opacity: 1 }

.doors .AREA .des { background-position: top left; background-repeat: no-repeat; background-size: 100% 100%; transform: scaleX(-1)  }
.doors .AREA .face { opacity: 0.7 }
.doors .AREA .wind { opacity: 1;  }

.doors .AREA .col { background-repeat: repeat; background-position: top; background-size: 100% auto; }
.doors.duo-T .AREA .col { background-repeat: repeat; background-position: top; background-size: 70% auto; }


.doors.duo-T .AREA div.light,
.doors.duo-T .AREA div.col  {
	width: 137%;
}

.doors .T .handy { display: none }








.doors .DOOR:after,
.popup-panel .door-viewer .wrap:after  {
	position: absolute;
	display: block;
	width: 100%;
	height: 60px;
	left: 0;
	bottom: 0;
	background: url(/images/images/doors/doorshade.png) repeat-x left top;
	background-size: auto 100%;
	content: '';
	opacity: 0.6;
}

.doors.duo-T .DOOR:after { width: 137% }


.popup-panel .door-viewer {
	display: inline-block;
	margin: 6px 14px;
	
}

.popup-panel .door-viewer .wrap {
	height: 208px;
	width: 104px;
	margin: 0;
	position: relative;
	background: #ddd;
	border: 6px solid #eee;
	border-radius: 3px;
}


.popup-panel .door-viewer.duo-viewer .wrap {
	height: 208px;
	width: 37px;
	margin: 0;
	position: relative;
	background: #ddd;
	border: 6px solid #eee;
	border-radius: 3px;
}

.popup-panel .door-viewer span {
	margin: 2px 0 10px;
	font-size: 13px;
	font-weight: 400;
	text-align: center;
	display: block;
}

.popup-panel .door-viewer .wrap > div {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.popup-panel .door-viewer .color,
.popup-panel .door-viewer .des {
	background-position: left top;
	background-repeat: repeat-y;
	background-size: 100% auto
}

.popup-panel .door-viewer .des {
	background-position: left top;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	transform: scaleX(-1) ;
}

.popup-panel .door-viewer .handy.oval { background: url(/images/images/door/handy-oval.png) no-repeat top left;  background-size: 100% 100%;  }
.popup-panel .door-viewer .handy.square { background: url(/images/images/door/handy-square.png) no-repeat top left;  background-size: 100% 100%;  }
.popup-panel .door-viewer .handy.rounded { background: url(/images/images/door/handy-rounded.png) no-repeat top left;  background-size: 100% 100%;  }

.popup-panel .door-viewer .frame { background: url(/images/images/door/light5.png) no-repeat top left; background-size: 100% 100%; }
.popup-panel .door-viewer .handy { background: url(/images/images/door/handy2.png) no-repeat top left;  background-size: 100% 100%;  }
.popup-panel .door-viewer .handy.T { display: none }

.doorview .popup-content {
	margin: 60px 0;
}



.color-only .desdisp,
.color-only .mixer-designs,
.color-only .coldisp .showall {
	display: none;
}



.doors .mixer-disp .disp div {
	font-size: 15px;
	margin-top: 8px;
	color: #555;
}

.doors .mixer-disp .disp div a {
	font-weight: 600;
	color: #555;
}

.doors .door-mixer .for-plus-only, .doors .door-mixer .help-text {
	margin-top: 4px;
	font-size: 14px;
	color: #666;
}

.doors .door-mixer .for-handy-T {
	margin-top: 4px;
	font-size: 14px;
	color: #666;
	display: none;
}

.doors .door-mixer .sep {
	border-top: 1px dotted #bbb;
	margin: 16px 0;
}

.doors .T .for-handy-T { display: block }


.doors .door-mixer.for-door-plus .for-plus-only {
	display: block;
}

.doors .door-mixer .for-plus-only ,
.doors .door-mixer.for-door-plus .help-text {
	display: none;
}

.doors .door-mixer .for-plus-only a {
	display: inline-block;
	font-weight: 700;
	color: #666;
	font-style: normal;
}





.door-plus {
	position: relative;
	background: url(/images/images/doors/wtg-gradient.png) repeat-x left bottom;
	text-align: center;
	padding: 120px 0 96px;
}

.door-plus .container {
	max-width: 1040px;
	margin: 0 auto;
}

.door-plus:before {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 80px;
	height: 40px;
	background: url(/images/images/doors/trd-de.png) no-repeat center -2px;
	background-size: 60px auto;
	content: '';
}

.door-plus .plushead {
	margin: 0 auto 70px;
	max-width: 560px;
}

.door-plus .col-50 {
	text-align: left;
	flex: 1;
	padding-bottom: 90px;
	position: relative;
}

.door-plus .col-50 .wrap {
	position: relative;
}

.door-plus .col-50 .pricing {
	position: absolute;
	left: 0;;
	bottom: 0;
	width: 100%;
	text-align: center;
}

.door-plus .col-50.l { margin-left: -1px; border-right: 1px solid #ddd; }
.door-plus .col-50.r { margin-left: -1px; border-left: 1px solid #ddd; }


.doors .arrow-down {
	position: relative;
	display: flex;
}

.doors .arrow-down:after {
	position: absolute;
	bottom: -40px;
	left: 50%;
	transform: translateX(-50%);
	width: 60px;
	height: 30px;
	background: url(/images/images/doors/trd-ce.png) no-repeat center -1px;
	background-size: 40px auto;
	content: '';
}

.more-extra {
	margin: 60px auto 0;
	max-width: 560px;
	display: none;
}

.more-extra p {
	font-weight: 500;
	text-align: center;
}

.more-extra p span {
	display: block;
}





.door-plus .box {
	display: inline-block;
	vertical-align: middle;
	padding: 0;
	margin: 0;
	text-align: left;
}

.door-plus .textbox {
	font-size: 15px;
	line-height: 24px;
	width: 580px;
}

.door-plus .plusbox {
	font-size: 15px;
	line-height: 24px;
	width: 460px;
}

.door-plus .textbox h2 {
	margin-bottom: 32px;
}

.door-plus .textbox .wrap div {
	margin: 16px 0;
}


.door-plus .textbox .wrap div b {
	font-weight: 500;
}

.door-plus .col-50 > .wrap {
	margin: 0 40px;
}


.door-plus .pluspack {
	border-radius: 8px;
	text-align: center;
	margin: 0;
}

.door-plus .pluspack .topwrap {
	padding: 20px 20px 20px;
}


.pluspack .label {
	position: relative;
	font-size: 24px;
	font-weight: 700;
	padding-bottom: 40px;
}

.pluspack .label:after {
	position: absolute;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	width: 40px;
	height: 3px;
	background: #666;
	content: '';
}

.doors .pluspack .piped {
	background: url(/images/images/doors/pipe.png) no-repeat left center;
	padding: 12px 0 12px 32px;
	border-bottom: 1px dotted #ccc;
	margin-bottom: 12px;
	font-size: 14px;
	text-align: left;
	font-weight: 400;
	color: #444;
}

.doors .pluspack .features > div,
.features.fextra > div  {
	display: block;
	background: url(/images/images/doors/plus-green.png) no-repeat left -1px;
	text-align: left;
	font-size: 14px;
	padding-left: 32px;
	font-weight: 400;
	margin-bottom: 8px;
	color: #444;
	position: relative;
}

.doors .pluspack .features.fpipe { margin-top: 12px; }
.doors .pluspack .features.fpipe > div {
	background: url(/images/images/doors/pipe.png) no-repeat left 0;
}


.features.fplus > div,
.features.fextra > div  {
	background: url(/images/images/doors/plus-green.png) no-repeat left -1px;
	cursor: pointer;
	color: #8dc63f;
	text-align: left;
	padding-right: 60px;
}

.features.fextra {
	max-width: 360px;
	margin: 20px auto 0;
}

.features.fextra > div { border-bottom: 1px dotted #bbb; margin-top: 4px; padding-bottom: 4px; }

.doors .pluspack .features > div .price,
.features.fextra > div .price {
	position: absolute;
	top: 0;
	right: 0;
	color: #999;
	font-size: 14px;
	line-height: 24px;
	white-space: nowrap;
	margin: 0;
}

.doors .pluspack .features > div .price span
.features.fextra > div .price span {
	margin: 0;
	padding: 0;
	font-size: 14px;
	color: #666;
	font-weight: 500;
}

.features.fplus div:hover span,
.features.extra div:hover span { color: #8dc63f }

.doors .pluspack .plustotal,
.doors .pluspack .realtotal {
	position: relative;
	margin: 6px 0 12px;
	padding: 6px 0;
	font-size: 14px;
	color: #999;
	text-align: right;
	border-top: 1px dotted #ccc;
	border-bottom: 1px dotted #ccc;
}

.doors .pluspack .plustotal { margin-bottom: 0 }
.doors .pluspack .realtotal {
	border-top: none;
	margin-top: 0;
}

.doors .pluspack .plustotal span,
.doors .pluspack .realtotal span {
	font-size: 15px;
	font-weight: 500;
	color: #444;
}

.doors .pluspack .realtotal span { text-decoration: line-through }

.doors .pluspack .plustotal div,
.doors .pluspack .realtotal div {
	position: absolute;
	top: 6px;
	left: 0;
}

.doors .pluspack .plustext {
	font-size: 14px;
	font-weight: 300;
	color: #8dc63f;
	line-height: 22px;
	margin: 24px 0px -10px 0px;
	position: relative;
}




.doors .pluspack .discounts {
	font-size: 15px;
	font-weight: 500;
	color: #8dc63f;
	display: inline-block;
	margin: 0;
	padding: 0;
	line-height: 22px;
}

.doors .pluspack .discounts span {
	font-size: 15px;
	font-weight: 600;
	color: #8dc63f;
}






.doors .pluspack .price.plusprice span { color: #8dc63f; }
.doors .pluspack a.button { margin-top: 0 }



.doors .pluspack .price.plusprice {
	display: block;
	overflow: hidden;
	color: #8dc63f;
	text-align: center;
	font-size: 18px;
	padding: 0;
	position: relative;
	line-height: 48px;
	margin: 0;
}





.door-features {
	position: relative;
	max-width: 980px;
	margin: 0 auto;
	min-height: 620px;
}

.door-features .baseimg {
	width: 320px;
	position: absolute;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 0;
}

.door-features .baseimg img {
	display: block;
	width: 100%;
}

.door-features .features {
	position: relative;
	z-index: 1;
	width: 50%;
}

.door-features .left { float: left; min-height: 520px; }
.door-features .right { float: right; min-height: 520px; }

.door-features .left .wrap {
	position: relative;
	margin: 0 180px 0 20px;
}

.door-features .right .wrap {
	position: relative;
	margin: 0 20px 0 180px;
}

.door-features .box { 
	position: relative;
	height: 80px;
	cursor: pointer;
}

.door-features .box .image { 
	display: block; 
	position: absolute;
	top: 0;
	background: #fff;
}

.door-features .left .box .image { left: 0 }
.door-features .right .box .image { right: 0 }

.door-features .box .image div { 
	position: relative;
	width: 96px;
	height: 62px;
	border: 4px solid #fff;
	overflow: hidden;
}

.door-features .left .box .image { border-right: 6px solid #555; }
.door-features .right .box .image { border-left: 6px solid #555; }

.door-features .box .image img { 
	display: block;
	width: 100%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}

.door-features .box .title { 
	position: relative;
	display: block;
	height: 64px;
	border-bottom: 1px solid #aaa;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: normal;
	font-weight: 400;
}

.door-features .left .box .title { margin-left: 124px; text-align: left }
.door-features .right .box .title { margin-right: 124px; text-align: right }

.door-features .box .title div { 
	position: absolute;
	bottom: 6px;
	width: 80%;
}

.door-features .left .box .title div { left: 0 }
.door-features .right .box .title div { right: 0 }

.door-features .left .box:nth-child(7) { margin-right: -100px; margin-left: 60px;  }
.door-features .left .box:nth-child(7) .title { border-right: 1px solid #ccc }

.door-features .left .box:nth-child(8) { margin-right: -160px; margin-left: 120px;  }
.door-features .left .box:nth-child(8) .title { border-right: 1px solid #ccc }

.door-features .right .box:nth-child(7) { margin-left: -100px; margin-right: 60px;  }
.door-features .right .box:nth-child(7) .title { border-left: 1px solid #ccc }

.door-features .right .box:nth-child(8) { margin-left: -160px; margin-right: 120px;  }
.door-features .right .box:nth-child(8) .title { border-left: 1px solid #ccc }


.door-features .box.for-plus:after { 
	position: absolute;
	top: -10px;
	width: 24px;
	height: 24px;
	border-radius: 14px;
	background: #82b73a url(/images/images/doors/plus-white.png) no-repeat center top;	
	content: '';
	border: 2px solid #fff;
}

.door-features .left .box.for-plus:after { left: -10px }
.door-features .right .box.for-plus:after { right: -10px }

.door-features .infotext {
	display: block;
	text-transform: none;
	max-width: 560px;
	margin: 0px auto;
	padding: 36px 20px;
}




.doors .hiddenblock {
	padding: 80px 0;
	background: #ededed;
}

.doors .hiddensep {
	height: 20px;
	display: none;
	background: #dedede;
}

.doors .hiddenline {
	background: #dedede;
	position: relative;
	font-size: 15px;
	text-transform: uppercase;
	text-align: center;
}

.doors .hiddenline .hiddennav {
	padding: 30px 20px;
	display: inline-block;
	padding-right: 60px;
	line-height: 30px;
	width: auto;
	position: relative;
	cursor: pointer;
	font-weight: 700;
	font-size: 18px;
}

.doors .hiddenline .hiddennav div {
	height: 40px;
	width: auto;
	background: url(/images/images/site/details3.png) no-repeat center;
	background-size: 200px auto;
	margin: -10px 0 4px;
}

/*.doors .hiddenline:after {
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	content: '';
	height: 20px;
	width: 40px;
	background: url(/images/images/doors/trd-de.png) no-repeat center top;
}*/


.doors .hiddenline .hiddennav:after {
	position: absolute;
	top: 50%;
	margin-top: -2px;
	right: 20px;
	width: 30px;
	height: 30px;
	background: #fff url(/images/images/doors/learn-more.png) no-repeat center;
	background-size: 100%;
	content: '';
	opacity: 0.4;
	border-radius: 30px;
	transition: all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
}

.doors .hiddenline .hiddennav.active:after {
	opacity: 0.8;
	transform: rotate(45deg);
}

.doors .hiddenline .hiddennav div {
	display: block;
	font-size: 16px;
	font-weight: 500;
}






.popup-hider {
	display: none;
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	z-index: 10000;
}

.popup-close {
	position: fixed;
	top: 5px;
	right:20px;
	transform: rotate(45deg);
	width: 36px;
	height: 36px;
	background: url(/images/images/doors/learn-more.png) no-repeat center;
	background-size: 100%;
	opacity: 0.4;
	border-radius: 30px;
	transition: all 0.2s ease-out;
	-webkit-transition: all 0.2s ease-out;
	cursor: pointer;
	z-index: 1000;
}

.popup-close:hover {
	transform: rotate(135deg);
	opacity: 0.7;
}

.popup-panel {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	background: #fff;
	box-shadow: 0 0 20px rgba(0,0,0,0.2);
	overflow-y: scroll;
	overflow-x: hidden;
}


.popup-panel-in { width: 560px }
.popup-panel-in.largepan { width: 820px }

.popup-head {
	padding: 40px 0 0;
	font-size: 15px;
	line-height: 22px;
	position: relative;
}



.popup-panel .subtitle {
	margin-top: 4px;
	font-size: 20px;
	line-height: 30px;
	font-weight: 300;
	text-transform: none;
}

.popup-bread {
	text-transform: uppercase;
	font-weight: 400;
	padding: 20px 0 10px;
	margin-left: -40px;
	background: rgba(256,256,256,0.9);
	position: sticky;
	-webkit-position: sticky;
	top: 0;
	z-index: 1000;
}

.popup-hider .wrap {
	position: relative;
	margin: 0 40px;
}

.popup-hider  .popup-panel-in > .wrap {
	margin: 0 60px;
}


.popup-hider h2 {
	font-size: 30px;
	line-height: 36px;
	font-weight: 700;
}

.popup-hider h2 div, .popup-hider h2 span {
	display: inline-block;
}

.popup-hider h2 span { 
	font-size: 16px; 
	line-height: 24px;
	margin-left: 10px; 
}

.popup-hider h2.large {
	font-size: 56px;
	line-height: 56px;
	font-weight: 900;
}

.popup-hider h2.large.num div {
	letter-spacing: -3px;
}


.popup-content {
	font-size: 15px;
	line-height: 24px;
	padding: 0 0 40px;
	position: relative;
	z-index: 100;
}

.popup-content .lead {
	font-weight: 400;
	font-size: 15px;
	line-height: 22px;
	margin-bottom: 24px;
}

.popup-content p {
	margin: 12px 0;
}

.popup-panel .image, .popup-panel .imagefull {
	position: relative;
}

.popup-panel .image img, .popup-panel .imagefull img {
	display: block;
	width: 100%;
}

.popup-panel .icodisp {
	margin: 20px 0;
	padding-left: 52px;
	min-height: 40px;
	font-size: 14px;
	line-height: 20px;
	position: relative;
}

.popup-panel .time15 {
	background: url(/images/images/doors/time15.png) no-repeat left top;
	background-size: 40px 40px;
}

.popup-panel .locker {
	background: url(/images/images/doors/locker.png) no-repeat left top;
	background-size: 40px 40px;
}

/*.popup-panel .icodisp.minutes {
	background: url(/images/images/doors/ico-minutes-20.png) no-repeat left top;
	background-size: 48px 48px;
}*/

.popup-panel .icodisp span {
	display: block;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	margin-bottom: 6px;
	padding-top: 10px;
}


.popup-panel .sep {
	margin: 24px 0;
	height: 0;
	height: 1px;
	border-bottom: 1px dotted #bbb;
}

.popup-panel .buttonset {
	margin-top: -12px;
}

.popup-panel .buttonset a.button {
	margin-left: 0;
}

.tempdisp {
	margin-top: 32px;
	font-size: 13px;
}

.tempdisp .line {
	position: relative;
	margin-bottom: 2px;
	padding: 4px 12px;
	background: #eee;
	font-weight: 400;
	color: rgba(0,0,0,0.7)
}

.tempdisp .line span {
	display: block;
	position: absolute;
	top: 6px;
	right: 12px;
	font-weight: 500;
}

.tempdisp .line.active {
	background:  #82b73a;
	color: #fff;
}


.tempdisp .line:nth-child(1) { margin-right: 50% }
.tempdisp .line:nth-child(2) { margin-right: 40% }
.tempdisp .line:nth-child(3) { margin-right: 25% }
.tempdisp .line:nth-child(4) { margin-right: 0 }


.popup-panel .scalehead {
	height: 2px;
	background: #ccc;
	position: relative;
	margin: 60px 0 20px 8px;
}

.popup-panel .scalehead:before, .popup-panel .scalehead:after {
	position: absolute;
	top: 1px;
	transform: translateY(-50%);
	width: 12px;
	height: 12px;
	border: 2px solid #fff;
	border-radius: 10px;
	background: #82b73a;
	content: '';
	z-index: 1;
}

.popup-panel .scalehead:before {
	left: -8px;
}

.popup-panel .scalehead:after {
	right: -8px;
}


.popup-panel .scalehead .dspl, .popup-panel .scalehead  .dspr {
	position: absolute;
	bottom: 16px;
	color: #555;
	font-size: 18px;
	font-weight: 400;
	line-height: 24px;
	font-family: 'Oswald';
}

.popup-panel .scalehead  .dspl { left: -8px }
.popup-panel .scalehead  .dspr { right: -8px }

.popup-panel .scalehead  .sign {
	position: absolute;
	bottom: -14px;
	width: 4px;
	height: 26px;
	border: 2px solid #fff;
	border-radius: 10px;
	background: #82b73a;
	transform: translateX(-50%);
}

	


.leftright {
	position: relative;
}

.popup-panel-in .image {
	max-width: 160px;
	float: left;
	position: relative;
	margin-right: 40px;
}

.popup-panel-in.largepan .image {
	width: 340px;
	float: left;
	position: relative;
	margin-right: 20px;
}


.popup-panel-in .image img {
	width: 100%;
	display: block;
}

.popup-panel-in .texthold {
	display: block;
	overflow: hidden;
	margin-top: 40px;
}

.popup-panel .list div {
	position: relative;
	margin-bottom: 20px;
	padding-left: 48px;
	font-size: 15px;
	line-height: 22px;
	font-weight: 400;
}

.popup-panel .list div:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 28px;
	height: 28px;
	line-height: 28px;
	font-size: 20px;
	text-align: center;
	font-weight: 500;
	border: 2px solid #82b73a;
	color: #82b73a;
	border-radius: 20px;
}

.popup-panel .list div:nth-child(1):before { content: '1' }
.popup-panel .list div:nth-child(2):before { content: '2' }
.popup-panel .list div:nth-child(3):before { content: '3' }
.popup-panel .list div:nth-child(4):before { content: '4' }

.popup-head.centerhead {
	position: relative;
}

.topsect {
	margin: 20px 0 -10px;
}

.popup-panel .spipe  {
	position: relative;
	padding-left: 32px;
	font-size: 15px;
	line-height: 24px;
	position: relative;
	background: url(/images/images/doors/pipe.png) no-repeat left center;
	margin: 2px 0;
	font-weight: 400;
}


.popup-panel .piped, .popup-panel .plusd  {
	position: relative;
	padding-left: 48px;
	font-size: 15px;
	line-height: 24px;
	position: relative;
}

.popup-panel .piped:before, .popup-panel .plusd:before  {
	position: absolute;
	left: 0;
	top: -3px;
	content: '';
	border: 2px solid  #8dc63f;
	border-radius: 20px;
	width: 26px;
	height: 26px;
}


.popup-panel .piped:before  {
	background: url(/images/images/doors/pipe.png) no-repeat 0 center;
}

.popup-panel .plusd:before  {
	background: url(/images/images/doors/plus-green.png) no-repeat center;
}

.popup-panel .featurepan .price {
	display: inline-block;
	font-weight: 700;
}

.popup-panel .rc-scale {
	position: absolute;
	top: 20px;
	right: 0;
}

.popup-panel .rc-scale div {
	display: inline-block;
	font-size: 24px;
	line-height: 36px;
	letter-spacing: -1px;
	font-weight: 400;
	font-family: 'Oswald';
	margin: 0 6px;
	color: #999;
}

.popup-panel .rc-scale div.active {
	border-bottom: 4px solid #82b73a;
	color: #82b73a;
}





.getofferline {
	max-width: 1040px;
	margin: 60px auto;
	padding: 48px 0 0;
	border-top: 1px solid #ddd;
	text-align: center;
}

.getofferline h3 {
	font-size: 18px;
	text-transform: uppercase;
	margin-bottom: 24px;
	font-weight: 500;
}




.doors .featurelist .box h2 {
	font-size: 21px;
	line-height: 30px;
	font-weight: 500;
	letter-spacing: normal;
	margin-bottom: 10px;
}

.doors .featurelist .box p.intro {
	margin: 0;
}

.doors .featurelist .box h2:after {
	display: none;
}

.doors .featurelist .box .price {
	margin: 10px 0;
	color: #82b73a;
}

.doors .featurelist .box .price span {
	color: #82b73a;
}




.cbox {
	max-width: 360px;
	display: inline-block;
	vertical-align: top;
	text-align: left;
}

.unibadge {
	margin: 0 auto;
	width: 280px;
	position: relative;
}

.unibadge img {
	display: block;
	width: 100%;
}

.xtrabadge:after {
	position: absolute;
	top: -32px;
	right: -24px;
	width: 96px;
	height: 96px;
	background: url(/images/images/site/xtra-badge.png) no-repeat center;
	background-size: 100%;
	content: '';
}