@media screen and (max-width: 1200px) {
	.reviews {
		display: none;
	}
	
	.reviews_mob {
		display: grid;
		align-items: center;
		align-self: center;
		justify-self: center;
		margin: 0 auto;
		height: 100%;
		grid-template-columns: 1fr;
		grid-template-rows: repeat(3, auto);
		padding-inline: 20px;
	}

	.otziv_text_mob {
		text-align: center;
		font-size: 4vw;
		color: #fff;
		margin-bottom: 5rem;
	}

	.comment_mob {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		margin-bottom: 3rem;
	}

	.comment_mob img {
		width: 50%;
		min-width: 250px;
	}

	.com_box_img_mob {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
	}

	.com_box_mob {
		background: grey;
		padding: 25px;
		border-radius: 10px;
		max-width: 700px;
		margin-bottom: 5%;
		font-family: stolzl;
		text-align: left;
		height: clamp(150px, 2vw, auto);
		font-size: clamp(15px, .5vw, 30px);
	}
	
	.com_box_mob h3 {
		text-align: right;
		margin-top: 10px;
	}

	.com_box_mob h2 {
		margin-bottom: 10px;
	}

	.yandex-otziv {
		margin: 0;
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		height: 80vh;
		width: 50vw;
	}

	.com_box_img_mob {
		gap: 20px;
	}

	.com_box_img_mob > div img{
		border-radius: 15px;
	}

	.yand_mob {
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: center;
	}

	.yand_mob::after {
		content: '';
		width: 27%;
	}

	.goo_mob {
		display:flex;
		width: 100%;
		align-items: center;
		justify-content: center;
	}

	.goo_mob::before {
		content: '';
		width: 100%;
		justify-content: center;
	}

	.tele_mob {
		display: flex;
		width: 100%;
		justify-content: center;
	}

	.tele_mob::after {
		content: '';
		width: 10vw;
	}
	
}



@media screen and (min-width: 1024px) {
	.numbers {
		grid-template-columns: auto auto auto auto auto;
	}
}

@media screen and (max-width: 1035px) {
	.text-box {
		width: 100%;
		align-items: left;
		margin: auto;
		text-align: center;
		height: 100%;
	}

	.page3 {
		display: none;
	}
}

@media screen and (max-width: 1024px) {
	.home {
		display: grid;
		height: 100%;
		width: 100%;
		grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
		grid-template-rows: auto;
		z-index: 10;
		align-content: center;
		justify-items: center;
		justify-content: center;
		margin: 0 auto;
	}

	.bgbox	{
		display: none;
	}

	.container {
		padding-inline: 5rem;
	}

	.social {
		display: flex;
		justify-content: center;
		margin-block: 8rem;
	
	}
	
	.social img {
		margin: 25px 0;
	}
	
	.logo {
		width: clamp(290px, 1vw, 1000px);
		display: flex;
		padding: 10px;
	}
	
	.skill {
		display: flex;
		width: 100%;
		justify-content: center;
	}
	
	.skill img {
		margin: 13px;
	}
	.numbers .mun1:nth-child(4) {
		align-items: end;
		transform: translateX(70px);
	}

	.numbers .mun1:nth-child(5) {
		align-items: end;
		transform: translateX(70px);
}

}


/* screen 768 */ /* screen 768 */ /* screen 768 */ /* screen 768 */ /* screen 768 */ /* screen 768 */

@media screen and (max-width: 940px) {
	.page3 {
		opacity: 0;
		position: absolute;
	}

	.page3_mob {
		display: flex;
		height: 100%;
		padding: 10px;
		align-items: center;
		justify-content: center;
		grid-template-columns: repeat(auto-fit, minmax());
		opacity: 1;
		position: relative;
		margin: 0 auto;
	}
}


