@import url('https://fonts.googleapis.com/css?family=Oswald:400,600&display=swap&subset=cyrillic');

.visible {
	display: block!important;
}

* {
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
  width: 100%;
}

@font-face {
	font-family: 'Oswald', sans-serif;
    font-weight: normal;
    font-style: normal;
}




/* -------------------- */

/*
::-webkit-scrollbar {
	display: none;
}
*/

.wrapper {
	margin: 0px auto;
	-webkit-user-select: none;
	overflow: hidden;
	background: #fff;
	height: 100%;
}

.page {
	position: relative;	
	width: 100%;
	height: 100%;
}
.page0 {
	position: relative;	
	display: none;
	width: 100%;
}

#iMain{
	overflow-y: auto;
	background-attachment: fixed;
	background: url(../images/bg.jpg) no-repeat;
	background-size: cover;	
}

header{
	height: 90px;
	background: #3340EB;
	/*display: table;
	table-layout: fixed;*/
	width: 100%;
	position: relative;
	font-size: 1.2em;
	
}

#iBase header{
	z-index: 3;
}

.main-title{
	color: white;
	width: 50%;
	margin-left: 40%;
	padding: 0 5%;
	text-align: center;
	position: relative;
  	top: 50%;
	transform: translateY(-50%);
	/*display: table-cell;
	vertical-align: middle;*/
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 14pt;
	font-style: normal;
	line-height: 14pt;
}

.cnt-container{
	height: 100%;
	text-align: center;
	position: relative;
}

.main-container{	
	font-size: 0;
}

.main-slide{
	display: inline-block;
	min-height: 320px;	
	height: 100%;
	margin: 0 auto;
	width: 100%;
	vertical-align: top;
}

.main-intro{

	position: relative;
}
.main-competition{
	background: rgba(0,94,210,0.79);
	height: auto;
	position: relative;
}

.main-intro-girl{
	background: url(../images/girl.png) no-repeat;
	background-size: cover;
	width: 100%;
	height: 100%;
	position: relative;
	top: -5%;
}

.main-intro-lenta{
	position: absolute;
	bottom: 0;
	background: url(../images/lenta.png) no-repeat;
	background-size: 100% 100%;
	width: 100%;
	height: 15%;
	z-index: 2;
}

.main-intro-lenta > div{
	height: 100%;
	background: url(../images/lenta_hbig.png) no-repeat;
	background-size: contain;
    background-position: center;
}

.main-competition-years{
	font-size: 35px;
	color: #ABFFFF;
	/*height: 45px;*/
	width: 100%;
	margin: 0 auto 3%;
	display: inline-block;
	position: relative;
}

.main-competition-years-container{
	overflow: hidden;	
	width: 80%;
	height: 100%;
	margin: 0 auto;
}

.main-year{
	display: inline-block;
	margin: 0 15px;
	cursor: pointer;
	padding: 24px 5px;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 22pt;
	font-style: bold;
}

.main-year-active{
	color: #f00;
	background: url(../images/year.png) no-repeat;
	background-size: 100% 100%;
}

.swiper-button-next-y, .swiper-button-next-m{
	background: url(../images/arrow.png) no-repeat;
	background-size: contain;
	background-position: center center;
	width: 10%;
	height: 50%;
	top: 50%;
	transform: translateY(-50%);
	margin-top: 0;
}

.swiper-button-prev-y, .swiper-button-prev-m{
	background: url(../images/arrow.png) no-repeat;
	background-size: contain;
	background-position: center center;
	-webkit-transform: scaleX(-1) translateY(-50%);
	    -ms-transform: scaleX(-1) translateY(-50%);
	        transform: scaleX(-1) translateY(-50%);
	width: 10%;
	height: 50%;
	top: 50%;	
	margin-top: 0;
}

.swiper-slide-m{
	margin: 0 auto;
}

.main-competition-wrapper{
	width: 80%;
	margin: 0 auto;
	height: 350px;	
	/*background: #f00;*/
	margin-bottom: 30px;
	position: relative;
}

.swiper-container-m {
      width: 100%;
      height: 100%;
      margin: 0px auto;
	  box-sizing: border-box;
	  color: #000;
	  overflow: hidden;
}

.main-competition-wrapper .swiper-button-next{
	background: url(../images/arrow.png) no-repeat;
	background-size: contain;
	background-position: center;
	right: -8%;
	width: 10%;
	height: 15%;
	top: 35%;
}

.main-competition-wrapper .swiper-button-prev{
	background: url(../images/arrow.png) no-repeat;
	background-size: contain;
	background-position: center;
	left: -8%;
	width: 10%;
	height: 15%;
	top: 35%;
}

.swiper-slide {
      text-align: center;
      background: transparent;	
      cursor: pointer;
      width: auto;
}

.main-slide-img{
	width: 93.2%;
	height: 75%;
	margin: 0 auto 1%;
	background: url(../images/pad.jpg) no-repeat;
	background-size: contain;
	background-position: center center;
	/*border: #ffad00 solid 8px;
	box-sizing: border-box;*/
	position: relative;
}

