@keyframes slide-in {
  0% {
    transform: translateY(400%);
    opacity: 0;
  }
  50% {
	opacity: 0;
  }
  100% {
    transform: translateY(0%);
    opacity: 1;
  }
}

@keyframes slide-left {
  0% {
    transform: translateX(-200%);
    opacity: 0;
  }
  50% {
	opacity: 0;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}

@keyframes slide-right {
  0% {
    transform: translateX(200%);
    opacity: 0;
  }
  50% {
	opacity: 0;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}

@keyframes fade-in {
	0% {
    	opacity: 0;
  	}
  	100% {
    	opacity: 1;
  	}	
}

/*@font-face {
    font-family: 'Quicksand';
    src: url('font/Quicksand-SemiBold.ttf') format('truetype'),
    	 url('font/Quicksand-SemiBold.woff') format('woff');
}

@font-face {
    font-family: 'Montserrat';
    src: url('/font/Montserrat-ExtraLight.ttf')  format('truetype'),
	     url('/font/Montserrat-ExtraLight.woff')  format('woff');
}
*/
html {
	height: 100vh;
}

body {	
    /*font-family: 'Hind', sans-serif;*/
    /*font-family: Helvetica;*/
    font-family: 'Montserrat', sans-serif;
	/*background-color: #3becf3;*/
	/*background: rgb(2,0,36);*/
	/*background: linear-gradient(45deg, rgb(8, 21, 173) 0%, rgb(46, 46, 212) 15%, rgb(2, 234, 252) 100%);*/
	/*background-image: url('../images/main-bg.jpg');*/
	background-size: cover;
/*	overflow: hidden;*/
	margin: 0;
	padding: 0;
	font-weight: 300;
}


a {
	color: inherit;
	text-decoration: inherit;
}

form {
	margin: 0;
	padding: 0;	
}

svg {
	display: block;
}

h1 {
	font-family: 'Quicksand', sans-serif;
	margin: 0;
	padding: 20px;
}

h2 {
	font-family: 'Quicksand', sans-serif;
	margin: 0;
	padding: 20px 0;
	font-size: 2.2em;
}

.slide-from-left {
	animation: 0.6s slide-left both ease !important;
}

.slide-from-right {
	animation: 0.6s slide-right both ease !important;
}

/* Width handling*/

.s-12 {
	width: 100%;
}

/**/


.z-depth-1 {
	-webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.z-depth-2 {
	-webkit-box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.3);
	box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.3);
}

.z-depth-3 {
	-webkit-box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);
	box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14),0 3px 14px 2px rgba(0,0,0,0.12),0 5px 5px -3px rgba(0,0,0,0.2);
}

.z-depth-4 {
	-webkit-box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),0 6px 30px 5px rgba(0,0,0,0.12),0 8px 10px -7px rgba(0,0,0,0.2);
	box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),0 6px 30px 5px rgba(0,0,0,0.12),0 8px 10px -7px rgba(0,0,0,0.2);
}

.hidden {
	display: none;
}

.super-hidden {
	display: none !important;
}

/* Use this along with an element that can have overflow hidden
	Remember to set this properties to the element to animate:;
	max-height: 10000px;
	overflow: hidden;
	transition: max-height 0s step-end 0s, opacity 0.3s ease 0s;
*/
.no-size-hidden {
	max-height: 0px !important;
	opacity: 0;
	transition: max-height 0s step-end 0.3s, opacity 0.3s ease 0s !important; 
}

.button {
	padding: 10px 15px;
	background-color: #26b669;
	border-radius: 3px;
	cursor: pointer;
	font-size: 1.3em;
	-webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
    -webkit-box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 2px 0 rgba(0, 0, 0, 0.2);            
	transition: all 0.3s ease 0s;
}

.button:hover {
	background-color: #169c54;
}

.button:active {
	background-color: #039044;
}

.dialog-backboard {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(0,0,0,0.6);
	z-index: 10000;
	/*pointer-events: none;*/
	max-height: 10000px;
	overflow: hidden;
	transition: max-height 0s step-end 0s, opacity 0.3s ease 0s;
}

