/** ----------------------------------------------------------
 *
 * Contains the main layout of the page and the individual styles.
 * Acts as the main stylesheet for theme.
 *
 *		Include your notes or table of contents below....
 *		Include color hex's or values of your grid
 *
 *		1. OOCSS GRID
 *		2. MAIN LAYOUT
 *		3. HEADER
 *			- Brand
 *			- Search Form
 *		4. Navigation
 *			- Primary Navigation
 *			- tablet Navigation
 *			- Secondary Navigation
 *			- Secondary Nav 2-5 Levels deep
 *		5. Mixed
 *		6. Footer
 *		7. Page Specific Layout
 *			- Homepage
 *			- Search Results
 *		8. Device and Responsive Layout
 *			- Breakpoint 960px
 *			- Breakpoint 640px
 *				- Search Form
 *				- Main Content
 *		9. Print Styles
 *			- Simple Theme custom print styles
 *
 * @author Your Name <email@silverstripe.com>
 * ------------------------------------------------------- */

/* OOCSS Grid
* https://github.com/stubbornella/oocss/wiki/grids
*/
@font-face {
	font-family: 'DINPro-Regular';

	src: url('../webfonts/DINPro-Regular.ttf');
	src: url('../webfonts/DINPro-Regular.eot?#iefix')
             format('embedded-opentype'),
         url('../webfonts/DINPro-Regular.eot.otf') format('otf');
}

@font-face {
	font-family: 'DINPro-Bold';
	font-weight: bold;

	src: url('../webfonts/DINPro-Bold.ttf');
	src: url('../webfonts/DINPro-Bold.eot?#iefix')
             format('embedded-opentype'),
         url('../webfonts/DINPro-Bold.eot.otf') format('otf');
}

/* MAIN LAYOUT */
html {
	height: 100%;
	overflow: hidden;
	font-size:100%;		/* by jacopo */
}

body {
    margin: auto !important;
    background: #fff;
    height: 100%;
	width: 100%;
    -webkit-text-size-adjust: none; /* The text size is not adjusted for Safari on iPhone */
    -moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	font-family: 'DINPro';
}

.text-bold {
	font-family: 'DINPro-Bold' !important;
}

.tooltip2 {
    position: relative;
    display: inline-block;
}

.compareCellSmall .tooltiptext,
.tooltip2 .tooltiptext {
    visibility: hidden;
    width: 260px;
    background-color: #0071BB;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 10px 10px;
    position: absolute;
    bottom: 125%;
    left: 21%;
    margin-left: -10px;
    opacity: .9;
    font-family: 'DINPro-Regular';
    font-size: 16px;
    /* text-align: justify; */
    z-index: 9999999999999999 !important;
}

.compareCellSmall .tooltiptext::after,
.tooltip2 .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 21px;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #555 transparent transparent transparent;
}

.compareCellSmall:hover .tooltiptext,
.tooltip2:hover .tooltiptext {
    visibility: visible;
}

.compareCellSmall.blue,
.tooltip2.blue{
	color: #0071BB;
}

.compareCellSmall .tooltiptext.step,
.tooltip2 .tooltiptext.step{
	width: 223px;
	height: auto;
	font-family: 'DINPro-Regular';
}
.tooltip2 .tooltiptext.step.pos2{
	margin-left: -54px;
}
.tooltip2 .tooltiptext.step.pos2::after{
	margin-left: 40px;
}
.tooltip2 .tooltiptext.step.pos3{
margin-left: -98px;
}
.tooltip2 .tooltiptext.step.pos3::after{
	margin-left: 85px;
}
.tooltip2 .tooltiptext.step.pos4{
margin-left: -142px;
}
.tooltip2 .tooltiptext.step.pos4::after{
	margin-left: 125px;
}
.tooltip2 .tooltiptext.step.pos5{
margin-left: -186px;
}
.tooltip2 .tooltiptext.step.pos5::after{
	margin-left: 170px;
}

.tooltip2.centered .tooltiptext{
	left: 50%;
    margin-left: -121px;
}
.tooltip2.centered .tooltiptext::after{
    margin-left: 95px;
}

.tooltip2.left-centered .tooltiptext{
	left: 50%;
    margin-left: -56px;
	text-align: left;
}
.tooltip2.left-centered .tooltiptext::after{
    margin-left: 30px;
}

.tooltip3 {
    position: relative;
    display: inline-block;
}
.tooltip3 > i {
    margin-right: 14px;
}

.tooltip3:hover .tooltiptext {
    visibility: visible;
}
.tooltip3 .tooltiptext {
    visibility: hidden;
    /* width: 260px; */
    background-color: #0071BB;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 10px 10px;
    position: absolute;
    /*bottom: -230%;
    left: 80%;*/
    right: 0%;
    margin-left: -10px;
    opacity: .9;
    font-family: 'DINPro';
    font-size: 16px;
    /* text-align: justify; */
    z-index: 99 !important;
    transition-property: all;
    transition-duration: .0s;
    transition-timing-function: ease-in-out;
}

.tooltip3.left-centered .tooltiptext::after {
    margin-left: 30px;
}
.tooltip3 .tooltiptext::after {
    border-color: #0071BB transparent transparent transparent;
}
.tooltip3 .tooltiptext::after {
    content: "";
    position: absolute;
    top: -11%;
    left: 24px;
    margin-left: -7px;
    border-width: 5px;
    border-style: solid;
    transform: rotate(180deg);
    color: #0071BB;
}


.leftBar {
	float: left;
	width: 300px;
	height: 100%;
	padding-top: 15px;
	padding-left: 10px;
    padding-right: 10px;
    overflow: hidden;
    flex-direction: column;
    background: rgb(51,111,159);
    background: linear-gradient(162deg, rgba(51,111,159,1) 33%, rgba(39,80,112,1) 66%, rgba(22,37,48,1) 100%);
}
	.noScrollbar{
		width: 100%;
		height: 100%;
		overflow-y: auto;
	}
.leftBar .logo img{
	width: 220px;
}
.leftBar nav.mainSegmentNav{
	margin-top: 20px;
}
.leftBar nav{
	margin-top: 20px;
}
.slogan,
.logo{
	font-size: 14px;
	font-family: 'DINPro';
	font-weight: bold;
	margin-left: 15px;
}
/*#rightUpBar{
	margin-top: 18px;
	margin-right: 18px;
	float: right;
}
#rightUpBar a{
	cursor:pointer;
}
#leftUpBar .navArrow{
	margin-top: 20px;
	margin-left: 20px;
	float: left;
}
#rightUpBar .navArrow img,
#leftUpBar .navArrow img{
	width: 34px;
}*/
#leftUpBar .slogan{
	float: left;
	margin-top: 20px;
	margin-left: 20px;
	color: #fff;
	font-family: 'DINPro';
	font-size: 21px;
}
.rightBar {
	float: right;
	width: 7%;
	height: 100%;
	/*background: #D1CBBE;
	background-image: url('../images/rightBar-bg.png');*/
	background-position: left;
	background-repeat: repeat-y;
}

ul#steps li {
	/*height: 60px;*/
}

#steps li a {
	height: 100%;
	text-decoration: none;
	font-family: 'DINPro';
}

.step {
	/*height: 60px;*/
	/*margin-bottom: 10px;*/
	display: flex;
	padding: 10px 0px;
}

.stepIcon {
	/*width:40px;
	margin-right: 10px;
	height: 40px;
	background: transparent url("../images/step-free.png");
	background-size: cover;
	float: left;*/

	height: 40px;
    width: 40px;
    display: block;
    margin-right: 10px;
    border: 3px solid gray;
    border-radius: 20px;
    padding: 2px;
    flex-grow: 0;
    flex-shrink: 0;
    /*float: left;*/
}

.stepIcon > .stepCircle {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    color: gray;
}

.stepIcon.full,
.stepIcon.active,
.stepIcon.alwaysActive{
	/*background-image: url('../images/step-full.png');*/
	background-color: #FFFFFF; /*#428bca;*/
	border-color: #FFFFFF; /*#428bca;	*/
	background-size: cover;
	cursor: pointer;
}
.stepIcon.full > .stepCircle,
.stepIcon.active > .stepCircle,
.stepIcon.alwaysActive > .stepCircle {
	color: #336F9F !important;
	padding: 2px;
}

.stepLabel {
	width: calc(100% - 50px);
    /*height: 100%;
	float: right;*/
}