.main-slide-img > div{
	content: ' ';
	width: 95%;
	height: 95%;
	display : block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.main-slide-title{
	height: 20%;
	margin: 0 auto;
	font-size: 30px;
	color: #fff;
	line-height: 7wh;
	vertical-align: middle;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 18pt;
	line-height: 16pt;
}

.base-logo{
	display: inline-block;
	height: 100%;
	width: 25%;
	background: url(../images/lenta3.png) no-repeat;
	background-size: contain;
	vertical-align: top;
	cursor: pointer;	
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) infinite;
  -webkit-animation:  shake 0.82s cubic-bezier(.36,.07,.19,.97) infinite;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
  animation-duration: 12s;
}


@keyframes shake {
  10%, 90% {
    transform: translate3d(0px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(-5px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-10px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(0px, 0, 0);
  }
}









.base-career{
	display: inline-block;	
	font-size: 30px;
	color: #FFE600;
	line-height: 7vh;
	vertical-align: middle;
	top: 50%;
	transform: translateY(-50%);
	position: relative;
	right: 14%;
	float: right;
	text-align: center;
	width: 50%;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 24pt;
	line-height: 16pt;
	cursor: pointer;
}

.arrow-down{
	background: url(../images/arrow-down.png) no-repeat;
	background-size: contain;
	background-position: center;
	height: 100%;
	width: 30px;
	display: inline-block;
	position: absolute;
	margin-left: 10px;
	top: 0;
}

#iCurProf{
	display: inline-block;
    text-overflow: ellipsis;
    max-width: 94%;
    font-size: 18pt;
}

.base-year{
	display: inline-block;
	position: relative;
	right: 5%;
	float: right;
	padding: 15px 10px;
	cursor: pointer;
	color: #f00;
	background: url(../images/year.png) no-repeat;
	background-size: 100% 100%;
	font-size: 30px;
	top: 50%;
	transform: translateY(-50%);
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 28pt;
}

.base-content{
	background-attachment: fixed;
	background: url(../images/bg.jpg) no-repeat;
	background-size: cover;	
}

#iText{
	width: 100%;
	height: 100%;
	overflow: hidden;
	background: rgba(255,255,255,.93); 
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 14pt;
	line-height: 16pt;
	overflow-y: auto;
}

.base-menu{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60px;
	background: rgba(0,94,210,0.79);
	text-align: center;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
	font-size: 24pt;
	line-height: 16pt;
}

.base-menu-item{
	display: inline-block;
	color: #fff;
	font-size: 24px;
	padding: 15px 20px;
	cursor: pointer;
	font-family: 'Oswald', sans-serif;
	font-weight: 500;
}

.base-menu-item:hover{
	color: #fff;
}

.base-menu-container{
	overflow: hidden;	
	width: 80%;
	height: 100%;
	margin: 0 auto;	
}

.base-menu-item-active{
	color: #2a35c9;
}

.base-year-popup-container{
	position: absolute;
	right: 0;
	top: 100%;	
	background: #2a35c9;
	color: #fff;
	border-radius: 5px;
	width: 100%;
	text-align: center;
	height: 0;
	display: none;
	transition: height 1s;
}

.base-year-popup-item, .base-prof-popup-item{
	margin: 25px auto;
	font-size: 0.8em;
	line-height: 18pt;
}
.base-year-popup-item:hover, .base-prof-popup-item:hover{
	color: #ffe600;
}

.base-prof-popup-container{
	position: absolute;
	right: 0;
	top: 140%;	
	background: #2a35c9;
	color: #fff;
	border-radius: 5px;
	width: 100%;
	text-align: center;
	height: 0;
	display: none;
	transition: height 1s;
	/*max-height: 300px;*/
	overflow-y: auto;
}

.active-popup{
	height: auto;
	display: block;
	overflow: auto;
}

@media (orientation: landscape) {
	.main-slide{
		width: 40%;
		height: 100%;		
	}
	.main-competition{
		height: 100%;
		width: 60%;
	}
	.main-intro-lenta{
		width: 250%;
		height: 20%;
	}
	.main-intro-girl{
		height: 105%;
	}
	.main-competition-wrapper{
		margin-bottom: 0;
	}

	.base-logo{
		width: 35%;
		background: url(../images/lenta2.png) no-repeat;
		background-size: contain;	
	}	
	.main-title{
	font-size: 21pt;
 	line-height: 25pt;
	}
	.main-year{
	font-size: 28pt;
 	line-height: 25pt;
	}
	.main-slide-title {
	font-size: 28pt;
 	line-height: 30pt;
	}
	.base-career{
	right: 17%;
	}
}

@media (max-width: 400px) {
	#iCurProf{
		max-width: 80%;
	}
	.base-year{
	    padding: 15px 5px;
	}
}



/* Scrollbar */
::-webkit-scrollbar-corner{background:transparent;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:#fff;border-radius:30px;}
::-webkit-scrollbar-thumb{border-radius:30px;background:#25d4d7;-webkit-box-shadow:none}
/* Scrollbar */