.dialog-backboard .x-close {
	position: absolute;
	right: 15px;
	top: 10px;
	font-size: 4em;
	color: #fff;
	transform: rotate(45deg);
	cursor: pointer;
	line-height: 40px;
	width: 35px;
	padding-top: 8px;
	overflow: hidden;
	border-radius: 50%;
	transition: color 0.3s ease 0s;
}

.dialog-backboard .x-close:hover {
	color: #dedede;
}

.dialog {
	max-width: 75vw;
	margin: 0 auto;
	margin-top: 0px;
	background-color: #f1fbff;
	border-radius: 5px;
	padding: 20px;
	max-height: 80vh;
	margin-top: 35vh;
	transform: translateY(-50%);
}

.dialog h2 {
	margin: 0;
}

.dialog .button.bottom-right {
	display: table;
	margin-right: 0;
	margin-left: auto;
	margin-top: 12px;	
}

.field {
	margin: 5px 0;
	display: inline-grid;
}

.field label {
	display: block;
	font-size: 1.1em;
}

.field input {
	width: calc(100% - 24px);
	font-size: 1.2em;
	border-radius: 4px;
	border: solid 1px #ccc;
	padding: 7px;
	margin: 0 5px;
}

nav.main-nav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 40px;
	background-color: white;
	color: #25a4aa;
	-webkit-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);
	box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2);
	z-index: 10;
	font-weight: 200;
	display: flex;
	justify-content: space-between;
	/*display: none;*/
}

nav.main-nav .logo {
	display: flex;
	margin-left: 15px;
	align-items: center;

}

nav.main-nav .logo img,
nav.main-nav .logo svg {
	height: 32px;
	width: auto;
	margin-right: 5px;
}

nav.main-nav .logo span {
	font-weight: 300;
}

nav.main-nav ol {
	list-style: none;
	margin: 0 30px;
	padding: 0;
	display: flex;
	line-height: 40px;
	justify-content: flex-end;
}

nav.main-nav ol li {
	padding: 0 10px;
	cursor: pointer;
	transition: all 0.3s ease 0s;
	-webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
}
nav.main-nav ol li:hover {
	background-color: #c1e1ed;
}

nav.main-nav ol.mobile-menu {
	display: none;
}

.menu-bars-nav {
	transition: all 0.3s ease 0s;
	font-size: 1.4em;
}

.mobile-menu.active .menu-bars-nav {
	transform: rotate(90deg);
}

.main-container {
	width: 100%;
	margin: 0 auto;
	margin-top: 40px;
	min-height: calc(100vh - 88px);
}

