@font-face{font-family:"circular";src:url("../fonts/lineto-circular-bold.eot");src:url("../fonts/lineto-circular-bold.eot?#iefix") format("embedded-opentype"),
url("../fonts/lineto-circular-bold.woff") format("woff"),
url("../fonts/lineto-circular-bold.ttf") format("truetype"),
url("../fonts/lineto-circular-bold.svg#lineto-circular-bold") format("svg");
font-weight:normal;
font-style:normal
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}
body {
    margin: 0
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}
audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}
audio:not([controls]) {
    display: none;
    height: 0
}
[hidden],
template {
    display: none
}
a {
    background-color: transparent
}
a:active,
a:hover {
    outline: 0
}
abbr[title] {
    border-bottom: 1px dotted
}
b,
strong {
    font-weight: bold
}
dfn {
    font-style: italic
}
h1 {
    font-size: 2em;
    margin: 0.67em 0
}
mark {
    background: #ff0;
    color: #000
}
small {
    font-size: 80%
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}
sup {
    top: -0.5em
}
sub {
    bottom: -0.25em
}
img {
    border: 0
}
svg:not(:root) {
    overflow: hidden
}
figure {
    margin: 1em 40px
}
hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0
}
pre {
    overflow: auto
}
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}
button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}
button {
    overflow: visible
}
button,
select {
    text-transform: none
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
}
button[disabled],
html input[disabled] {
    cursor: default
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}
input {
    line-height: normal
}
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto
}
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em
}
legend {
    border: 0;
    padding: 0
}
textarea {
    overflow: auto
}
optgroup {
    font-weight: bold
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
td,
th {
    padding: 0
}
body {
    margin: 0;
    padding: 0;
    background: #00bff3;
    font-size: 20px;
    font-family: circular, sans-serif;
    color: #1d1d1b
}
a {
    color: #1d1d1b
}
::-webkit-input-placeholder {
    color: #666
}
::-moz-placeholder {
    color: #666
}
:-ms-input-placeholder {
    color: #666
}
input:-moz-placeholder {
    color: #666
}

.scenes {
    position: relative;
    margin-left: 0 auto;
    width: 100%
}
.items {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%
}
.overflow {
    width: 100%;
    overflow: hidden;
    position: relative
}

.topcornerContact {
    position:absolute;
    top: 25px;
    right: 50px;
    border-radius: 50%;
    background: #00ccff;
    z-index: 20;
    width: 100px;
    height: 100px;
    box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}

.topcornerContact:active {
 
    box-shadow: -2px 2px 2px 0 rgba(0, 0, 0, 0.5), -2px 2px 5px 0 rgba(0, 0, 0, 0.2);
}









.popupContactContainer {
    background-color: #313131;
    display: none;
    height: 100%;
    left: 0;
    opacity: 0.95;
    overflow: auto;
    position: fixed;
    top: 0;
    width: 100%;
	z-index: 200;
}

.close {
    cursor: pointer;
    position: absolute;
    right: -14px;
    top: -14px;
}
.popupContactForm {
    font-family: Helvetica,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #00444E;
    left: 50%;
    margin-left: -202px;
    position: absolute;
    top: 17%;
}
.popupContactForm form {
    background-color: white;
    border: 2px solid gray;
    border-radius: 10px;
    font-family: Helvetica,Arial,sans-serif;
    max-width: 300px;
    min-width: 250px;
    padding: 10px 50px;
}

.popupContactForm h2 {
    background-color: #feffed;
    border-radius: 10px 10px 0 0;
    margin: -10px -50px;
    padding: 20px 35px;
    text-align: center;
}
.popupContactForm hr {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #ccc -moz-use-text-color -moz-use-text-color;
    border-image: none;
    border-style: solid none none;
    border-width: 1px 0 0;
    margin: 10px -50px;
}
.popupContactForm input[type="text"] {
    border: 1px solid #ccc;
    font-family: Helvetica,Arial,sans-serif;
    font-size: 16px;
    margin-top: 30px;
    padding: 10px 10px 10px 40px;
    width: 82%;
}
#name {
    background-image: url("../images/name.jpg");
    background-position: 5px 7px;
    background-repeat: no-repeat;
}
#email {
    background-image: url("../images/email.png");
    background-position: 5px 7px;
    background-repeat: no-repeat;
}
.popupContactForm textarea {
    background-image: url("../images/msg.png");
    background-position: 5px 7px;
    background-repeat: no-repeat;
    border: 1px solid #ccc;
    font-family: Helvetica,Arial,sans-serif;
    font-size: 16px;
    height: 95px;
    margin-bottom: 30px;
    margin-top: 30px;
    padding: 10px 10px 10px 40px;
    resize: none;
    width: 82%;
}
#submit {
    background-color: #29aae1;
    border: 1px solid #29aae1;
    border-radius: 5px;
    color: white;
    cursor: pointer;
    display: block;
    font-size: 20px;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
    width: 100%;
}

