﻿html, body, div, span, ul, li {
	margin: 0;
	padding: 0px;
	border: 0;
	outline: none;
}

.clearfix:before, .clearfix:after {
	display: table;
	content: "";
	line-height: 0px;
}

.clearfix:after {clear: both;}

.clearfix {*zoom: 1;}

.inner {
	text-align:center;
	margin: 0px auto;
}

.wrapper {
	top: 0;
	left: 0;
	width:100%;
	height:100%;
}

.wrapper .page {
	position: relative;
	width: 100%;
	height: 100%;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;/* opacity: 0.3;*/
	transition: opacity 0.8s 0ms cubic-bezier(0.445, 0.145, 0.355, 1);
	-webkit-transition: opacity 0.8s 0ms cubic-bezier(0.445, 0.145, 0.355, 1);
}

.businees:before,.informatefix:before,.sense:before{
	content:"";
	width:100%;
	height:100%;
	position:absolute;
	left:0;
	top:0;
	z-index:3;
	display:none\9;
}

.businees:before{height:134px;}

.wrapper.active-page3 .page.page3 .businees{animation:scroll_on2 1s 0.2s ease-in-out forwards;}

.wrapper.active-page3 .page.page3 .businees:before{
	animation:scroll_on22 1s 0.2s ease-in-out forwards;
	z-index:5;
}

.wrapper.active-page3 .page.page3 .busineetit{animation:scroll_on2 0.8s 0.2s ease-in-out forwards;}

.wrapper.active-page3 .page.page3 .busineetit:before{
	animation:scroll_on22 0.8s 0.2s ease-in-out forwards;
	z-index:5;
}

.banner-box, .business, .busineli, .busineli >li, .busineli >li figure {
	width:100%;
	height:100%;
}

@media (max-width: 768px){
	.banner-box, .business, .busineli, .busineli >li, .busineli >li figure {height:550px;}
}

@keyframes scroll_on22 {
	0% { left:0; }
	100% { left:100%; }
}

@keyframes scroll_on2 {
	0% { opacity:0; }
	100% { opacity:1; }
}

@-webkit-keyframes show {
	0% {opacity: 0;}
	1%,100% {opacity: 1;}
}
@-ms-keyframes show {
	0% {opacity: 0;}
	1%,100% {opacity: 1;}
}

@keyframes show {
	0% {opacity: 0;}
	1%,100% {opacity: 1;}
}


.business-box{position:relative;}

@media (max-width: 768px){
	/* .business-box{margin-top:-100px;} */
}

.business{position:relative;}

.busineli li {
	line-height: 1;
	backface-visibility:hidden;
	overflow:hidden;
	opacity:1 !important;
	height:100%;
}

@media (max-width: 768px){
	.busineli li {height:700px !important;}
}

.busineli li figure{
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
}

.busineli li figure img{
	display:block;
	width:100%;
	height:auto;
	position:absolute;
	right:0;
	top:0;
}

.busineli li.flex-active-slide{
	z-index: 4 !important;
	opacity: 1;
	-webkit-animation: increaseHeight 1.2s forwards;
	animation: increaseHeight 1.2s forwards;
}

.busineli li{
	-webkit-animation: hide 1.2s forwards;
	animation: hide 1.2s forwards;
}

@-webkit-keyframes hide {
	0%,99% {opacity: 1;}
	100% {opacity: 0;}
}

@keyframes hide {
	0%,99% {opacity: 1;}
	100% {opacity: 0;}
}

@-webkit-keyframes increaseHeight {
	from {width: 0;}
	to {width: 100%;}
}

@keyframes increaseHeight {
	from {width: 0;}
	to {width: 100%;}
}

.businees{
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	top:40%;
	z-index:10;
	text-align:center;
	overflow:hidden;
	opacity:0;
	opacity:1\9;
	padding-bottom:30px;
	width:100%;
}

@media (min-width: 768px) and (max-width: 1280px){
	.businees {
		top:30%;
	}
}

@media (max-width: 768px){
	.businees{
		width:100%;
		top:22%;
	}
}

.businees > li {
	display:inline-block;
	width: 24%;
	padding:15px 60px;
	text-align:center;
	cursor:pointer;
	vertical-align:top;
}

@media (min-width: 1280px) and (max-width: 1366px){
	.businees > li {
		padding:15px 10px;
	}
}

@media (min-width: 768px) and (max-width: 1279px){
	.businees > li {
		width: 49%;
		padding:15px 20px;
	}
}

@media (max-width: 768px){
	.businees > li {
		width: 100%;
		padding: 0 20px;
		vertical-align:top;
		margin-bottom:20px;
	}
}

.businetop {
	width:120px;
	height:120px;
	border-radius:50%;
	border:2px solid #fff\9;
	position:relative;
	box-shadow:inset 0 0 0 2px #fff;
	-webkit-box-shadow:inset 0 0 0 2px #fff;
	-moz-box-shadow:inset 0 0 0 2px #fff;
	transition:all 0.46s;
	box-shadow:none\9;
	-webkit-box-shadow:none\9;
	margin-left:auto;
	margin-right:auto;
}