.main-container.bg-01{
	background-image: url('../images/bg-03.jpg');
	background-size: cover;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

.main-container.bg-01 h1 {
	color: #fff;
}

.vertical-center {
	margin-top: 50vh;
	transform: translateY(-50%);
}

.pre-launch-logo {
	width: 33vh;
	display: block;
	margin: 0 auto;
	/*margin-top: calc(40px + 5vh);*/
	background-color: rgba(10,10,10,0.6);
	/*background-color: rgba(255,255,255,0.9);*/
	padding: 40px;
	border-radius: 50%;
	animation: 1s fade-in;
}

.slogan {
	color: white;
	font-size: 2em;
	font-weight: bold;
	margin: 0 auto;
	text-align: center;
	margin: 30px;
	animation: 0.5s fade-in 0.5s both;
}

.cards {
	display: flex;
	max-width: 800px;
	margin: 0 auto;
}

.card {
	flex: 1;
	margin: 0 35px;
	padding: 10px;
	border-radius: 5px;
	/*background-color: #09d5aa;*/
	background-color: #009b7a;
	/*background: linear-gradient(45deg, rgb(0, 155, 122) 0%, rgb(9, 213, 170) 100%);*/
	background: linear-gradient(45deg, rgb(0, 105, 117) 0%, rgb(9, 213, 170) 100%);
	animation: 0.6s slide-in both ease;
	transition: all 0.4s ease 0s;
}

.card:nth-child(1){
	animation-delay: 1s !important;
}
.card:nth-child(2){
	animation-delay: 1.5s !important;
}
.card:nth-child(3){
	animation-delay: 2s !important;
}

.card:hover {
	background: linear-gradient(45deg, rgb(1, 126, 140) 0%, rgb(2, 236, 187) 100%);
}

.card:active {
	background: linear-gradient(45deg, rgb(2, 84, 94) 0%, rgb(13, 176, 142) 100%);
}

.card-image {
	width: 100px;
	margin: 0 auto;
	text-align: center;
	display: block;
	padding: 10px;
}

.card-title {
	color: #fff;
	display: block;
	text-align: center;
	font-size: 1.4em;
}

.notification {
  background-color: #fff;
  border-radius: 4px;
  display: flex;
  align-items: stretch;
  transition: all 0.4s ease 0s;
  z-index: 10000;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.notification .content {
  max-width: 200px;
}

.notification h1 {
  margin: 0px;
  margin-bottom: 5px;
  font-size: 1.1em;
}

.notification .message {
  font-size: 0.9em;
}

.pos-bottom-right {
  position: fixed;
  bottom: 15px;
  right: 15px;
}

.notification div {
}

.notification .content {
  padding: 10px;
}

.notification .button {
  border-left: solid 1px #ccc;
  padding: 10px;
  display: flex;
  align-items: center;
  max-width: 50px;
  transition: all 0.3s ease 0s;
  cursor: pointer;
  border-radius: 0px 4px 4px 0;
  -webkit-user-select: none; /* Safari */
         -khtml-user-select: none; /* Konqueror HTML */
           -moz-user-select: none; /* Firefox */
            -ms-user-select: none; /* Internet Explorer/Edge */
                user-select: none;
}

.notification .button:hover {
  background-color: #dedede;
}
.notification .button:active {
  background-color: #bbb;
}

.pos-bottom-right.outbound {
  right: -100%;
}

.section .content {
	width: 85vw;
	margin: 0 auto;
}

.section.intro-s {
	/*height: 40vh;*/
	display: flex;
	align-items: center;
	background-image: url(../images/home-main-banner.jpg);
	background-attachment: fixed;
	background-size: cover;
	background-position-y: -130px;	
	padding-top: 50px;
	padding-bottom: 30px;
	display: flex;
	flex-direction: column;
	background-position-x: center;
}

.section.intro-s span{
	text-align: center;
	display: block;
	margin: 0 auto;
	font-size: 2.5em;
	color: #fff;
}

.section.pillar-s {
	/*background-color: #fff;*/
	background-color: #243546;
	background: linear-gradient(25deg, #243546 0%,#263e56 50%,#2d5277 99%);
	/*padding: 50px;*/
	color: #fff;
	/* As of now, we will work with a fixed height for the pillars panel*/
	height: 452px;
}

.section.pillar-s .content {
	width: auto;
}

.pillar-s .content {
	display: flex;
	justify-content: space-between;
	overflow-x: hidden;
}

.pillar-s .left-panel {
	padding: 0px;
	/*padding-left: calc(15vw + 15px);*/
	position: relative;
	overflow: hidden;
	flex-grow: 1;
}

.pillar-s .left-panel h2{
	font-size: 2.2em;
}

.pillar-s .left-panel span{
	font-size: 1.3em;
	display: block;
	margin-bottom: 20px;
}

.pillar-s .left-panel img{
	margin: 0 auto;
	display: block;
}

.pillar-s .left-panel .panel-card {
	position: absolute;
	height: 452px;
	padding: 0.01px;
	padding-left: calc(15vw + 15px);
	padding-right: 30px;
	top: 0;
	left: 200%;
	background: linear-gradient(25deg, #243546 0%,#263e56 50%,#2d5277 99%);
	transition: all 0.6s ease 0s;
	z-index: 0
}

.pillar-s .left-panel .panel-card.displaying {
	position: relative;
	left: 0;
	z-index: 1;
}

.pillar-s .left-panel .panel-card.comfort-pillar,
.pillar-s .left-panel .panel-card.security-pillar,
.pillar-s .left-panel .panel-card.sustainability-pillar{
	display: flex;
	align-items: center;
}

.pillar-s .left-panel .panel-card.comfort-pillar img,
.pillar-s .left-panel .panel-card.security-pillar img,
.pillar-s .left-panel .panel-card.sustainability-pillar img{
	padding: 0 30px;
	height: 80%;
	/*flex-basis: 0;*/
}

.pillar-s .left-panel .panel-card.comfort-pillar span,
.pillar-s .left-panel .panel-card.security-pillar span,
.pillar-s .left-panel .panel-card.sustainability-pillar span{
	font-size: 2em;
}

.pillar-s .right-panel {
	-webkit-box-shadow: -4px 0px 4px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: -4px 0px 4px 0px rgba(0,0,0,0.3);
	box-shadow: -4px 0px 4px 0px rgba(0,0,0,0.3);
	padding-left: 30px;
	padding-right: 15vw;
	background-color: #2f3440;
	z-index: 2;
}

.pillar-s .cards {
	flex-direction: column;
	padding: 10px;
}

.pillar-s .cards .card {
	margin: 15px;
	cursor: pointer;
}

.pillar-s .cards .card .card-image {
	width: 50px;
}

.pillar-s .cards .card .card-title {
	font-size: 1.2em;
}

.no-pillar > img {
	max-width: 100%;
}

.section.smart-home-s .content{
	display: flex;
	margin: 30px auto;
	align-items: center;
}

.section.smart-home-s .content .smart-home-content {
	flex: 1;
}

.section.smart-home-s .content .smart-home-content.left {
	padding-right: 30px;
	margin-right: 30px;
	border-right: solid 5px;
}

.section.smart-home-s .content .smart-home-content img {
	width: 100%;
}

.section.smart-home-s .smart-home-content h2 {
	text-align: center;
	font-size: 2.2em;
}

.section.smart-home-s .smart-home-content div {
	font-size: 1.3em;
	text-align: center;
	line-height: 1.6em;
}

.section.infographic-s h2 {
	text-align: center;
	font-size: 2em;
	margin-top: 50px;
/*	display: block;*/
	margin-bottom: 15px;
}

.section.infographic-s svg{
	width: 100%;
	height: 100%;
	display: block;
}

#IG-EmbededDevices,
#IG-EasyExpansion,
#IG-GasLeakDetection,
#IG-IdealIlumination {
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: opacity 0.4s ease 0.2s;
	-webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
}

#IG-EmbededDevices:hover,
#IG-EasyExpansion:hover,
#IG-GasLeakDetection:hover,
#IG-IdealIlumination:hover {
	opacity: 1;
	transition: opacity 0.4s ease 0s;
}

#IG-DevicesHighlights {
	opacity: 0;
	transition: opacity 0.4s ease 0.2s;
}

#IG-BaseHover {
	opacity: 0;
}

