/* Qleager Developer */
/*–––––––––––––––––––––––––––––––––
	Fonts
–––––––––––––––––––––––––––––––––*/
@font-face {
  src: url(fonts/Cervo-Medium.otf);
  font-family: Cervo-Medium;
}

@font-face {
  src: url(fonts/Cervo-Regular.otf);
  font-family: Cervo-Regular;
}

@font-face {
  src: url(fonts/Cervo-Thin.otf);
  font-family: Cervo-Thin;
}

@font-face {
  src: url(fonts/PFDinTextPro-Regular.ttf);
  font-family: PFDinTextPro-Regular;
}

@font-face {
  src: url(fonts/PFDinTextPro-Thin.ttf);
  font-family: PFDinTextPro-Thin;
}

/*–––––––––––––––––––––––––––––––––
	Framework
–––––––––––––––––––––––––––––––––*/
#body .relative {
  position: relative;
}

#body .absolute {
  position: absolute;
}

#body .totop {
  position: absolute;
  top: 0;
}

#body .toright  {
  position: absolute;
  right: 0;
}

#body .tobottom {
  position: absolute;
  bottom: 0;
}

#body .toleft {
  position: absolute;
  left: 0;
}

#body .float-right {
  float: right;
}

#body .float-left {
  float: left;
}

#body .w-100 {
  width: 100%;
}

#body .h-100 {
  height: 100%;
}

#body .mt-l {
	margin-top: 160px;
}

#body .mt-m {
	margin-top: 80px;
}

#body .mt-s {
	margin-top: 40px;
}

#body .mb-l {
	margin-bottom: 160px;
}

#body .mb-m {
	margin-bottom: 80px;
}

#body .mb-s {
	margin-bottom: 40px;
}

#body .pt-l {
	padding-top: 160px;
}

#body .pt-m {
	padding-top: 80px;
}

#body .pt-s {
	padding-top: 40px;
}

#body .pb-l {
	padding-bottom: 160px;
}

#body .pb-m {
	padding-bottom: 80px;
}

#body .pb-s {
	padding-bottom: 40px;
}

#body .flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

#body .text-center {
  text-align: center;
}

#body .uppercase {
  text-transform: uppercase;
}

#body .lowercase {
  text-transform: lowercase;
}

#body .nowrap {
  white-space: nowrap;
}

#body .white {
	color: white;
}

/*–––––––––––––––––––––––––––––––––
	Structure
–––––––––––––––––––––––––––––––––*/
* {
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  outline: none !important;
}

body {
  margin: 0;
  margin-top: 20px;
  font: 18px PFDinTextPro-Regular;
	color: rgba(30, 63, 79, 0.6);
}

#body a {
  color: rgba(30, 63, 79, 0.6);
  text-decoration: none;
  transition: .2s ease-in;
}
  #body a:hover {
    color: #FDA001;
    transition: .3s ease-out;
  }

h1 {
  font: 48px Cervo-Medium;
  color: #FDA001;
  text-transform: uppercase;
}

h2, .h2 {
  padding: 160px 0 80px;
  font: 48px Cervo-Medium;
  color: #FDA001;
  text-transform: uppercase;
}
  h2:after {
    position: absolute;
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    margin-top: 10px;
    background: url(images/i-line.svg) no-repeat center / cover;
  }

h3, .h3 {
  font: 48px Cervo-Thin;
  text-transform: uppercase;
}

h4, .h4 {
  font: 18px PFDinTextPro-Thin;
  color: #1E3F4F;
  text-transform: uppercase;
}

button.main {
  z-index: 5;
  position: relative;
	display: block;
  width: 100%;
	max-width: 250px;
	height: 70px;
  margin: 80px 0 160px;
  font: 24px Cervo-Regular;
  color: #FDA001;
  text-transform: uppercase;
	border: 2px solid #FDA001;
  border-radius: 10px;
	background-color: transparent;
  transition: .2s ease-in;
  cursor: pointer;
}
  button.main:hover {
    background: #FDA001;
    color: white;
    transition: .3s ease-out;
  }

.image-wrapper {
  overflow: hidden;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50vw;
  height: 100%;
}

.image-wrapper img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
}

.bg {
  background: rgba(242, 242, 242, 0.5);
}
/*–––––––––––––––––––––––––––––––––
	Header
–––––––––––––––––––––––––––––––––*/
#header {
  top: -90px;
	width: 100%;
  height: 90px;
	padding: 20px 40px;
  font-size: 14px;
}
	#header.fixed {
    z-index: 10;
		position: fixed;
		top: 0px;
		left: 0px;
		transition: .5s;
	}

	#header.show {
		position: fixed;
		top: 0;
		transition: .5s;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	}

