.referenceWrapper .titleBox p, .referenceWrapper .titleBox ul li, .referenceWrapper .footer-nav-menu li a {
	font-family: "Montserrat", sans-serif;
	font-weight: 600
}
.referenceWrapper .titleBox h1, .hamaWrapper .icons__text, .pressengerWrapper .gameTitle {
	font-family: "Montserrat", sans-serif;
	font-weight: 700
}
.referenceWrapper .titleBox {
	position: relative;
	width: calc(100% - 60px);
	min-height: 320px;
	height: 80vh;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center
}
.referenceWrapper .titleBox h1 {
	color: #fff;
	text-align: center;
	margin: 0 auto;
	font-size: 28px;
	line-height: 32px;
	letter-spacing: 0
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox h1 {
	font-size: 82px
}
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox h1 {
	line-height: 90px
}
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox h1 {
	letter-spacing: -4px
}
}
.referenceWrapper .titleBox h1+* {
	margin-top: 25px
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox h1+* {
	margin-top: 30px
}
}
.referenceWrapper .titleBox p {
	font-size: 14px;
	line-height: 20px;
	color: #000;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	max-width: 640px
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox p {
	font-size: 16px
}
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox p {
	line-height: 24px
}
}
.referenceWrapper .titleBox p+* {
	margin-top: 45px
}
.referenceWrapper .titleBox ul {
	text-align: center;
	display: none
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox ul {
	display: block
}
}
.referenceWrapper .titleBox ul li {
	font-size: 14px;
	line-height: 1;
	letter-spacing: 2px;
	color: #fff;
	display: inline-block
}
.referenceWrapper .titleBox ul li:not(:last-of-type) {
	margin-right: 25px
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .titleBox {
	width: calc(100% - 120px)
}
}
@media (min-width: 1024px) {
.referenceWrapper .titleBox {
	height: 98vh
}
}
.works-icon {
	width: 28px;
	height: 11px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	margin: 0 auto
}
.works-icon>div {
	width: 4px;
	height: 4px;
	background: #fff;
	transition: background .5s
}
.works-icon>div:not(:last-of-type) {
	margin-right: 3px
}
.works-icon>div:nth-of-type(-n+4) {
	margin-bottom: 3px
}
.works-icon>div:nth-of-type(1) {
transition-delay:calc(.02s + ((1 - 1) * .02s))
}
.works-icon>div:nth-of-type(2) {
transition-delay:calc(.02s + ((2 - 1) * .02s))
}
.works-icon>div:nth-of-type(3) {
transition-delay:calc(.02s + ((3 - 1) * .02s))
}
.works-icon>div:nth-of-type(4) {
transition-delay:calc(.02s + ((4 - 1) * .02s))
}
.works-icon>div:nth-of-type(5) {
transition-delay:calc(.02s + ((5 - 1) * .02s))
}
.works-icon>div:nth-of-type(6) {
transition-delay:calc(.02s + ((6 - 1) * .02s))
}
.works-icon>div:nth-of-type(7) {
transition-delay:calc(.02s + ((7 - 1) * .02s))
}
.works-icon>div:nth-of-type(8) {
transition-delay:calc(.02s + ((8 - 1) * .02s))
}
.works-icon>div:nth-of-type(9) {
transition-delay:calc(.02s + ((9 - 1) * .02s))
}
.works-icon>div:nth-of-type(10) {
transition-delay:calc(.02s + ((10 - 1) * .02s))
}
.referenceWrapper .footer-nav-menu {
	position: absolute;
	left: 0;
	bottom: 0;
	display: flex;
	align-items: flex-end;
	width: calc(100% - 10px);
	padding: 0 4px;
	z-index: 999
}
.referenceWrapper .footer-nav-menu li {
	position: relative;
	display: inline-block;
	width: 100%;
	text-align: center
}
.referenceWrapper .footer-nav-menu li a {
	font-size: 14px;
	line-height: 1;
	color: #fff;
	display: block;
	text-transform: uppercase;
	transition: color .5s, text-shadow .5s;
	padding-bottom: 20px
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .footer-nav-menu li a {
	padding-bottom: 40px
}
}
.referenceWrapper .footer-nav-menu li a:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	background: #fff;
	pointer-events: none;
	height: 10px;
	transition: background .5s
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .footer-nav-menu li a:after {
	height: 20px
}
}
.referenceWrapper .footer-nav-menu li a>span {
	position: relative;
	vertical-align: top;
	display: inline-block
}
.referenceWrapper .footer-nav-menu li a>span span {
	display: none
}
@media (min-width: 1200px) {
.referenceWrapper .footer-nav-menu li a>span span {
	display: inline-block
}
}
.referenceWrapper .footer-nav-menu li a>span:before {
	content: '';
	position: absolute;
	top: 4px;
	border: solid #fff;
	border-width: 0 3px 3px 0;
	display: inline-block;
	padding: 3px;
	transition: border-color .5s linear .02s
}
@media (min-width: 1200px) {
.referenceWrapper .footer-nav-menu li a>span:before {
	top: 2px
}
}
.referenceWrapper .footer-nav-menu li:nth-of-type(1) a>span:before {
	left: 0;
	transform: rotate(135deg)
}
@media (min-width: 1200px) {
.referenceWrapper .footer-nav-menu li:nth-of-type(1) a>span:before {
	left: -40px
}
}
.referenceWrapper .footer-nav-menu li:nth-of-type(2) {
	padding-left: 4px;
	padding-right: 4px
}
.referenceWrapper .footer-nav-menu li:nth-of-type(2) a:after {
	left: 4px;
	width: calc(100% - 8px)
}
.referenceWrapper .footer-nav-menu li:nth-of-type(2) a>span:before {
	content: unset
}
.referenceWrapper .footer-nav-menu li:nth-of-type(3) a>span:before {
	right: 0;
	transform: rotate(-45deg)
}
@media (min-width: 1200px) {
.referenceWrapper .footer-nav-menu li:nth-of-type(3) a>span:before {
	right: -40px
}
}
.referenceWrapper .footer-nav-menu li:hover .works-icon>div {
	background: #000
}
.referenceWrapper .footer-nav-menu li:hover a {
	color: #000
}
.referenceWrapper .footer-nav-menu li:hover a>span:before {
	border-color: #000
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper .footer-nav-menu {
width:calc(100vw - (20px * 2));
	padding: 0 6px;
	position: fixed;
	left: 20px
}
.referenceWrapper .footer-nav-menu li:nth-of-type(2) {
	padding-left: 6px;
	padding-right: 6px
}
.referenceWrapper .footer-nav-menu li:nth-of-type(2) a:after {
	left: 6px;
	width: calc(100% - 12px)
}
}
.referenceWrapper.imoWrapper .macbook {
	text-align: center
}
.referenceWrapper.imoWrapper .macbook__img {
	width: 85%;
	max-width: 1045px;
	margin-top: -15vh
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper.imoWrapper .macbook__img {
	margin-top: -18vh
}
}
@media (min-width: 1024px) {
.referenceWrapper.imoWrapper .macbook__img {
	margin-top: -28vh
}
}
.referenceWrapper.imoWrapper .screens {
	overflow: hidden;
	position: relative
}
.referenceWrapper.imoWrapper .screens:after {
	content: "";
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 60%;
	background: linear-gradient(to top, #fff, rgba(255,255,255,0))
}
.referenceWrapper.imoWrapper .screens img {
	max-width: 508px;
	width: calc(33.333% - 15px);
	margin: 0 15px 15px 0;
	position: relative
}
.referenceWrapper.imoWrapper .screens img:nth-of-type(-n+3) {
	align-self: flex-end
}
.referenceWrapper.imoWrapper .screens img:nth-of-type(1), .referenceWrapper.imoWrapper .screens img:nth-of-type(4) {
	top: -45px
}
@media (min-width: 1024px) {
.referenceWrapper.imoWrapper .screens img:nth-of-type(1), .referenceWrapper.imoWrapper .screens img:nth-of-type(4) {
	top: -110px
}
}
.referenceWrapper.imoWrapper .screens img:nth-of-type(3), .referenceWrapper.imoWrapper .screens img:nth-of-type(6) {
	top: -30px
}
@media (min-width: 1024px) {
.referenceWrapper.imoWrapper .screens img:nth-of-type(3), .referenceWrapper.imoWrapper .screens img:nth-of-type(6) {
	top: -45px
}
}
.referenceWrapper.imoWrapper .screens__inner {
	position: relative;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	margin: 0 -30% 0 0;
	left: -20%
}
@media (min-width: 1024px) {
.referenceWrapper.imoWrapper .screens__inner {
	left: auto;
	right: -5%;
	margin: 0
}
}
.referenceWrapper.imoWrapper .screens--modal {
	position: relative;
	padding-bottom: 0;
	background: #fff;
	margin-bottom: -10px
}
.referenceWrapper.imoWrapper .screens--modal__page {
	max-width: 1241px;
	width: 100%
}
.referenceWrapper.imoWrapper .screens--modal__modal {
	position: absolute;
	top: 50%;
	left: 53%;
	transform: translate(-50%, -50%);
	max-width: 999px;
	width: 100%;
	opacity: 0;
	transition: opacity .5s linear .3s;
	will-change: opacity
}
.referenceWrapper.imoWrapper .screens--modal__modal.show {
	opacity: 1
}
.referenceWrapper.imoWrapper .screens--modal__modal:not(.show) {
	transition-delay: 0s
}
@media (min-width: 1200px) {
.referenceWrapper.imoWrapper .screens--modal {
	text-align: center;
	height: calc(100vh - 20px);
	margin-bottom: 0
}
.referenceWrapper.imoWrapper .screens--modal__page {
	width: 80%
}
.referenceWrapper.imoWrapper .screens--modal__modal {
	width: auto;
	max-width: unset;
	max-height: 709px;
	height: 100%
}
}
.rvWrapper .images {
	background: #432c86;
	position: relative;
	margin-top: 400px;
	margin-bottom: -20px
}
.rvWrapper .images .shadow-container {
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden
}
.rvWrapper .images .shadow-container .shadow-bottom {
	position: relative;
	width: 140%;
	left: 50%;
	transform: translateX(-50%)
}
.rvWrapper .images .imoFirstImg {
	position: relative;
	left: 50%;
	top: -20.8333vw;
	transform: translateX(-50%);
	margin-left: 4.166vw
}
.rvWrapper .images .screens-container {
	overflow: hidden
}
.rvWrapper .images .screens-container .screens {
	height: 1350px;
	position: relative
}
.rvWrapper .images .screens-container .screens img {
	position: relative
}
.rvWrapper .images .screens-container .screens img:not(:last-of-type) {
	height: 100%;
	top: 0;
	filter: blur(5px)
}
.rvWrapper .images .screens-container .screens img:nth-of-type(1) {
	left: -33px
}
.rvWrapper .images .screens-container .screens img:nth-of-type(2) {
	position: absolute;
	right: -33px
}
.rvWrapper .images .screens-container .screens img:nth-of-type(3) {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate3d(-50%, -55%, 0)
}
.rvWrapper .images .mobile {
	position: relative;
	left: 50%;
	transform: translateX(-50%);
	max-width: 90%;
	margin-top: 90px;
	margin-bottom: -70px
}
@media (min-width: 1700px) {
.rvWrapper .images .imoFirstImg {
	top: -12.8333vw;
	margin-left: 2.166vw
}
.rvWrapper .images .screens-container .screens {
	height: 1785px
}
.rvWrapper .images .screens-container .screens img:nth-of-type(3) {
	width: 50%;
	transform: translate3d(-50%, -50%, 0)
}
}
@media (max-width: 1300px) {
.rvWrapper .images .screens-container .screens {
	height: auto;
	padding-bottom: 60px
}
.rvWrapper .images .screens-container .screens img:not(:last-of-type) {
	height: auto;
	width: 50%;
	top: 30px
}
.rvWrapper .images .screens-container .screens img:nth-of-type(3) {
	height: 100%;
	transform: translate3d(-50%, -50%, 0)
}
}
@media (max-width: 768px) {
.rvWrapper .images {
	margin-bottom: -230px;
	padding-bottom: 140px;
	margin-top: 248px
}
}
@media (max-width: 600px) {
.rvWrapper .images {
	padding-bottom: 235px;
	margin-top: 210px
}
}
.lipakWrapper .logos>div:not(:last-of-type):before {
	content: '';
	position: absolute;
	width: 2px;
	height: 22px;
	background: #2f2f2f;
	z-index: 1;
	left: 50%;
	transform: translateX(-50%)
}
.lipakWrapper .referenceContent {
	position: relative;
	margin-top: -15vh;
	z-index: 1
}
.lipakWrapper .referenceContent__bg {
	background: url("/assets/img/referencies/lipak/black-bg.png");
	background-position: top center;
	background-size: 100% 100%;
	background-repeat: no-repeat;
	padding-bottom: 15vh
}
.lipakWrapper .referenceContent__bg--black {
	background: #262626
}
.lipakWrapper .logos {
	width: 100%;
	display: inline-flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	margin-top: 5%
}
.lipakWrapper .logos>div {
	position: relative;
	transform: translateY(-15%);
	opacity: 0;
	transition: opacity .8s, transform .5s;
	will-change: opacity
}
.lipakWrapper .logos>div:nth-of-type(1) {
transition-delay:calc(1 * .125s)
}
.lipakWrapper .logos>div:nth-of-type(2) {
transition-delay:calc(2 * .125s)
}
.lipakWrapper .logos>div:nth-of-type(3) {
transition-delay:calc(3 * .125s)
}
.lipakWrapper .logos>div:not(:last-of-type):before {
	opacity: 0;
transition:opacity 0.5s linear calc(calc(3 * .125s) + .125s)
}
.lipakWrapper .logos>div img {
	width: 100%
}
.lipakWrapper .logos>div:nth-of-type(1) {
	max-width: 610px;
	width: 80%;
	margin-top: -10%
}
.lipakWrapper .logos>div:nth-of-type(1):before {
	top: 75%
}
@media (min-width: 1600px) {
.lipakWrapper .logos>div:nth-of-type(1):before {
	top: 70%
}
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .logos>div:nth-of-type(1) {
	width: 50%;
	margin-top: -5%
}
}
@media (min-width: 1024px) {
.lipakWrapper .logos>div:nth-of-type(1) {
	width: 35%;
	margin-top: 0
}
}
@media (min-width: 1366px) {
.lipakWrapper .logos>div:nth-of-type(1) {
	margin-top: -5%
}
}
.lipakWrapper .logos>div:nth-of-type(2) {
	max-width: 220px;
	width: 50%;
	margin-top: -15%
}
.lipakWrapper .logos>div:nth-of-type(2):before {
	top: 78%
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .logos>div:nth-of-type(2) {
	margin-top: -10%
}
}
@media (min-width: 1024px) {
.lipakWrapper .logos>div:nth-of-type(2) {
	margin-top: -8%
}
}
@media (min-width: 1600px) {
.lipakWrapper .logos>div:nth-of-type(2) {
	margin-top: -9%
}
}
.lipakWrapper .logos>div:nth-of-type(3) {
	max-width: 113px;
	margin-left: -3%
}
@media (min-width: 568px) {
.lipakWrapper .logos>div:nth-of-type(3) {
	margin-left: -1%
}
}
@media (min-width: 1600px) {
.lipakWrapper .logos>div:nth-of-type(3) {
	margin-left: -.5%
}
}
.lipakWrapper .logos.show>div {
	opacity: 1;
	transform: translateY(0)
}
.lipakWrapper .logos.show>div:not(:last-of-type):before {
	opacity: 1
}
.lipakWrapper .logos:not(.show)>div {
	transition-delay: 0s
}
.lipakWrapper .logos:not(.show)>div:not(:last-of-type):before {
	transition-delay: 0s
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .logos {
	margin-bottom: 20vh
}
}
.lipakWrapper .b-cards__inner {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center
}
.lipakWrapper .b-cards__inner img {
	position: relative
}
.lipakWrapper .b-cards__inner img:first-of-type {
	max-width: 614px;
	width: 100%;
	z-index: 1
}
@media (min-width: 1366px) {
.lipakWrapper .b-cards__inner img:first-of-type {
	margin-left: -11%
}
}
@media (min-width: 1600px) {
.lipakWrapper .b-cards__inner img:first-of-type {
	margin-left: -8%
}
}
.lipakWrapper .b-cards__inner img:last-of-type {
	max-width: 592px;
	width: 100%;
	margin-left: 25%;
	margin-top: -35%
}
@media (min-width: 1366px) {
.lipakWrapper .b-cards__inner img:last-of-type {
	margin-top: -20%
}
}
.lipakWrapper .catalog {
	margin-bottom: 100px
}
.lipakWrapper .catalog__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}
.lipakWrapper .catalog__inner img {
	max-width: 861px
}
.lipakWrapper .catalog__inner img:first-of-type {
	width: 80%
}
.lipakWrapper .catalog__inner img:last-of-type {
	width: 100%
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .catalog {
	margin-bottom: 15vh
}
}
.lipakWrapper .colors__inner img {
	width: 100%
}
.lipakWrapper .colors__inner img:first-of-type {
	max-width: 593px
}
.lipakWrapper .colors__inner img:last-of-type {
	max-width: 513px;
	margin-left: -5%;
	margin-top: -25%
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .colors__inner img:last-of-type {
	margin-top: -10%;
	transform: none !important
}
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .colors__inner {
	text-align: center
}
}
@media (min-width: 768px) and (min-height: 610px) {
.lipakWrapper .colors {
	margin-bottom: 10vh
}
}
.lipakWrapper .macbook {
	text-align: center;
	margin-bottom: 20%
}
.lipakWrapper .macbook__img {
	max-width: 1045px;
	width: 90%;
	margin-top: -15vh
}
.lipakWrapper .screens {
	position: relative;
	margin-bottom: -170vh;
	z-index: 1
}
.lipakWrapper .screens img {
	position: relative;
	display: block;
	max-width: 775px;
	width: 90%;
	left: 0
}
.lipakWrapper .screens img:nth-of-type(even) {
	margin-left: auto;
	left: auto;
	right: 0
}
@media (max-width: 1023px) {
.lipakWrapper .screens__inner {
	transform: none !important
}
}
@media (min-width: 1024px) {
.lipakWrapper .screens {
	margin-bottom: -135vh
}
.lipakWrapper .screens__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}
.lipakWrapper .screens img {
	transform: none !important;
	width: 60%
}
.lipakWrapper .screens img.contact, .lipakWrapper .screens img.gallery {
	margin-left: 0;
	z-index: 1
}
.lipakWrapper .screens img.products, .lipakWrapper .screens img.about {
	position: absolute;
	top: 50%
}
.lipakWrapper .screens img.gallery {
	margin-top: -10%
}
.lipakWrapper .screens img.products {
	left: 0;
	transform: translate(-50%, -50%) !important
}
.lipakWrapper .screens img.about {
	left: auto;
	right: 0;
	transform: translate(50%, -50%) !important
}
}
@media (min-width: 1366px) {
.lipakWrapper .screens img.gallery {
	margin-top: -9%
}
.lipakWrapper .screens img.products {
	left: 50%;
	transform: translate(-134%, -50%) !important
}
.lipakWrapper .screens img.about {
	right: 50%;
	transform: translate(134%, -50%) !important
}
}
@media (min-width: 1600px) {
.lipakWrapper .screens img.gallery {
	margin-top: -7%
}
}
.lipakWrapper .tablet {
	position: relative;
	background: #121212;
	padding-top: 170vh;
	text-align: center
}
.lipakWrapper .tablet:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 15vh;
	background: #262626
}
@media (min-width: 1024px) {
.lipakWrapper .tablet:after {
	height: 28vh
}
}
.lipakWrapper .tablet__hand {
	max-width: 1164px;
	width: 90%;
	margin-bottom: -10%;
	transform: rotate(30deg) translate(25%, 50%);
	transition: transform .5s
}
.lipakWrapper .tablet__hand.show {
	transform: none
}
.lipakWrapper .tablet__img {
	position: relative;
	max-width: 1695px;
	width: 115%;
	margin-left: -25%;
	margin-bottom: -55%;
	z-index: 1
}
@media (min-width: 1366px) {
.lipakWrapper .tablet__img {
	margin-bottom: -40%
}
}
@media (min-width: 1024px) {
.lipakWrapper .tablet {
	padding-top: 135vh
}
}
.hamaWrapper .referenceContent {
	background: #ec1a39;
	position: relative;
	margin-top: -10vh
}
@media (min-width: 768px) and (min-height: 610px) {
.hamaWrapper .referenceContent {
	margin-top: -10vh
}
}
@media (min-width: 1024px) {
.hamaWrapper .referenceContent {
	margin-top: 0
}
}
@media (min-width: 1200px) {
.hamaWrapper .referenceContent {
	margin-top: 5vh
}
}
.hamaWrapper .macbook {
	text-align: center
}
.hamaWrapper .macbook__img {
	max-width: 1503px;
	width: 100%;
	margin-left: -5%;
	position: relative;
	z-index: 1;
	margin-top: -17vh
}
@media (min-width: 768px) and (min-height: 610px) {
.hamaWrapper .macbook__img {
	margin-top: -23vh
}
}
@media (min-width: 1024px) {
.hamaWrapper .macbook__img {
	margin-top: -42vh
}
}
@media (min-width: 1200px) {
.hamaWrapper .macbook__img {
	margin-top: -50vh
}
}
.hamaWrapper .hand-phone-container {
	display: flex;
	align-items: flex-start;
	justify-content: flex-end;
	margin-top: -40%
}
.hamaWrapper .hand-phone-container .hand-phone-img {
	max-width: 1341px;
	width: 90%
}
.hamaWrapper .screens {
	position: relative
}
.hamaWrapper .screens .left, .hamaWrapper .screens .right {
	position: absolute;
	width: 55%
}
.hamaWrapper .screens .front {
	max-width: 1226px;
	width: 100%;
	position: relative;
	margin-top: 5%
}
@media (min-width: 1600px) {
.hamaWrapper .screens .front {
	margin-top: -1%;
	margin-left: 15%
}
}
.hamaWrapper .screens .left {
	max-width: 813px;
	top: -7%;
	left: 0
}
.hamaWrapper .screens .right {
	max-width: 838px;
	top: -15%;
	right: 0
}
.hamaWrapper .icons {
	width: 80%;
	margin: 0 auto;
	padding-bottom: 10vh
}
.hamaWrapper .icons__text {
	font-size: 4.44444vh;
	line-height: 1.2;
	color: #fff;
	max-width: 680px
}
.hamaWrapper .icons__text+* {
	margin-top: calc(15vh - 20px)
}
.hamaWrapper .icons .custom-icons-list {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap;
	margin-left: -7%;
	margin-right: -7%
}
.hamaWrapper .icons .custom-icons-list .custom-icon {
	width: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px 0;
	transform: translateY(-15%);
	opacity: 0;
	transition: opacity .5s ease-out, transform .3s linear;
	will-change: opacity
}
.hamaWrapper .icons .custom-icons-list .custom-icon img {
	display: block
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(1) {
transition-delay:calc(1 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(2) {
transition-delay:calc(2 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(3) {
transition-delay:calc(3 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(4) {
transition-delay:calc(4 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(5) {
transition-delay:calc(5 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(6) {
transition-delay:calc(6 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(7) {
transition-delay:calc(7 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(8) {
transition-delay:calc(8 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(9) {
transition-delay:calc(9 * .075s)
}
.hamaWrapper .icons .custom-icons-list .custom-icon:nth-of-type(10) {
transition-delay:calc(10 * .075s)
}
@media (min-width: 768px) and (min-height: 610px) {
.hamaWrapper .icons .custom-icons-list {
	justify-content: space-between
}
.hamaWrapper .icons .custom-icons-list .custom-icon {
	width: 20%
}
}
@media (min-width: 1366px) {
.hamaWrapper .icons .custom-icons-list {
	margin-left: -9%;
	margin-right: -9%
}
.hamaWrapper .icons .custom-icons-list .custom-icon {
	padding-bottom: 7%
}
}
.hamaWrapper .icons.show .custom-icons-list .custom-icon {
	opacity: 1;
	transform: translateY(0%)
}
.hamaWrapper .icons:not(.show) .custom-icons-list .custom-icon {
	transition-delay: 0s
}
.webmedicWrapper .referenceContent {
	background: #fff
}
.webmedicWrapper .referenceContent div:last-of-type {
	padding-bottom: 0
}
.webmedicWrapper .breadcrumbs {
	z-index: 0
}
.webmedicWrapper .breadcrumbs li img {
	height: 120%
}
.webmedicWrapper .macbook {
	position: relative;
	width: 100%;
	text-align: center;
	background-image: linear-gradient(to bottom, #c3c3c3 0, #fff 50%)
}
.webmedicWrapper .macbook__img {
	max-width: 900px;
	width: 100%;
	margin-left: 0;
	margin-top: -25vh;
	position: relative;
	z-index: 1
}
@media (min-width: 1200px) {
.webmedicWrapper .macbook__img {
	width: 65%;
	margin-top: -32vh
}
}
.webmedicWrapper .macbook__phone, .webmedicWrapper .macbook__help-box {
	position: absolute;
	top: 0;
	z-index: 1
}
.webmedicWrapper .macbook__phone {
	max-width: 285px;
	width: 25%;
	left: 2%;
	display: none
}
.webmedicWrapper .macbook__phone[style*="position: fixed"] {
	left: calc(2vw + 10px) !important
}
@media (min-width: 768px) and (min-height: 610px) {
.webmedicWrapper .macbook__phone[style*="position: fixed"] {
	left: calc(2vw + 20px) !important
}
}
@media (min-width: 1200px) {
.webmedicWrapper .macbook__phone[style*="position: fixed"] {
	left: calc(5vw + 20px) !important
}
}
@media (min-width: 1600px) {
.webmedicWrapper .macbook__phone[style*="position: fixed"] {
	left: calc(15vw + 20px) !important
}
}
@media (min-width: 1200px) {
.webmedicWrapper .macbook__phone {
	width: 20%;
	left: 5vw;
	display: block
}
}
@media (min-width: 1600px) {
.webmedicWrapper .macbook__phone {
	left: 15vw
}
}
.webmedicWrapper .macbook__help-box {
	max-width: 177px;
	width: 20%;
	right: 5%
}
@media (min-width: 1024px) {
.webmedicWrapper .macbook__help-box {
	top: 5%
}
}
@media (min-width: 1200px) {
.webmedicWrapper .macbook__help-box {
	width: 10%;
	right: 20%
}
}
@media (min-width: 1600px) {
.webmedicWrapper .macbook__help-box {
	right: 28%
}
}
.webmedicWrapper .data-table {
	background-image: url("/assets/img/referencies/webmedic/shadow.png");
	background-size: cover;
	background-position: bottom center;
	text-align: right;
	padding-bottom: 45%
}
.webmedicWrapper .data-table img {
	position: relative;
	max-width: 1186px;
	width: 100%;
	right: 10%
}
.webmedicWrapper .screens {
	position: relative;
	text-align: center
}
.webmedicWrapper .screens img {
	max-width: 757px
}
.webmedicWrapper .screens .front {
	position: relative;
	margin-top: -45%;
	width: 70%
}
.webmedicWrapper .screens .left, .webmedicWrapper .screens .right {
	position: absolute;
	width: 50%
}
.webmedicWrapper .screens .left {
	top: -10%;
	left: 0
}
@media (min-width: 1600px) {
.webmedicWrapper .screens .left {
	left: 10%
}
}
.webmedicWrapper .screens .right {
	top: -25%;
	right: 0
}
@media (min-width: 1600px) {
.webmedicWrapper .screens .right {
	right: 10%
}
}
.webmedicWrapper .full-width-logo {
	padding-bottom: 0;
	opacity: 0;
	transform: translateY(-5%);
	transition: opacity .8s ease, transform .5s ease;
	will-change: opacity
}
.webmedicWrapper .full-width-logo img {
	width: 100%
}
.webmedicWrapper .full-width-logo.show {
	opacity: 1;
	transform: translateY(0%)
}
@media (min-width: 1200px) {
.webmedicWrapper .full-width-logo {
	height: 100vh
}
}
.canvas-btn {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2000
}
.btn-play {
	display: inline-block;
	background: linear-gradient(to right, #27f7e7, #544fff);
	border: none;
	width: auto;
	position: relative;
	padding: 0;
	border-radius: 30px;
	transition: all .3s ease-in-out
}
.btn-play:after {
	content: '';
	background: linear-gradient(95deg, #27f7e6 0%, #27f7e6 25%, #514efa 100%);
	display: block;
	position: absolute;
	z-index: 1;
	top: -1px;
	bottom: -1px;
	left: -1px;
	right: -1px;
	border-radius: 30px;
	transition: all .25s ease-in-out
}
.btn-play>span {
	color: #fff;
	font-family: 'Montserrat';
	font-size: 20px;
	font-weight: 500;
	display: block;
	padding: 1.15em 3em;
	border-radius: 30px;
	position: relative;
	z-index: 10
}
.btn-play>span:after {
	content: '';
	background: #13122b;
	transform-origin: 50% 50%;
	position: absolute;
	left: 0;
	border-radius: 30px;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	transition: all 0.25s cubic-bezier(0.72, 0.38, 0.42, 0.63)
}
.btn-play:active, .btn-play:hover {
	background: linear-gradient(45deg, #27f7e6 0%, #27f7e6 25%, #514efa 100%) !important;
	box-shadow: none !important;
	border: none !important
}
.btn-play:active>span:after, .btn-play:hover>span:after {
	height: calc(100% - 8px);
	width: calc(100% - 8px);
	right: 4px;
	bottom: 4px;
	transform: translate(4px, 4px)
}
.btn-play:active:after, .btn-play:hover:after {
	top: 4px;
	bottom: 4px;
	left: 4px;
	right: 4px
}
.soccer-game-area {
	width: 100%;
	height: 100%;
	margin-bottom: 200px;
	margin-top: 150px;
	position: relative;
	z-index: 1
}
.soccer-game-area-content {
	position: relative;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center
}
.canvas-wrapper {
	position: relative;
	width: 752px;
	height: 378px;
	background-color: #1d1c44;
	box-shadow: 0 0 200px 40px rgba(0,0,0,0.3)
}
.canvas-wrapper:after {
	content: '';
	background: url("../img/layout/bgs/404-bg.png") no-repeat;
	width: 366px;
	height: 141px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -183px;
	margin-top: -70px;
	z-index: 500
}
#soccer-game-canvas {
	border-radius: 10px;
	width: 752px;
	height: 378px;
	position: relative;
	z-index: 1000
}
.game-out {
	position: relative;
	z-index: 10;
	font-size: 20px;
	top: -10px
}
.game-out .team-name {
	font-family: 'Montserrat';
	font-weight: 700;
	font-size: 20px;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 0.150em;
	max-width: 100px;
	line-height: 1.3em;
	margin-bottom: 10px
}
.game-out .team-point {
	font-family: 'Montserrat';
	font-weight: 700;
	font-size: 20px;
	color: #27efe2;
	letter-spacing: 0.150em
}
.game-out-left {
	padding-right: 3vw;
	text-align: right
}
.game-out-right {
	padding-left: 4vw;
	text-align: left
}
.game-out-right .team-point {
	color: #484de5
}
.game-player-1:before {
	content: '';
	background: url("../img/game/letter-control-help.png");
	width: 100px;
	height: 65px;
	position: absolute;
	top: 162px;
	left: 0
}
.game-player-2:before {
	content: '';
	background: url("../img/game/arrow-control-help.png");
	width: 100px;
	height: 65px;
	position: absolute;
	top: 162px;
	right: 0
}
@media (max-width: 1200px) {
.soccer-game-area {
	display: none !important
}
}
.pressengerWrapper .referenceContent {
	background-color: #14142e;
	margin-top: -5vh
}
@media (min-width: 768px) and (min-height: 610px) {
.pressengerWrapper .referenceContent {
	margin-top: -3vh
}
}
@media (min-width: 1024px) {
.pressengerWrapper .referenceContent {
	margin-top: 0
}
}
@media (min-width: 1366px) {
.pressengerWrapper .referenceContent {
	margin-top: 8vh
}
}
.pressengerWrapper .macbook {
	text-align: center
}
.pressengerWrapper .macbook__img {
	max-width: 1195px;
	width: 90%;
	margin-top: -18vh;
	position: relative;
	z-index: 1;
	margin-top: -18vh
}
@media (min-width: 768px) and (min-height: 610px) {
.pressengerWrapper .macbook__img {
	margin-top: -24vh
}
}
@media (min-width: 1024px) {
.pressengerWrapper .macbook__img {
	margin-top: -35vh
}
}
@media (min-width: 1200px) {
.pressengerWrapper .macbook__img {
	margin-top: -38vh
}
}
@media (min-width: 1366px) {
.pressengerWrapper .macbook__img {
	margin-top: -48vh
}
}
.pressengerWrapper .icons-list {
	width: 80%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 70px auto 140px
}
.pressengerWrapper .icons-list li {
	width: 50%;
	min-height: 60px;
	max-height: 149px;
	height: 10vh;
	text-align: center
}
.pressengerWrapper .icons-list li:nth-of-type(-n+2) {
	margin-bottom: 20%
}
.pressengerWrapper .icons-list img {
	height: 100%;
	opacity: 0;
	transition: opacity .8s linear;
	will-change: opacity
}
.pressengerWrapper .icons-list li:nth-of-type(1) img {
transition-delay:calc(1 * .05s)
}
.pressengerWrapper .icons-list li:nth-of-type(2) img {
transition-delay:calc(2 * .05s)
}
.pressengerWrapper .icons-list li:nth-of-type(3) img {
transition-delay:calc(3 * .05s)
}
.pressengerWrapper .icons-list li:nth-of-type(4) img {
transition-delay:calc(4 * .05s)
}
.pressengerWrapper .icons-list.show img {
	opacity: 1
}
.pressengerWrapper .icons-list:not(.show) li:nth-of-type(1) img {
	transition-delay: 0s
}
.pressengerWrapper .icons-list:not(.show) li:nth-of-type(2) img {
	transition-delay: 0s
}
.pressengerWrapper .icons-list:not(.show) li:nth-of-type(3) img {
	transition-delay: 0s
}
.pressengerWrapper .icons-list:not(.show) li:nth-of-type(4) img {
	transition-delay: 0s
}
@media (min-width: 1024px) {
.pressengerWrapper .icons-list {
	flex-wrap: nowrap
}
.pressengerWrapper .icons-list li {
	width: auto
}
.pressengerWrapper .icons-list li:nth-of-type(-n+2) {
	margin-bottom: 0
}
}
@media (min-width: 1200px) {
.pressengerWrapper .icons-list {
	width: 65%
}
.pressengerWrapper .icons-list li {
	height: 15vh
}
}
.pressengerWrapper .hand-phone-container {
	background-image: url("/assets/img/referencies/pressenger/pressenger_middle.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	height: 90vh
}
.pressengerWrapper .screens {
	background-color: #181834
}
.pressengerWrapper .screens__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start
}
@media (max-width: 1199px) {
.pressengerWrapper .screens__inner {
	transform: none !important
}
}
.pressengerWrapper .screens img {
	position: relative;
	width: 85%;
	margin-bottom: 10%
}
.pressengerWrapper .screens img:nth-of-type(1) {
	margin-top: -25%
}
.pressengerWrapper .screens img:last-of-type {
	margin-bottom: 90px
}
@media (min-width: 1024px) {
.pressengerWrapper .screens img {
	width: 60%
}
}
@media (min-width: 1200px) {
.pressengerWrapper .screens__inner {
	flex-wrap: nowrap;
	justify-content: flex-end
}
.pressengerWrapper .screens img {
	width: 35%;
	transform: none !important
}
.pressengerWrapper .screens img:nth-of-type(1) {
	margin-top: -20%
}
.pressengerWrapper .screens img:nth-of-type(2) {
	margin: -5% 30px 0
}
.pressengerWrapper .screens img:nth-of-type(3) {
	margin-top: -13%
}
}
.pressengerWrapper .game {
	background-image: url("/assets/img/referencies/pressenger/bottom-shadow.png");
	background-size: contain;
	background-position: 100% 100%;
	background-repeat: no-repeat;
	text-align: center;
	display: none
}
.pressengerWrapper .gameTitle {
	font-size: 2.8169vh;
	line-height: 1.1;
	color: #fff;
	max-width: 700px;
	width: 90%;
	margin: 0 auto;
	margin-top: 70px;
	text-align: left
}
@media (min-width: 1200px) {
.pressengerWrapper .gameTitle {
	position: relative;
	font-size: 4.44444vh;
	line-height: 1.1;
	left: -3%
}
}
@media (min-width: 1200px) {
.pressengerWrapper .game {
	display: block
}
}
.pressengerWrapper .game__preview {
	width: 90%
}
@media (min-width: 1200px) {
.pressengerWrapper .game__preview {
	display: none
}
}
.hansaWrapper .breadcrumbs li img {
	height: 40px
}
.hansaWrapper .macbook {
	position: relative
}
.hansaWrapper .macbook:before {
	content: '';
	background: url("/assets/img/referencies/hansa/macbook-bg.png");
	background-position: top left;
	background-size: cover;
	background-repeat: no-repeat;
	position: absolute;
	top: -15vh;
	left: 0;
	width: 100%;
	height: calc(100% + 16vh)
}
.hansaWrapper .macbook__img {
	position: relative;
	max-width: 1241px;
	width: 100%;
	margin-top: -22vh;
	margin-left: -7%;
	z-index: 1
}
@media (min-width: 768px) and (min-height: 610px) {
.hansaWrapper .macbook__img {
	margin-top: -22vh
}
}
@media (min-width: 1024px) {
.hansaWrapper .macbook__img {
	margin-top: -38vh
}
}
@media (min-width: 1200px) {
.hansaWrapper .macbook__img {
	margin-top: -32vh
}
}
@media (min-width: 1366px) {
.hansaWrapper .macbook {
	text-align: center
}
.hansaWrapper .macbook__img {
	transform: translateX(-5%)
}
}
.hansaWrapper .middle-section {
	position: relative;
	background: #fff
}
.hansaWrapper .middle-section .hansa-pages {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	flex-wrap: wrap
}
.hansaWrapper .middle-section .hansa-pages img {
	width: 95%
}
.hansaWrapper .middle-section .hansa-pages img:first-of-type {
	max-width: 1316px;
	margin-left: 15px;
	margin-bottom: -35%
}
.hansaWrapper .middle-section .hansa-pages img:last-of-type {
	max-width: 1132px;
	display: inline-block;
	margin-left: auto;
	margin-right: 15px
}
@media (max-width: 1199px) {
.hansaWrapper .middle-section .hansa-pages {
	transform: none !important
}
}
@media (min-width: 1200px) {
.hansaWrapper .middle-section .hansa-pages {
	flex-wrap: nowrap
}
.hansaWrapper .middle-section .hansa-pages img {
	transform: none !important;
	width: 90%
}
.hansaWrapper .middle-section .hansa-pages img:first-of-type {
	margin-left: -10%
}
.hansaWrapper .middle-section .hansa-pages img:last-of-type {
	margin-left: -20%;
	margin-top: -1%
}
}
@media (min-width: 1600px) {
.hansaWrapper .middle-section .hansa-pages {
	padding-bottom: 5%
}
.hansaWrapper .middle-section .hansa-pages img:last-of-type {
	margin-left: -15%
}
}
.hansaWrapper .middle-section .hansa-mobil-holder {
	position: absolute;
	bottom: -40%;
	left: 0;
	width: 100%;
	text-align: right;
	transform: rotate(45deg) translateX(100%);
	transition: transform 1s;
	z-index: 1
}
.hansaWrapper .middle-section .hansa-mobil-holder img {
	max-width: 1053px;
	width: 100%;
	position: relative;
	z-index: 1
}
.hansaWrapper .middle-section .hansa-mobil-holder.show {
	transform: none
}
@media (min-width: 1024px) {
.hansaWrapper .middle-section .hansa-mobil-holder img {
	width: 70%
}
}
.hansaWrapper .writing-paper-container {
	position: relative
}
.hansaWrapper .writing-paper-container:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 40%;
	background: linear-gradient(#fff 30%, rgba(255,255,255,0))
}
.hansaWrapper .writing-paper-container>img {
	width: 130%
}
@media (min-width: 1366px) {
.hansaWrapper .writing-paper-container>img {
	width: 100%
}
}
.hansaWrapper .writing-paper-container .business-cards {
	position: absolute;
	bottom: -30%;
	left: 0;
	width: 100%;
	height: 50%;
	transition: bottom .5s linear .3s
}
.hansaWrapper .writing-paper-container .business-cards img {
	position: absolute;
	bottom: 0;
	max-width: 535px;
	width: 60%
}
.hansaWrapper .writing-paper-container .business-cards img:first-of-type {
	left: 5%
}
.hansaWrapper .writing-paper-container .business-cards img:last-of-type {
	right: -10%
}
.hansaWrapper .writing-paper-container .business-cards.show {
	bottom: -10%
}
.hansaWrapper .writing-paper-container .business-cards.show+.logos img {
	opacity: 1
}
.hansaWrapper .writing-paper-container .business-cards.show+.logos img.blue {
	left: 15%
}
.hansaWrapper .writing-paper-container .business-cards.show+.logos img.orange {
	top: 85%
}
.hansaWrapper .writing-paper-container .business-cards.show+.logos img.white {
	top: 25%;
	left: 85%
}
@media (min-width: 768px) and (min-height: 610px) {
.hansaWrapper .writing-paper-container .business-cards {
	height: auto;
	bottom: 10%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start
}
.hansaWrapper .writing-paper-container .business-cards img {
	position: static
}
.hansaWrapper .writing-paper-container .business-cards.show {
	bottom: 10%
}
}
@media (min-width: 1200px) {
.hansaWrapper .writing-paper-container .business-cards {
	bottom: auto;
	top: 26%;
	align-items: flex-start
}
.hansaWrapper .writing-paper-container .business-cards img {
	margin-left: 25%
}
.hansaWrapper .writing-paper-container .business-cards.show {
	bottom: auto
}
}
.hansaWrapper .writing-paper-container .logos {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	min-height: 420px;
	height: 75vh
}
.hansaWrapper .writing-paper-container .logos img {
	position: absolute;
	transform: translate(-50%, -50%);
	opacity: 0;
	will-change: opacity, left, top
}
.hansaWrapper .writing-paper-container .logos img.main {
	max-width: 177px;
	width: 35%;
	top: 50%;
	left: 50%;
	position: relative;
	z-index: 1;
	opacity: 1
}
.hansaWrapper .writing-paper-container .logos img.blue {
	max-width: 160px;
	width: 30%;
	top: 55%;
	left: 50%
}
.hansaWrapper .writing-paper-container .logos img.white {
	max-width: 95px;
	top: 53%;
	left: 50%;
	width: 22%
}
.hansaWrapper .writing-paper-container .logos img.orange {
	max-width: 104px;
	width: 25%;
	top: 54%;
	left: 50%
}
.hansaWrapper .writing-paper-container .logos img.white {
transition:opacity 0.5s linear calc(calc(1 * .125s) + .1s), left 0.5s linear calc(1 * .125s), top 0.5s linear calc(1 * .125s)
}
.hansaWrapper .writing-paper-container .logos img.blue {
transition:opacity 0.5s linear calc(calc(2 * .125s) + .1s), left 0.5s linear calc(2 * .125s), top 0.5s linear calc(2 * .125s)
}
.hansaWrapper .writing-paper-container .logos img.orange {
transition:opacity 0.5s linear calc(calc(3 * .125s) + .1s), left 0.5s linear calc(3 * .125s), top 0.5s linear calc(3 * .125s)
}
@media (min-width: 768px) and (min-height: 610px) {
.hansaWrapper .writing-paper-container .logos {
	top: 65%
}
}
@media (min-width: 1024px) {
.hansaWrapper .writing-paper-container .logos {
	top: 80%
}
}
@media (min-width: 1200px) {
.hansaWrapper .writing-paper-container .logos {
	width: 75%;
	top: 70%;
	left: 50%;
	transform: translateX(-50%)
}
}
.hansaWrapper .social-screens {
	position: relative;
	text-align: center;
	margin-top: 75vh;
	overflow: hidden
}
.hansaWrapper .social-screens:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	background: linear-gradient(to top, #c5c5c5 50%, rgba(197,197,197,0));
	z-index: 1
}
.hansaWrapper .social-screens img {
	max-width: 1152px;
	width: 130%
}
.hansaWrapper .social-screens img.facebook {
	position: absolute;
	top: 15%;
	left: -5%;
	max-width: 1147px
}
.hansaWrapper .social-screens img.linkedin {
	max-width: 1148px
}
@media (max-height: 415px) {
.hansaWrapper .social-screens {
	margin-top: 420px
}
}
@media (min-width: 768px) and (min-height: 610px) {
.hansaWrapper .social-screens {
	margin-top: 35vh
}
}
@media (min-width: 1200px) {
.hansaWrapper .social-screens img {
	opacity: 0;
	transition: opacity .5s
}
.hansaWrapper .social-screens img.facebook {
	left: -70%;
	transition: left 1s, opacity .5s;
	transition-delay: .5s;
	z-index: 1
}
.hansaWrapper .social-screens.show img {
	opacity: 1
}
.hansaWrapper .social-screens.show img.facebook {
	left: 0
}
.hansaWrapper .social-screens:not(.show).facebook {
	transition-delay: 0s
}
}
@media (min-width: 1366px) {
.hansaWrapper .social-screens.show img.facebook {
	left: 10%
}
}
@media (min-width: 1366px) {
.hansaWrapper .social-screens.show img.facebook {
	left: 50%;
	transform: translateX(-50%)
}
}
.isweetWrapper .bgrBox {
	height: calc(100% - 20px)
}
@media (max-width: 768px) {
.referenceWrapper.isweetWrapper .bgrBox {
	height: calc(100% - 10px)
}
.referenceWrapper.isweetWrapper .imoLastImg img {
	right: 0 !important
}
}
.toolspotWrapper .bgrBox {
	height: calc(100% - 20px)
}
@media (max-width: 768px) {
.referenceWrapper.toolspotWrapper .bgrBox {
	height: calc(100% - 10px)
}
.referenceWrapper.toolspotWrapper .imoLastImg img {
	right: 0
}
}
.pecsiSorWrapper img {
	max-width: 100%
}
.pecsiSorWrapper .referenceContent {
	background: #284a39;
	margin-top: -10vh
}
@media (min-width: 768px) and (min-height: 610px) {
.pecsiSorWrapper .referenceContent {
	margin-top: -10vh
}
}
@media (min-width: 1024px) {
.pecsiSorWrapper .referenceContent {
	margin-top: 0
}
}
@media (min-width: 1200px) {
.pecsiSorWrapper .referenceContent {
	margin-top: 5vh
}
}
@media (min-width: 1366px) {
.pecsiSorWrapper .referenceContent>div:last-of-type {
	padding-bottom: 23.33333vh
}
}
.pecsiSorWrapper .macbook {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	margin-bottom: 23.33333vh
}
.pecsiSorWrapper .macbook__img {
	max-width: 1550px;
	width: 100vw;
	margin-left: -7%;
	margin-top: -18vh
}
@media (min-width: 768px) and (min-height: 610px) {
.pecsiSorWrapper .macbook__img {
	margin-top: -21vh
}
}
@media (min-width: 1024px) {
.pecsiSorWrapper .macbook__img {
	margin-top: -40vh
}
}
@media (min-width: 1200px) {
.pecsiSorWrapper .macbook__img {
	margin-top: -41vh
}
}
.pecsiSorWrapper .full-width img {
	width: 100%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .full-width {
	padding-bottom: 150px
}
.pecsiSorWrapper .full-width img {
	width: 110%
}
}
.pecsiSorWrapper .parallax-container {
	position: relative;
	margin-bottom: 285px;
	height: 1012px
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container {
	margin-bottom: 60vh
}
}
@media (min-width: 568px) {
.pecsiSorWrapper .parallax-container {
	height: 1200px
}
}
@media (min-width: 768px) and (min-height: 610px) {
.pecsiSorWrapper .parallax-container {
	height: 1700px
}
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container {
	height: 100vh
}
}
@media (min-width: 1366px) {
.pecsiSorWrapper .parallax-container {
	height: 120vh
}
}
@media (min-width: 1600px) {
.pecsiSorWrapper .parallax-container {
	height: 100vh
}
}
.pecsiSorWrapper .parallax-container img {
	position: absolute
}
.pecsiSorWrapper .parallax-container .walldraw {
	max-width: 1026px;
	top: 26%;
	left: 10%;
	height: 22%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .walldraw {
	top: 8%;
	left: 20%;
	height: auto;
	width: 80%
}
}
.pecsiSorWrapper .parallax-container .poster-lg {
	max-width: 658px;
	top: 5%;
	left: 0;
	height: 40%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .poster-lg {
	top: 15%;
	left: -2%;
	height: auto;
	width: 51%
}
}
.pecsiSorWrapper .parallax-container .poster-md-1 {
	max-width: 770px;
	top: 75%;
	right: -15%;
	height: 25%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .poster-md-1 {
	top: 52%;
	right: auto;
	left: 15%;
	height: auto;
	width: 66%;
	z-index: 1
}
}
@media (min-width: 1366px) {
.pecsiSorWrapper .parallax-container .poster-md-1 {
	left: 25%
}
}
.pecsiSorWrapper .parallax-container .poster-md-2 {
	max-width: 703px;
	top: 90%;
	left: -17%;
	height: 25%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .poster-md-2 {
	top: 81%;
	left: 32%;
	height: auto;
	width: 60%
}
}
.pecsiSorWrapper .parallax-container .poster-sm-1 {
	max-width: 549px;
	top: 42%;
	left: 9%;
	height: 30%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .poster-sm-1 {
	top: 93%;
	left: -3%;
	height: auto;
	width: 46%
}
}
.pecsiSorWrapper .parallax-container .poster-sm-2 {
	max-width: 563px;
	top: 66%;
	left: 16%;
	height: 30%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .poster-sm-2 {
	top: 69%;
	left: 62%;
	height: auto;
	width: 44%
}
}
.pecsiSorWrapper .parallax-container .obscure-red {
	max-width: 526px;
	top: 0;
	right: 0;
	height: 47%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .obscure-red {
	top: -2%;
	height: auto;
	width: 31%
}
}
.pecsiSorWrapper .parallax-container .obscure-yellow {
	max-width: 414px;
	top: 47%;
	left: 0;
	height: 64%
}
@media (min-width: 1024px) {
.pecsiSorWrapper .parallax-container .obscure-yellow {
	top: 7%;
	left: -2%;
	height: auto;
	width: 42%
}
}
.pecsiSorWrapper .truck {
	position: relative;
	left: -20vw;
	max-width: 1694px;
	transform: translateX(60%);
	transition: transform 1s ease-in-out;
	will-change: transform
}
.pecsiSorWrapper .truck.show {
	transform: translateX(0%)
}
@media (min-width: 1024px) {
.pecsiSorWrapper .truck {
	left: -13%
}
}
.tomMarketWrapper .desktop-screens:before, .tomMarketWrapper .mobile-area__screens:before {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 50%;
	background: linear-gradient(to top, #c6c6c6 30%, rgba(198,198,198,0));
	z-index: 2
}
.tomMarketWrapper .referenceContent {
	position: relative;
	background-color: #171717;
	margin-top: -10vh
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .referenceContent {
	margin-top: -5vh
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .referenceContent {
	margin-top: 0
}
}
.tomMarketWrapper .macbook {
	text-align: center
}
.tomMarketWrapper .macbook__img {
	max-width: 1302px;
	width: 100%;
	margin-top: -13vh;
	margin-left: -10%
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .macbook__img {
	margin-top: -17vh
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .macbook__img {
	margin-top: -25vh
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .macbook__img {
	margin-left: -7%
}
}
.tomMarketWrapper .desktop-screens {
	position: relative;
	text-align: center
}
.tomMarketWrapper .desktop-screens:before {
	bottom: -1px
}
.tomMarketWrapper .desktop-screens__inner {
	overflow: hidden;
	height: 610px
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens__inner {
	height: 112.22222vh
}
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens__inner {
	min-height: 1010px
}
}
.tomMarketWrapper .desktop-screens img {
	width: 90%
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens img {
	width: 60%
}
}
.tomMarketWrapper .desktop-screens .left, .tomMarketWrapper .desktop-screens .right {
	position: absolute;
	top: 20%
}
.tomMarketWrapper .desktop-screens .front {
	position: relative;
	max-width: 950px;
	z-index: 1
}
.tomMarketWrapper .desktop-screens .left {
	max-width: 938px;
	left: -40%
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .left {
	left: -10%
}
}
.tomMarketWrapper .desktop-screens .right {
	max-width: 940px;
	right: -40%
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .right {
	right: -10%
}
}
.tomMarketWrapper .desktop-screens .dropdown, .tomMarketWrapper .desktop-screens .numbers {
	position: absolute;
	opacity: 0;
	z-index: 2;
	pointer-events: none
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .dropdown, .tomMarketWrapper .desktop-screens .numbers {
	opacity: 1
}
}
.tomMarketWrapper .desktop-screens .numbers {
	max-width: 260px;
	width: 20%;
	top: 0;
	left: 0
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .numbers {
	top: 15%
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .desktop-screens .numbers {
	top: 30%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .desktop-screens .numbers {
	top: 45%
}
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .numbers {
	left: 20%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .desktop-screens .numbers {
	left: 25%
}
}
.tomMarketWrapper .desktop-screens .dropdown {
	max-width: 449px;
	width: 35%;
	top: 0;
	right: 0
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .dropdown {
	top: 20%
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .desktop-screens .dropdown {
	top: 35%
}
}
@media (min-width: 1366px) {
.tomMarketWrapper .desktop-screens .dropdown {
	top: 47%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .desktop-screens .dropdown {
	top: 52%
}
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens .dropdown {
	right: 10%
}
}
@media (min-width: 1366px) {
.tomMarketWrapper .desktop-screens .dropdown {
	right: 15%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .desktop-screens .dropdown {
	right: 23%
}
}
.tomMarketWrapper .desktop-screens--bottom {
	background: #c6c6c6;
	margin-top: 0
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .desktop-screens--bottom {
	margin-top: -2px
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .desktop-screens--bottom {
	margin-top: -20%
}
}
.tomMarketWrapper .desktop-screens--bottom:before {
	content: unset
}
.tomMarketWrapper .desktop-screens--bottom .left, .tomMarketWrapper .desktop-screens--bottom .right {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: unset;
	height: 70%;
	z-index: 1
}
.tomMarketWrapper .desktop-screens--bottom .front {
	max-width: 1020px;
	z-index: 2;
	width: 100%
}
.tomMarketWrapper .desktop-screens--bottom .left {
	max-width: 872px;
	transform: translate(-100%, -50%)
}
.tomMarketWrapper .desktop-screens--bottom .right {
	max-width: 821px;
	transform: translate(0%, -50%)
}
.tomMarketWrapper .mobile-area {
	position: relative;
	background: #c6c6c6;
	display: flex;
	align-items: flex-start;
	justify-content: flex-end
}
.tomMarketWrapper .mobile-area .hand-phone {
	max-width: 651px;
	width: 60%;
	position: absolute;
	top: 15px;
	left: 0;
	z-index: 2
}
.tomMarketWrapper .mobile-area .hand-phone[style*="position: fixed"] {
	left: 10px !important
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .mobile-area .hand-phone[style*="position: fixed"] {
	left: 20px !important
}
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .mobile-area .hand-phone {
	top: calc(20px + 15px)
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .mobile-area .hand-phone {
	width: 50%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .mobile-area .hand-phone {
	top: 10%
}
}
.tomMarketWrapper .mobile-area__screens {
	width: 50%;
	position: relative;
	z-index: 1
}
.tomMarketWrapper .mobile-area__screens:before {
	opacity: 0;
	bottom: -1px
}
.tomMarketWrapper .mobile-area__screens img {
	max-width: 404px;
	width: 100%
}
@media (max-width: 1023.9px) {
.tomMarketWrapper .mobile-area__screens {
	transform: none !important
}
}
@media (min-width: 1024px) {
.tomMarketWrapper .mobile-area__screens {
	width: 55%;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	margin-top: 25%
}
.tomMarketWrapper .mobile-area__screens:before {
	opacity: 1;
	height: 65%;
	background: linear-gradient(to top, #c6c6c6 50%, rgba(198,198,198,0.61) 73%, transparent 94%)
}
.tomMarketWrapper .mobile-area__screens img {
	width: 50%;
	height: auto
}
.tomMarketWrapper .mobile-area__screens img:nth-of-type(3), .tomMarketWrapper .mobile-area__screens img:nth-of-type(4) {
	margin-top: -10%
}
}
@media (min-width: 1600px) {
.tomMarketWrapper .mobile-area__screens img:nth-of-type(3), .tomMarketWrapper .mobile-area__screens img:nth-of-type(4) {
	margin-top: -5%
}
}
@media (min-width: 768px) and (min-height: 610px) {
.tomMarketWrapper .mobile-area {
	margin-top: -2px
}
}
.ottakringerWrapper .referenceContent {
	background-color: #096f3c;
	margin-top: -10vh
}
@media (min-width: 768px) and (min-height: 610px) {
.ottakringerWrapper .referenceContent {
	margin-top: -10vh
}
}
@media (min-width: 1200px) {
.ottakringerWrapper .referenceContent {
	margin-top: 0
}
}
@media (min-width: 1366px) {
.ottakringerWrapper .referenceContent div:last-of-type {
	padding-bottom: 18.88889vh
}
}
.ottakringerWrapper .macbook {
	text-align: center
}
.ottakringerWrapper .macbook__img {
	max-width: 1539px;
	width: 100%;
	margin-left: -8%;
	margin-top: -15vh;
	position: relative;
	z-index: 1;
	margin-top: -15vh
}
@media (min-width: 768px) and (min-height: 610px) {
.ottakringerWrapper .macbook__img {
	margin-top: -20vh
}
}
@media (min-width: 1024px) {
.ottakringerWrapper .macbook__img {
	margin-top: -30vh
}
}
@media (min-width: 1200px) {
.ottakringerWrapper .macbook__img {
	margin-top: -40vh
}
}
@media (min-width: 1600px) {
.ottakringerWrapper .macbook__img {
	margin-top: -47vh
}
}
.ottakringerWrapper .phones {
	margin-top: -27%;
	margin-bottom: 15%;
	padding-top: 27%;
	position: relative
}
.ottakringerWrapper .phones:before {
	content: "";
	background-color: #f9e10b;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 70%
}
.ottakringerWrapper .phones img {
	max-width: 403px;
	width: 60%;
	display: block;
	position: relative
}
.ottakringerWrapper .phones img:first-of-type {
	margin-right: auto
}
.ottakringerWrapper .phones img:last-of-type {
	margin-left: auto
}
@media (min-width: 1024px) {
.ottakringerWrapper .phones {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-left: 15%;
	padding-right: 15%;
	padding-top: 40%;
	margin-bottom: 20%
}
.ottakringerWrapper .phones img {
	width: 50%
}
.ottakringerWrapper .phones img:first-of-type, .ottakringerWrapper .phones img:last-of-type {
	margin: 0
}
}
@media (min-width: 1366px) {
.ottakringerWrapper .phones {
	padding-left: 24%;
	padding-right: 24%
}
}
@media (min-width: 1600px) {
.ottakringerWrapper .phones {
	margin-top: -22%;
	padding-top: 22%
}
}
.ottakringerWrapper .full-width .truck {
	max-width: 1694px;
	position: relative;
	left: -15%;
	width: 120%;
	transform: translateX(70%);
	transition: transform 1s ease-in-out;
	will-change: transform
}
.ottakringerWrapper .full-width .truck.show {
	transform: translateX(0%)
}
@media (min-width: 1200px) {
.ottakringerWrapper .full-width .truck {
	left: -20%
}
}
.referenceWrapper {
	background-image: url("/assets/img/layout/sectionBgr/desktop/works-landing.png");
	position: relative;
	height: auto;
	border: none;
	border-right: 0;
	border-bottom: 0;
	padding-right: 10px;
	padding-bottom: 10px;
	overflow: hidden
}
@media (min-width: 768px) and (min-height: 610px) {
.referenceWrapper {
	border: 0;
	padding-right: 0;
	padding-bottom: 0
}
.referenceWrapper:before {
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 0px;
	background: #fff;
	z-index: 999
}
}
.referenceContent>div:last-of-type {
	padding-bottom: 15.625vh
}