#IG-BaseHover:hover ~ #IG-DevicesHighlights {
	opacity: 1;
}

.product-carrousel {
	display: grid;
	grid-template-columns: 50px 1fr 50px;
	grid-template-areas: "leftcontrol product rightcontrol";
}

.product-list {
	display: grid;
	/*grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));*/
	grid-template-columns: repeat(2, minmax(100px, 1fr));
	grid-gap: 20px;
	padding: 20px;
	width: 85%;
	margin: 0 auto;
}

.product-carrousel .product-list {
	grid-template-columns: 1fr;
	width: auto;
	width: calc(100% - 40px);
	overflow: hidden;
	position: relative;
}

.product-carrousel .controls {
	align-self: center;
	text-align: center;
	font-size: 2em;
	cursor: pointer;
}

.product-carrousel .left-control {
	grid-area: leftcontrol;
}

.product-carrousel .right-control {
	grid-area: rightcontrol;
}

.product-item {
	display: grid;
	grid-template-columns: 250px 1fr;
	grid-template-rows: min-content 1fr min-content;
	grid-template-areas:
	"image title"
	"image desc"
	"image extrainfo";
	transition: all 0.4s ease 0s;
	-webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none;
    cursor: pointer;
    padding: 10px;
    background-color: #fff;
}

.product-item.z-depth-2:hover {
	-webkit-box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),0 6px 30px 5px rgba(0,0,0,0.12),0 8px 10px -7px rgba(0,0,0,0.2);
	box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14),0 6px 30px 5px rgba(0,0,0,0.12),0 8px 10px -7px rgba(0,0,0,0.2);
}