.popupContactForm button {
    background-color: peru;
    border-radius: 3px;
    color: white;
    cursor: pointer;
    font-family: Helvetica,Arial,sans-serif;
    font-size: 18px;
    height: 45px;
    width: 10%;
}
img#fugo {
    margin-left: 70%;
}











.envelope {
    background: url(img/envelope.png);
    top: 25px;
    right: -15px;
    position: relative;
    z-index: 40;
    width: 70px;
    height: 50px;
}

.scene {
    margin-top: -2px;
    width: 100%;
    height: 768px;
    position: relative;
    background: url(img/scene-1.svg) 50% 0 repeat-x;
    background-size: auto 768px;
    z-index: 10;
    -webkit-transform: translate3d(0, 0, 0)
}
body.scale .scene {
    height: 100vh;
    background-size: cover
}
.scene-1 {
    height: 1228px;
    background-size: 1920px auto;
    background-position: 50% -100px
}

.logo {
	/* background: url(img/logo.png); */
	margin-left: auto;
	margin-right: auto;
	top: 20px;
	position: relative;
	
	width: 1000px;
	height: 500px;
}

.logoLayer1 {
	background: url(img/logo-L1.png);
	position: absolute;
	width: 714px;
	height: 452px;
}

.logoLayer3 {
	background: url(img/logo-L3.png);
	position: absolute;
	width: 714px;
	height: 452px;
}



.scrollText {
	margin: 0 auto;
    width: 280px;
    text-align: center;
	top: 30px;
	position: relative;
	z-index: 20;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 15px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #00444E;
    overflow: hidden
}

.arrow {
	background: url(img/arrow.svg);
	margin-left: auto;
	margin-right: auto;
	top: 50px;
	position: relative;
	z-index: 20;
	width: 25px;
	height: 25px;
	-webkit-animation: bounce 3s infinite;
	   animation: bounce 3s infinite;
}

/* Scroll down indicator (bouncing) */
@-webkit-keyframes bounce {
  0%, 50%, 100% {
    -webkit-transform: translateY(0); }
  25% {
    -webkit-transform: translateY(15px); }
  75% {
    -webkit-transform: translateY(15px); } }
@-moz-keyframes bounce {
  0%,  50%, 100% {
    -moz-transform: translateY(0); }
  25% {
    -moz-transform: translateY(15px); }
  75% {
    -moz-transform: translateY(15px); } }
@keyframes bounce {
  0%,  50%, 100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  25% {
    -webkit-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -o-transform: translateY(15px);
    transform: translateY(15px); }
  75% {
    -webkit-transform: translateY(15px);
    -moz-transform: translateY(15px);
    -ms-transform: translateY(15px);
    -o-transform: translateY(15px);
    transform: translateY(15px); } }

.scene-11 {
    background: #29AAE1;
    height: 900px}

.scene-11 .text {
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 295px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #00444E;
	opacity: 0;
	left: -400px;
    overflow: hidden
}	

.text1circle {
    border-radius: 50%;
	background: #FFFF73;
	margin-left: auto;
	margin-right: auto;
	top: 600px;
	position: relative;
	z-index: 20;
	width: 500px;
	height: 500px;
}
	
.scene-12 {
	margin-top: -4px;
    background-image: url(img/tree-scene-bg22.svg) ;
	background-size: auto 850px;
	background-repeat: repeat-x;  
    height: 850px 
}

.scene-12 .text {
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 703px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: 400px;
    overflow: hidden
}	