#header.fixed img[src="images/logo.svg"],
#header img[src="images/logo-small.svg"],
#header.fixed p,
#header.fixed a:not([href="#body"]) {
  display: none !important;
}

#header.fixed img[src="images/logo-small.svg"] {
  display: block !important;
}

#header.fixed button {
  margin-left: auto;
}

#header.fixed + *,
#header.show + * {
	padding-top: 170px;
}

#header .tel {
  font: 24px Cervo-Regular;
  color: #1E3F4F;
}

#header button {
  display: inline-flex;
  width: 35px;
  height: 15px;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  cursor: pointer;
}

#header button span {
  display: block;
  width: 35px;
  height: 3px;
  background-color: #222222;
  transition: .2s ease-in;
}
  #body #header button:hover span {
    width: 30px;
    background-color: #FDA001;
    transition: .3s ease-out;
  }

#header button > span:last-child {
  width: 18px;
}

/*–––––––––––––––––––––––––––––––––
  Start
–––––––––––––––––––––––––––––––––*/
#start {
  overflow: hidden;
}

#body #start a {
  font-size: 14px;
}

#start h1 {
  position: relative;
  z-index: 2;
  margin-top: -8px;
}

#start .video {
  z-index: 2;
  position: relative;
  margin-top: 80px;
  width: 600%;
  box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.4);
  object-fit: cover;
}

#start button {
  margin-bottom: 250px;
}

/*–––––––––––––––––––––––––––––––––
  About
–––––––––––––––––––––––––––––––––*/
#about #map {
  right: -15px;
}

#about #map .controls {
  z-index: 900;
  position: absolute;
  top: 15px;
  right: 15px;
}

#about #map .controls button {
  height: 30px;
  min-width: 30px;
  padding: 0 10px;
  margin-left: 5px;
  background-color: #FDA001;
  font: 16px PFDinTextPro-Regular;
  color: white;
}

.leaflet-bottom.leaflet-right {
  display: none;
}

/*–––––––––––––––––––––––––––––––––
  Profit
–––––––––––––––––––––––––––––––––*/
#profit p.h3 {
  color: #FDA001;
  transform: translateY(-4px);
}

/*–––––––––––––––––––––––––––––––––
  Chef
–––––––––––––––––––––––––––––––––*/
#chef .chef {
  color: #1E3F4F;
}

#chef .chef small {
  display: block;
  margin-top: 15px;
  font-size: 14px;
  color: rgba(30, 63, 79, 0.6);
}

#chef .wrapper {
  overflow: hidden;
  padding-top: 100px;
  margin-top: -345px;
}

#chef .slick-slider {
  width: 910px;
  height: 100%;
  max-width: 100vw;
  padding: 0;
  right: -15px;
  flex: none;
}

#chef .slick-list {
  overflow: visible;
}

#chef .slick-slide {
  transition: 1s;
}

#chef .slick-slide.prev {
  visibility: hidden;
  opacity: 0;
  filter: blur(2px);
  transition: .3s;
}

.slick-slide > div {
  display: flex;
}

#chef .slick-slider a {
  position: relative;
  margin-right: 30px;
  box-shadow: 0px 50px 150px rgba(0, 0, 0, 0.4);
}

.slick-slider a:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(images/i-loup.svg) no-repeat center 75% / auto rgba(30, 63, 79, 0.6);
  opacity: 0;
  transition: .2s ease-in;
}
  .slick-slider a:hover:before {
    opacity: 1;
    transition: .3s ease-out;
    background-position: center 65%;
  }

#chef .slick-slider img {
  width: 100%;
}

#chef .controls {
  height: 50px;
}

.slick-arrow {
  width: 50px;
  height: 50px;
  background: url('images/i-arrow.svg') no-repeat center / auto #FDA001;
  transition: .2s ease-in;
  cursor: pointer
}
  .slick-arrow:not(.slick-disabled):hover {
    background: url('images/i-arrow.svg') no-repeat 65% center / auto #FDA001;
    transition: .3s ease-out;
  }
  .slick-arrow:not(.slick-disabled):active {
    background: url('images/i-arrow.svg') no-repeat 65% center / auto #FDD9C1;
  }

.slick-prev {
  margin-right: 25px;
  transform: scale(-1, 1);
}

.slick-disabled {
  background: url('images/i-arrow.svg') no-repeat center / auto #FDD9C1
}