.product-item .product-image {
	grid-area: image;
	align-self: center;
}

.product-item .product-image img {
	width: 230px;
	height: 230px;
	display: block;
	/*padding: 20px;*/
}

.product-item h2 {
	grid-area: title;
	margin: 0;
	padding: 10px;
	/*align-self: center;*/
	font-family: Montserrat;
	font-weight: 500;
	border-bottom: solid 2px;
}

/*removed from product list at this moment*/
.product-item .pillar-score {
	align-self: center;
	grid-area: pillars;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	justify-items: center;
}

.product-item .product-description {
	grid-area: desc;
	padding: 10px;
	font-weight: 300;
	line-height: 1.5em;
}

.product-item .product-extra-info {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto;
	grid-template-areas: "documents msrp";
}

.product-item .product-documents {
	grid-area: documents;
	padding: 10px;
	align-self: end;
	text-align: center;
	display: flex;
	justify-content: center;
}

.product-item .product-price {
	grid-area: msrp;
	padding: 10px;
	align-self: end;
	text-align: center;
	display: flex;
	justify-content: center;
	font-family: Lato;
}

.product-price-inner {
	padding: 13px;
	border-radius: 50px;
	/*background-color: #29b094;*/
	background-color: #0d9fcf;
	color: #fff;
}

.product-price-inner .currency {
	font-size: 0.8em;
}

.product-price-inner .currency-integer {
	font-size: 1.2em;
	font-weight: bold;
}

.product-carrousel .product-list .product-item {
	/*position: absolute;*/
	top: 0;
	/*left: 200%;*/
	transition: none;
	display: none;
}

.product-carrousel .product-item.from-left {
	left: -200%;
	display: grid;
	position: relative;
}

.product-carrousel .product-item.from-right {
	left: 200%;
	display: grid;
	position: relative;
}

.product-carrousel .product-item.displaying {
	position: relative;
	/*transition: all 0.4s ease 0s;*/
	left: 0;
	display: grid;
}

.product-carrousel .product-item.leaving {
	position: absolute;
	/* The padding adjustment is due the fact that when we change to absolute positioning the content dislocates a bit*/
	padding: 30px;
}

/*.product-carrousel .product-list .product-item.from-left {

}*/

.product-carrousel .product-item.out-to-left {
	position: absolute;
	left: -200%;
}

.product-carrousel .product-item.out-to-right {
	position: absolute;
	left: 200%;
}

.pillar {
	display: flex;
}

.pillar-score .pillar .pillar-img-container{
	padding: 10px;
	/*background: linear-gradient(45deg, rgb(1, 126, 140) 0%, rgb(2, 236, 187) 100%);*/
	background-color: #29b094;
	border-radius: 50%;
}

.pillar-score .pillar img {
	width: 50px;
}

.score-container {
	margin: 0 5px;
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}

.score-container > div {
	border-radius: 10px;
	background-color: #ccc;
	width: 20px;
	height: 10px;
}

.score-container .score-bar-empty {

}

.score-container .score-bar-filled {
	/*background: linear-gradient(45deg, rgb(1, 126, 140) 0%, rgb(2, 236, 187) 100%);*/
	background: rgb(50, 210, 177);
}

footer {
	background-color: #181f26;
	display: flex;
	color: #fff;
	align-items: center;
	justify-content: center;
}

footer .logo img{
	width: 28px;
	padding: 10px;
	display: block;
}

footer ul {
	list-style: none;
	font-weight: bold;
	font-size: 0.8em;
	padding: 0;
}

footer ul li {
	padding: 5px;
}

@media (min-width: 601px){
	.m-6 {
		width: calc(50% - 2px);
	}
}

@media (min-width: 993px){
	.l-12 {
		width: 100%;
	}

}

@media (min-width: 1201px){
	
}

@media (max-height: 800px){

	body {
		overflow: auto;
	}

	.card {
		animation: 1s fade-in 1s both ease;
	}
}

@media (max-width: 1024px) {
	.pillar-s .left-panel .panel-card {
		padding-left: calc(5vw + 15px);
	}
	.pillar-s .right-panel {
		padding-right: 5vw;
	}
}