.stepLabel h2 {
	font-family: 'DINPro-Regular';
	font-size: 14px;
	font-weight: normal;
	color: #FFF;
    margin-top: 0px;
    margin-bottom: 0px;
}
.stepLabel h3 {
	font-family: 'DINPro-Regular';
	font-size: 14px;
	font-weight: bold;
	color: #FFFFFF;
    margin-top: 4px;
    margin-bottom: 0px;
}
.sectionChoices h3{
	font-size: 21px;
	margin-top: 0px;
	border-bottom: 2px solid #0071bb;
	color: #0071bb;
}

	.sectionChoices.couplingMode{
		position: relative;
		overflow: hidden;
		padding: 15px 5px 0px;
	}
	.sectionChoices.couplingMode.backgroundBlu{
		background: linear-gradient(to right, rgba(0, 113, 187, 0.05) , #FFF);
		border-bottom: 1px solid #0071bb;
	}

	.sectionChoices.couplingMode.backgroundGreen{
		background: linear-gradient(to right, rgba(139, 195, 74, 0.1) , #FFF);
		border-bottom: 1px solid #18821c;
	}

	.sectionChoices.couplingMode .titleCouplingMode{
		float: left;
		width: 35px;
		min-height: 341px;
		padding: 5px;
	}
		.sectionChoices.couplingMode .titleCouplingMode h3{
			transform: rotate(270deg);
			min-width: 361px;
			margin-top: 155px;
			margin-left: -170px;
			border: 0px;
			font-family: 'DINPro-Bold';
			/*font-weight: bold;*/
			/*font-size: 24px;*/
			font-size: 21px;
			text-align: center;
		}
		.sectionChoices.couplingMode.backgroundGreen .titleCouplingMode h3{
			color: #18821C;
		}
		.sectionChoices.couplingMode.backgroundGreen .sectionChoice p b{
			color: #18821C;
		}

	.sectionChoices.couplingMode .selectCouplingMode{
		float: left;
		width: calc(100% - 50px);
		padding-left: 15px;
	}
		.sectionChoices.couplingMode .selectCouplingMode .sectionChoice{
			margin-bottom: 5px;
		}
			.sectionChoices.couplingMode .selectCouplingMode .sectionChoice .btnChoice{
				box-shadow: none;
			}

.sectionChoice{
	float: left;
	/*width: 223px;*/
	width: 160px;
	margin-right: 20px;
	margin-bottom: 20px;
}
.sectionChoiceShape{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.sectionChoiceMedium{
	float: left;
	width: 223px;
	margin-right: 20px;
	margin-bottom: 20px;
}
.sectionChoice.finishingChoice{
	min-height: 400px;
	z-index: 1;
	position: relative;
}
.sectionChoice.finishingChoice:hover{
	z-index: 99;
}
.sectionChoice p{
	font-family: 'DINPro-Bold';
	font-size: 18px;
	margin-right: 20px;
	margin-bottom: 10px;
}
.sectionChoice p b{
	font-family: 'DINPro-Bold';
	/*font-size: 18px;*/
	font-size: 16px;
	margin-bottom: 18px;
	color: #0071BB;
}
.btnChoice {
	font-family: 'DINPro-Regular';
	float:  left;
	width:  223px;
	height: 172px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	/*border: 1px solid #000000;*/
	background: #ecebe9; /* For browsers that do not support gradients */
	/*box-shadow: -5px 5px 10px #ddd;*/
	text-align: center;
	position:relative;
	cursor:pointer;
	margin-bottom: 20px;
	overflow: hidden;
}
.dot-PG p,
.dot-RAL p,
.dot-EZ p,
.dot-ZNAL p,
.dot-EZplus p,
.dot-HDG p,
.dot-GC p,
.dot-INOX304L p,
.dot-INOX316L p{
	font-family: 'DINPro-Bold';
	font-size: 40px;
	margin: auto;
    margin-top: 50px;
    	border-radius: 50%;
}
.dot-PG{
	background: #FFF;
	color: #000;
	border: 1px solid #000;
}
.dot-RAL,
.dot-EZ{
	background: #FFDC01;
	color: #000;
}
.dot-ZNAL,
.dot-EZplus{
	background: #AC1A82;
	color: #fff;
}
.dot-HDG,
.dot-GC{
	background: #6FBF54;
	color: #000;
}
.dot-INOX304L{
	background: #F58932;
	color: #000;
}
.dot-INOX316L{
	background: #0072BC;
	color: #fff;
}
.btnChoice img.selected{
	display:none;
	position:absolute;
	top:5px;
	left:5px;
}
.btnChoice.selected{
	/*background: -webkit-linear-gradient(left top, #b5b5b5, #efefef);
	background: -o-linear-gradient(bottom right, #b5b5b5, #efefef);
	background: -moz-linear-gradient(bottom right, #b5b5b5, #efefef);
	background: linear-gradient(to bottom right, #b5b5b5, #efefef); */
	cursor:default;
}
.btnChoice.selected img.selected{
	display: block;
}
.btnChoiceSmall{
	float:  left;
	/*width:  200px;
	height: 55px;*/
	width:  165px;
	height: 44px;
	/*margin-bottom: 20px;*/
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background: #fff;
	border: 1px solid #393939;
	position:relative;
	cursor:pointer;
	font-size: 21px;
	/*padding-top: 12px;*/
	padding-top: 10px;
	color:#393939;
	font-family: 'DINPro-Bold';
	/*font-weight:bold;*/
}
.btnChoiceMedium{
	float:  left;
	/*width:  200px;
	height: 110px;*/
	width:  165px;
	height: 87px;
	/*margin-bottom: 20px;*/
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	background: #fff;
	border: 1px solid #393939;
	position:relative;
	cursor:pointer;
	font-size: 21px;
	color:#393939;
	font-family: 'DINPro-Bold';
	/*font-weight:bold;*/
	overflow: hidden;
}
.disableChoice .btnChoiceMedium img{
	filter: grayscale(100%);
}
.btnChoiceMedium img{
	width: 100%;
}
.btnChoiceMedium p{
	position: absolute;
    bottom: 0px;
    right: 0px;
    /*margin-right: 10px;*/
    margin-right: 3px;
    /*margin-bottom: 2px;*/
    margin-bottom: 0px;
    font-size: 16px;
}

#intallationChoice .btnChoiceMedium p{
	color: #fff;
}

.disableChoice .btnChoiceMedium,
.disableChoice .btnChoiceSmall{
	opacity:0.2;
	cursor:not-allowed;
}
.btnChoiceMedium img{
	filter: grayscale(95%);
}
.btnChoiceMedium.selected{
	border-color: #0071bb;
	color: #0071bb;
}
.btnChoiceMedium img:hover,
.btnChoiceMedium.selected img{
	filter: grayscale(0%);
}
.btnChoiceSmall.selected{
	background:#0071bb;
	border:2px solid #0071bb;
	cursor:default;
	color:#fff;
}
#shapeSelection,
#finishingSelection{
	margin-top:0px;
}

#lineSelection h2,
#dimensionSection h2,
#shapeSelection h2,
#couplingSection h2,
#finishingSelection h2{
	font-family: 'DINPro-Bold';
	/*font-weight:bold;*/
	/*font-size: 24px;*/
	font-size: 21px;
	color:#393939;
	margin-top: 4px;
}
#finishingSelection h3{
	font-family: 'DINPro-Bold';
	font-size: 18px;
	color:#0071BB;
	margin-top: 4px;
}
#finishingSelection h3.purple{
	font-family: 'DINPro-Bold';
	font-size: 18px;
	color:#AC1A82 !important;
	margin-top: 4px;
}
.purple{
	color:#AC1A82 !important;
}
.purple{
	color:#e30019 !important;
}
#dimensionSection h3{
	margin-top: 15px;
	margin-bottom: 24px;
	font-family: 'DINPro-Regular';
	font-size: 21px;
	color:#393939;
}
#dimensionSection h2.subTitleDimension{
	color:#0071BB;
	/*font-size: 22px;*/
	font-size: 21px;
	/*font-weight: bold;*/
	font-family: 'DINPro-Bold';
}
.btnChoiceSmall p {
	font-family: 'DINPro-Bold';
	/*font-size: 20px;*/
	font-size: 18px;
	text-align: center;
	margin-right: 0;
}
.page-container {
	height: 100%;
	overflow-y: auto;
	overflow-x: auto;
	width: 100%;
}
.page-container.withLateralBar{
	width: calc(100% - 300px);
}
.module-container {
	/*margin-top: 90px;*/
	padding: 20px;
}

.viewContainer.viewIntroduction{
	height: 100%;
	padding:0 0 0 0;
}

#loaderContainer{
	width:100%;
	height:100%;
	/*background:#000;*/
	position: absolute;
	top:0;
	left:0;
	z-index: 99;
	background-image: url('../images/offusca.png');
}
.loader {
	margin: 40% auto 0;
	width: 16px; /*16*/
	height: 16px; /*16*/
	background-image: url('../images/ajax-loader.gif');
}
.intro{
	width: 100%;
	height:100%;
}
.appDescription{
	float: left;
	width: 60%;
	min-width: 416px;
	height:100%;
	padding:40px;
	position: relative;
}
.appDescription h1{
	font-family: 'DINPro-Bold';
	font-size: 40px;
	color: #fff;
	margin-bottom: 40px;
	/*font-weight:normal;*/
	text-shadow: -3px 6px 10px rgba(0, 0, 0, 0.50);
}
.appDescription p{
	font-family: 'DINPro-Regular';
	font-size: 21px; /*24px;*/
	color: #fff;
	text-shadow: -3px 3px 10px #000;
	margin-bottom: 0;
	line-height: 26px;
}
#introParagraph{
	position: absolute;
	bottom: 6em; /*40px;*/	/*by jacopo*/
	width: 70%;
	/* font-size: 2.7rem; */
}
.linesSelection{
	float: left;
	width: 40%;
	height:100%;
}
.linesSelection .logo{
	width:300px;
}
.lineSelection{
	padding-top: 30px;
	/*height: 230px;*/
    /*margin-left: -70px;*/
}
.linesSelection .firstSelection{
	margin-top: 10px;
}
.lineSelection .lineIcon{
	float: left;
	background: #DBDBDB;
	height: 172px;
	width: 223px;
	z-index: 15;
    position: relative;
    box-shadow: -6px 10px 10px rgba(0, 0, 0, 0.50);
    -webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	overflow: hidden;
}
.lineSelection .lineIcon img{
	width: 223px;
    position: relative;
}
.lineDescription{
	/*float: left;*/
	/*padding-left: 40px;*/
	/*width: calc(100% - 225px);*/
	font-family: 'DINPro';
	color: #2F2F2F;
	font-size: 18px;
	margin-top: 15px;
}
.lineDescription p,
.lineDescription h1{
	font-family: 'DINPro';
	font-size: 18px;
	margin-top: 0px;
}
.lineDescription h1{
	color: #0071BB;
	font-weight: bold;
	/*margin-bottom: 3px;*/
}
.lineDescription .btnNextStep{
	/*float: right;*/
	margin-bottom: 10px;
}
.btnNextStep{
	background: #0071BB;
	/*line-height: 53px;*/
	min-height: 44px;
	color: #fff;
	font-family: 'DINPro-Regular';
	/*font-size: 20px;*/
	font-size: 18px;
	font-weight: bold;
	border-radius: 6px;
	text-align: center;
	margin: 0 0 0 auto;
	cursor: pointer;
	max-width: 360px;
	display: flex;
    justify-content: center;
    align-items: center;
}
.btnNextStep a {
	color: #fff;
	text-decoration: none;
}
.lineDescription .btnNextStep{
	width: 270px;
}
.btnNextStep.disable{
	opacity: 0.5;
	cursor: not-allowed;
}
.topBar {
	position: sticky;
	top: 0;
	z-index: 10;
	display: flex;
    flex-wrap: wrap;
	background: #FFFFFF;
	width: 100%;
    border-bottom: 1px solid #e8ecee;
    padding: 20px;
}