@media screen and (max-width: 768px) {

	* {
		margin: 0;
		padding: 0;
	}

		.page3 {
			display: block;
		}

	.gallery-box {
		height: 1px;
		margin-bottom: 0;
	}

	.home {
		width: 100%;
		height: 100vh;
		z-index: 5;
		width: 100%;
	}

	
	.page3_mob {
		display: grid;
		padding: 10px;
		align-items: center;
		justify-content: center;
		grid-template-columns: repeat(auto-fit, minmax());
		opacity: 1;
		position: relative;
		margin: 0 auto;
	}

	.pic-box {
		left: 0px;
		width: clamp(100px, 10vw, 1200px);
		opacity: 0;
	}

	.pic-box_mob {
		background: #fff;
		display: grid;
		position: relative;
		align-items: center;
		justify-content: center;
		grid-template-columns: auto auto auto;
		opacity: 1;
		width: 100%;
		height: 100%;
		padding: 5px;
		gap: 5px;
	}

	.slider {
		display: grid;
		height: 100%;
		width: 100%;
		padding-inline: 25px;
		display: grid;
		align-items: center;
		align-self: center;
		justify-content: center;
		gap: 10px;
		grid-template-rows: repeat(auto-fit, minmax(300px, 1fr));
		overflow: visible
	}

	.text-box p {
		text-align: justy;
		word-spacing: clamp(1px, 1vw, 4px);
		font-size: clamp(15px, 1vw, 70px);
	}

	.text-box h1 {
		font-size: clamp(2rem, 6vw, 70px);
	}


	.img-box {
		align-items: center;
		text-align: center;
		width: 100%;
	}

	.img-box img {
		width: 100%;
	}

	.social {
		display: flex;
		width: 100%;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		padding-inline: 3rem;
		z-index: 1;
		margin-block: 3rem;
	}

	.social img {
		align-items: center;
		justify-content: center;
	}


	.skill {
		display: flex;
		align-items: center;
		justify-content: start;
		max-width: 100px;
		opacity: 0.3;
	}

	.skill a {
		justify-content: center;
		margin: 0 auto;
	}

	.skill a:nth-child(odd) {	
	margin-top: 30px;
	}

	.logo {
		transform: translateY(-150px);
		display: flex;
		height: 100%;
		align-items: center;
		flex-direction: column;
		justify-content: end;
		}

	.logo img {
		margin: 2.5rem 0;
	}

	.social img {
		width: 3;
	}

 	.bgbox	{
		display: none;
	}

	.container {
		position: absolute;
		width: 100%;
		max-width: 350px;
		min-width: 250px;
		display: flex;
		right: 0;
		margin: 0;
		padding-inline: 1px;
	}
	
	.navmenu {
		height: 23rem;
		margin-left: 400px;
		transform: translatex(60px);
		display: flex;
		max-width: 300px;
		background: linear-gradient(rgba(255, 14, 72, 1), rgba(184, 27, 129, 1));
		border-radius: 20px;
		z-index: 10;
		filter: saturate(1.2);
		will-change: transform;
		transition: transform .5s;
		}
		 
		.navmenu:focus {
				will-change: transform;
				transition: transform .5s;
			  transform: translatex(-130px);
				box-shadow: 0 0 99999px rgba(20, 20, 19, .8);
		}


		.navmenu ul::after {
			content: '';
			background-image: url(../img/tap.svg);
			background-size: 30px 30px;
			background-repeat: no-repeat;
			background-position: center;
			width: 35px;
			height: 35px;
			position: absolute;
			transform: translatex(-20px);
			display: block;
			z-index: 11;
		}

		

		
	.navmenu ul {
		height: 99%;
		width: 99%;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: space-around;
		background: #141413;
		border-radius: 20px 0 0 20px;
	}

	.navmenu::before {
		content: '';
		height: 110%;
		width: 110%;
		background: transparent;
		position: absolute;
		backdrop-filter: blur(10px);
		border-radius: 20px;
		z-index: 1;
	}

	.navmenu ul li {
		z-index: 2;
	}


	.navmenu ul li a {
		font-size: clamp(23px, 1vw, 40px);
		color: #fff;
		margin: 13px;
	}



	.portfolio {
		height: 100vh;
		max-width: 300px;
		min-width: 500px;
		width: 100%;
		opacity: 1;
		position: absolute;
	}
	
	.navmenu_portfolio {
		height: 15rem;
		top: 250px;
		min-width: 300px;
		transform: translatex(-270px);
		position: absolute;
		display: flex;
		background: linear-gradient(rgba(255, 14, 72, 1), rgba(184, 27, 129, 1));
		border-radius: 20px;
		z-index: 11;
		filter: saturate(1.2);
		will-change: transform;
		transition: transform .5s;
	}

	.navmenu_portfolio:focus {
		transform: translateX(-70px);
		box-shadow: 0 0 99999px rgba(20, 20, 19, .8);
	}
	
	.navmenu_portfolio ul {
		background:#141413;
		width: 99%;
		height: 99%;
		border-radius: 20px;
		display: flex;
		flex-direction: column;
		align-items: end;
		justify-content: center;
		list-style: none;
		gap: 35px;
	}

	.navmenu_portfolio::after {
		content: '';
		position: absolute;
		width: 110%;
		height: 110%;
		background: transparent;
		backdrop-filter: blur(10px);
		filter: saturate(1.3);
		z-index: 1;
	}

	.navmenu_portfolio ul li {
		z-index: 2;
	}

	.navmenu_portfolio ul > li a {
		color: #fff;
		font-family: protosans56;
		font-weight: 400;
		text-decoration: none;
		list-style: none;
		margin: 25px;
		font-size: clamp(20px, 1rem, 30px);
		}

		.navmenu_portfolio ul::after {
			content: '';
			background-image: url(../img/tap.svg);
			background-size: 30px 30px;
			background-repeat: no-repeat;
			background-position: center;
			width: 35px;
			height: 35px;
			position: absolute;
			transform: translate(10px, -110px) rotate(180deg);
			display: block;
			z-index: 11;
		}

		
.portfolio_text {
	position: relative;
	text-align: center;
	color: #fff;
	opacity: 1;
	display: flex;
	align-items: center;
	justify-content: right;
	margin: 5rem;
	font-size: 20px;
	height: 100vh;
	margin: 0;
	margin-bottom: 5rem;
}

.portfolio_text h1{
	position: absolute;
	font-size: 30px;
	transform: rotate(-90deg);
	font-family: protosans56;
	margin-right: -19rem;
	font-size: clamp(80px, 1vw, 200px);
	opacity: 0.1;
}

}