@media (max-width: 800px) {

	.section.intro-s {
		/*background-image: url(../images/home-main-banner.jpg);*/
		background-attachment: initial;
		background-size: auto 100%;
		padding-top: 0px;
		padding-bottom: 30px;
		background-position-x: 36%;
		background-position-y: 0;
	}

	.section.pillar-s {
		height: auto;
	}

	.pillar-s .content {
		flex-direction: column;
	}

	.pillar-s .cards {
		flex-direction: row;
	}

	.section.smart-home-s .content .smart-home-content.right{
		padding-left: 30px;
		border-left: solid 5px;
	}

	.section.smart-home-s .content .smart-home-content.left{
		/*padding-right: 0;*/
		margin-right: 0;
		border-right: none;
	}

	.section.infographic-s {
		display: none;
	}

}

@media (max-width: 600px) {

	body:before {
		content: "";
		display: block;
		position: fixed;
		left: 0;
		top: 0;
		/*width*/: 100%;
		/*height: 100%;*/
		bottom: -40px;
		right: 0;
		z-index: -10;
		/*background: url('../images/main-bg.jpg') no-repeat center center;*/
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
	body {
		background: none;
		overflow-x: hidden;
	}

	nav.main-nav ol li:hover  {
		background-color: transparent;
	}

	nav.main-nav ol:not(.mobile-menu) {
		position: fixed;
		right: -100%;
		top: 40px;
		display: block;
		bottom: 0;
		background-color: rgba(255,255,255, 0.95);
		margin: 0;
		width: 100%;
		transition: all 0.3s ease 0s;
	}

	nav.main-nav ol:not(.mobile-menu) li {
		font-size: 1.5em;
		text-align: center;
		margin: 10px 0;
		padding: 10px;
		font-weight: normal;
	}

	nav.main-nav ol.mobile-menu {
		display: flex;
	}

	nav.main-nav ol.mobile-menu.active {

	}

	nav.main-nav ol.mobile-menu.active + ol {
		right: 0;
	}

	.main-container {
		width: 100%;
	}

	.vertical-center {
		margin: 0 auto;
		transform: none;
	}

	.pre-launch-logo{
		margin-top: calc(40px + 5vh);
	}

	.section.smart-home-s .content {
		flex-direction: column;
	}

	.pillar-s .left-panel .panel-card.comfort-pillar, .pillar-s .left-panel .panel-card.security-pillar, .pillar-s .left-panel .panel-card.sustainability-pillar {
		flex-direction: column;
		padding-bottom: 20px;
	}

	.pillar-s .right-panel {
		padding: 0;
	}

	.pillar-s .cards .card .card-title {
		display: none;
	}

	.pillar-s .cards {
		flex-direction: row;
		padding: 0;
	}

	.pillar-s .cards .card {
		margin: 10px;
	}

	.pillar-s .left-panel .panel-card {
		height: auto;
	}

	.panel-card.no-pillar.displaying{
		padding-bottom: 20px;
	}

	.pillar-s .left-panel .panel-card.comfort-pillar img, .pillar-s .left-panel .panel-card.security-pillar img, .pillar-s .left-panel .panel-card.sustainability-pillar img {
		padding: 0;
		height: 280px;

	}

	.section.smart-home-s .content .smart-home-content.right {
		padding: 0;
		border-left: none;
		border-top: solid 5px;
	}

	.section.smart-home-s .content .smart-home-content.left {
		padding: 0;
		margin: 0;
		border: none;
		padding-bottom: 30px;
	}

	.product-list {
		grid-template-columns: 1fr;
	}

	.product-item {
		grid-template-columns: 1fr;
		grid-template-areas:
			"title"
			"image"
			"desc"
			"extrainfo";
	}

	.product-item .product-image img {
		margin: 0 auto;
	}


	/* this is just a temp solution while we dont have the documents for download */
	.product-item .product-extra-info {
		grid-template-columns: 1fr;
		grid-template-areas: "msrp";
	}

	.product-item .product-documents {
		display: none;
	}
	/* end of tmep solution */

}



.loading-overlay {
	/*display: none;*/
	max-height: 0px !important;
	opacity: 0;
	transition: max-height 0s step-end 1.2s, opacity 0.2s ease 0s !important; 
}