.mainSegmentNav p,
.commonPropertyNav p{
	font-family: 'DINPro-Regular';
	/*font-size: 20px;*/
	font-size: 16px;
	color: #0071BB;
	font-weight: bold;
	margin: 0 0 8px;
}

.mainSegmentNav hr,
.commonPropertyNav hr{
	margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid rgba(0,0,0,.1);
	margin-left: -15px;
}

.fotorama,
#slide{
	position:absolute;
	top:0;
	left:0;
	z-index:0;
	width: 60%;
	height: 100%;
	overflow: hidden;
}
.fotorama__wrap{
	background:transparent url("../images/shadow-image-introduction.png") repeat-x 0 bottom;
}
.slide.ng-hide-remove {
  -webkit-transition: all linear 0.5s;
  -moz-transition: all linear 0.5s;
  -o-transition: all linear 0.5s;
  transition: all linear 0.5s;
  display: block!important;
}
.slide.ng-hide-add.ng-hide-add-active,
.slide.ng-hide-remove {
  opacity: 0;
}
.slide.ng-hide-add,
.slide.ng-hide-remove.ng-hide-remove-active {
  opacity: 1;
}
.appDescription{
	position:relative;
	z-index:10;
}
.fotorama img,
#slide img{
	width:100%;
}
#popupAddAccessories,
#popupCompareFinishing,
#popupCorrosionFinishing,
#popupAddSegment,
#popupActionSegment,
#popupSaveFileMyBticino,
#popupFileSavedMyBticino,
#popupBICMessage,
#popupAccessoriesQuestion{
	/*width: calc(100% - 300px);
	width: calc(100% - 275px);*/
	width: 100%;
	background-color:rgba(0,0,0,0.96);
	height: 100%;
	position:absolute;
	top:0;
	left:0;
	padding:40px;
	z-index:100;
	overflow: auto;
}

/*@media screen and (max-width: 1050px){*/
@media screen and (max-width: 1110px){
	#popupCorrosionFinishing{
		width: 100%;
	}
}

#popupAddAccessories{
	background-color:rgba(255,255,255,1);
}
#popupAddAccessories h1{
	/*margin-bottom: 30px;*/
	margin-bottom: 25px;
	font-family: 'DINPro-Bold';
	/*font-size: 22px;*/
	font-size: 21px;
	color:#0073ba;
}
#popupAddAccessories h2{
	margin: 0px;
	/*font-size: 20px;*/
	font-size: 18px;
	color: #4D4A44;
	font-family: 'DINPro-Bold';
	cursor: pointer;
}
#buttonsAccessoriesPopup{
    z-index: 10;
    background-color: white;
    border-bottom: 1px solid #0071BB;
    margin-bottom: 20px;
    /*position: sticky;
    top: 0px;*/
}

#popupCompareFinishing h5,
#popupCorrosionFinishing h5,
#popupAddSegment h5,
#popupActionSegment h5,
#popupSaveFileMyBticino h5,
#popupFileSavedMyBticino h5,
#popupBICMessage h5,
#popupAccessoriesQuestion h5{
	font-size: 21px;
	color:#fff;
	font-family: 'DINPro-Bold';
	margin-bottom: 20px;
}
#popupActionSegment h4{
	font-size: 21px;
	color:#fff;
	font-family: 'DINPro-Bold';
	margin-bottom: 20px;
}
#chooseSegment,
#chooseActionSegment{
	padding-bottom: 30px;
	border-bottom: 1px solid #fff;
	padding-left: 10px;
	margin-bottom: 25px;
}
#chooseSegment .imgIcon,
#chooseActionSegment .imgIcon{
	float:left;
	width: 40px;
	height: 40px;
	background:#fff;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	display : flex;
  	align-items : center;
  	text-align: center;
  	margin-bottom: 19px;
}
#chooseSegment .imgIcon img,
#chooseActionSegment .imgIcon img{
	margin:0 auto;
}
#chooseSegment .descriptionChoose,
#chooseActionSegment .descriptionChoose{
	float:left;
	color:#fff;
	font-size: 21px;
	font-family: 'DINPro-Bold';
	padding-top: 5px;
    margin-left: 20px;
}
.closePopup{
	width: 42px;
	margin-left:20px;
	-webkit-border-radius: 28px;
	-moz-border-radius: 28px;
	border-radius: 28px;
	cursor:pointer;
	font-size: 21px;
	font-family: 'DINPro-Bold';
	padding:5px 0;
	text-align: center;
	border:2px solid #FFFFFF;
	color:#FFFFFF;
	float: right;
}
#buttonsAccessoriesPopup .closePopup{
	border-color: #0073ba;
	color: #0073ba;
}
#buttonsFileSavedMyBticinoPopup .closePopup {
	border-color: #ACACAC;
	color: #ACACAC;
}
#buttonsBICMessagePopup .closePopup {
	border-color: #ACACAC;
	color: #ACACAC;
}
.cancelPopup,
.continuePopup{
	float:left;
	width: 152px;
	margin-left:20px;
	-webkit-border-radius: 28px;
	-moz-border-radius: 28px;
	border-radius: 28px;
	cursor:pointer;
	font-size: 21px;
	font-family: 'DINPro-Bold';
	padding:9px 0;
	text-align: center;
}
.cancelPopup{
	border:2px solid #ACACAC;
	color:#ACACAC;
}
.continuePopup{
	border:2px solid #0071BB;
	color:#fff;
	background: #0071BB;
}
#buttonsAddSegmentPopup,
#buttonsActionSegmentPopup{
	float:right;
}
#pendants ul,
#segments ul{
	margin-right: 60px;
}

#pendants li,
#segments li{
	/*border:1px solid #95989A;
	-webkit-border-radius: 28px;
	-moz-border-radius: 28px;
	border-radius: 28px;*/
	color:#000000;
	font-family: 'DINPro-Regular';
	font-size:21px;
	display:block;
	width:100%;
	/*padding:3px 10px;*/
	margin-bottom: 0px;
	margin-right: 60px;
	text-decoration: none;
	/*height: 36px;*/
	display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3px 0px;
}
#pendants li.current,
#segments li.current{
	/*border:2px solid #0071BB;*/
	color: #FFFFFF;
}

#pendants li.current a h2,
#segments li.current a h2{
	color:#0071BB;
}
#pendants li a h2,
#segments li a h2{
	color:#000000;
	font-family: 'DINPro-Regular';
	font-size:20px;
	text-decoration: none;
	margin-top: 0px;
    margin-bottom: 0px;
    float: left;
}
#pendants li div,
#segments li div{
    margin-top: 5px;
    margin-left: 2px;
    cursor:pointer;
    /*font-size: 20px;*/
    font-size: 17px;
}
.accessoiryInput,
.segmentInput,
.segmentInputBorder{
	width: 170px;
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}
.segmentInputBorder{
	border-right: 2px solid #e8ecee;
	width: 185px;
}
.segmentInput3{
	width: 600px;
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}
.segmentInput3Type,
.segmentInput3Length,
.segmentInput3Clip{
	float: left;
	margin-right: 15px;
}

.segmentInput3Type select{
	width: 100px;
}

.inputSysSupport{
	padding:5px 0;
	border-radius: 6px;
    border: 1px solid #95989A;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	text-align:center;
	cursor:pointer;
	/*font-size: 22px;*/
	font-size: 18px;
    font-family: 'DINPro-Bold';
    /*font-weight: bold;*/
}
.inputSysSupport img{
	display:block;
	margin: 0 auto;
}
.inputSysSupport.selected{
	color: #0071BB;
	border: 2px solid #0071BB;
}
.inputSysSupport:hover{
	border: 2px solid #0071BB;
}
.segmentInputBig{
	width: 250px;
	float: left;
	margin-right: 20px;
}

#segmentSection .segmentInputBig select{
    /*width: 248px;*/
     width: 230px;
}
#segmentSection h2{
    font-family: 'DINPro-Regular';
    font-weight: bold;
    /*font-size: 22px;*/
    font-size: 21px;
    color: #0071BB;
}
#segmentSection h3{
    font-family: 'DINPro-Regular';
    /*font-size: 20px;*/
    font-size: 18px;
    color: #393939;
    margin-top:0px;
}
#segmentSection h4 {
    font-family: 'DINPro-Bold';
    /*font-size: 20px;*/
    font-size: 18px;
    color: #393939;
    margin-top: 0px;
}
.accessorySection p{
	font-size: 18px;
	font-family: 'DINPro-Regular';
	color: #393939;
}
.accessorySection select{
	font-size: 19px !important;
}

.selector select,
#segmentSection select,
#segmentSection input{
    width:165px;
    height: 44px;
    color: #393939;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #CCCCCC;
	/*font-size: 22px;*/
	font-size: 18px;
	padding-left: 10px;
	font-family: 'DINPro-Regular';
	font-weight:bold;
}
#segmentSection input[type="radio"]{
	width: 25px;
	height: 25px;
}
#segmentSection select:disabled,
#segmentSection input:disabled:not(.disable-opacity-1){
	opacity: 0.2;
}
#segmentSection select:disabled,
#segmentSection input:disabled{
	cursor:not-allowed;
}
#segmentSection hr{
	border: 1px solid #e8ecee;
    margin-top: 20px;
    margin-bottom: 5px;
    margin-left: 0px;
    margin-right: 40px;
}
.accessorySection{
	width:100%;
	height: 350px;
	margin-bottom: 20px;
	border-bottom: 2px solid #DBDBDB;
}
.accessoryImage{
	float: left;
	width: calc(100% - 230px);
	margin-right: 30px;
}
	.accessoryImage img{
		/*border: 2px solid #DBDBDB;*/
		max-width: 100%;
		height: auto;
	}
	@media(max-width: 800px){
		.accessoryImage{
			width: 100%;
			margin-bottom: 40px;
			margin-right: 0px;
		}
	}