@media (min-width: 768px) and (max-width: 1280px){
	.businetop{
		width:160px;
		height:160px;
	}
}

@media (max-width: 768px) {
	.businetop{
		width:50px;
		height:50px;
	}
}

.businetop img{
	display:block;
	width:80px;
	height:80px;
	position:absolute;
	left:0;
	top:0;
	right:0;
	bottom:0;
	margin:auto;
	z-index:5;
}

@media (min-width: 768px) and (max-width: 1280px){
	.businetop img{
		width:60px;
		height:60px;
	}
}

@media (max-width: 768px) {
	.businetop img{
		width:40px;
		height:40px;
	}
}

.businees li span.clst{
	display:block;
	text-align:center;
	color:#fff;
	letter-spacing:2px;
	font-size:2em;
	font-weight:300;
	margin-top:20px;
	position:relative;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 10px;
}

@media (min-width: 768px) and (max-width: 1280px){
	.businees li span.clst{font-size:1.6em;}
}

@media (max-width: 768px) {
	.businees li span.clst{
		font-size:1.2em;
		margin-top:10px;
	}
}

.businees li span.clst a{
	color:#fff;
	font-weight:300;
}

.businees li span.clstzi a {
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
	font-size:1.6em;
	color:#fff;
	font-weight:300;
}

@media (min-width: 768px) and (max-width: 1280px){
	.businees li span.clstzi a {font-size:1.3em;}
}

@media (max-width: 768px) {
	.businees li span.clstzi a {font-size:1em;}
}

.businees li span.clst:before{
	content:"";
	width:9px;
	height:8px;
	background:url("https://www.skladprom.com/images/arrow1.png") center no-repeat;
	position:absolute;
	left:50%;
	margin-left:-4px;
	bottom:-14px;
	opacity:0;
	visibility:hidden;
	transition:0.34s;
}

.businees li:hover .businetop,.businees li.flex-active .businetop{
	box-shadow: inset 0 0 0 80px rgba(255,255,255,0.3);
	-webkit-box-shadow: inset 0 0 0 80px rgba(255,255,255,0.3);
	-moz-box-shadow: inset 0 0 0 80px rgba(255,255,255,0.3);
	background:rgba(255,255,255,0.3)\9;
	border-color:rgba(255,255,255,0.3)\9;
}

.businees li:hover .businetop img,.businees li.flex-active .businetop img{
	animation-delay: 0ms;
	animation-duration: 500ms;
	animation-timing-function:ease-in-out;
	animation-name: scales;
	animation-play-state: running;
	animation-timing-function: linear;
}

.businees li.flex-active  span:before{
	opacity:1;
	visibility:visible;
	transition:0.35s 0.18s;
	bottom:-10px;
}

.busineli li.flex-active-slide .busineet{
	opacity:1;
	visibility:visible;
	transition:0.76s 0.44s;
}

.business .flex-direction-nav{display:none;}

.business .flex-direction-nav li a{
	display:block;
	width:18px;
	height:36px;
	text-indent:9999px;
	overflow:hidden;
	position:absolute;
	top:50%;
	margin-top:-33px;
	z-index:10;
}

@keyframes scales {
    0% { transform: scale(0);}
    100% { transform:scale(1); }
}


.core-posi {
	position:relative;
	overflow:hidden;
	height:100%;
}

@media (max-width: 768px){
	/* .core-posi {height:780px !important;} */
}

.circle {
	z-index:99;
	position:absolute;
    width:120vh;
    height:120vh;
    background-color:rgba(8,162,236,0.54);;
    border-radius:50%;
	left:50%;
	transform:translateX(-50%);
	top:65%;
}

@media (max-width: 768px){
	.circle {
		width:70vh;
		height:70vh;
		border-radius:50%;
		left:50%;
		transform:translateX(-50%);
		top:80%;
	}
}

.cir-zi {
	z-index:9999;
	position:absolute;
	left:50%;
	transform:translateX(-50%);
	top:20vh;
	text-align:center;
}

@media (min-width: 768px) and (max-width: 1280px){
	.cir-zi {top:160px;}
}

@media (max-width: 768px){
	.cir-zi {
		position:absolute;
		top:30px;
		left:50%;
		transform:translateX(-50%);
	}
}

.cir-zi .cir-t {
	display:block;
	font-size:3em;
	font-weight:300;
	color:#fff;
	text-align:center;
}

@media (min-width: 768px) and (max-width: 1280px){
	.cir-zi .cir-t {font-size:2.5em;}
}

@media (max-width: 768px){
	.cir-zi .cir-t {font-size:2em;}
}

.cir-zi .cir-ten {
	display:block;
	font-size:3.5em;
	color:rgba(255,255,255,0.25);
	text-align:center;
	margin-top:-10px;
	margin-bottom:30px;
}

@media (min-width: 768px) and (max-width: 1280px){
	.cir-zi .cir-ten {font-size:3em;}
}

@media (max-width: 768px){
	.cir-zi .cir-ten {
		font-size:1.6em;
		margin-top:0px;
		line-height:20px;
		margin-bottom:0px;
	}
}