@media only screen and (min-width : 1201px) {
	.mobile {
		display: none;
	}
}

/* iPads (portrait) ----------- */
@media only screen and (max-width : 1700px) {
	header .sticla {
		width: 180px;
		top: 60px;
	}

	header .sticla.st {
		left: -92px;
	}

	header .sticla.dr {
		right: -94px;
	}

	header .bottom .ei {
		width: 370px
	}

	header .bottom .ei.ea {
		right: calc(100% + 0px);
	}

	header .bottom .ei.el {
		left: calc(100% + 10px);
	}

	.s1 {
		text-align: left
	}

	.s1 .buton {
		display: table;
		margin: 20px auto;
	}

	.s2 {
		text-align: left
	}

	.s2 .buton {
		display: table;
		margin: 40px auto;
	}

	.s3 {
		text-align: left
	}
}

@media only screen and (max-width : 1500px) {
	header .bottom .ei {
		display: none
	}
}

@media only screen and (max-width : 1200px) {

	.mobile.bottom .top {
		background: #c2dae7;
		display: flex;
		justify-content: center;
		align-items: flex-end;
	}

	.mobile.bottom .video p {
		padding: 0 15px;
		font-size: 18px;
		margin-bottom: 0;
	}

	.mobile.bottom .video.el p {
		margin-top: 70px;
		text-align: right
	}

	.mobile.bottom .text {
		padding: 30px 15px;
	}

	.mobile.bottom .sticla {
		margin-bottom: -70px;
		width: 180px;
	}

	.mobile.bottom .ei {
		width: 380px;
	}
	header .menu {
		position: fixed;
		background: rgba(0,0,0,0.85);
		top: -100vh;
		left: 0;
		width: 100%;
		display:  flex;
		flex-direction: column;
		align-items: center;
		z-index: 2;
		gap: 20px;
		height: 100vh;
		transition: all 0.2s ease-in-out;
	}

	header .menu .close-menu {
		position: absolute;
		top: 30px;
		right: 14px;
	}

	header .bottom .text {
		background: #fff;
		padding: 20px 0;
		position: relative;
		text-align: left;
	}

	header .bottom .text:before {
		content: '';
		width: 100vw;
		height: 100%;
		display: block;
		position: absolute;
		background: #fff;
		right: 100%;
		top: 0
	}

	header .bottom .text:after {
		content: '';
		width: 100vw;
		height: 100%;
		display: block;
		position: absolute;
		background: #fff;
		left: 100%;
		top: 0;
	}

	.menu-opened header .menu {
		top: 0;
	}

	.menu-opened {
		overflow: hidden;
	}

	.desktop {
		display: none;
	}
}

/* iPads (landscape) ----------- */
@media only screen and (max-width : 991px) {
	
	header .top h1 {
		font-size: 23px;
		text-align: center;
		margin: 0;
	}

	header .top .logo {
		width: 105px;
	}

	header .top {
		display: flex;
		justify-content: space-between;
		padding: 10px 0;
		gap: 0;
	}
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (max-width : 500px) {
	header .top h1 {
		max-width: 220px;
	}

	body {
		overflow-y: hidden;
	}

	.mobile.bottom .sticla {
		width: 116px;
		margin-bottom: -50px;
	}

	.mobile.bottom .ei {
		width: 311px;
		margin: 0 -40px;
	}

	

}