@import url('https://fonts.googleapis.com/css2?family=El+Messiri:wght@400;500;600;700&display=swap');

* {
	padding: 0;
	margin: 0;
	color: white;
}
body {
	background-color: #162831;
	font-family: 'El Messiri', sans-serif;
	font-weight: 700;
	margin: 0 auto;
	width: 68%;
}
header {
	font-size: 16px;
	line-height: 135%;
	padding-top: 30px;
}
nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.submenu {
	display: none;

}
header ul {
	list-style: none;
	display: inline-flex;
	align-items: center;
}
header li {
	margin-right: 50px;
}
a {
	text-decoration: none;
}
p {
	font-weight: 400;
	font-size: 16px;
	padding-top: 30px;
	line-height: 22px;
	text-align: justify;
}
.d-none {
	font-weight: normal;
}
.nav__btn {
	border: none;
	border-radius: 3px;
	cursor: pointer;
	width: 180px;
	height: 51px;
	background-color: #018ABE;
	padding: 9px 15px;
	font-family: 'El Messiri', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	transition: 1s;
}
.nav__btn:hover {
	background-color: #016ABE;
	color: whitesmoke;
	transition: .3s ease-in-out;
}
.Offer__RitmStyle {
	text-align: center;
    position: absolute;
    align-items: center;
	top: 280px;
    left: 0;
    width: 100%;
    z-index: 2;
}
.Signature {
	font-size: 24px;
}
.Offer__Text {
	padding-top: 20px;
	font-size: 64px;
}
.Aquatherapy {
	position: relative;
	margin-top: 50px;
	width: 100%;
	height: 100%;
	z-index: 1;
}
.SheetWL {
	margin-right: 66px;
}
.SheetWR {
	margin-left: 66px;
}


/*Cеансы RitmStyle*/
.Head-Text {
	padding-top: 150px;
	text-align: center;
	font-size: 42px;
}
.Grid__Sessions {
	margin-left: 20px;
	display: grid;
	row-gap: 22px;
    column-gap: 24px;
	grid-template-columns: repeat(2, 1fr);
}
.For {
	position: relative;
    display: flex;
    align-items: flex-end;
	cursor: pointer;
}
.Text-in-Sessions {
	position: absolute;
	font-size: 24px;
	padding: 40px;
}
.Sessions {
	width: 100%;
	height: 100%;
}
.Content-wrapper {
	display: flex;
	padding-top: 100px;
	justify-content: center;
}

/*Отзывы*/
.item {
	background-color: #018ABE;
	border-radius: 10px;
	height: 350px;
	width: 100%;
}
.owl-carousel {
	padding-top: 100px;
}

/*Об RitmStyle*/
.Img-Content img {
	width: 100%;
	height: 100%;
}
.Content {
	padding: 66px 84px 0px 0px;
	width: 50%;
}
.About {
	padding: 16px 0px 0px 84px;
}
.container-another {
	width: 85%;
	margin: 0 auto;
}
.Shell {
	padding: 16px 0px 0px 84px;
}

/* Стоимость сеансов */
.Card-Thanks h3 {
	font-size: 21px;
	padding-top: 20px;
}
.Card-Thanks {
	text-align: center;
}
#Card-Thanks {
	width: 100%;
}
.Content-3 {
	padding: 37px;
}
.Name-Price li {
	list-style: none;
	margin-top: 31px;
}
.Name-Price li::before {
	content: url(../Img/CardWrapCost.svg);
	padding-right: 20px;
}
.Content-3 strong {
	margin-left: 120px;
}
.Name-Price {
	display: flex;
	justify-content: center;
	min-width: 450px;
	
}
.Price {
	display: flex;
    flex-direction: column;
}
.Price strong {
	margin-top: 31px;
}

/* Карта */
.containerMapAdaptive {
	display: none;
}
.Content-4 {
	display: flex;
	width: 70%;
}
#map {
	width: 100%;
	height: 100%;
	border-radius: 10px;
	border: 2px;
}
.map {
	width: 95%;
}
i {
	/* не работал со значением меньше 600 */
	font-weight: 700 !important;
	padding-top: 21px;
}
.Adress-name {
	font-weight: normal;
}
.Card {
	display: grid;
    background-color: #018ABE;
    border-radius: 10px;
    padding: 35px 45px;
}
.Card-Adress {
	display: grid;
    row-gap: 40px;
}
.Card__btn {
	border: none;
	border-radius: 3px;
	cursor: pointer;
	width: 180px;
	height: 36px;
	background-color: #ffffff;
	color: #016ABE;
	padding: 9px 15px;
	font-family: 'El Messiri', sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: 140%;
	transition: 1s;

	margin-top: 30px;
}
.Card__btn:hover {
	background-color: #016ABE;
	color: whitesmoke;
	transition: .3s ease-in-out;
}
.div {
	display: grid;
}
.Icons {
	display: flex;
	align-items: baseline
}
.Icons p {
	margin-left: 20px;
	padding-top: 21px;
}
.d-block {
	display: none;
}