.accessoiryDescription{
	float: left;
	width: calc(100% - 200px - 270px);
}
.summaryActions .btnAction,
#rightUpBar .btnAction{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: 1px solid #0071BB;
    color: #0071BB;
    height: 44px;
    min-width: 175px;
    margin: 2.5px 5px 2.5px 0;
}

.btn.btnAction.rexelNlBtn{
	color: #ffffff;
	background-color: #0a297d;
	border: 1px solid #4086bf;
}

.btn.btnAction.soneparNLBtn{
    background-color: transparent;
    border: 1px solid #007c33;
    color: #007c33;
}

.btn.btnAction.soneparNLBtn img{
	height: 22px;
	width: 22px;
}

.btn.btnAction.marchiol{
	background-color: #269b47!important;
	color: #FFFFFF!important;
	border: 1px solid #269b47!important;
}

.summaryActions .btnActionRexFra {
	height: 44px;
	margin: 0px;
	color: #fff;
    background-color: #0a297d;
    border-color: #0a297d;
}

#buttonsAccessoriesPopup .btnAction{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    border: 1px solid #0071BB;
    color: #0071BB;
    height: 44px;
    min-width: 175px;
    margin: 2.5px 5px 2.5px 0;
    float: right;
}
.fa-close-accessories{
    margin-right: 5px;
    font-size: 20px;
}
.summaryActions .btnAction{
	border: 1px solid #d1193a;
    color: #d1193a;
    text-decoration: none;
}
.btn{
	font-size: 18px;
}
.btnAction a,
.btnAction a:visited,
.btnAction a:hover{
	color: #0071BB;
	font-family: 'DINPro-Regular';
	font-size: 18px;
	text-decoration: none;
	/*font-weight: bold;*/
}
.btnActionIco{
	width: 23px;
	height: 23px;
}
.btnSummary{
	float: right;
	/*background: #0071BB;*/
    line-height: 38px;
    height: 42px;
    color: #393939;
    font-family: 'DINPro-Regular';
    /*font-size: 20px;*/
    font-size: 18px;
    border-radius: 25px;
    text-align: center;
    margin: 0 auto;
    cursor: pointer;
    max-width: 170px;
    border:2px solid #393939;
    margin-left: 10px;
    padding:0px 10px;
}

.btnFinishing{
	float: right;
    line-height: 38px;
    height: 42px;
    color: #393939;
    font-family: 'DINPro-Bold';
    font-size: 20px;
    border-radius: 25px;
    text-align: center;
    margin: 0 auto;
    cursor: pointer;
    max-width: 170px;
    border:2px solid #393939;
    margin-left: 10px;
    padding:0px 10px;
}

.tableHead,
.tableRow{
	width:100%;
	height: 40px;
	border-bottom: 2px solid #e8ecee;
	font-family: 'DINPro-Regular';
	font-size: 18px;
	line-height: 38px;
}
.tableRowSmall{
	width:100%;
	height: 40px;
	border-bottom: 2px solid #e8ecee;
	font-family: 'DINPro-Regular';
	font-size: 16px;
	line-height: 38px;
}
.shortCell,
.longCell,
.mediumCell,
.shortplusCell{
	float: left;
	height:100%;
}
.shortplusCell{
	width:5%;
}
.shortCell{
	width:8%;
}
.longCell{
	width:33%;
}
.mediumCell{
	width:14%;
}
.shortCell.bar{
	width:15%;
}
.shortCell.action{
	width:7%;
}

.numeric{
	text-align: right;
}

.progress{
	margin-top:8px;
	margin-left:10px;
	margin-right:10px;
	height: 24px;
}
.totalRow .longCell{
	width:80%;
}
.tableRow.totalRow{
	border:none;
	font-family: 'DINPro-Bold';
	font-size: 24px;
	color:#393939;
	padding-top: 10px;
}
.tableRowSmall.totalRow{
	border:none;
	font-family: 'DINPro-Regular';
	font-size: 16px;
	color:#393939;
	padding-top: 10px;
}
.summaryActions h1{
	float:left;
	/*font-size: 24px;*/
	font-size: 22px;
	color:#0071BB;
	font-family: 'DINPro-Bold';
	margin-top: 4px;
}
.summaryActions{
	/*margin-bottom: 20px;*/
	position: relative;
    /*overflow: hidden;*/
	/*border-left: 2px solid #e8ecee;*/
    margin-left: 2px;
    /*padding-left: 7px;    */
}
@media(max-width:  991px){
	.summaryActions {
		margin-left: 0;
	}
}
#descriptionAccessories{
	float:left;
	width:calc(100% - 250px);
}
#descriptionAccessories p{
	font-family: 'DINPro-Regular';
	font-size: 20px;
	color:#393939;
}
#buttonAccessories{
	float:right;
	background:#0071BB;
	color:#fff;
	font-family: 'DINPro-Bold';
	font-size: 20px;
	border-radius: 25px;
	padding: 10px 40px;
	cursor:pointer;
}
#summaryAccessories{
	margin-top: 60px;
}
#sendEmailPopup,
#popupSaveFileMyBticino input{
	display: block;
    width: 50%;
    padding: 10px;
    font-size: 18px;
    margin-bottom: 30px;
}
.mediumCell .progress{
	position:relative;
}
.mediumCell .progress-bar{
	background-color: #dfdfdf;
}
.mediumCell .progress p{
	font-size: 12px;
    line-height: 20px;
    color: #428bca;
    text-align: center;
    width: 100%;
    position:absolute;
    top:0;
    left:0;
}
#corrosionTable,
#compareTable{
	color: #ffffff;
    margin-top: 80px;
    /*clear: both;*/
}
table#corrosionTable {
	width: 100%;
	font-size: 13px;
}
table#corrosionTable > thead > tr:last-child {
	border-bottom: 2px solid #ffffff;
	font-family: 'DINPro-Bold';
	color: #009EE1;
	text-transform: uppercase;
}
table#corrosionTable tr > td {
	padding: 15px 5px;
	vertical-align: middle;
}
table#corrosionTable > tbody > tr {
	border-bottom: 1px solid #ffffff;
	font-family: 'DINPro-Regular';
}
table#corrosionTable > tbody > tr > td.text-bold{
	color:#009EE1;
}

.compareHeadRow{
	/*height: 30px;*/
	width: 100%;
	border-bottom: 2px solid #ffffff;
	font-family: 'DINPro-Regular';
	color: #009EE1;
	text-transform: uppercase;
}
@media screen and (max-width: 1240px){
	.compareHeadRow{
		font-size: 0.9em;
	}
}
@media screen and (max-width: 1150px){
	.compareHeadRow{
		font-size: 0.8em;
	}
}

.compareRow{
	height: 60px;
	width: 100%;
	border-bottom: 1px solid #ffffff;
	font-family: 'DINPro-Regular';
}
.compareRow .compareCellMedium{
	line-height: 60px;
}

.compareCell{
	/*float: left;*/
	height: 100%;
	width: 21%;
}
/*
@media screen and (max-width: 1260px){
	.compareCell{
		font-size: 1vw;
	}
	.compareCellMedium{
		font-size: 1vw;
	}
	.compareCellSmall{
		font-size: 1vw;
	}
}
*/
.compareCell p,
.corrosionCell p{
	vertical-align: middle;
    display: table-cell;
    font-size: 100%;
}
.corrosionHeadRow{
	height: 50px;
	width: 100%;
	border-bottom: 2px solid #ffffff;
	font-family: 'DINPro-Bold';
	color: #009EE1;
	text-transform: uppercase;
}

@media screen and (max-width: 1280px){
	.corrosionHeadRow{
	height: 70px;
	}
}
@media screen and (max-width: 760px){
	.corrosionHeadRow{
	font-size: 80%;
	}
}
@media screen and (max-width: 530px){
	.corrosionHeadRow{
	font-size: 60%;
	}
}

@media screen and (max-width: 720px){
	#popupCorrosionFinishing{
		width: 100%;
		padding: 20px 20px;
	}
	.corrosionHeadRow{
	height: 90px;
	}
}


.corrosionRow{
	height: 60px;
	width: 100%;
	border-bottom: 1px solid #ffffff;
	font-family: 'DINPro-Regular';
}
@media screen and (max-width: 1170px){
	.corrosionRow{
		height: 80px;
	}
}
@media screen and (max-width: 660px){
	.corrosionRow{
		font-size: 80%;
	}
}
@media screen and (max-width: 530px){
	.corrosionRow{
	font-size: 60%;
	}
}

.corrosionRow.double{
	height: 125px; /*DC PRIMA -> 120px*/
	width: 100%;
	border-bottom: 1px solid #ffffff;
	font-family: 'DINPro-Regular';
}
@media screen and (max-width: 1280px){
	.corrosionRow.double{
		height: 165px;
	}
}
@media screen and (max-width: 1080px){
	.corrosionRow.double{
		height: 210px;
	}
}
@media screen and (max-width: 760px){
	.corrosionRow.double{
		height: 180px;
		font-size: 80%;
	}
}
@media screen and (max-width: 560px){
	.corrosionRow.double{
		height: 180px;
		font-size: 60%;
	}
}

.corrosionRow.triple{
	height: 180px;
	width: 100%;
	border-bottom: 1px solid #ffffff;
	font-family: 'DINPro-Regular';
}
@media screen and (max-width: 1280px){
	.corrosionRow.triple{
		height: 200px;
	}
}
@media screen and (max-width: 770px){
	.corrosionRow.triple{
		height: 220px;
	}
}
@media screen and (max-width: 730px){
	.corrosionRow.triple{
		height: 245px;
	}
}

.corrosionCell{
	float: left;
	height: 100%;
	width: 20%;
	padding-right: 10px;
	display: table;
}
.corrosionCell p strong{
	color:#009EE1;
}
.rowInside50{
	height: 50%;
}
.rowInside33{
	height: 33.333%;
}
.rowInside25{
	height: 25%;
}
.rowInside16{
	height: 16.665%;
}
.rowInside98{
	height: 98%;
}
.rowInside12{
	height: 12.5%;
}