/*–––––––––––––––––––––––––––––––––
  Reasons
–––––––––––––––––––––––––––––––––*/
#reasons h4 {
  margin: 25px 0 30px;
}

img[src="images/reasons-img-1.jpg"] {
  width: 100%;
  margin-bottom: -7px;
}

/*–––––––––––––––––––––––––––––––––
  Support
–––––––––––––––––––––––––––––––––*/
#support h4 {
  position: relative;
}

#support h4::before {
  content: '';
  position: absolute;
  left: -30px;
  top: 10px;
  display: block;
  width: 10px;
  height: 6px;
  background-color: #FDA001;
}

#support li {
  position: relative;
  list-style-type: none;
}

#support ul > li:not(:last-child) {
  margin-bottom: 15px;
}

#support li::before {
  content: '';
  position: absolute;
  left: -30px;
  top: 13px;
  display: block;
  width: 10px;
  height: 2px;
  background-color: #7CB7C3;
}

/*–––––––––––––––––––––––––––––––––
  Terms
–––––––––––––––––––––––––––––––––*/
img[src="images/terms-img-2.jpg"] {
  box-shadow: 0px 50px 150px rgba(0, 0, 0, 0.4);
}

#terms form {
  z-index: 2;
  position: relative;
}

#terms h4 + p {
  color: #F28C00;
  margin-top: 10px;
}
/*–––––––––––––––––––––––––––––––––
  Gallery
–––––––––––––––––––––––––––––––––*/
#gallery {
  overflow: hidden;
}

#gallery h2::after {
  left: calc(50% - 30px);
}

#gallery .slick-list {
  overflow: visible;
}

#gallery .slick-current {
  position: relative;
  transition: .4s ease-out;
}

#gallery .slick-slide img {
  width: 100%;
}

#gallery .slick-slide:not(.slick-current) {
  transform: scale(.8);
  transition: .2s ease-in;
}

#gallery .controls {
  z-index: 0;
  position: absolute;
  top: calc(50% - 25px);
  left: 0;
  display: flex;
  width: calc(100% - 30px);
  justify-content: space-between;
}

#gallery .controls button {
  position: absolute;
  right: 15px;
  transform: translateX(104px);
}

#gallery .controls button.slick-prev {
  right: unset;
  transform: scale(-1, 1) translateX(104px);
}

#chef .slick-slider a {
  display: block;
  position: relative;
}

/*–––––––––––––––––––––––––––––––––
  Steps
–––––––––––––––––––––––––––––––––*/
#steps h2::after {
  left: calc(50% - 30px);
}
#steps div > p {
  display: flex;
  align-items: center;
  height: 60px;
  margin-bottom: 20px;
}

#steps .left p:nth-of-type(2n) {
  visibility: hidden;
}

#steps .right p:nth-of-type(-2n+5) {
  visibility: hidden;
}

#steps span {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  margin-bottom: 20px;
  font: 48px Cervo-Thin;
  color: #FDA001;
  text-align: center;
  border: 2px solid #FDA001;
  border-radius: 100%;
  background: white;
}

#steps div > span:not(:last-child)::before {
  content: '';
  z-index: -1;
  position: absolute;
  bottom: -22px;
  left: calc(50% - 5px);
  width: 10px;
  height: 22px;
  background-color: #FDA001;
}

#steps div > span::after {
  content: '';
  z-index: -1;
  position: absolute;
  top: calc(50% - 2.5px);
  left: -52px;
  display: block;
  width: 52px;
  height: 5px;
  background: url(images/steps-line.svg) no-repeat center / cover;
}

#steps div > span:nth-of-type(2n)::after {
  transform: scale(-1, 1);
  left: unset;
  right: -52px;
}

/*–––––––––––––––––––––––––––––––––
	Footer
–––––––––––––––––––––––––––––––––*/
#footer {
  background-color: #1E3F4F;
}

#footer p,
#footer a {
  color: #7CB7C3;
}

menu > a:not(:last-child) {
  display: inline-block;
  margin-bottom: 15px;
}

#footer .contacts {
  text-align: right;
}
#footer a.tel {
  font: 24px Cervo-Regular;
  color: #FDA001;
}
/*–––––––––––––––––––––––––––––––––
	Modal
–––––––––––––––––––––––––––––––––*/
section.modal {
  z-index: 99;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  width: 50vw;
  height: 100vh;
  justify-content: flex-end;
  background-color: #F2F2F2;

  transform: translateX(-50vw);
  opacity: 0;
  transition: .2s ease-in;
}
  section.modal.active {
    transform: translateX(0);
    opacity: 1;
    transition: .3s ease-out;
  }

