/*!
Theme Name: ZGBK
Theme URI: 
Author: me
Author 
Description: ZGBK theme
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: zgbk
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

ZGBK is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

/*------------------------------Specification--------------------------------*/
.aic{
	align-items: center;
}

.ait{
	align-items: start;
}

.jcc{
	justify-content: center;
}

.aifs{
	align-items: flex-start;
}

html{
	scroll-behavior: smooth;
}

body {
	font-family: 'Alumni Sans', sans-serif;
	padding: 0;
	background: rgb(58,161,180);
	background: linear-gradient(149deg, rgba(58,161,180,0.196516106442577) 0%, rgba(29,154,253,0.15) 33%, rgba(41,127,229,0.1516981792717087) 66%, rgba(69,252,222,0.15) 100%);
	color: #081d42;
	font-weight: 300;
	letter-spacing: 0.05em;
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.4em;
}

div, p, form, input, a, span, button {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

p {
	margin: 0;
	padding: 0;
    font-size: 14px;
    line-height: 1.4em;
    letter-spacing: 0.02em;
    font-family: "Montserrat", sans-serif;
}

.container {
	max-width: 1400px;
	margin: 0 auto;
}

.container-fluid {
	margin: 0 auto;
}

ul, li {
	display: block;
	padding: 0;
	margin: 0;
}

h1, h2, h3, h4, h5, h6 {
	text-transform: uppercase;
	text-decoration: none;
	margin: 0;
	padding: 0;
	letter-spacing: normal;
	line-height: normal;
}

h2{
	text-decoration: none;
	font-size: 42px;
	font-weight: 700;
}

a, a:hover, a:active {
	text-decoration: none;
	transition: all 0.5s ease;
	cursor: pointer;
}

a:hover {
	border: none;
}

a, button, input {
	transition: all 0.5s ease;
}

input, input:hover, input:focus, input:active,
button, button:hover, button:focus, button:active {
	outline: none;
}

.button {
	display: flex;
	background: #81b6fa;
	color: #222;
	padding: 25px;
	width: 220px;
	justify-content: center;
	align-items: center;
	font-size: 20px;
	font-weight: 700;
	border-radius: 15px;
}

.button:hover {
	box-shadow: 0px 0px 25px #81b6fa;
}

/*----------------------------------Header---------------------------------------*/

.header{
	background: #000;
	padding: 30px 0;
	color: #dadada;
}

.logo{
	height: 70px;
	width: 210px;
	margin-right: 150px;
}

.header__offer{
	font-size: 13px;
	font-family: 'Montserrat', sans-serif;
	color: #AAABAB;
	font-weight: 500;
	margin-bottom: 3px;
}

.header__info{
	font-size: 18px;
	color: #DADADA;
	font-weight: 700;
	font-family: 'Alumni Sans', sans-serif;
	letter-spacing: 0.05em;	
	width: 300px;
}

.header-contacts{
	align-items: center;
}

.header-address{
	margin-right: 70px;
	align-items: center;
}

.header-icon{
	display: flex;
	border-radius: 100%;
	background: #fff;
	width: 50px;
	height: 50px;
	align-items: center;
	text-align: center;
	justify-content: center;
	margin-right: 30px;
}

.fa-location-dot{
	margin-bottom: 2px;
}

.icon{
	font-size: 20px;
	color: #000;
}

.menu-button{
	font-family: 'Alumni Sans', sans-serif;
	width: 200px;
}

.main-screen{
	height: 90VH;
	position: relative;
	z-index: 0;
}

.bg{
	background-image: url(http://zgbk.by/wp-content/uploads/2024/03/bg.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment:fixed;
}

.fake{
	display: block;
	background: #222;
	opacity: 80%;
	width: 100%;
	height: 100%;
	z-index: -1;
	position: absolute;
	left: 0;
	top: 0;
}

.main-text{
	padding-top: 12%;
}

.pretitle{
	font-family: 'Alumni Sans', sans-serif;
	font-size: 33px;
	color: #81b6fa;
	text-transform: uppercase;
	font-weight: 500;
}

.title{
	font-family: 'Alumni Sans', sans-serif;
	font-size: 100px;
	color: #dadada;
	font-weight: 900;
}

.posttitle{
	font-family: 'Alumni Sans', sans-serif;
	font-size: 26px;
	color: #dadada;
	font-weight: 500;
	padding-left: 15px;
	margin-bottom: 30px;
}

.main-button{
	margin-bottom: 100px;
	font-size: 24px;
	padding: 30px;
	width: 240px;
}

.container-fluid{
	display: flex;
	align-items: center;
	justify-content: center;
}

.advanteges{
	background: #000;
	padding: 30px;
	color: #dadada;
	border-radius: 20px;
	position: absolute;
	bottom: 5%;
	width: 90vw;
}

.icon-wrap{
	background: #fff;
	margin-right: 20px;
	border-radius: 15px;
}

.advanteges__icon{
	font-size: 40px;
	padding: 25px;
	color: #000;
}

.fa-clipboard-list{	
	margin: 0 5px;	
	text-align: center;
}

.advanteges__text{
	width: auto;
}

.advanteges__title{
	font-family: 'Alumni Sans', sans-serif;
	font-size: 22px;
	margin-bottom: 10px;
	font-weight: 700;
}

.advanteges__description{
	font-size: 14px;
	font-weight: 400;
	width: 90%;
}

.about-block{
	padding: 125px 150px;
}

.about{
	display: flex;
	align-items: center;
}

.about-text{
	width: 90%;
}

.about__title{
	margin-bottom: 35px;
}

.about__description{
	color: #081d42;
	font-size: 20px;
}

.about-pictures__item{
	padding: 0;
	margin: 0;
}

.picture{
	width: 320px;
	height: 240px;
	margin-right: 10px;
	margin-bottom: 5px;
	border-radius: 15px;
}

.wrap-li{
	display: flex;
}

.more-button{
	margin-top: 40px;
}

.services{
	color: #dadada;
	box-shadow: 0px 0px 10px #040916;
	position: relative;
	padding: 125px 75px;
	z-index: 0;
}

.services .container{
	width: 100%;
	padding: 0;
}

.services-title{
	margin-bottom: 50px;
}

.tab {
    float: left;
    border: 3px solid #c1dcff;
    box-shadow: 0 0 12px #c1dcff;
    border-radius: 15px 0 0 15px;
    background-color: #fff;
    width: 30%;
    height: 65vh;
    overflow-y: scroll;
}

/* Style the buttons that are used to open the tab content */
.tab button {
    display: block;
    font-size: 24px;
    background-color: inherit;
    color: #081d42;
    width: 100%;
    border: 1px solid #c1dcff;
    border-radius: 0;
    outline: none;
    text-align: left;
    cursor: pointer;
    transition: 0.3s;
    padding: 0 5px;
    margin-top: 0;
}

/* Change background color of fabuttons on hover */
.tab button:hover {
    background-color: #81b6fa50;
}

/* Create an active/current "tab button" class */
.tab button.active {
    background-color: #81b6fa;
}

/* Style the tab content */
.tabcontent {
		background: #c1dcff;
		color: #081d42;
    float: left;
    padding: 25px 30px;
    border: 3px solid #c1dcff;
    box-shadow: 0 0 12px #c1dcff;
    width: 70%;
    border-left: none;
    height: 65vh;
    border-radius: 0 15px 15px 0;
    position: relative;
    flex-direction: column;
    justify-content: space-between;
}

.wrap{
	flex-wrap: wrap;
	justify-content: space-between;
}

.mark{
	align-items: center;
	justify-content: space-between;
	width: 48%;
	border-radius: 10px;
	margin-bottom: 20px;
	padding: 10px;
	background: #ffffff40;
	transition: all 0.5s ease;
}

.mark:hover{
	background: #ffffff60;
	transition: all 0.5s ease;
}

.mark:hover .mark__title, .mark:hover .price{
	color: #0a58ca;
	transition: all 0.5s ease;
}

.mark__title{
	font-size: 20px;
	margin-bottom: 7px;
	font-weight: 700;
}

.mark__desc{
	font-size: 16px;
	font-weight: 500;
}

.price{
	font-size: 16px;
	width: 33%;
	font-weight: 700;
}

.unpriced{
	font-size: 22px;
	font-weight: 700;
	color: #e12d2d;
	text-transform: uppercase;
}

.services-button{
	margin-right: 50px;
	padding: 20px;
	width: 200px;
	background: none;
	border: 1px solid #0a58ca;
	color: #0a58ca;
}

.services-button:hover{
	box-shadow: 0px 0px 12px #0a58ca;
	border: none;
}

.button-more{
	font-size: 20px;
	font-weight: 700;
}

.button-more:hover{
	text-shadow: 0 0 5px #0a58ca30;
}

.button-wrap{
	margin-top: 15px;
	align-items: center;
	justify-content: flex-end;
}

.tab::-webkit-scrollbar {
  width: 16px;               /* ширина всей полосы прокрутки */
}

.tab::-webkit-scrollbar-track {
	width: 100%;
  background: #81b6fa40;        /* цвет зоны отслеживания */
}

.tab::-webkit-scrollbar-thumb {
  background-color: #81b6fa;    /* цвет бегунка */
  border-radius: 0px;       /* округлось бегунка */
}

.services-h3{
	font-weight: 700;
	color: #081d42;
	margin-bottom: 5px;
}

.services-p{
	font-weight: 500;
	color: #081d42;
	margin-bottom: 15px;
}

.swiper{
	min-width: 0;
	position: relative;	
}

.swiper-wrapper{
	padding: 0px 0 25px 0;
	display: flex;
	align-items: center;
}

.swiper-button-prev, .swiper-button-next{	
	font-weight: 900;
	color: #81b6fa;
}

.swiper-pagination{
	color: #81b6fa;
}

.swiper-pagination-bullet{
	background: #81b6fa;
	opacity: 50%;
	width: 16px;
	height: 16px;
	color: #fff;
	font-size: 20px;
	font-weight: 700;
}

.swiper-pagination-bullet-active{
	opacity: 100%;
}

.diploma{
	padding: 125px 0px;
}

.diploma-slide{
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
}

.diploma-picture{
	width: 280px;
	height: 400px;
	padding: 10px 20px;
	box-shadow: 0px 0px 16px #22222238;
	border-radius: 10px;
	cursor: pointer;
}

.image {
	margin:30px;
	cursor:zoom-in;
}

.popup {
	position: absolute;
	height:100%;
	width:100%;
	top:0;
	left:0;
	display:none;
	text-align:center;
}

.popup_bg {
	background:rgba(0,0,0,0.3);
	position:fixed;
	z-index:1;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	width: auto;
  height: auto;
}

.popup_img {
	position: fixed;
	z-index:2;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	max-height: 90%;
}

.popup_img {
  pointer-events: none;
}

.feedback{
	background: url(http://zgbk.by/wp-content/uploads/2024/03/1.webp);
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	z-index: 0;
	color: #dadada;
	scroll-behavior: smooth;
}

.feedback-form{
	display: flex;
	flex-direction: column;
	text-align: center;
	justify-content: center;
	padding: 75px 0;
}

.wpcf7-form p{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.wpcf7-response-output{
    border: none;
}

.feedback-title{
	font-size: 50px;
	margin-bottom: 25px;
}

.feedback-text{
	font-size: 20px;
	margin-bottom: 30px;
}

.form-text{
	display: flex;
	align-items: center;
	justify-content: center;
}

.input-container {
  position: relative;
  margin-right: 100px;
  width: 250px;
}

.input-container input[type="text"] {
  font-size: 20px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #dadada;
  padding: 5px 0;
  background-color: transparent;
  outline: none;
}

.input-container input[type="tel"] {
  font-size: 20px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #dadada;
  padding: 5px 0;
  background-color: transparent;
  outline: none;
}

.field{
	padding: 13px 15px;
	margin-bottom: 25px;
	color: #dadada;
	background: none;
	border-radius: 10px;
	border: 1px solid #dadada;
}

.field::-webkit-input-placeholder { color: #ffffff95; }

.input-container .label {
  position: absolute;
  font-family: 'Alumni Sans', sans-serif;
  font-size: 20px;
  font-weight: 700;
  top: 0;
  left: 8px;
  color: #dadada;
  transition: all 0.3s ease;
  pointer-events: none;
}

.input-container input[type="text"]:focus ~ .label,
.input-container input[type="text"]:valid ~ .label {
  top: -20px;
  left: 0;
  font-size: 16px;
  color: #81b6fa;
}

.input-container input[type="tel"]:focus ~ .label,
.input-container input[type="tel"]:valid ~ .label {
  top: -20px;
  left: 0;
  font-size: 16px;
  color: #81b6fa;
}

.input-container .underline {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 100%;
  background-color: #81b6fa;
  transform: scaleX(0);
  transition: all 0.3s ease;
}

.input-container input[type="text"]:focus ~ .underline,
.input-container input[type="text"]:valid ~ .underline {
  transform: scaleX(1);
}

.input-container input[type="tel"]:focus ~ .underline,
.input-container input[type="tel"]:valid ~ .underline {
  transform: scaleX(1);
}

button{
	font-size: 16px;
	height: 60px;
	width: 260px;
	color: #dadada;
	border: 2px solid #dadada;
	background: none;
	font-weight: 700;
	border-radius: 15px;
}

button:hover{
	border: none;
	background: #dadada;
	color: #222;
	box-shadow: 0px 0px 16px #ffffff60;
	cursor: pointer;
}

.wpcf7-submit{
	font-size: 16px;
	height: 60px;
	width: 260px;
	color: #dadada;
	border: 2px solid #dadada;
	background: none;
	font-weight: 700;
	border-radius: 15px;
	margin-top: 15px;
}

.wpcf7-submit:hover{
	border: none;
	background: #dadada;
	color: #222;
	box-shadow: 0px 0px 16px #ffffff60;
	cursor: pointer;
}

.footer {
	padding: 50px 0;
	background: #000;
	color: #dadada;
}	

.footer-logo{
	margin-bottom: 30px;
	margin-right: 25px;
}

.logo-str{
	width: 60px;
	height: 60px;
	margin-right: 15px;
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  transition: all 0.5s ease;
}

.str-name{
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 3px;
	color: #fff;
}

.str-adv{
	font-size: 12px;
	font-weight: 500;
	color: #fff;
}

.str3{
	margin-bottom: 15px;
}

.str3:hover .logo-str{
	-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
  transition: all 0.5s ease;
}

.str3:hover .str-name, .str3:hover .str-adv{
	transition: all 0.5s ease;
	color: #81b6fa;
}

.about-us__description{
	font-family: "Alumni sans", sans-serif;
	font-weight: 700;
	font-size: 18px;
}

.about-us__description:hover, .copyright:hover{
	transition: all 0.5s ease;
	color: #81b6fa;
}

.copyright{
	font-family: "Alumni sans", sans-serif;
	font-weight: 700;
	font-size: 18px;
}

.contacts{
	flex-direction: column;
}

.contacts-title{
	margin-bottom: 15px;
	text-align: left;
}

.footer-address{
	width: 90%;
}

.footer-icon{
	display: flex;
	border-radius: 100%;
	background: #fff;
	width: 50px;
	height: 50px;
	align-items: center;
	text-align: center;
	justify-content: center;
	margin-right: 10px;
	position: relative;
}

.footer-text{
	font-size: 14px;
}

.contacts-list{
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
}

.contacts-list__item{
	display: flex;
	margin-bottom: 15px;
	align-items: center;
	font-weight: 700;
	margin-right: 30px;
}

.social{
	display: flex;
	align-items: center;
	font-size: 40px;
	font-weight: 700;
	margin-bottom: 15px;
	color: #dadada;
	margin-right: 15px;
}

.social-text{
	font-size: 14px;
	letter-spacing: 0.24em;
}

.social-icon{
	margin-right: 10px;
}

.instagram-link:hover{
	color: #833AB4;
}

.telegram-link:hover{
	color: #0088cc;
}

.vk-link:hover{
	color: #4C75A3;
}

.blue{
	text-transform: uppercase;
	color: #81b6fa;
	font-weight: 700;
}

.copyright{	
	text-align: right;
}

.map{
	margin: 25px 0;
}

@media (max-width: 1399.98px) {

	.container{
		max-width: 1180px;
	}

	.header-address{
		margin-right: 20px;
	}

	.header-icon{
		margin-right: 10px;
	}

	.advanteges__icon{
		font-size: 26px;
		padding: 20px;
	}

	.advanteges__title{
		font-size: 20px;
		margin-bottom: 5px;
	}

	.advanteges__description{
		letter-spacing: normal;
	}

	.fa-clipboard-list{
		margin: 0;
	}

	.about-block{
		padding: 75px 25px;
		margin-right: 25px;
	}

	.about__title{
		margin-bottom: 20px;
	}

	.picture{
		width: 280px;
		height: 220px;
	}

	.services{
		padding: 75px 25px;
	}

	.mark__title{
		font-size: 20px;
		margin-bottom: 5px;
	}

	.mark__desc{
		font-size: 12px;
	}

	.diploma{
		padding: 75px 25px;
	}

	.diploma-picture{
		width: 260px;
		height: 360px;
	}
}

@media (max-width: 1199.98px) {

	.container{
		max-width: 960px;
	}

	.logo{
		height: 50px;
		width: 160px;
		margin-right: 0;
	}

	.header-phone__text{
		width: 140px;
	}

	.header-icon{
		width: 30px;
		height: 30px;
	}

	.icon{
		font-size: 14px;
	}

	.header__info{
		font-size: 14px;
	}

	.menu-button{
		font-size: 16px;
		width: 140px;
		padding: 15px;
	}

	.pretitle{
		font-size: 28px;
	}

	.title{
		font-size: 70px;
	}

	.main-button{
		width: 220px;
		padding: 30px;
	}

	.picture{
		width: 230px;
		height: 200px;
	}

	.mark__title{
		font-size: 16px;
	}

	.about__description{
		font-size: 16px;
	}

	.price{
		font-size: 12px;
	}

	.swiper-wrapper{
		padding: 0px 0 20px 0;
	}

	.diploma-picture
	{
		width: 220px;
		height: 300px;
	}

	.input-container{
		margin-right: 35px;
	}

	.footer{
		padding: 50px 0;
	}

	.tab button{
		display: flex;
		padding: 50px 10px;
		align-items: center;
	}

}

@media (max-width: 991.98px) {

	h2{
		font-size: 36px;
	}

	.container{
		max-width: 720px;
	}

	.logo{
		width: 300px;
		height: 100px;
		margin-right: 0;
		margin-bottom: 20px;
	}

	.header-icon{
		width: 60px;
		height: 60px;
	}

	.icon{
		font-size: 26px;
	}
	
	.header-contacts{
		flex-direction: column;
	}

	.header__info, .header__offer{
		font-size: 20px;
		text-align: center;
		width: 100%;
	}

	.header-address{
		margin-bottom: 25px;
		margin-right: 0;
	}

	.menu-button{
		padding: 30px;
		width: 400px;
		margin-top: 30px;
		font-size: 30px;
	}

	.title{
		font-size: 60px;
	}

	.main-button{
		padding: 25px;
	}

	.advanteges{
		bottom: -300px;
	}

	.icon-wrap{
		width: 50px;
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
	}

	.advanteges__icon{
		font-size: 20px;
	}

	.advanteges__text{
		width: 100%;
	}

	.advanteges__item{
		margin-bottom: 30px;
	}

	.advanteges__item:last-child{
		margin-bottom: 0;
	}

	.picture{
		width: 150px;
		height: 150px;
	}

	.about__description{
		font-size: 14px;
		font-weight: 500;
	}

	.about{
		align-items: start;
	}

	.about__title{
		margin-bottom: 10px;	
	}

	.more-button{
		margin-top: 20px;
		font-size: 16px;
		padding: 20px;
	}

	.tabcontent{
		padding: 15px 20px;
	}

	.mark__title{
		font-size: 16px;
	}

	.price{
		font-size: 14px;
	}

	.tab{
		float: none;
		display: flex;
		height: 15vh;
		width: 100%;
		overflow-y: hidden;
		border-radius: 15px 15px 0 0;
	}

	.tab button{
		text-align: center;
		padding-left: 50px;
		padding-right: 50px;
	}

	.tabcontent{
		width: 100%;
		border-radius: 0 0 15px 15px;
		height: auto;
	}

	.mark{
		width: 100%;
	}

	.mark__title{
		font-size: 24px;
	}

	.mark__desc{
		font-size: 16px;
	}

	.price{
		font-size: 22px;	
	}

	.button-wrap{
		justify-content: space-between;
	}

	.services-button{
		font-size: 24px;
		padding: 30px;
		width: 260px;
	}

	.button-more{
		font-size: 22px;
	}

	.diploma-picture{
		width: 500px;
		height: 760px;
	}

	.footer-logo{
		width: 220px;
		height: 80px;
	}

	.footer-about{
		display: flex;
		justify-content: space-between;
		margin-bottom: 30px;
	}

	.contacts-title{
		text-align: center;
		margin-bottom: 25px;
		font-size: 46px;
	}

	.footer-text{
		font-size: 20px;
	}

	.social-media{
		display: flex;
		justify-content: space-between;
		margin-top: 25px;
	}
}

@media (max-width: 767.98px) {

	.container{
		max-width: 540px;
	}

	.header-address__text{
		width: 100%;
	}

	.header-phone__text{
		width: 100%;
	}

	.advanteges{
		bottom: -400px;
	}

	.picture{
		width: 250px;
    height: 170px;
	}

	.about-text{
		margin-bottom: 30px;
	}

	.form-text{
		flex-direction: column;
	}

	.input-container{
		margin-right: 0;
		margin-bottom: 40px;
	}

	.button-more{
		font-size: 18px;
	}
}

@media (max-width: 575.98px) {

	.picture{
		margin-right: 0;
	}

	.header__info{
		font-size: 14px;
	}

	.container{
		max-width: 100%;
	}

	.container-fluid{
		max-width: 100%;
		padding: 0;
	}

	.main-screen{
		height: auto;
	}
	
	.main-button{
	    margin-bottom: 25px;
	}

	.advanteges{
		position: static;
		width: 100%;
		border-radius: 0;
		padding: 25px 0;
	}

	.wrap-li{
		flex-direction: column;
	}

	.social-media{
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
	}

	.footer-text{
		font-size: 14px;
		text-align: center;
	}

	.logo{
		width: 240px;
		height: 80px;
	}

	.field{
		width: 280px;
	}

	.about-us__description{
		font-size: 14px;
	}

	.copyright{
		font-size: 14px;
	}

	.social-text{
		font-size: 18px;
	}

	.footer-about{
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.diploma-picture{
		width: 280px;
		height: 340px;
	}

	.about-block, .services, .diploma{
		padding: 45px 15px;
		margin: 0;
	}

	.about-block{
		text-align: center;
	}

	.about-text{
		width: 100%;
	}

	.about-pictures__item{
		display: flex;
		align-items: center;
		justify-content: center;	
	}

	.diploma-title, .services-title, .about-title{
		font-size: 28px;
		margin-bottom: 15px;
		text-align: center;
	}

	.feedback-title{
		font-size: 40px;
	}

	.feedback-text{
		font-size: 16px;
	}

	.feedback-form{
		padding: 45px 0;
	}

	.contacts-list__item{
		margin-right: 0;
	}

	.main-text{
		display: flex;
		flex-direction: column;
		text-align: center;
		align-items: center;
		justify-content: center;
	}

	.tab{
		height: auto;
	}

	.tab button{
		font-size: 16px;
		padding: 0px 25px;
		line-height: normal;
		height: auto;
	}

	.price{
		font-size: 12px;
	}

	.unpriced{
		font-size: 16px;
	}

	.mark__text{
		margin-right: 10px;
	}

	.mark__title{
		font-size: 16px;
	}

	.mark__desc{
		font-size: 14px;
	}

	.swiper-wrapper{
		padding: 0px 0 10px 0;
		box-shadow: none;
	}

	.services-button{
		font-size: 14px;
		padding: 10px;
		text-align: center;
		margin-right: 25px;
		letter-spacing: normal;
		width: 50%;
	}

	.button-more{
		font-size: 14px;
	}

	.title{
		font-size: 44px;
	}	

	.menu-button{
		display: none;
	}

	.contacts-list {
		align-items: center;
		justify-content: center;
	}

	.header-phone__text{
		width: 160px;
	}

	.header-address__text{
		width: 220px;
	}

	.pretitle{
		font-size: 24px;
	}

	.posttitle{
		padding-left: 0;
		font-size: 20px;
	}

	.contacts-title{
		display: none;
	}

	.footer{
		padding: 25px 0;
	}

	.footer-icon{
		width: 40px;
		height: 40px;
	}

	.icon{
		font-size: 16px;
	}

	.header-icon{
		width: 40px;
		height: 40px;

	}

}