/* Footer */
.Footer {
	padding: 85px 0px 30px 0px;
	display: flex;
	justify-content: space-between;
}

/* submenu выпадающий список */
.submenu {
	cursor: pointer;
	z-index: 100;
	
}
.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
	background-color: #fff;
    margin: 6px 0;
    transition: 0.4s;
}
.active .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}
.active .bar2 {opacity: 0;}
.active .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}
.overlay {
	position: absolute;
	position: fixed;
	top: 0;
	left: 0;
	width: 105%;
	height: 100%;
	z-index: 10;
	background-color: rgba(0,0,0,0.5);
	display: none;
}
.submenu__overlay {
	top: 20%;
	position: relative;
}
.submenu__overlay ul {
	display: flex;
	flex-direction: column;
}
.submenu.active {
	position: fixed;
	right: 15px;
	
}
.submenu__overlay li {
	margin-bottom: 10px;
}

@media screen and (max-width: 1440px) {
	/* Общие настройки */
	.container-another {
		width: 90%;
	}
	body {
		width: 70%;
	}

	/* header */
	header {
		font-size: 14px;
	}
	header li {
		margin-right: 25px;
	}
	.nav__btn {
		width: 165px;
		font-size: 14px;
	}

	/* First Screen */
	.Offer__RitmStyle {
		top: 230px;
	}
	.Signature {
		font-size: 16px;
	}
	.Offer__Text {
		font-size: 46px;
	}
	header li {
		margin-right: 25px;
	}
	.SheetWL {
		margin-right: 33px;
		width: 20px;
		height: 10px;
	}
	.SheetWR {
		margin-left: 33px;
		width: 20px;
		height: 10px;
	}

	/*Cеансы RitmStyle*/
	.Content {
		padding: 45px 25px 0px 0px;
	}
	.Head-Text {
    	padding-top: 100px;
    	font-size: 26px;
	}
	.Text-in-Sessions {
		font-size: 14px;
		padding: 20px;
	}
	.Grid__Sessions {
		margin-left: 14px;
		row-gap:16px;
		column-gap: 14px;
	}
	.Content-wrapper {
		padding-top: 60px;
	}

	/* Отзывы */
	.owl-carousel {
		padding-top: 60px;
	}
	.item {
		height: 300px;
	}

	/* Об RitmStyle */
	.d-none {
		display: none;
	}
	.Left {
		margin-right: 25px;
	}
	p {
		font-size: 14px;
	}
	h2 {
		font-size: 22px;
	}

	/* Стоимость сеансов */
	.Content-3 {
		padding: 60px 20px 0px 0px;
	}
	.Content-3 li {
		margin-top: 15px;
		font-size: 14px;
	}
	.Content-3 strong {
		margin-left: 60px;
	}
	.Price {
		font-size: 14px;	
	}
	.Price strong {
		margin-top: 15px;
	}
	.Name-Price {
		min-width: 350px;
	}

	/* Карта */
	.Card-Adress {
		row-gap: 25px;
	}
	.Card {
		padding: 25px 35px;
		min-width: 203px;
	}
	.Card h2 {
		text-align: center;
	}
	.d-block {
		display: block;
	}

	/*Footer*/ 
	.Footer{
		font-size: 14px;
	}
}
@media screen and (max-width: 1075px) {
	/* Общие настройки */
	.Head-Text {
		padding-top: 50px;
	}
	.Content-wrapper {
		padding-top: 30px;
	}

	/* Header */
	.menu li {
		display: none;
	}
	.nav__btn {
		display: none;
	}
	.submenu {
		display: block;
	}
	/* First Screen */

	/* Сеансы RitmStyle */

	/* Отзывы */
	.owl-carousel {
		padding-top: 30px;
	}

	/* Об RitmStyle */
	.Content {
		padding-top: 20px;
	}
	.Content.About {
		padding-right: 0px;
	}
	p {
		padding-top: 15px;
	}
	.Left {
		margin-right: 14px;
	}
	/* Стоимость сеансов */
	.Content-3 {
		padding-top: 10px;
	}
	.Name-Price li {
		font-size: 12px;
	}
	.Name-Price strong {
		font-size: 12px;
	}
	/* Карта */
	.containerMap {
		display: none;
	}
	.containerMapAdaptive {
		display: block !important; 
	}
	.adaptive1075px {
		padding-top: 30px;
	}
	.Content-4 {
		display: block;
		width: 100%;
		height: 380px;
	}
	.map {
		width: 100%;
		height: 95%;
	}
	.Card-Adress {
		display: flex;
		column-gap: 25px;
		justify-content: space-evenly;
	}
	.Card {
		width: 100%;
	}
	.d-block {
		display: none;
	}
}
@media screen and (max-width: 768px) {
	/* Общие настройки*/
	body {
		width: 94%;
	}
	.container-another {
		width: 100%;
	}
    .Head-Text {
		padding-top: 30px;
		font-size: 20px;
	}
	.adaptive {
		margin: -15px;
	}
	/* Header */
	header {
		padding: 15px 0px 5px 0px;
	}
    .submenu__overlay li {
		font-size: 24px;
		margin-top: 25px;
	}
	.logo {
		width: 45px;
		height: 45px;
	}

	/* First Screen */
    .Offer__RitmStyle {
		top: 180px;
	}
	.Aquatherapy {
		margin-top: 25px;
	}
	.Signature {
		font-size: 12px;
	}
	.SheetWL {
		margin-right: 15px;
		width: 10px;
		height: 8px;
	}
	.SheetWR {
		margin-left: 15px;
		width: 10px;
		height: 8px;
	}
	.Offer__Text {
		padding-top: 5px;
		font-size: 30px;
	}

	/* Сеансы RitmStyle */
    .Text-in-Sessions {
		padding: 5px;
		font-size: 10px;
	}

	/* Отзывы */
    .owl-carousel {
		padding-top: 20px;
	}
	.item {
		height: 200px;
	}

	/* Об RitmStyle */
	.Content {
		width: 80%;
		padding: 25px 20px 20px 20px;
	}
	h2 {
		font-size: 20px;
	}
	p {
		font-size: 12px;
	}
	.Content.About {
		padding-top: 35px;
	}
	
	/* Стоимость сеансов */
    .Content-3 li {
		font-size: 10px;
		
	}
	.Price {
		font-size: 10px;
	}
	.Name-Price {
		padding-top: 30px;
	}
	.Price strong {
		margin-top: 11px;
	}
	/* Карта */

}
@media screen and (max-width: 602px) {
	/* Карта */
	.Card-Adress {
		flex-direction: column;
	}
	.Card {
		width: auto;
	}
}
@media screen and (max-width: 425px) {
 	/* Общие настройки*/
	 .Head-Text {
		padding-top: 25px;
		font-size: 20px;
	}

	/* Header */
	
	/* First Screen */
	.Aquatherapy {
		margin-top: 20px;
	}
	.Offer__RitmStyle {
		top: 115px;
	}

	/* Сеансы RitmStyle */

	/* Отзывы */
	.item {
		height: 150px;
	}

	/* Об RitmStyle */
	.Content-wrapper {
		padding-top: 15px;
	}
	p {
        padding: 10px 0px 0px 0px;
    }
	.Content {
		position: absolute;
		z-index: 2;
		padding-top: 35px !important;
	}
	.Img-Content {
		position: relative;
		width: 94%;
	}
	.Img-Content img {
        width: 106%;
    }
	h2 {
		text-align: center;
		font-size: 18px;
	}
	.Adaptive {
		display: none;
	}

	/* Стоимость сеансов */
	.Name-Price {
		min-width: 225px;
	}
	.Content-3,.Name-Price {
		padding-top: 0px;
	}
	.Content-3 strong {
		margin-left: 20px;
	}
	.Name-Price li::before {
		padding-right: 10px;
	}
	/* Карта */
	
}
@media screen and (max-width: 375px) {
   /* First Screen */
	.Offer__RitmStyle {
		top: 100px;
	}
}
@media screen and (max-width: 320px) {
   /* Общие настройки */
	
	/* Header */
	
	/* First Screen */
	.Signature {
		font-size: 10px;
	}
	.Offer__Text {
		font-size: 25px;
	}
	/* Сеансы RitMStyle */
	.Grid__Sessions {
		row-gap: 10px;
		column-gap: 8px;
		margin-left: 10px;
	}
	.Text-in-Sessions {
		font-size: 7.9px;
	}
	.Card-Thanks {
		display: none;
		padding-right: 0px;
	}
	/* Отзывы */
	
	/* Об RitmStyle */
	.Content {
		padding-top: 10px !important;
	}

	/* Стоимость сеансов */
	.Content-3 {
		padding-right: 10px;
	}
	/* Карта */
}