.rowInsideLenght70{
	width: 70%;
	text-align: right;
}
.rowInsideLenght60{
	width: 60%;
	text-align: right;
}
.rowInsideLenght50{
	width: 10%;
}

.rowBorderBottom{
	border-bottom: 1px solid #FFF;
}

.verticalTextCell{
	writing-mode: vertical-rl;
    display: inline-block;
	/*transform: rotate(270deg);
	transform-origin: left top 0px;
	/*position: relative;
    top: 17px;*/
    font-size: 100%;
    font-weight: bold;
}
@media screen and (max-width: 1060px){	/* by jacopo*/
	.verticalTextCell{
		line-height: 12px;
	}
}

.compareCellMedium{
	/*float: left;*/
	height: 100%;
	width: 9%;
}
.compareCellSmall{
	/*float: left;*/
	height: 100%;
	width:7%;
	min-width: 50px;

}
/*@media screen and (max-width: 1024px){
	.compareCellSmall{
		width: 47px;
	}
}
*/
.compareCellSmall img{
	max-width: 50%; /*45px;*/	/*by jacopo*/
	width: 100%;
	height: auto;
	text-align: center;
	padding-bottom: 10px;
}
/*@media screen and (max-width: 1024px){
	.compareCellSmall img{
		margin: 15px 0;
	}
}*/

.dotLegend{
	clear: both;
	font-family: 'DINPro-Regular';
	font-size: 16px;
	color: #fff;
}
.selector label
{
	font-family: 'DINPro-Regular';
	font-size: 16px;
	/*float: right;*/
	margin-top: 10px;
	margin-right: 10px;
	font-weight: normal;
	cursor: default;
}
.selector select
{
    width: 110px;
}
.compatibilitySection{
	width: 50%;
	max-width:300px;
	float: right;
	clear: both;
	font-family: 'DINPro-Regular';
	color: #fff;
}
.compatibilitySection h1{
	font-size: 18px;
}
.compatibilitySection .compatibilityTable{
	max-width:300px;
	line-height: 40px;
}
.compatibilitySection .compatibilityRow{
	width:100%;
	height: 40px;
	border-bottom: 1px solid #A0A0A0;
	font-size: 16px;
	color: #fff;
}
.compatibilitySection .compatibilityCell{
	height: 100%;
	width: 50%;
	float: left;
}
.compatibilitySection .compatibilityHeadCell{
	height: 100%;
	width: 50%;
	float: left;
	font-family: 'DINPro-Bold';
	color: #009EE1;
	text-transform: uppercase;
}

@media screen and (max-width: 1260px){
	.compatibilitySection h1{
		font-size: 1.3em !important;
		line-height: 1.7em !important;
	}
	.compatibilitySection .compatibilityRow {
		font-size: 1em !important;
		line-height: 1.2em !important;
		padding-top: 12px;
	}
}
@media screen and (max-width: 1024px){
	.compatibilitySection h1{
		font-size: 1.2em !important;
		line-height: 1.5em !important;
	}
	.compatibilitySection .compatibilityRow {
		font-size: 0.9em !important;
		line-height: 1.1em !important;
		padding-top: 14px;
	}
}

.headerAccordion span{
	float: right;
	width: 42px;
	height: 42px;
	margin-top: -10px;
	border: 2px solid #0073BA;
	border-radius: 28px;
	text-align: center;
	line-height: 39px;
}
	/* Aperto */
	.headerAccordion span.arrow-up:after{
		content: '\f063';
		font-family: 'FontAwesome';
		color: #0071BB;
		font-size: 20px;
	}
	/* Chiuso */
	.headerAccordion span.arrow-down:after{
		content: '\f062';
		font-family: 'FontAwesome';
		color: #0071BB;
		font-size: 20px;
	}

.compatibility-icon{
    height: 24px;
    margin-top: -6px;
}

.accItem hr{
	clear: both;
}
.accImage{
	float: left;
	width: 70px;
}
.accContent{
	float: left;
	width: calc(100% - 200px);
	padding-left: 10px;
}
.accContentFull{
	width: calc(100% - 140px - 110px)!important;
}
.accContent h3{
	font-family: 'DINPro-Bold';
    /*font-size: 20px;*/
    font-size: 18px;
    color: #0073ba;
    margin: 0px;
}
.accContent p,
.accSpinner p{
	font-family: 'DINPro-Regular';
    /*font-size: 18px;*/
    font-size: 16px;
    color: #4D4A44;
}
.accSpinner{
	float: left;
	width: 110px;
}

.accCompatibility{
	float: left;
	width: 140px;
}
.accCompatibility img{
	width: 32px;
}
.accCompatibility h3{
    font-size: 16px;
}
.accCompatibility p{
	font-family: 'DINPro-Regular';
    float: left;
    font-size: 16px;
    margin-right: 5px;
}
/*.accSpinner input{
    #width:100px;
    width:90px;
    height: 50px;
    color: #393939;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	border:2px solid #95989A;
	#font-size: 22px;
	font-size: 18px;
	padding-left: 10px;
	font-family: 'DINPro';
	font-weight:bold;
}*/
.hrBlue{
	/*margin-bottom: 25px;*/
	margin-bottom: 20px;
	margin-top: 15px!important;
	color: #0073ba;
	border-bottom: 1px solid #0073ba;
}
/* .ng-cloack{
	display: none;
} */
.wrap{
    position: relative;
    margin: 2em 0;
}
.btnSly {
	position: absolute;
	z-index: 5;
	width: 48px;
	height: 145px;
	margin-bottom: 0;
	padding: 4px 12px;
	vertical-align: middle;
	cursor: pointer;
	border: none;
}

.btnSly.prev {
	background: #FFF url("../images/arrow-left-sly.png") no-repeat center;
	/* box-shadow: 10px 0px 0px 0px #f2e1f2; */
}
.btnSly.next {
	top: 0px;
	right: 0px;
	background: #FFF url("../images/arrow-right-sly.png") no-repeat center;
	/* box-shadow: -10px 0px 0px 0px #f2e1f2; */
}

.frame{
	height: 145px;
}
.frame ul {
	list-style: none;
	margin: 0;
	padding: 0 55px;
	height: 100%;
	font-size: 50px;
}
.frame ul li {
	float: left;
	/*width: 170px;*/
	width: 160px;
	height: 100%;
	/*margin: 0 20px 0 0;*/
	margin: 0 15px 0 0;
	padding: 5px 0;
	text-align: center;
	cursor: pointer;
}


@media(max-width: 900px){
	.lineSelection.last{
		margin-top: 10px;
	}
}

@media(max-width: 870px){
	.lineSelection.last{
		margin-top: 35px;
	}
}

@media(max-width: 800px){
	.fotorama{
		width: 0%;
	}
	.appDescription{
		width: 0%;
		display: none;
	}
	.linesSelection{
		width: 100%;
	}
}

@media screen and (max-width: 1060){
	.minWidth800{
		min-width: 720px;
	}
}

@media(max-width: 800px){
	body{
		overflow-x: auto;
	}

	.viewContainer{
		overflow-x: auto;
	}
	.linesSelection{
		width: 337px;
	}
	.lineSelection.last{
		margin-top: 85px;
	}

	.minWidth800{
		min-width: 720px;		/*460px;*/ 		/*by jacopo*/
	}
}
#loaderContainer{
	width:100%;
	height:100%;
	/*background:#000;*/
	position: absolute;
	top:0;
	left:0;
	z-index: 999;
	background-image: url('../images/offusca.png');
}
.loader {
	margin: 30% auto 0;
	width: 100px;
	height: 102px;
	background: url('../images/loader-blu.gif') no-repeat;
	background-size: cover;
}

.segmentInput3Clip.last{
	margin: 0px;
}

.tooltipImg{
	cursor: pointer;
}

.tooltipImgPopup{
    position: absolute;
    z-index: 100;
    top: 0;
    right: 0;
	/*width: calc(100% - 300px);
	width: calc(100% - 275px);*/
	width: 100%;
    height: 100%;
    padding: 40px 40px;
    overflow: auto;
    background-color: rgba(0,0,0,0.96);
}
	.tooltipImgPopup .closePopup{
		position: absolute;
		right: 20px;
		z-index: 99;
	}
	.tooltipImgPopup img{
		max-width: 95%;
		height: auto;
	}

.accContent .price{
	color: #0073ba;
}

.compareTableSelection{
	margin-top: 100px !important;
	min-width: 620px;
}

.compareTableSelection .compareRow{
	height: 80px;
}

.compareTableSelection thead.compareHeadRow{
	border-bottom: 1px solid #009EE1;
}

.compareTableSelection tr.compareHeadRow > th {
	max-height: 100px;
}

.compareTableSelection .compareRow{
	color: #000;
	border-bottom: 1px solid #009EE1;
	cursor: pointer;
}

.compareTableSelection .compareRow.selected{
	background-color: rgba(0, 113, 187, 0.1);
}

.compareTableSelection .compareCell{
	width: 21%;
}

@media screen and (max-width: 1024px){
	/*.compareTableSelection .compareCell*/.regulationCell{
		/*width: 8em !important;*/
		width: 15% !important;
	}
	.materialCell{
		/*width: 19em !important;*/
		width:25% !important;
	}
}
@media screen and (max-width: 1010px){
	.materialCell{
		width:23% !important;
	}
}
@media screen and (max-width: 1000px){
	.materialCell{
		width:20% !important;
	}
}

.compareTableSelection .compareCell.compareCellMaterial{
	width: 30%;
	padding-right: 10px;
}
.compareTableSelection .compareCell.compareCellStd{
	width: 10%;
}

.compareTableSelection .compareCellMedium{
	text-align: center;
}

.compareTableSelection .compareCellMedium.selected p{
	border: 1px solid #000;
	background: url('../images/selected-icon.png') no-repeat 5px 5px;
	background-size: 20%;
}