@media screen and (max-width: 620px) {
	.numbers {
		display: none;
	}


	.num {
		margin-bottom: 8rem;
		width: 100%;
		height: 100%;
		margin-top: 5rem;
		display: flex;
		opacity: 1;
		justify-content: center;
		align-items: center;
		position: relative;
		text-align: center;
		font-size: clamp(30px, 20vw, 80px);
		padding-inline: 10px;
		}

	.num_mob {
		color: #fff;
		width: 100%;
	}

	.num_mob:nth-child(1) {
		display: flex;
		width: 100%;
		flex-direction: column;
		font-size: clamp(30px, 20vw, 80px);
		font-family: protosans56;
		line-height: 9.8rem;
		text-align: right;
		margin-top: -21px;
		margin-right: 0.5rem;
		margin-left: 1rem;
		z-index: -1;
		opacity: 0.3;
	}

	.num_mob:nth-child(3) {
		display: flex;
		width: 100%;
		flex-direction: column;
		line-height: 9.8rem;
		font-family: Stolzl;
		font-size: clamp(10px, 5vw, 25px);
		text-align: left;
		margin-top: -21px;
		margin-left: 0.5rem;
		margin-right: 1rem;
		z-index: -1;
	}

}

@media screen and (max-width: 480px) {
	
	.cont-icon {
		flex-direction: row;
	}

	.slider {
		margin-top: 150px;
	}
	.text_home {
		grid-row: 2;
		display: flex;
		flex-direction: column;
		width: 100%;
		font-size: 15px;
		font-family: stolzl-thin;
		color: #fff;
		font-weight: 250;
		line-height: 50px;
		align-items: start;
		justify-content: end;
		margin-top: 65px;
	}

	.home {
		position: relative;
		display: grid;
		width: 100%;
		grid-template-columns: 1fr;
		grid-template-rows: 50% 40% 10%;
		padding: 25px;
	}

	.social {
		margin: 0;
		width: 100%;
		height: 80%;
		justify-content: start;
		align-items: flex-start;
		grid-row: 3;
		display: flex;
		flex-direction: row-reverse;
		padding: 0;
	}

	.social img {
		margin: 0 25px 0 0;
	}

	.logo {
		grid-row: 1;
		width: 100%;
		display: flex;
		position: relative;
		transform: translateY(0);
		margin: 0;
		margin-top: 55px;
	}

	.logo img {
		top: 180px;
		left: 0;
		margin: 0;
		position: absolute;
		width: clamp(200px, 3vw, 300px);
	}


	.skill {
		position: absolute;
		margin-top: 180px;
		right: 0;
		max-width: 150px;

	}

	.page5-grid .set {
		flex-direction: column;
		height: 100%;
	}

	.page5-text h1{
		font-size: 4rem;
	}

	.page5-img .img1 {
		transform: translatey(25px);
		margin-left: 15px;
		z-index: 2;
	}
	
	.page5-img .img2 {
		margin-right: 15px;
	}

	.page5-img .img3 {
		transform: translatey(-25px);
		margin-left: 15px;
		z-index: 1;
	}

	.page5-img .img3 img {

		box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3);
	}


	.page5-img .img4 {
		transform: translateY(-50px);
		margin-right: 15px;
	}

}

