* {padding: 0; margin: 0; list-style: none}
body {background: #efe3ca}
a {text-decoration: none; outline: none; transition: all .2s ease-in-out}
div {font-family: "Open Sans", sans-serif; font-optical-sizing: auto; font-style: normal; font-variation-settings: "wdth" 100}
img {border: 0}
.clear {clear: both}
.left {float: left}
.right {float: right}
.center {text-align: center}

@media (max-width: 700px) {
	html {font-size: .8px; line-height: 1.5}
	.page {position: relative; z-index: 2; padding: 0 5%}
	.menu-hide {cursor: pointer; position: fixed; top: 0; right: 0; z-index: 200; transition: all .2s ease-in-out}
	.open {width: 20%; height: 100vh}
	.menu {position: fixed; top: 0; left: 0; width: 80%; height: 100%; z-index: 50; display: flex; flex-direction: column; align-items: center; justify-content: center; transition: all .2s ease-in-out; border-top-right-radius: 20px; border-bottom-right-radius: 20px; transform: translateX(-100%); overflow: hidden; background: #ffe38d}
	.menu:before {content: ""; display: block; width: 60%; padding-bottom: 40%; position: absolute; top: 7%; left: 20%; background: url(img/logo.png) center no-repeat; background-size: contain}
	.menu ul {display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; font-size: 20rem; font-weight: 700; text-transform: uppercase; line-height: 2}
	.menu li {margin: 20rem 0 0 0}
	.showmenu {transform: translateX(0) !important; box-shadow: 0 0 40rem 0 rgba(0,0,0,0.1)}	
	.menu .tel {display: none}
	.full {position: relative; z-index: 1; height: 80vw; overflow: hidden}
	.full .fbox {display: none}
	.box-1 {top: 7vw; right: 27.6vw; background: rgba(255, 227, 141, .7); color: #000}
	.box-2 {top: 22.6vw; left: 27.6vw; background: rgba(162, 0, 8, .8); color: #e9e3e4}
	.box-3 {top: 22.6vw; right: 27.6vw; background: url(img/gallery.jpg); background-size: cover}
	.logo {width: 32vw; height: auto; display: block; position: absolute; left: 8vw; top: 4vw; z-index: 5}
	.ln {width: 60vw; height: auto; display: block; position: absolute; left: 1px; bottom: 1px; z-index: 2}
	.wave {width: 14vw; height: auto; display: block; position: absolute; right: 34vw; top: 29vw; z-index: 2}
	.top-photo {background: url(img/top.jpg) left; background-size: cover; position: absolute; top: 0; left: -40rem; width: calc(100% + 80rem); z-index: 1; height: 100%}
	.welcome {padding: 25rem 5%; background: url(img/grad.jpg); background-size: 100% 100%; font-size: 22rem; line-height: 30rem; text-align: center; color: #fff; position: relative; z-index: 2}
	.container {position: relative; z-index: 2; overflow: hidden; font-size: 18rem; line-height: 30rem; color: #222; background: url(img/bg.jpg) top no-repeat; background-size: 100%; padding-top: 90rem}
	.container h1, .container h2 {color: #000; font-weight: 600; font-size: 34rem; line-height: 1.3; margin-bottom: 35rem}
	.main {display: flex; flex-direction: column-reverse; justify-content: center; align-items: center; margin: 0 0 90rem 0}
	.foto-main {display: flex; flex-direction: column; position: relative; justify-content: center; align-items: center}
	.f01 {width: 100%; height: 60vw; position: relative; z-index: 2; margin-bottom: 10rem}
	.f02 {width: 100%; height: 60vw; position: relative; z-index: 3}
	.desc {margin-bottom: 80rem}
	.more {display: flex; justify-content: center; align-items: center; flex-direction: column; margin-top: 55rem}
	.more a {display: block; width: 320rem; line-height: 60rem; text-align: center; color: #fff; background: #89c043; font-size: 20rem; font-weight: 700; text-transform: uppercase; margin-bottom: 10rem}
	.call {display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 21rem; line-height: 46rem; font-weight: 600; color: #000; margin-top: 50rem}
	.ask {display: flex; align-items: center; flex-direction: column}
	.f03 {height: 65vw; overflow: hidden; position: relative; z-index: 1}
	.lnv {display: block; width: 380rem; height: auto; transform: rotate(90deg); position: absolute; top: 18rem; right: -160rem; z-index: 2}
	.contact {padding: 100rem 0 80rem 0; font-size: 22rem; line-height: 34rem; font-weight: 600; color: #000; position: relative; z-index: 1}	
	.contact ol {display: flex; justify-content: center; flex-direction: column; margin-left: 10%}
	.contact li {padding-left: 32rem; padding-top: 12rem; margin: 0 20rem 20rem 20rem; position: relative}
	.contact li:before {content: ""; display: block; width: 2rem; height: 64rem; background: #bf86b1; position: absolute; top: 0; left: 0}
	.contact li:first-child:before {width: 48rem; height: 67rem; background: url(img/loc.png) center no-repeat; background-size: contain; left: -45rem}
	.contact li a {font-size: 20rem; line-height: 40rem; display: block; color: #000}
	.contact li:nth-child(2) a {font-size: 28rem}
	.content {margin: 0 0 90rem 0}
	.lst {margin: 60rem 0; font-weight: 500; font-size: 23rem; line-height: 38rem; text-align: center; position: relative}
	.lst li {padding: 10%; margin: 0 0 10rem 0; color: #fff}
	.equip {display: flex; margin: 60rem 0 0 0; font-size: 16rem; line-height: 20rem; text-align: center; flex-wrap: wrap}
	.equip li {width: 19%; margin: 0 3% 8% 3%}
	.gallery {display: flex; margin: 60rem -1% 0 -1%; flex-wrap: wrap; position: relative}
	.gallery a {display: block; width: 48%; height: 28vw; margin: 1%; position: relative}	
	.att {margin-top: 60rem}
	.att h3 {font-size: 24rem; margin-bottom: 20rem; font-weight: 600; color: #4d5c93}
	.att span {display: block; width: 100%; height: 60vw; margin-bottom: 30rem; overflow: hidden}
	.adr {font-weight: 500; font-size: 22rem; line-height: 38rem; padding-bottom: 60rem}
	.adr strong {font-size: 28rem; line-height: 1.3; display: block; margin-bottom: 30rem; font-weight: 600}
	.adr ul {padding-top: 50rem; line-height: 40rem; font-weight: 400}
	.form {margin-bottom: 120rem}
	.price {margin: 40rem 0}
	.price li {margin: 0 0 10rem 0; border: 1px solid #89c043; padding: 20rem 0; text-align: center; color: #000; background: #f7efdd}
	.content ul {margin: 30rem 0}
	.lang {display: flex; justify-content: center; position: absolute; top: 5vw; left: 38vw; width: 32vw; z-index: 20}
	.lang img {display: block; width: 7vw; height: auto; margin: 0 2vw}
}

@media (min-width: 701px) and (max-width: 1000px) {
	html {font-size: .8px; line-height: 1.5}
	.page {position: relative; z-index: 2; padding: 0 5%}
	.menu-hide {display: none}
	.menu {position: fixed; top: 0; left: 0; z-index: 50; width: 100%; height: 10vw; display: flex; align-items: center; justify-content: flex-end; transition: all .2s ease-in-out}
	.menu ul {display: flex; font-size: 17rem; font-weight: 700; text-transform: uppercase; line-height: 2}
	.menu ul li {margin-right: 4vw}
	.menu .tel {position: absolute; left: 4vw; top: 50%; font-size: 17rem; line-height: 40rem; margin-top: -20rem; opacity: 0; display: flex; color: #000; transform: translateY(-90rem)}
	.menu .tel a {display: block; padding-left: 25rem; color: #000; background: url(img/phone.png) left no-repeat; background-size: 16rem; margin-left: 15rem; font-weight: 600}
	.smaller {height: 70rem; background: #ffe38d}
	.smaller .tel {opacity: 1; transform: translateY(0)}
	.full {position: relative; z-index: 1; height: 62vw; overflow: hidden}
	.full .fbox {display: none}
	.box-1 {top: 7vw; right: 27.6vw; background: rgba(255, 227, 141, .7); color: #000}
	.box-2 {top: 22.6vw; left: 27.6vw; background: rgba(162, 0, 8, .8); color: #e9e3e4}
	.box-3 {top: 22.6vw; right: 27.6vw; background: url(img/gallery.jpg); background-size: cover}
	.logo {width: 21vw; height: auto; display: block; position: absolute; left: 4vw; top: 4vw; z-index: 5}
	.ln {width: 60vw; height: auto; display: block; position: absolute; left: 1px; bottom: 1px; z-index: 2}
	.wave {width: 14vw; height: auto; display: block; position: absolute; right: 20vw; top: 14vw; z-index: 2}
	.top-photo {background: url(img/top.jpg) center; background-size: cover; position: absolute; top: 0; left: -40rem; width: calc(100% + 80rem); z-index: 1; height: 100%}
	.welcome {padding: 25rem 5%; background: url(img/grad.jpg); background-size: 100% 100%; font-size: 23rem; line-height: 36rem; text-align: center; color: #fff; position: relative; z-index: 2}
	.container {position: relative; z-index: 2; overflow: hidden; font-size: 18rem; line-height: 30rem; color: #222; background: url(img/bg.jpg) top no-repeat; background-size: 100%; padding-top: 120rem}
	.container h1, .container h2 {color: #000; font-weight: 600; font-size: 34rem; line-height: 1.3; margin-bottom: 35rem}
	.main {display: flex; flex-direction: column-reverse; justify-content: center; align-items: center; margin: 0 0 140rem 0}
	.foto-main {display: flex; position: relative; justify-content: space-between}
	.foto-main:before {content: ""; display: block; width: 30rem; height: 70%; background: #4d5c93; position: absolute; top: 15%; right: 100%; z-index: 1}
	.f01 {width: 48%; height: 400rem; position: relative; z-index: 2}
	.f02 {width: 48%; height: 275rem; position: relative; z-index: 3}
	.desc {width: 660rem; margin-bottom: 80rem}
	.more {display: flex; justify-content: space-between; margin-top: 55rem}
	.more a {display: block; width: 320rem; line-height: 60rem; text-align: center; color: #fff; background: #89c043; font-size: 20rem; font-weight: 700; text-transform: uppercase}
	.call {display: flex; font-size: 21rem; line-height: 46rem; font-weight: 600; color: #000; margin-top: 50rem}
	.ask {margin-left: 20rem}
	.f03 {height: 51vw; overflow: hidden; position: relative; z-index: 1}
	.lnv {display: block; width: 580rem; height: auto; transform: rotate(90deg); position: absolute; top: 28rem; right: -240rem; z-index: 2}
	.contact {padding: 100rem 0 80rem 0; font-size: 22rem; line-height: 34rem; font-weight: 600; color: #000; position: relative; z-index: 1}	
	.contact ol {display: flex; justify-content: center; flex-direction: column; margin-left: 25%}
	.contact li {padding-left: 32rem; padding-top: 12rem; margin: 0 20rem 20rem 20rem; position: relative}
	.contact li:before {content: ""; display: block; width: 2rem; height: 64rem; background: #bf86b1; position: absolute; top: 0; left: 0}
	.contact li:first-child:before {width: 48rem; height: 67rem; background: url(img/loc.png) center no-repeat; background-size: contain; left: -45rem}
	.contact li a {font-size: 24rem; line-height: 40rem; display: block; color: #000}
	.contact li:nth-child(2) a {font-size: 28rem}
	.content {margin: 0 0 140rem 0}
	.lst {display: flex; justify-content: center; margin: 60rem 0; font-weight: 500; font-size: 20rem; line-height: 34rem; text-align: center; flex-wrap: wrap; position: relative}
	.lst li {width: 39%; padding: 5%; display: flex; align-items: center; justify-content: center; margin: .5%; color: #fff}
	.equip {display: flex; margin: 60rem 0 0 0; font-size: 16rem; line-height: 20rem; text-align: center; flex-wrap: wrap}
	.equip li {width: 11%; margin: 0 1.5% 4% 1.5%}
	.gallery {display: flex; margin: 60rem -1% 0 -1%; flex-wrap: wrap; position: relative}
	.gallery a {display: block; width: 23%; height: 15vw; margin: 1%; position: relative}	
	.atts {display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60rem; position: relative}
	.att {width: 30%; margin-bottom: 40rem; font-size: 17rem; line-height: 24rem}
	.att h3 {font-size: 24rem; margin-bottom: 20rem; font-weight: 600; color: #4d5c93}
	.att span {display: block; width: 100%; height: 18vw; margin-bottom: 30rem; overflow: hidden}
	.flex {display: flex; justify-content: space-between}
	.adr {width: 50%; font-weight: 500; font-size: 22rem; line-height: 38rem; padding-bottom: 60rem}
	.adr strong {font-size: 28rem; line-height: 1.3; display: block; margin-bottom: 30rem; font-weight: 600}
	.adr ul {padding-top: 50rem; line-height: 40rem; font-weight: 400}
	.form {width: 45%}
	.price {margin: 40rem -1%; display: flex; flex-wrap: wrap; justify-content: center}
	.price li {width: calc(31.333% - 2px); margin: 1%; border: 1px solid #89c043; padding: 20rem 0; text-align: center; color: #000; background: #f7efdd}
	.content ul {margin: 30rem 0}
	.lang {display: flex; justify-content: center; position: absolute; top: 21vw; left: 4vw; width: 21vw; z-index: 20}
	.lang img {display: block; width: 3vw; height: auto; margin: 0 1vw}
}

@media (min-width: 1001px) {
	html {font-size: .65px; line-height: 1.5}
	.page {width: 1200rem; margin: auto}
	.menu-hide {display: none}
	.menu {position: fixed; top: 0; left: 0; z-index: 50; width: 100%; height: 120rem; display: flex; align-items: center; justify-content: flex-end; transition: all .2s ease-in-out}
	.menu ul {display: flex; margin-right: 18.5vw; font-size: 17rem; font-weight: 700; text-transform: uppercase; line-height: 2}
	.menu ul li {margin-left: 50rem}
	.menu .tel {position: absolute; left: 18.5vw; top: 50%; font-size: 17rem; line-height: 40rem; margin-top: -20rem; opacity: 0; display: flex; color: #000; transform: translateY(-90rem)}
	.menu .tel a {display: block; padding-left: 25rem; color: #000; background: url(img/phone.png) left no-repeat; background-size: 16rem; margin-left: 15rem; font-weight: 600}
	.smaller {height: 70rem; background: #ffe38d}
	.smaller .tel {opacity: 1; transform: translateY(0)}
	.full {position: relative; z-index: 1; height: 43vw; overflow: hidden}
	.full .fbox {display: block; width: 15vw; height: 11.5vw; padding-top: 2vw; position: absolute; z-index: 10; text-align: center; font-size: .9vw; line-height: 1.2vw}
	.full .fbox strong {display: block; font-size: 1.4vw; line-height: 1.7vw; margin-bottom: 1.3vw}
	.full .fbox span {display: inline-block; text-transform: uppercase; font-weight: 600; padding-right: .8vw; margin-top: 1.4vw; position: relative}
	.full .fbox span:before {content: ""; display: block; width: .4vw; height: 100%; position: absolute; top: 0; right: 0; background: url(img/ar.png) right no-repeat; background-size: contain}
	.box-1 {top: 7vw; right: 27.6vw; background: rgba(255, 227, 141, .7); color: #000}
	.box-2 {top: 22.6vw; left: 27.6vw; background: rgba(162, 0, 8, .8); color: #e9e3e4}
	.box-3 {top: 22.6vw; right: 27.6vw; background: url(img/gallery.jpg); background-size: cover}
	.logo {width: 14.4vw; height: auto; display: block; position: absolute; left: 18.5vw; top: 2vw; z-index: 5}
	.ln {width: 37.8vw; height: auto; display: block; position: absolute; left: 1px; bottom: 1px; z-index: 2}
	.wave {width: 8vw; height: auto; display: block; position: absolute; right: 2.5vw; top: 11.5vw; z-index: 2}
	.top-photo {background: url(img/top.jpg) center; background-size: cover; position: absolute; top: 0; left: -40rem; width: calc(100% + 80rem); z-index: 1; height: 100%}
	.welcome {padding: 25rem 0; background: url(img/grad.jpg); background-size: 100% 100%; font-size: 26rem; line-height: 36rem; text-align: center; color: #fff; position: relative; z-index: 2}
	.welcome span {display: block; width: 980rem; margin: 0 auto}
	.container {position: relative; z-index: 2; overflow: hidden; font-size: 18rem; line-height: 30rem; color: #222; background: url(img/bg.jpg) top no-repeat; background-size: 100%; padding-top: 120rem}
	.container h1, .container h2 {color: #000; font-weight: 600; font-size: 34rem; line-height: 1.3; margin-bottom: 35rem}
	.main {display: flex; justify-content: space-between; margin: 0 85rem 140rem 85rem}
	.foto-main {display: flex; width: 290rem; position: relative}
	.foto-main:before {content: ""; display: block; width: 30rem; height: 300rem; background: #4d5c93; position: absolute; top: 40rem; right: 100%; z-index: 1}
	.f01 {height: 400rem; position: relative; z-index: 2}
	.f02 {width: 400rem; height: 275rem; position: absolute; bottom: 0; right: 60rem; z-index: 3}
	.desc {width: 660rem}
	.more {display: flex; justify-content: space-between; margin-top: 55rem}
	.more a {display: block; width: 320rem; line-height: 60rem; text-align: center; color: #fff; background: #89c043; font-size: 20rem; font-weight: 700; text-transform: uppercase}
	.call {display: flex; font-size: 21rem; line-height: 46rem; font-weight: 600; color: #000; margin-top: 50rem}
	.ask {margin-left: 20rem}
	.f03 {height: 32vw; overflow: hidden; position: relative; z-index: 1}
	.lnv {display: block; width: 726rem; height: auto; transform: rotate(90deg); position: absolute; top: 33rem; right: -240rem; z-index: 2}
	.contact {padding: 100rem 0 80rem 0; font-size: 22rem; line-height: 34rem; font-weight: 600; color: #000; position: relative; z-index: 1}
	.contact ol {display: flex; justify-content: center}
	.contact li {padding-left: 32rem; padding-top: 12rem; margin: 0 40rem; position: relative}
	.contact li:before {content: ""; display: block; width: 2rem; height: 64rem; background: #bf86b1; position: absolute; top: 0; left: 0}
	.contact li:first-child:before {width: 48rem; height: 67rem; background: url(img/loc.png) center no-repeat; background-size: contain; left: -45rem}
	.contact li a {line-height: 40rem; display: block; color: #000}	
	.contact li:nth-child(2) a {font-size: 28rem}
	.sub {height: 24vw}
	.sub .top-photo {background: url(img/top.jpg) 50% -1vw; background-size: cover}
	.flip {flex-direction: row-reverse}
	.flip .f02 {right: auto; left: 60rem}
	.flip .foto-main:before {left: 100%; right: auto}
	.content {margin: 0 85rem 140rem 85rem}
	.lst {display: flex; justify-content: center; margin: 60rem 0; font-weight: 500; font-size: 20rem; line-height: 34rem; text-align: center; flex-wrap: wrap; position: relative}
	.lst:before, .gallery:before, .atts:before {content: ""; display: block; width: 726rem; height: 63rem; transform: rotate(90deg); background: url(img/ln.png) no-repeat; background-size: contain; position: absolute; top: 33rem; left: -480rem; z-index: 2}
	.lst li {width: 39%; padding: 5%; display: flex; align-items: center; justify-content: center; margin: .5%; color: #fff}
	.equip {display: flex; margin: 60rem 0 0 0; font-size: 16rem; line-height: 20rem; text-align: center; flex-wrap: wrap}
	.equip li {width: 107rem; margin: 0 40rem 50rem 0}
	.gallery {display: flex; margin: 60rem -1% 0 -1%; flex-wrap: wrap; position: relative}
	.gallery:before {top: 500rem; right: -480rem; left: auto}
	.gallery a {display: block; width: 23%; height: 200rem; margin: 1%; position: relative}	
	.atts {display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 60rem; position: relative}
	.atts:before {top: 600rem; left: -480rem}
	.att {width: 30%; margin-bottom: 40rem; font-size: 17rem; line-height: 24rem}
	.att h3 {font-size: 24rem; margin-bottom: 20rem; font-weight: 600; color: #4d5c93}
	.att span {display: block; width: 100%; height: 240rem; margin-bottom: 30rem; overflow: hidden}
	.flex {display: flex; justify-content: space-between}
	.adr {width: 35%; font-weight: 500; font-size: 22rem; line-height: 38rem; padding-bottom: 60rem}
	.adr strong {font-size: 28rem; line-height: 1.3; display: block; margin-bottom: 30rem; font-weight: 600}
	.adr ul {padding-top: 50rem; line-height: 40rem; font-weight: 400}
	.form {width: 60%}
	.price {margin: 40rem -1%; display: flex; flex-wrap: wrap; justify-content: center}
	.price li {width: calc(31.333% - 2px); margin: 1%; border: 1px solid #89c043; padding: 20rem 0; text-align: center; color: #000; background: #f7efdd}
	.content ul {margin: 30rem 0; font-size: 16rem}
	.lang {display: flex; justify-content: center; position: absolute; top: 14vw; left: 18.5vw; width: 14.4vw; z-index: 20}
	.lang img {display: block; width: 2vw; height: auto; margin: 0 .5vw}
}

@media (min-width: 1201px) {
	html {font-size: .8px}
}

@media (min-width: 1701px) {
	html {font-size: 1px}
}

#nav-icon {width: 55px; height: 50px; position: absolute; top: 0; right: 0; transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out}
#nav-icon i {display: block; position: absolute; right: 20px; height: 2px; width: 25px; background: #000; opacity: 1; transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out}
#nav-icon i:nth-child(1) {top: 18px}
#nav-icon i:nth-child(2), #nav-icon i:nth-child(3) {top: 24px}
#nav-icon i:nth-child(4) {top: 30px}
.open #nav-icon i:nth-child(1) {top: 24px; width: 0%; right: 20px}
.open #nav-icon i:nth-child(2) {transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg)}
.open #nav-icon i:nth-child(3) {transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg)}
.open #nav-icon i:nth-child(4) {top: 24px; width: 0%; right: 20px}
.menu ul li a {display: block; color: #000}
.menu ul li a:hover {color: #df1c25}
.menu ul li.active a {color: #4d5c93}
.full .fbox:hover {transform: scale(1.05)}
.box-1 strong, .box-1 span {color: #c10009}	
.box-2 strong, .box-2 span, .box-3 strong, .box-3 span {color: #fff}
.box-2 span:before, .box-3 span:before {filter: grayscale(1) brightness(5)}
.foto-main img, .f03 img {display: block; width: 100%; height: 100%; object-fit: cover}
.more a:first-child {background: #df1c25}
.more a:hover {background: #4d5c93; transform: translateY(-5rem)}
.ask a {display: block; color: #000; padding-left: 35rem}
.ask .phone {background: url(img/phone.png) left no-repeat; background-size: 24rem}
.ask .mail {background: url(img/mail.png) left no-repeat; background-size: 24rem}
.room {position: relative}
.contact li a span {color: #bf86b1}
.copy {display: flex; align-items: center; justify-content: center; font-size: 15rem; line-height: 20rem; padding: 50rem 5%; color: #fff; background: url(img/grad.jpg); background-size: 100% 100%}
.copy img {width: 55px; height: 20px; display: block; margin-left: 10rem}
.lst li:nth-child(1) {background: #89c043}
.lst li:nth-child(2) {background: #df1c25}
.lst li:nth-child(3) {background: #4e5d93}
.lst li:nth-child(4) {background: #ff6893}
.lst li:nth-child(5) {background: #e4aa00}
.equip li img {display: block; width: auto; height: 40rem; margin: 0 auto 15rem auto}
.gallery a img {display: block; width: 100%; height: 100%; object-fit: cover; position: relative; z-index: 2; transition: all .2s ease-in-out}
.gallery a:hover img {filter: brightness(1.1); transform: translateY(-5rem)}
.att span img {display: block; width: 100%; height: 100%; object-fit: cover}
.adr li {padding-left: 40rem; margin-bottom: 20rem; position: relative}
.adr li:before {content: ""; display: block; width: 24rem; height: 100%; position: absolute; top: 0; left: 0}
.adr li:nth-child(1) {background: url(img/phone.png) left no-repeat; background-size: 24rem; font-size: 28rem; font-weight: 600}
.adr li:nth-child(2) {background: url(img/mail.png) left no-repeat; background-size: 24rem}
.adr a {color: #000}
.form input[type=text], .form textarea {font-family: 'Open Sans', sans-serif; width: 90%; border: 0; margin: 0 0 10rem 0; padding: 15rem 5%; font-size: 18rem; line-height: 34rem; outline: none; background: rgba(255,255,255,0.6); color: #000}
.form textarea {height: 200rem}
.form input[type=button] {float: right; width: 200rem; font-family: 'Open Sans', sans-serif; font-weight: 700; border: 0; padding: 5rem 0; font-size: 16rem; line-height: 50rem; outline: none; background: #89c043; text-transform: uppercase; color: #fff; cursor: pointer; margin: 0}
.map {display: block; margin-top: 60rem; height: 500rem; width: 100%}
.price li strong {display: block; color: #df1c25; font-weight: 700; font-size: 30rem; padding-top: 10rem}
.price li span {font-size: 17rem; color: #4d5c93}
.content ul li {padding-left: 45rem; position: relative}
.content ul li:before {content: "—"; position: absolute; top: 0; left: 15rem; color: #89c043; font-weight: 700}
.oform {margin: auto}

.show {opacity: 0}
.showleft {opacity: 0; transform: translate(-100rem,0)}
.showright {opacity: 0; transform: translate(100rem,0)}
.showtop {opacity: 0; transform: translate(0,-100rem)}
.showbottom {opacity: 0; transform: translate(0,100rem)}
.showscale {opacity: 0; transform: scale(1.1)}
.showrotate {opacity: 0; transform: scale(.8) rotate(30deg)}
.showls {opacity: 0; letter-spacing: .2em}
.come-in, .already-visible {animation: come-in 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards}
.ccm-edit-mode .module, .already-visible .module {opacity: 1 !important; transform: translate(0) !important}
ul.ccm-edit-mode-inline-commands {right: -20px !important}

@keyframes come-in {
  to {transform: translate(0) scale(1); opacity: 1; letter-spacing: 0}
}