.compareTableSelection .compareCellMedium p{
	height: 58px;
	margin: 10px;
	padding-top: 0px;
	font-family: 'DINPro-Bold';
	/*font-size: 1.8vw;*/
	font-size: 1.4vw;
	line-height: 58px;
	cursor: pointer;
}
.compareTableSelection .compareCellMedium p.tooltip2{
	display: block !important;
}
.compareTableSelection .compareCellMedium p.tooltip2 .tooltiptext{
	bottom: 110%;
	line-height: 25px !important;
}

.compareTableSelection .compareCellMedium p.PG{
	background-color: #f5e52a;
	color: #000;
	border: 0px;
}
.compareTableSelection .compareCellMedium p.RAL,
.compareTableSelection .compareCellMedium p.EZ,
p.tooltip2.EZ{
	background-color: #FFDC01;
	color: #000;
}
.compareTableSelection .compareCellMedium p.ZNAL,
.compareTableSelection .compareCellMedium p.EZP,
p.tooltip2.ZNAL{
	background-color: #AC1A82;
	color: #FFF;
}
.compareTableSelection .compareCellMedium p.HDG{
	background-color: #6FBF54;
}
.compareTableSelection .compareCellMedium p.INOX304L,
p.tooltip2.INOX304L{
	background-color: #F58932;
	color: #000;
}
.compareTableSelection .compareCellMedium p.INOX316L,
p.tooltip2.INOX316L{
	background-color: #0072BC;
	color: #FFF;
}
.dotLegend{
	/*float: left;*/
	/*width: 50%;*/
	/*clear: none;*/
	color: #000 !important;
}
.dotLegend p img{
    width: 45px;
	height: auto;
}

.compatibilitySection.step1Selection{
	float: right;
	width: 50%;
	clear: none;
	color: #000 !important;
}
.compatibilitySection.step1Selection .compatibilityCell{
	color: #000 !important;
}

.tooltipImgSummary{
	bottom: 90% !important;
	left: 0 !important;
	width: 110px !important;
	padding: 5px !important;
	opacity: 1 !important;
}
.tooltipImgSummary img{
	width: 100px;
	height: auto;
}

.tooltipImgSummary::after{
	left: 38px !important;
}


#modDefaultProperties{
	margin-bottom: 23px;
	border-bottom: 2px solid #009EE1;
	background-color: rgba(0, 113, 187, 0.1);
}
	#modDefaultProperties h1{
		margin-top: 0px;
		padding: 15px 20px 0px;
		font-family: 'DINPro-Regular';
		font-weight: bold;
		/*font-size: 24px;*/
		font-size: 21px;
		color: #393939;
	}

	#modDefaultProperties hr{
		margin-top: 0px;
	}

	.headerModDefaultProperties span{
		float: right;
		width: 42px;
		height: 42px;
		margin-top: -10px;
		border: 2px solid #0073BA;
		border-radius: 28px;
		text-align: center;
		line-height: 34px;
	}
		/* Aperto */
		.headerModDefaultProperties.collapsed span:after{
			content: '\f063';
			font-family: 'FontAwesome';
			color: #0071BB;
			font-size: 20px;
		}
		/* Chiuso */
		.headerModDefaultProperties span:after{
			content: '\f062';
			font-family: 'FontAwesome';
			color: #0071BB;
			font-size: 20px;
		}

	#propertiesSelected{
		padding: 1px 20px;
	}

	.modDefaultProperty{
		width: 100%;
		clear: both;
	}
		.modDefaultProperty .subTitleDimension{
			margin-bottom: 30px;
			font-family: 'DINPro-Regular';
			/*font-size: 22px;*/
			font-size: 21px;
			font-weight: bold;
			color: #0071BB;
		}

/* DIVIDER TOOLTIP */
#dividerTooltipContent .section.first .row .parteTop,
#dividerTooltipContent .section.first .row .parteBottom{
	float: left;
	width: 100%;
	margin-bottom: 10px;
}

#dividerTooltipContent .section.first .row .imgContainer{
	float: left;
	width: 50%;
}

#dividerTooltipContent .section.first .row .parteTop p{
	float: left;
	width: 50%;
}

#dividerTooltipContent .section.first .row .tableDivider{
	padding-right: 15px;
}
	#dividerTooltipContent .section.first .row .tableDivider .cellBigger{
		float: left;
		width: 52.2%;
		text-align: center;
	}

#dividerTooltipContent .section.sesta img{
	float: left;
	width: 70px !important;
}
#dividerTooltipContent .section.sesta h2{
	float: right;
	width: calc(100% - 85px);
	margin-top: 0px;
	padding-left: 15px;
}

/* CLIP TOOLTIP */
	#clipTooltipContent .section.installation .section30 img{
		margin-bottom: 15px !important;
	}
	#clipTooltipContent .section.installation .section70{
		padding-left: 15px !important;
	}

/* COVER, CLIP e DIVIDER TOOLTIP */
#couplingTooltipContent,
#coverTooltipContent,
#dividerTooltipContent,
#clipTooltipContent{
	max-width: 800px;
	margin: 20px auto;
	color: #ffffff;
    clear: both;
}

.tooltipImgPopup h1{
	margin: 0px;
	font-family: 'DINPro-Regular';
	font-size: 21px;
	font-weight: bold;
	color: #009EE1;
}
.tooltipImgPopup h2{
	color: #009EE1 !important;
}
.tooltipImgPopup hr{
	margin: 20px auto !important;
	border: 1px solid #009EE1 !important;
}
.tooltipImgPopup p{
	font-family: 'DINPro-Regular';
	font-size: 14px;
	color: #FFF;
}

.tooltipImgPopup .padding-left-15{
	padding-left: 15px;
}
.tooltipImgPopup .padding-sides-15{
	padding: 0px 15px;
}

.tooltipImgPopup .section .row{
	position: relative;
	overflow: hidden;
	margin: 15px auto !important;
	padding: 0px !important;
}
	.tooltipImgPopup .section .row .section70{
		float: left;
		width: 70%;
	}
	.tooltipImgPopup .section .row .section50{
		float: left;
		width: 50%;
	}
	.tooltipImgPopup .section .row .section33{
		float: left;
		width: 33.33%;
	}
	.tooltipImgPopup .section .row .section30{
		float: left;
		width: 30%;
	}
	.tooltipImgPopup .section .row .section25{
		float: left;
		width: 25%;
	}
		.tooltipImgPopup .section .row .section25 .maxWidth50{
			max-width: 50%;
			margin-bottom: 5px;
		}

.tooltipImgPopup .section .tableDivider{
	text-align: center;
}

.tooltipImgPopup .section .tableDivider .cell70{
	float: left;
	width: 70%;
}
.tooltipImgPopup .section .tableDivider .cell60{
	float: left;
	width: 60%;
}
.tooltipImgPopup .section .tableDivider .cell50{
	float: left;
	width: 50%;
}
.tooltipImgPopup .section .tableDivider .cell40{
	float: left;
	width: 40%;
}
.tooltipImgPopup .section .tableDivider .cell35{
	float: left;
	width: 35%;
}
.tooltipImgPopup .section .tableDivider .cell33{
	float: left;
	width: 33.33%;
}
.tooltipImgPopup .section .tableDivider .cell30{
	float: left;
	width: 30%;
}
.tooltipImgPopup .section .tableDivider .cell25{
	float: left;
	width: 25%;
}
.tooltipImgPopup .section .tableDivider .cell20{
	float: left;
	width: 20%;
}
.tooltipImgPopup .section .tableDivider .cell17-5{
	float: left;
	width: 17.5%;
}
.tooltipImgPopup .section .tableDivider .cell15{
	float: left;
	width: 15%;
}
.tooltipImgPopup .section .tableDivider .cell13{
	float: left;
	width: 13.33%;
}
.tooltipImgPopup .section .tableDivider .cell10{
	float: left;
	width: 10%;
}


.tooltipImgPopup .section .tableDivider .cellBig{
	text-align: left;
	font-weight: bold;
	color: #009EE1;
}

.tooltipImgPopup .section .tableDivider .headerRow{
	width: 100%;
	height: 80px;
	font-family: 'DINPro-Regular';
	font-size: 20px;
	font-weight: bold;
	color: #009EE1;
	border-bottom: 1px solid #FFF;
	line-height: 25px;
}
	.tooltipImgPopup .section .tableDivider .headerRow .cellBig{
		height: 80px;
		line-height: 105px;
	}
	.tooltipImgPopup .section .tableDivider .headerRow .cell{
		height: 80px;
		line-height: 105px;
		width: 17.75%;  /*DC PRIMA -> non c'era la width*/
	}

	.tooltipImgPopup .section .tableDivider .cellBigger .topTitle{
		width: 100%;
		height: 25px;
		text-align: center;
	}
	.tooltipImgPopup .section .tableDivider .cellBigger .bottomTitle{
		height: 55px;
		line-height: 55px !important;
	}

	.tooltipImgPopup .section .tableDivider .cell{
		text-align: center;
	}

.tooltipImgPopup .section .tableDivider .normalRow{
	width: 100%;
	height: 40px;
	font-family: 'DINPro-Regular';
	font-size: 16px;
	color: #FFF;
	border-bottom: 1px solid #FFF;
	line-height: 40px;
}


.tooltipImgPopup .section.legendKey h1 span{
	font-family: 'DINPro-Regular';
	font-size: 16px;
	font-weight: normal;
	color: #FFF;
	line-height: 24px;
}

.integrated {
	border: 1px solid #0071bb;
	color: #0071bb;
}
.standalone {
	border: 1px solid #18821C;
	color: #18821C;
}
.selected.integrated {
	border: 2px solid #0071bb;
	background-color: #0071bb;
}
.selected.standalone {
	border: 2px solid #18821C;
	background-color: #18821C;
}