section.modal .wrapper {
  display: flex;
  max-width: 570px;
  width: 100%;
  height: fit-content;
  flex-wrap: wrap;
}

section.modal > * {
  transform: translateX(-300px);
  opacity: 0;
  transition: .2s ease-in;
}
  section.modal.active > * {
    transform: translateX(0) scale(1);
    opacity: 1;
    transition: .35s linear;
  }

section.modal {
  font-size: 14px;
}

#body section.modal a.tel {
  font: 24px Cervo-Regular;
  color: #1E3F4F;
}
  #body section.modal a.tel:hover {
    color: #FDA001;
  }
section.modal button.close {
	z-index: 3;
  position: absolute;
	top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  color: white;
  border: none;
  cursor: pointer;
}

/*–––––––––––––––––––––––––––––––––
	Form
–––––––––––––––––––––––––––––––––*/
#form form {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 300px;
  border: none;
}

form input {
  width: 100%;
  height: 30px;
  margin-bottom: 20px;
  align-self: flex-end;
  border: none;
  border-radius: 0;
	border-bottom: 1px solid lightgrey;
	background: none;
}

::-webkit-input-placeholder {
  font-size: 14px;
}
::-moz-placeholder {
  font-size: 14px;
}
:-moz-placeholder {
  font-size: 14px;
}
:-ms-input-placeholder {
  font-size: 18px;
}

input:focus + span,
input.defocus + span,
input.click + span {
  position: absolute;
	left: 0;
  margin-bottom: 30px;
  font-size: 14px;
  color: gray;
  transition: .2s;
}

input.defocus:valid + span {
  color: green;
}

input.defocus:invalid + span {
  color: red;
}

section.sent-alert {
  z-index: 2;
	position: absolute;
  top: 0;
  left: 0;
  display: none;
  width: 100%;
  height: 100%;
	padding-left: 80px;
  justify-content: center;
  flex-direction: column;
	background: rgba(255, 255, 255, 0.9);
}

#form .close:hover svg line {
  stroke: #FDA001;
  transition: .3s ease-out;
}

/*–––––––––––––––––––––––––––––––––
	Navigation
–––––––––––––––––––––––––––––––––*/
#navigation {
  background-color: #1E3F4F;
  color: #DAEEED;
}

#navigation .head > a {
  color: #DAEEED !important;
}
  #navigation .head > a:hover {
    color: #FDA001 !important;
  }

#navigation menu a {
  font-size: 18px;
  color: #7CB7C3;
}

#navigation .close:hover svg line {
  stroke: #DAEEED;
  transition: .3s ease-out;
}

/*–––––––––––––––––––––––––––––––––
	Background Images
–––––––––––––––––––––––––––––––––*/
img[src="images/bg-1.svg"] {
  z-index: 2;
  transform: scale(-1, 1) translate3d(-110px, -120px, 0);
}

img[src="images/bg-1.svg"].second {
  transform: scale(.9) translate3d(-60%, 20px, 0);
}

img[src="images/bg-2.svg"] {
  transform: translate3d(215%, -180%, 0);
}

img[src="images/bg-3.svg"] {
  transform: translate3d(60%, -50%, 0);
}

img[src="images/bg-4.svg"] {
  transform: translate3d(-20%, -35%, 0);
}

img[src="images/bg-5.svg"] {
  transform: translate3d(20%, -80%, 0);
}

img[src="images/bg-6.svg"] {
  z-index: 2;
  transform: translate3d(-25%, 150%, 0);
}

img[src="images/bg-7.svg"] {
  transform: translate3d(-35%, -20%, 0);
}

img[src="images/bg-8.svg"] {
  transform: translate3d(120%, -140%, 0);
}

img[src="images/bg-9.svg"] {
  transform: translate3d(0%, -54%, 0);
}

img[src="images/bg-10.svg"] {
  transform: translate3d(0%, -80%, 0);
}

img[src="images/bg-12.svg"] {
  transform: translate3d(-100%, -95%, 0);
}


.video_container {
	position: relative;
	padding-bottom: 300%;
	overflow: hidden;
	height: 0;
}

.video_iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.video-plan
{
  position: absolute;
  width: 452px;
  z-index: 1;
  padding: 13px;
  top: 82px;
  left: 301px;
  background: #FFF;
}
@media (max-width: 767px) {
  .video-plan
  {
    position: relative;
    width: 100% ;
    z-index: 1;
    padding: 0px;
    top: -38px;
    left: auto;
  }
}