.text2circle {
    border-radius: 50%;
	background: #6D5522;
	margin-left: auto;
	margin-right: auto;
	top: 600px;
	position: relative;
	z-index: 20;
	left: 400px;
	width: 150px;
	height: 150px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}

.scene-13 {
	margin-top: -8px;
    background: url(img/tree-muncher-bg.svg) ;
	background-position: 0 0;
	background-color: #FFEF22;
	background-repeat: repeat-x;  
    height: 1416px
}
	
.scene-13 .text{
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 1115px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: -470px;
    overflow: hidden
}	
	
.text3-2 {
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 200px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: 470px;
    overflow: hidden
}	

.text3circle {
    border-radius: 50%;
	background: #EA6F00;
	margin-left: auto;
	margin-right: auto;
	top: 1000px;
	position: relative;
	z-index: 20;
	left: -470px;
	width: 170px;
	height: 170px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}

.text3circle2 {
    border-radius: 50%;
	background: #EA6F00;
	margin-left: auto;
	margin-right: auto;
	top: 100px;
	position: relative;
	z-index: 20;
	left: 470px;
	width: 170px;
	height: 170px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}

.scene-131 {
	margin-top: -8px;
	background: #FFEF22;
    height: 600px}
	
.scene-14 {
	margin-top: -8px;
    background: url(img/chair-laser-bg.svg) ;
	background-position: 0 0;
	background-repeat: repeat-x;  
	background-color: #92FFBE;
    height: 1080px}
	
.scene-14 .text{
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 908px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: -325px;
    overflow: hidden
}	
	
.text4circle {
    border-radius: 50%;
	background: #00E8A0;
	margin-left: auto;
	margin-right: auto;
	top: 760px;
	position: relative;
	z-index: 20;
	left: -325px;
	width: 200px;
	height: 200px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}

.scene-2 {
	margin-top: -12px;
	background-image: url(img/room42bb.svg);
	background-repeat: repeat-x;  
    height: 1700px;
	background-size: auto 1700px;
     }
	
.scene-2 .text{
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 1314px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: -390px;
    overflow: hidden
}	
	
.text5circle {
    border-radius: 50%;
	background: #FF2929;
	margin-left: auto;
	margin-right: auto;
	top: 1205px;
	position: relative;
	z-index: 20;
	left: -390px;
	width: 160px;
	height: 160px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}
	
.scene-22 {
	background: url(img/warehouse-bg2.svg) ;
	background-position: 0 0;
	background-repeat: repeat-x;  
    height: 1100px}
	
.scene-22 .text{
	margin: 0 auto;
    width: 100%;
    text-align: center;
	top: 708px;
	position: relative;
	z-index: 30;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
	left: 500px;
    overflow: hidden
}	
	
.text6circle {
    border-radius: 50%;
	background: #FF2929;
	margin-left: auto;
	margin-right: auto;
	top: 600px;
	position: relative;
	z-index: 20;
	left: 500px;
	width: 160px;
	height: 160px;
	opacity: 0;
	box-shadow: -4px 8px 8px 0 rgba(0, 0, 0, 0.5), -4px 6px 20px 0 rgba(0, 0, 0, 0.2);
}
		
.scene-4 {
	background: #93FAAD;
    height: 1100px}

.scene-4-text {
    position: absolute;
    z-index: 30;
    top: -240px;
    left: 50%;
    width: 300px;
    margin-left: -150px;
    text-align: center
}

	
.treeCon {
	width: 320px;
    height: 550px;
    top: 740px; 
    position: relative;
    margin: 0 auto;
	background-size: 100% auto;
    z-index: 20;
	}
	
.tree, .tree-2 {
	width: 315px;
    height: 448px;
    top: 400px; 
    position: relative;
    margin: 0 auto;
    background: url(img/tree.svg) 50% 50% no-repeat;
	background-size: 100% auto;
    z-index: 20;
   -webkit-transform: translate3d(0, 0, 0);
	}

.tree-2 {
	background: url(img/tree2.svg) 50% 50% no-repeat;
	top: 1030px; 
}	