#pendants li.current a h5,
#segments li.current a h5{
	color:#FE9602;
}
#pendants li a h5,
#segments li a h5{
	color:#000000;
	font-family: 'DINPro-Regular';
	/*line-height: 25px;*/
	line-height: 1.5;
	text-decoration: none;
	margin-top: 0px;
    margin-bottom: 0px;
    /*float: left;*/
    font-weight: bold;
}
.tooltip2 .tooltiptext.tooltipSU{
	min-width: 100% !important;
	width: auto;
	padding: 5px !important;
	opacity: 1 !important;
	margin-left: -50px;
	color: #000;
	left: 0%;
	text-align: left;
}
.tooltip2 .tooltiptext.tooltipSU .progress {
	margin-bottom: 0;
	margin-top: 0;
	position:relative;
	background-color: #dfdfdf;
	font-size: 12px;
    line-height: 20px;
    color: #428bca;
    text-align: center;
    top:0;
    left:0;
}
.tooltip2 .tooltiptext.tooltipSU .tooltipSUContainer {
	min-width: 100%;
	background-color: #FFF;
	padding: 0 0 5px 0;
	white-space: nowrap;
	line-height: 26px;
}
.tooltip2 .tooltiptext::after {
	border-color: #0071BB transparent transparent transparent;
}
.tooltip2 .tooltiptext.tooltipSU::after{
	left: auto;
	right: 40px;
}
.tooltip2 .tooltiptext.tooltipSU .tooltipSUContainer > p {
	margin: 0 10px 0 10px;
}
#segmentSection .segmentError h3 {
	color: #FF0000;
}

.headerContainer {
	display: flex;
	justify-content: center;
	background-color: #DEDEDE;
}

.headerContainer > div {
	padding: 7px;
}

.IamLogo {
	width: 101px;
}

.btnLoginIam > .IamLogo{
	vertical-align: text-bottom;
}

.btnLoginIam {
    border: 0;
    font-size: 15px;
    width: 200px;
    padding: 0;
    font-weight: bold;
   	background-color: transparent;
}

.linesContainer {
	padding: 0 30px 0 0;
}

.logoContainer {
	margin-top: 40px;
	text-align: right;
}

.lineDescription .btnLoginIamLine{
	float: right;
}
.btnLoginIamLine{
	background: #C7C7C7;
	line-height: normal;
	padding: 3px;
	color: #fff;
	font-family: 'DINPro-Regular';
	font-size: 20px;
	font-weight: bold;
	border-radius: 29px;
	text-align: center;
	margin: 0 auto;
	cursor: pointer;
	max-width: 360px;
}
.lineDescription .btnLoginIamLine{
	width: 300px;
}

.summaryTable {
	width: 100%;
}

.summaryTable > thead > tr {
	color: #0071BB;
	font-family: 'DINPro-Bold';
	text-transform: uppercase;
	background: #FFFFFF;
	background-color: #FFFFFF;
}
.summaryTable > tbody > tr{
	background-color: #F9F9F9;
	font-family: 'DINPro-Regular';
}
.summaryTable > thead > tr,
.summaryTable > tbody > tr {
	width:100%;
	min-height: 40px;
	border-bottom: 2px solid #E8E8E8;
	font-size: 16px;
}

.summaryTable td:first-child{
	padding-left: 10px;;
}

.p-r-10{
	padding-right: 10px !important;
}

.t-a-l{
	text-align: left !important;
}

@media screen and (max-width: 940px){
	.summaryTable > thead > tr,
	.summaryTable > tbody > tr {
		width:100%;
		min-height: 40px;
		border-bottom: 2px solid #E8E8E8;
    	background-color: #F9F9F9;
		font-family: 'DINPro-Regular';
		font-size: 13px;
	}
}


.summaryTable > thead > tr > td,
.summaryTable > tbody > tr > td {
	padding: 6px 0;
	vertical-align: middle;
}

.accImage img,
.summaryTable > tbody > tr > td img {
	width: 100%;
    min-width: 25px;
    min-height: 25px;
    max-width: 70px;
    max-height: 70px;
    object-fit: contain;
    mix-blend-mode: multiply;
}

.totalTable {
	width: 100%;
	margin-top: 10px;
	border:none;
	font-family: 'DINPro-Bold';
	font-size: 21px;
	color:#393939;
	/*font-weight: bold;*/
}

.totalTable.smallFont{
	font-family: 'DINPro-Regular';
	font-size: 16px;
	font-weight: normal;
}

@media screen and (max-width: 940px){
	.totalTable {
		width: 100%;
		margin-top: 10px;
		border:none;
		font-family: 'DINPro-Bold';
		font-size: 18px;
		color:#393939;
		/*font-weight: bold;*/
	}

	.totalTable.smallFont{
		font-size: 13px;
	}
}



.IamUsername {
	font-size: 15px;
	font-weight: bold;
}

.btnLogoutIam {
	border: 0;
    font-size: 15px;
    padding: 0;
    font-weight: bold;
   	background-color: transparent;
}

.btnLoginIam:hover,
.btnLogoutIam:hover {
	color: #EA6721;
}

#IamLogoutIamForm {
	display: inline-block;
}

.LogoutIamContainer > *:nth-child(odd) {
	padding-right: 4px;
}

.LogoutIamContainer > *:nth-child(even) {
	padding-left: 4px;
}

.LogoutIamContainer > *:not(:last-child){
	border-right: 1px solid #aaa;
}

.iamBar {
	width: 48%;
	margin-left: 52%;
	height: 37px;
}

.iamBar.withLateralBar {
	width: calc(100%);
	margin-left: 0;
	border-bottom: 2px solid black;
}
@media screen and (max-width: 940px){
	.viewContainer.withLateralBar{
		/*min-width: 640px;*/
	}
}

.viewContainer.withIamBar{
	height: calc(100% - 107px);
}
.viewContainer.withIamBarIntroduction{
	height: calc(100% - 37px);
}

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p,
blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins,
kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul,
li, fieldset, form, label, legend, table, caption, tbody, tfoot,
thead, tr, th, td, article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
    font-family: 'DINPro-Regular';
    /*font-size: 16px;*/
}

p
{
    font-size: 16px;
}

b, strong {
    font-family: 'DINPro-Bold';
}

h5, .h5 {
    font-size: 14px!important;
}

strong, b, th{
	font-weight: normal;
}

.bold{
	font-weight: bold;
}

.p-l-0 {
	padding-left: 0 !important;
}

.number-spinner {
	border-radius: 6px;
	border: 1px solid #CCCCCC;
	font-family: 'DINPro-Bold';
	max-width: 165px;
}
.number-spinner input {
	font-size: 18px;
	color: #393939;
	padding: 0 10px 0 10px;
	max-height: 42px !important;
}

input, select, button {
	outline: none !important;
}

.selectorContainer {
	text-align: right;
	margin-top: 100px;
}

.clearBoth {
	clear: both;
}

.fullWidth {
	width: 100%;
}

.t-a-center {
	text-align: center;
}

.max-w-50perc {
	max-width: 50%;
}

.m-b-10 {
	margin-bottom: 10px;
}


/* BTicino CSS App */

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}
.row-eq-height:before,
.row-eq-height:after {
	content: normal;
}
.col-flex {
	display: flex;
	flex-wrap: wrap;
}
.flex-column {
	flex-direction: column;
}
.col-flex-items-center {
	align-items: center;
}
.col-flex-items-start {
	align-items: flex-start;
}
.col-flex-items-end {
	align-items: flex-end;
}
.col-flex-content-start {
	justify-content: flex-start;
}
.col-flex-content-center {
	justify-content: center;
}
.col-flex-content-end {
	justify-content: flex-end;
}
.flex-grow-1 {
	flex-grow: 1;
}
.flex-1 {
	flex: 1;
}
hr {
	border-color: #ccc;
}

/* limit mobile devices */
@media (max-width:  991px) {
	/*.logo {
		margin: 0;
	}
	.logo > img {
		margin-left: auto;
		margin-right: auto;
	}*/
	.leftBar {
		width: 62px;
	}
	.leftBar .logo{
		margin: 10px 0 30px 0;
	}
	.leftBar .logo img{
		width: 100%;
	}
	.page-container.withLateralBar {
		width: calc(100% - 62px);
	}
	/*.step .stepCircleContainer {
		margin-right: 0;
	}
	.viewContainer.withLeftBar {
		width: calc(100% - 60px);
	}
	.popup-100 {
		padding: 25px;
	}

	table.quotationsTable tr > td.actions > button.btn-action-table {
		opacity: 1;
	}

	#accessoryPopup .popup-header .AccessoryPopupActionBottomContainer > button:not(:last-child) {
		margin-bottom: 5px;
	}*/
}

/* END BTicino CSS */
/* Cablofil CSS */

.form-group label {
	cursor: default;
	font-weight: normal;
	font-size: 16px;
}
.form-control {
	font-size: 14px;
	color: #393939;
	padding: 5px 10px;
	-webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: none;
    transition: none;
    border-color: #CCC;
    height: auto;
    border-radius: 6px;
}
.form-control:focus {
	border-color: #A7A7A7;
    -webkit-box-shadow: none;
    box-shadow: none;
}

textarea.resize-vertical {
	resize: vertical;
}

.disclaimer{
	text-align: justify;
    font-size: 12px;
    color: #999;
}

.privacy-banner {
	position: absolute;
	z-index: 1;
	width: 100%;
	padding: 5px;
	text-align: center;
	background: rgb(238, 238, 238);
	font-size: 16px;
}

.privacy-banner button.btn-link {
	padding: 0;
    line-height: inherit;
    vertical-align: baseline;
    border: 0;
    margin-left: 20px;
    font-size: inherit;
}

#homeConsentNotice{
	position: absolute;
    bottom: 30px;
    right: 30px;
}

#homeConsentNotice a{
	text-decoration: none;
	color: #ccc;
}

#groupLogo{
	position: absolute;
    bottom: 2em;
    width: 40%;
    text-align: right;
}
@media screen and (max-width: 570px){
	#groupLogo{
		width: 53%;
	}
}
@media screen and (max-width: 465px){
	#groupLogo{
		width: 63%;
	}
}
@media screen and (max-width: 380px){
	#groupLogo{
		width: 73%;
	}
}
.groupLogo{
	width: 50%;
}

.cablofil-hr {
	border-width: 2px;
	border-color: #0071BB;
}

.input-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}