@media screen and (max-width: 900px) {
	

	.link_map {
		display: flex;
		width: 100%;
		height: 100%;
	}

	.map {
		width: 100%;
		height: 100%;
	}

	.map h1 {
		text-align: center;
	}

	.numbers .mun1:nth-child(4) {
		align-items: center;
		justify-content: center;
		transform: translatex(0px);
	}

	.text-box {
		width: 100%;
		padding-inline: 10px ;
	}
	.gallery-box {
		margin-bottom: 17rem;
		height: 100vh;
	}

	.stmob {
		opacity: 1;
	}

	.gallery-box {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-inline: auto 0;
	}

	.gallery-box .mov {
		width: 100%;
		opacity: 1;
		left: -50px;
	}

	.gallery-box .mov img {
		width: 3000px;
	}


	.page5-grid {
		grid-auto-flow: auto;
		position: relative;
		height: auto;
		margin: 0 auto;
	  grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
	  grid-template-rows: auto;
	  grid-auto-flow: dense;
	}

	.page5-text {
		margin: auto;
		grid-column: auto;
		grid-row: auto;
		width: 100%;
		display: flex;
		max-width: 600px;
		justify-content: space-around;
		align-items: center;
		font-size: clamp(20px, 1vw, 120px)
	}
	
	.page5-grid .page5-text h1 {
		font-size: clamp(25px, 7vw, 70px);
		color: #fff;
		font-family: protosans56;
		padding: 2rem;
		opacity: 0.5;
	}
	
	.set {
		margin: auto;
		grid-column: auto;
	  grid-row: auto;
		width: 100%;
		display: flex;
		max-width: 600px;
		flex-direction: row;
		align-items: center;
		justify-content: space-around;
		padding-inline: 3rem;
	}

	.set p {
		font-size: clamp(25px, 2vw, 50px);
		color: #fff;
		font-family: protosans;
	}
	
	.quk {
		align-items: center;
		flex-direction: column;
		text-align: center;
	}
	
	.easy {
		display: flex;
		flex-direction: column;
		text-align: center;
	}
	
	.instal {
		display: flex;
		flex-direction: column;
		text-align: center;
	}
	
	.page5-img {
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 20px;
		grid-row: auto;
	  grid-column: auto;
		margin: 20px;
	}
	
	.page5-grid .page5-img img {
		margin-top: 10px;
		border-radius: 15px;
	}

  	.img3 {
		margin-block: 0px;

	}

	.img2 {
		margin-top: 0rem;
	}

	.text-box h1 {
		text-align: center;
	}
	
	.text-box {
		height: 100%;
		width: 100%;
		align-items: center;
		justify-content: end;
	}

	.gallery-box .gallery-grid {
		opacity: 0;


	}

	.numbers {	
		height: 50vh;
		margin-top: 15rem;
	}

	
}
	
@media screen and (max-width: 380px) {
	.gallery-box {
		width: 100%;
		margin-left: 2rem;
	}
}