.treeMuncher {
	width: 802px;
    height: 1016px;
    top: 2110px; 
	left: 50%;
    margin-left: -401px;
    position: absolute;
    background: url(img/tree-muncher-a.svg) no-repeat;
	background-size: 100% auto;
    z-index: 50;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.treeMuncherFrame {
	width: 550px;
    height: 495px;
    top: 2350px; 
	left: 50%;
    margin-left: -276px;
    position: absolute;
    background: url(img/tree-muncher-frame.svg) no-repeat;
	background-size: 100% auto;
    z-index: 70;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.treeMuncherFrameGlow {
	width: 550px;
    height: 495px;
    top: 2350px; 
	left: 50%;
    margin-left: -276px;
    position: absolute;
	opacity: 0;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.saw-left, .saw-right {
	width: 340px;
    height: 341px;
    top: 2426px; 
	left: 50%;
    margin-left: -399px;
    position: absolute;
    background: url(img/saw-left.svg) no-repeat;
	background-size: 100% auto;
    z-index: 60;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.saw-right {
	background: url(img/saw.svg) no-repeat;
	margin-left: 62px;
}

.log-machine {
	width: 119px;
    height: 345px;
    top: 2424px; 
	left: 50%;
    margin-left: -59px;
    position: absolute;
	background-size: 100% auto;
    z-index: 60;
   -webkit-transform: translate3d(0, 0, 0);
}

.gear-large {
	width: 130px;
    height: 130px;
    top: 2860px; 
	left: 50%;
    margin-left: -95px;
    position: absolute;
    background: url(img/gear-large.svg) no-repeat;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.gear-small {
	width: 76px;
    height: 77px;
    top: 2915px; 
	left: 50%;
    margin-left: 30px;
    position: absolute;
    background: url(img/gear-small.svg) no-repeat;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.log-out {
	width: 272px;
    height: 119px;
    top: 2990px; 
	left: 50%;
	margin-left: -136px;
	position: absolute;
    background: url(img/log-out.svg) no-repeat;
	background-size: 100% auto;
    z-index: 30;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.log-out-2{
	width: 119px;
    height: 272px;
    top: 225px; 
	left: 50%;
	margin-left: -59.5px;
	position: absolute;
    background: url(img/log-out-2.svg) no-repeat;
	background-size: 100% auto;
    z-index: 30;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.chair-laser-pipe {
	width: 247px;
    height: 805px;
    top: 660px; 
	left: 50%;
    margin-left: -124px;
    position: absolute;
    background: url(img/laser-pipe.svg) no-repeat;
	background-size: 100% auto;
    z-index: 70;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.laser-left {
	width: 275px;
    height: 93px;
    top: 1043px; 
	left: 50%;
    margin-left: -713px;
    position: absolute;
    background: url(img/laser-left.svg) no-repeat;
	background-size: 100% auto;
    z-index: 70;
   -webkit-transform: translate3d(0, 0, 0);
	}

.laser-beam-left  {
	width: 1294px;
    height: 15px;
    top: 1081px; 
	left: 50%;
    margin-left: -1222px;
    opacity: 0.7;
    position: absolute;
	background-size: 100% auto;
    z-index: 20;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.laser-beam-left-2 {
	width: 1294px;
    height: 15px;
    top: 1081px; 
	left: 50%;
    margin-left: -1222px;
    opacity: 0;
    position: absolute;
    background: url(img/laser-beam-left-2.svg) no-repeat; 
	background-size: 100% auto;
    z-index: 20;
   -webkit-transform: translate3d(0, 0, 0);
	}

.laser-right {
	width: 210px;
    height: 187px;
    top: 613px; 
	left: 50%;
    margin-left: 441px;
    position: absolute;
	background: url(img/laser-right.svg) no-repeat;
	background-size: 100% auto;
    z-index: 70;
   -webkit-transform: translate3d(0, 0, 0);
   }	
	
.laser-right-beam {
	width: 626px;
    height: 187px;
    top: 613px; 
	left: 50%;
    margin-left: 25px;
	opacity: 0;
    position: absolute;
	background-size: 100% auto;
    z-index: 50;
   -webkit-transform: translate3d(0, 0, 0);
   }

.laser-base-left, .laser-base-right {
	width: 159px;
    height: 187px;
    top: 995px; 
	left: 50%;
    margin-left: -650px;
    position: absolute;
    background: url(img/laser-base-left.svg) no-repeat;
	background-size: 100% auto;
    z-index: 60;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.laser-base-right {
	background: url(img/laser-base-right.svg) no-repeat;
	margin-left: 491px;
	z-index: 60;
	}

.laser-support-left, .laser-support-right {
	width: 118px;
    height: 917px;
    top: 610px; 
	left: 50%;
    margin-left: -632px;
    position: absolute;
    background: url(img/laser-support.svg) no-repeat;
	background-size: 100% auto;
    z-index: 20;
   -webkit-transform: translate3d(0, 0, 0);
	}
	
.laser-support-right {
	margin-left: 523px;
}

.pipe-top {
	width: 246px;
    height: 405px;
    top: 659px; 
	left: 50%;
    margin-left: -123px;
    position: absolute;
    background: url(img/pipe-top.svg) no-repeat; 
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.pipe-hot-top {
	width: 294px;
    height: 461px;
    top: 641px; 
	left: 50%;
    margin-left: -147px;
    position: absolute;
	opacity: 0;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.pipe-mid {
	width: 130px;
    height: 118px;
    top: 1064px; 
	left: 50%;
    margin-left: -65px;
    position: absolute;
    background: url(img/pipe-mid.svg) no-repeat; 
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.pipe-hot-mid {
	width: 130px;
    height: 118px;
    top: 1064px; 
	left: 50%;
    margin-left: -65px;
    position: absolute;
	opacity: 0;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.pipe-bottom {
	width: 246px;
    height: 283px;
    top: 1182px; 
	left: 50%;
    margin-left: -123px;
    position: absolute;
    background: url(img/pipe-bottom.svg) no-repeat; 
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.pipe-hot-bottom {
	width: 308px;
    height: 353px;
    top: 1136px; 
	left: 50%;
    margin-left: -154px;
    position: absolute;
	opacity: 0;
	background-size: 100% auto;
    z-index: 80;
   -webkit-transform: translate3d(0, 0, 0);
}

.chair, .chair-2, .chair-3 {
    width: 96px;
    height: 143px;
    top: 1280px; 
    position: absolute;
	 margin-left: -48px;
	left: 50%;
    background: url(img/stolica.svg) no-repeat;
    background-size: 100% auto;
    z-index: 20;
   -webkit-transform: translate3d(0, 0, 0);
}

.chair-2 {
   
	top: 549px; 
	position: absolute;
	margin-left: -388px;
}

.chair-3 {
   
    top: 549px; 
    position: absolute;
	margin-left: 300px;
}

.table {
	top: 576px;
	width: 354px;
    height: 178px;
    position: absolute;
    margin-left: -177px;
	left: 50%;
    background: url(img/table.svg) 0 0 no-repeat;
    background-size: 100% auto;
    z-index: 30;
   -webkit-transform: translate3d(0, 0, 0);   
}

.cupboard, .cupboard-3 {
	top: 50px;
	width: 175px; 
	height: 283px; 
    position: absolute;
    margin-left: -87px;
	left: 50%;
    background: url(img/cupboard.svg) 0 0 no-repeat;
    background-size: 100% auto;
    z-index: 30;
   -webkit-transform: translate3d(0, 0, 0);   
}


.cupboard-3 {
	background: url(img/cupboard-dark.svg) 0 0 no-repeat;
	top: 2100px;
	

}

.painterLeft, .painterRight {
	width: 115px; 
	height: 247px; 
    position: absolute;
	margin-left: -350px;
	left: 50%;
    background-size: 100% auto;
    z-index: 30;
   -webkit-transform: translate3d(0, 0, 0);   
	background: url(img/painterLeft.svg) 0 0 no-repeat;
	top: 500px;
}

.painterRight {
	background: url(img/painterRight.svg) 0 0 no-repeat;
	margin-left: 237px;
}

.sprayLeft, .sprayRight {
	width: 232px; 
	height: 272px; 
    position: absolute;
    left: 50%;
	margin-left: -233px;
    background-size: 100% auto;
    z-index: 40;
   -webkit-transform: translate3d(0, 0, 0);   
	opacity: 0;
	background: url(img/sprayLeft.svg) 0 0 no-repeat;
	top: 452px;
}

.sprayRight {
	background: url(img/sprayRight.svg) 0 0 no-repeat;
	margin-left: 3px;
}

.afterSpray {
	top: 792px; 
	position: absolute;
}

.pin2Trigger {
   top: 1305px;
   width: 100%;
   position: absolute;
}

.text {
    margin: 0 auto;
    width: 280px;
    text-align: center;
    overflow: hidden
}

.hide {
    visibility: hidden;
    z-index: 0;
}

/* truck layer */

.content-noscroll
{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.cloud
{
	position: absolute;
	width: 180px;
	height: 120px;
	background-image: url(img/cloud.svg);
}

#cloud-1
{
	left: 180px;
	top: 20%;
}

#cloud-2
{
	left: 1100px;
	top: 5%;
	
}

#cloud-3
{
	left: 1500px;
	top: 30%;
}

#cloud-4
{
	left: 1900px;
	top: 10%;
}

#cloud-5
{
	left: 2600px;
	top: 20%;
}

#container
{
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 30;
}

.layer-horizontal
{
	position: absolute;
	left: 0px;
	height: 100%;
}

#layer-horizontal-1
{
	width: 2000px;
}

#layer-horizontal-2
{
	width: 5000px;
}

.layer-vertical
{
	position: absolute;
	bottom: 0px;
	width: 100%;
}

#layer-vertical-1
{
	height: 3500px;
}

.horizontal-tree
{
	position: absolute;
	bottom: 17%;
	width: 315px;
    height: 447px;
	background-image: url(img/tree.svg);
	background-size: 100% auto;
}

#horizontal-tree-1
{
	bottom: 20%;
	width: 282px;
    height: 400px;
	left: 1030px;
}

#horizontal-tree-2
{
	width: 282px;
    height: 400px;
	left: 2640px;
	z-index: 70;
}

#horizontal-tree-3
{
	left: 2940px;
	z-index: 10;
}

#horizontal-tree-4
{
	bottom: 22%;
	width: 247px;
    height: 350px;
	left: 3320px;
	z-index: 10;
}

#horizontal-tree-5
{
	bottom: 22%;
	width: 247px;
    height: 350px;
	left: 4640px;
	z-index: 10;
}

#horizontal-tree-6
{
	bottom: 19%;
	width: 282px;
    height: 400px;
	left: 5220px;
	z-index: 50;
}

.house
{
	position: absolute;
	bottom: 17%;
	width: 555px;
    height: 370px;
	background-size: 100% auto;
}

#house-1
{	
	background-image: url(img/house-1.svg);
	left: 1240px;
}

#house-2
{
	left: 2800px;
	background-image: url(img/house-2.svg);
	z-index: 30;
}

#house-3
{
	left: 4800px;
	background-image: url(img/house-3.svg);
	z-index: 30;
}

#horizontal-page
{
	left: 0px;
	top: 0px;
	width: 100%;
}

#truck
{
	position: relative;
	 left: -50%; 
	width: 712px;
	height: 333.5px;
	z-index: 100;
}

#truck-container
{
	position: absolute;
	bottom: 7%;
	z-index: 100;
}

#home-delivery
{
	position: absolute;
	top: 35px;
	left: 90px;
	width: 255px;
	height: 25px;
	text-align: center;
	font-family: Arial Rounded MT Bold,Helvetica Rounded,Arial,sans-serif;
	font-size: 24px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 30px;
	color: white;
	opacity: 0;
}

#truck-slides
{
	left: 0px;
	top: -100px;
	width: 712px;
	height: 333.5px;
	background-image: url(img/truck22.svg);
	z-index: 200;
	background-repeat: no-repeat;
}

.ground
{
	position: absolute;
	top: 70%;
}

#grass-layer
{
	left: -50%;
	width: 400%;
	height: 40%;
	 background-image: url("img/roadslice-1.svg");
    background-repeat: repeat-x;
}

#road-layer
{
	left: -50%;
	width: 400%;
	top: 40%;
	height: 100%;
	background-image: url("img/roadslice-2.svg");
    background-repeat: repeat-x;
}

.transparent
{
	opacity: 0;
	filter: alpha(opacity=0);
}