.input-group-append, .input-group-prepend {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.input-group-prepend {
    margin-right: -1px;
}
.input-group>.input-group-prepend>.input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-group-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .375rem .75rem;
    margin-bottom: 0;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    background-color: #007dc5;
    border: 1px solid #ced4da;
    border-radius: 6px;
    cursor: default;
}

.input-group>.custom-select:not(:first-child), .input-group>.form-control:not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.input-group>.custom-file, .input-group>.custom-select, .input-group>.form-control {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    width: 1%;
    margin-bottom: 0;
}
.custom-select {
    display: inline-block;
    width: 100%;
    height: calc(2.25rem + 2px);
    padding: .375rem 1.75rem .375rem .75rem;
    line-height: 1.5;
    color: #495057;
    vertical-align: middle;
    background-size: 8px 10px;
    border: 1px solid #ced4da;
    border-radius: 6px;
    font-size: 1rem;
}
.mb-3 {
	margin-bottom: 1rem;
}

#compareTable {
	width: 100%;
	table-layout: fixed;
	vertical-align: middle;
}
#compareTable thead > tr {
	border-bottom: 2px solid #009EE1;
	font-family: 'DINPro-Regular';
	color: #009EE1;
	text-transform: uppercase;
	vertical-align: bottom;
}
#compareTable th.vertical {
    text-align:center;
    white-space:nowrap;
    transform-origin:50% 50%;
    transform: rotate(90deg);
}
#compareTable th.vertical:before {
    content:'';
    padding-top:110%;/* takes width as reference, + 10% for faking some extra padding */
    display:inline-block;
    vertical-align:middle;
}

.compatibilityTable {
	width: 100%;
	font-size: 14px;
}
.compatibilityTable th {
	font-family: 'DINPro-Bold';
	color: #009EE1;
	text-transform: uppercase;
}
.compatibilityTable tr {
	border-bottom: 1px solid #A0A0A0;
}
.compatibilityTable tr > th, .compatibilityTable tr > td {
	padding: 8px 0;
}

.finishing-legend {
	margin-top: 20px;
}

.accessorySectionContainer {
	padding-bottom: 20px;
	margin-bottom: 10px;
	border-bottom: 2px solid #DBDBDB;
}
.segmentInputContainer {
	margin-bottom: 20px;
}

.segment-input-checkbox {
	display: block;
	position: relative;
	cursor: pointer;
	padding-left: 25px;
	font-weight: normal;
	font-size: 18px;
}
.segment-input-checkbox  input[type="checkbox"]{
	position: absolute;
    z-index: -1;
    opacity: 0;
    width: 20px !important;
}
.segment-input-checkbox .checkbox-indicator {
	position: absolute;
    top: 3px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #eee;
}

.accessoryImageContainer > img {
	max-width: 100%;
	height: auto;
}

.reference > img {
    width: 75%;
    object-fit: cover;
}

.draw > img {
	width: 100%;
    height: 100%;
    object-fit: cover;
}

.tooltipLinkCatalog {
	position: relative;
    display: inline-block;
}
.tooltipLinkCatalog .tooltiptext {
	visibility: hidden;

	white-space: nowrap;
	position: absolute;
	background-color: #0071BB;
	color: white;
	text-align: center;
    border-radius: 6px;
    padding: 10px 10px;

	right: -18%;
	bottom: 125%;
	z-index: 1;
}
.tooltipLinkCatalog .tooltiptext::after {
	content: "";
	top: 100%;
    right: 5%;
    position: absolute;
    border: 5px solid;
    border-color: #0071BB transparent transparent transparent;
}
.tooltipLinkCatalog:hover .tooltiptext {
	visibility: visible;
}

.m-l-25{
	margin-left: 25px!important;
}
/* checkbox Css */
.custom-control {
    position: relative;
    display: block;
    min-height: 1.5rem;
    padding-left: 1.5rem;
}

.custom-checkbox .custom-control-input:disabled:checked~.custom-control-label::before {
    background-color: #F36F23;
}

.checkboxContainer {
    display: block;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    /*font-size: 18px;*/
    font-weight: normal;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.checkboxContainer input[type="checkbox"] {
    position: absolute;
    /*opacity: 0;*/
    cursor: pointer;
    /*display: none;*/
}
.checkboxCheckmark {
    position: absolute;
    top: 1px;
    left: 0;
    height: 25px;
    width: 25px;

    border: 1px solid #ccc;
    border-radius: 8px;

    background-color: #fff;
    -webkit-transition: background-color 0.3s, border-color 0.3s;
    transition: background-color 0.3s, border-color 0.3s;
}
.checkboxContainer:hover input ~ .checkboxCheckmark {
    background-color: #ccc;
}
.checkboxContainer input:checked ~ .checkboxCheckmark {
    background-color: #0071BB;
    border-color: #0071BB;
}
.checkboxCheckmark:after {
    content: "";
    position: absolute;
    display: none;
}
.checkboxContainer input:checked ~ .checkboxCheckmark:after {
    display: block;
}
.checkboxContainer .checkboxCheckmark:after {
    left: 8px;
    top: 5px;
    width: 7px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
/* END checkbox Css */

.m-t-20{
	margin-top: 20px;
}

.m-t-35{
	margin-top: 35px;
}
.p-r-5{
	padding-right: 5px;
}
table.quotationsTable tr > td.actions > button.btn-action-table {
    /*opacity: 0;*/
    margin: 2px 1px 2px 1px;
}

.btn-action-table, .btn-action-table:focus, .btn-action-table:hover {
    color: #0071BB;
    border: 1px solid #DEDEDE;
    background-color: transparent;
    padding: 0;
    line-height: 1;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    transition: opacity 0.2s, color 0.2s, border-color 0.2s;
}
.popup-100 {
    position: absolute;
    width: 100%;
    min-height: 100%;
    overflow: auto;
    background-color: red;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.93);
    z-index: 99;
}
.PopupContainer {
    background-color: #F9F9F9;
    text-align: center;
    padding: 20px;
    border: 2px solid #DEDEDE;
    border-radius: 10px;
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

.th-title{
	text-transform: uppercase;
    color: #0071bb;
}

.headerContainerError{
	display: flex;
	justify-content: center;
	background-color: #fddddd;
	color: #bb211e;
}

.headerContainerError > div {
	padding: 7px;
}

.pointer{
	cursor:pointer;
}

.btn .caret {
    margin-left: 10px;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #d1193a;
    border-color: #d1193a;
}
/* END Cablofil CSS */

.cartContainer{
	display: inline-flex;
}

.rexelNLBtn,
.cebeoBtn{
	border: 1px solid #d1193a;
    color: #d1193a;
    text-decoration: none;
}
.cebeoBtn input{
	padding:0px;
	height: 100%;
	width: 100%;
	border: 0px;
	background-color: transparent;
}

#submitXmlTest #xml{
	display:none;
}

.rexelBeBtn{
	background: #a4bb25 !important;
	border: 1px solid #a4bb25 !important;
    text-decoration: none;
    color: #fff !important;
    font-family: "Open Sans",sans-serif;
	font-weight: 700
}

#elbridgeForm input[type="submit"]{
	color: #fff;
    background-color: #0a297d;
	border: 1px solid #0a297d;
    text-decoration: none;
    height: 44px;
    min-width: 175px;
    margin: 2.5px 5px 2.5px 0;
    border-radius: 4px;
}

.bticino-dropdown {
	width: 100%;
}

.bticino-dropdown button.dropdown-toggle {
	width: 100%;
	display: flex;
	align-items: center;
}

.bticino-dropdown button.dropdown-toggle .glyphicon-container {
	margin-left: auto;
}

.bticino-dropdown .dropdown-menu {
	min-width: 100%;
}

.bticino-dropdown img {
	margin-right: 5px;
}

.p-t-25{
	padding-top: 25px!important;
}

.form-check-label{
	font-size: 18px;
}

.d-flex{
	display: flex;
}
.flex-row{
	flex-direction: row;
}
.flex-nowrap{
	flex-wrap: nowrap;
}
.flex-wrap{
	flex-wrap: wrap;
}
.w-100{
	width: 100%;
}

.brackets-container.blue-border{
	border: 2px solid #0071BB;
	border-radius: 6px;
	padding: 15px;
}

.vertical-line.blue-border{
	border: 0.5px solid #0071BB;
	margin: 10px 30px;
}

.justify-content-center{
	justify-content: center	;
}

.justify-content-between{
	justify-content: space-between	;
}
.justify-content-around{
	justify-content: space-around	;
}
.justify-content-evenly{
	justify-content: space-evenly	;
}
.cursor-pointer{
	cursor: pointer;
}
.grey-text{
	color: grey;
}
.m-t-0{
	margin-top: 0;
}

.form-group.brackets-length label,
.form-group.brackets-family label{
	margin-bottom: 10px;
}

select#bracketsLengthSelect{
	height: 74px;
}

@media screen and (max-width: 1535px){
	.form-group.brackets-family,
	.form-group.brackets-length	{
		width: 100%;
	}
}

@media screen and (max-width: 600px){
	.pendants-responsive-row{
		flex-wrap: wrap;
	}

	.vertical-line.blue-border{
		border-color: transparent;
	}
}

.m-t-auto{
	margin-top: auto;
}

.panel-group .accessories-accordion-group .panel-heading + .panel-collapse > .panel-body{
	border-top: none;
}

.accessories-accordion-group .panel-body{
	padding: 0;
}

.accessories-accordion-group{
	border: none;
}

.accessories-accordion-group .accordion-toggle{
	text-decoration: none;
}

.accessories-accordion-group .panel-heading{
	color: transparent;
    background: transparent;
    border: transparent;
    padding: 0;
}

.cablobend-single-icons{
	height: 80px;
	width: 80px;
}

.cablobend-double-icons{
	height: 80px;
	width: 160px;
}

.table-vertical-alig {
	vertical-align: middle!important;
}

.invert-color {
	filter: invert(100%);
}

.qr-code-image {
	min-width: 100px;
	min-height: 100px;
}

p.tooltip2 {
	min-height: 32px;
    min-width: 32px;
	padding-top: 5px;
}