From 6fab785b39492684affdd8c565abc324d54549c4 Mon Sep 17 00:00:00 2001
From: Sina Mostafaei <sinamostafaei2002@gmail.com>
Date: Tue, 31 Oct 2023 19:16:01 +0330
Subject: [PATCH] bug fix

---
 css/style.css              | 1076 +++++++++++++++++++++++++++++++++++-
 sass/components/_card.scss |    6 +-
 sass/pages/_home.scss      |    6 +-
 3 files changed, 1081 insertions(+), 7 deletions(-)

diff --git a/css/style.css b/css/style.css
index 546d241..8c7aa60 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1 +1,1075 @@
-@keyframes moveInBottom{0%{opacity:0;transform:translateY(3rem)}100%{opacity:1;transform:translateY(0)}}@keyframes moveInLeft{0%{opacity:0;transform:translateX(-10rem)}80%{transform:translateX(1rem)}100%{opacity:1;transform:translateX(0)}}@keyframes moveInRight{0%{opacity:0;transform:translateX(10rem)}80%{transform:translateX(-1rem)}100%{opacity:1;transform:translateX(0)}}*{padding:0;margin:0;box-sizing:inherit}html{font-size:62.5%}@media only screen and (min-width: 112.5em){html{font-size:75%}}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 56.25em){html{font-size:50%}}body{padding:3rem;box-sizing:border-box}@media only screen and (max-width: 56.25em){body{padding:0}}::-moz-selection{background-color:#55c57a;color:#fff}::selection{background-color:#55c57a;color:#fff}body{font-family:"Lato", sans-serif;font-weight:400;font-size:1.6rem;line-height:1.7;color:#777}.heading-primary{color:#fff;text-transform:uppercase;backface-visibility:hidden;margin-bottom:6.4rem}.heading-primary--main{display:block;font-size:6.4rem;font-weight:400;letter-spacing:3.6rem;animation:moveInLeft 1s ease-out}@media only screen and (max-width: 37.5em){.heading-primary--main{font-size:4.8rem;letter-spacing:1rem}}.heading-primary--sub{display:block;font-size:2.4rem;font-weight:700;letter-spacing:1.7rem;animation:moveInRight 1s ease-out}@media only screen and (max-width: 37.5em){.heading-primary--sub{font-size:1.6rem;letter-spacing:0.7rem}}.heading-secondary{font-size:3.6rem;font-weight:700;text-transform:uppercase;text-align:center;background-image:linear-gradient(to right, #7ed56f, #28b485);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}@media only screen and (max-width: 56.25em){.heading-secondary{font-size:3rem}}@media only screen and (max-width: 37.5em){.heading-secondary{font-size:2.4rem}}.heading-tertiary{font-size:1.6rem;text-transform:uppercase}.paragraph{font-size:1.6rem;font-weight:400;line-height:1.6}.paragraph:not(:last-child){margin-bottom:2.4rem}.u-center-text{text-align:center !important}.u-mb-sm{margin-bottom:1.6rem !important}@media only screen and (max-width: 56.25em){.u-mb-sm{margin-bottom:1rem !important}}.u-mb-md{margin-bottom:3.6rem !important}@media only screen and (max-width: 56.25em){.u-mb-md{margin-bottom:2.4rem !important}}.u-mb-lg-1{margin-bottom:6.4rem !important}@media only screen and (max-width: 56.25em){.u-mb-lg-1{margin-bottom:4.8rem !important}}.u-mb-lg-2{margin-bottom:9.6rem !important}@media only screen and (max-width: 56.25em){.u-mb-lg-2{margin-bottom:6.4rem !important}}.u-mt-lg-2{margin-top:9.6rem !important}.btn{border:none;display:inline-block;border-radius:10rem;padding:1.6rem 4rem;position:relative;text-transform:uppercase;transition:all 0.2s;font-size:1.6rem;font-weight:400;cursor:pointer}.btn:link,.btn:visited{text-decoration:none}.btn--white{background-color:#fff;color:#777}.btn--white::after{background-color:#fff}.btn--primary{background-color:#55c57a;color:#fff}.btn--primary::after{background-color:#55c57a}.btn--animated{animation:moveInBottom 0.5s ease-out 0.75s;animation-fill-mode:backwards}.btn::after{content:"";display:inline-block;width:100%;height:100%;position:absolute;z-index:-1;top:0;left:0;border-radius:10rem;transition:all 0.3s ease-out}.btn:hover{transform:translateY(-0.3rem);box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.14)}.btn:hover::after{transform:scaleX(1.4) scaleY(1.6);opacity:0}.btn:active{transform:translateX(-0.1rem);box-shadow:0 0.6rem 1.2rem rgba(0,0,0,0.07)}.btn--simple:link,.btn--simple:visited{text-decoration:none;color:#55c57a;display:inline-block;padding:0.3rem;transition:all 0.3s;border-bottom:solid 1px #55c57a}.btn--simple:hover{background-color:#55c57a;color:#fff;transform:translateY(-0.4rem);box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.14)}.btn--simple:active{transform:translateY(-0.1rem);box-shadow:0 0.6rem 1.2rem rgba(0,0,0,0.07)}.composition{position:relative}@media only screen and (max-width: 56.25em){.composition{padding-top:4.8rem}}.composition:hover .composition__img:not(:hover){transform:scale(0.95)}.composition__img{position:absolute;display:block;width:55%;transition:all 0.3s;box-shadow:0 0 2.4rem 1rem rgba(0,0,0,0.15)}@media only screen and (max-width: 56.25em){.composition__img{position:relative;width:32%;display:inline-block}}.composition__img:hover{transform:scale(1.05) translateY(-5px);z-index:10;outline:solid 1rem #55c57a;outline-offset:1rem;box-shadow:0 0 4.8rem 1rem rgba(0,0,0,0.3)}.composition__img--1{top:0;left:0}@media only screen and (max-width: 56.25em){.composition__img--1{left:3rem;top:-3rem;transform:scale(1.1)}}.composition__img--2{top:15%;right:0}@media only screen and (max-width: 56.25em){.composition__img--2{top:0;transform:scale(1.3);z-index:100}}.composition__img--3{bottom:5%;left:15%}@media only screen and (max-width: 75em){.composition__img--3{bottom:8%}}@media only screen and (max-width: 56.25em){.composition__img--3{top:2rem;bottom:0;left:-3rem;transform:scale(1.2)}}.feature-card{text-align:center;background-color:rgba(255,255,255,0.8);border-radius:4px;padding:3.2rem 1.6rem;transition:all 0.3s;box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.1)}.feature-card:hover{transform:scale(1.05) translateY(-2rem);box-shadow:0 2.4rem 3.6rem rgba(0,0,0,0.2)}.feature-card__icon{display:inline-block;font-size:6.4rem;background-image:linear-gradient(to right, #7ed56f, #28b485);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.card{width:100%;height:52rem;perspective:150rem;position:relative}.card__face{z-index:100;box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.1);border-radius:3px;overflow:hidden;backface-visibility:hidden;width:100%;height:52rem;position:absolute;transition:all 0.6s ease}.card__face--back{transform:rotateY(180deg)}.card__face--front{transform:rotateY(0deg)}.card:hover .card__face--front{transform:rotateY(-180deg)}.card:hover .card__face--back{transform:rotateY(0deg)}.card__face--front{background-color:#fff}.card__picture{background-size:cover;background-position:top;background-blend-mode:screen;-webkit-clip-path:polygon(0 0, 100% 0, 100% 85%, 0 100%);clip-path:polygon(0 0, 100% 0, 100% 85%, 0 100%);height:23rem}.card__picture--1{background-image:linear-gradient(to right bottom, #ffb900, #ff7730),url("../../img/nat-5.jpg")}.card__picture--2{background-image:linear-gradient(to right bottom, #7ed56f, #28b485),url("../../img/nat-6.jpg")}.card__picture--3{background-image:linear-gradient(to right bottom, #2998ff, #5643fa),url("../../img/nat-7.jpg")}.card__heading{position:absolute;right:2rem;top:12rem;text-transform:uppercase;color:#fff;font-size:2.8rem;font-weight:300;width:75%;text-align:right;display:inline-block}.card__heading-span{padding:1rem 1.5rem;-webkit-box-decoration-break:clone;box-decoration-break:clone;text-align:right}.card__heading-span--1{background-image:linear-gradient(to bottom right, rgba(255,185,0,0.8), rgba(255,119,48,0.8))}.card__heading-span--2{background-image:linear-gradient(to bottom right, rgba(126,213,111,0.8), rgba(40,180,133,0.8))}.card__heading-span--3{background-image:linear-gradient(to bottom right, rgba(41,152,255,0.8), rgba(86,67,250,0.8))}.card__desc{text-align:center;padding:3rem 0}.card__desc-list{list-style:none;display:inline-flex;flex-direction:column}.card__desc-item{padding:0.8rem 2.4rem}.card__desc-item:not(:last-child){border-bottom:1px solid #eee}.card__face--back{position:relative}.card__face--back-1{background-image:linear-gradient(to bottom right, #ffb900, #ff7730)}.card__face--back-2{background-image:linear-gradient(to bottom right, #7ed56f, #28b485)}.card__face--back-3{background-image:linear-gradient(to bottom right, #2998ff, #5643fa)}.card__price-box{width:100%;text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.card__price--only{display:block;color:#fff}.card__price{display:block;color:#fff;font-size:6.4rem;font-weight:100;margin-bottom:6.4rem}@media only screen and (max-width: 56.25em), only screen and (hover: none){.card{height:auto;box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.1);border-radius:3px;overflow:auto;background-color:#fff}.card__face{border-radius:none;box-shadow:none;height:auto;position:relative}.card__face--back{transform:rotateY(0deg)}.card__face--front{transform:rotateY(0deg)}.card:hover .card__face--front{transform:rotateY(0)}.card__picture{-webkit-clip-path:polygon(0 0, 100% 0, 100% 90%, 0 100%);clip-path:polygon(0 0, 100% 0, 100% 90%, 0 100%);background-position:10%;height:40rem}.card__heading{top:33rem;line-height:1.5;font-size:3.6rem;width:100%}.card__face--back{position:relative;-webkit-clip-path:polygon(0 15%, 100% 0%, 100% 100%, 0 100%);clip-path:polygon(0 15%, 100% 0%, 100% 100%, 0 100%)}.card__price-box{position:relative;top:0;left:0;transform:translate(0, 0);padding:4.8rem 0 3.6rem 0}.card__price{font-size:4.8rem;margin-bottom:2.4rem}}@media only screen and (max-width: 37.5em){.card__picture{background-position:cover;height:23rem}.card__heading{top:16rem;right:1rem;line-height:1.7;font-size:2.4rem;width:50%}}.story{padding:6.4rem;width:75%;margin:0 auto;background-color:rgba(255,255,255,0.6);transform:skewX(-12deg);box-shadow:0 3rem 6rem rgba(0,0,0,0.1);border-radius:3px}@media only screen and (max-width: 56.25em){.story{width:90%}}@media only screen and (max-width: 37.5em){.story{transform:skewX(0);padding:3.6rem 2.4rem}}.story:not(:last-child){margin-bottom:9.6rem}.story::after{content:"";clear:both;display:table}.story__shape{width:15rem;height:15rem;-webkit-clip-path:circle(50% at 50% 50%);clip-path:circle(50% at 50% 50%);shape-outside:circle(50% at 50% 50%);transition:all 0.4s;float:left;position:relative;transform:skewX(12deg)}@media only screen and (max-width: 37.5em){.story__shape{transform:skewX(0);float:none;margin:0 auto;margin-bottom:2.4rem}}.story__img{height:100%;transition:all 0.5s;transform:scale(1.4) translateX(-3rem);backface-visibility:hidden}.story__author{position:absolute;opacity:0;transform:translate(-50%, 0);color:#fff;transition:all 0.5s;text-transform:uppercase;text-align:center;top:50%;left:50%;transform:translate(-50%, 20%)}.story__text{transform:translateX(2rem) skewX(12deg)}@media only screen and (max-width: 37.5em){.story__text{transform:translateX(2rem) skewX(0)}}.story:hover .story__author{opacity:1;transform:translate(-50%, -50%)}.story:hover .story__img{filter:blur(4px) brightness(80%);transform:scale(1) translateX(-3.5rem)}.bg-video{position:absolute;z-index:-1;top:0;left:0;width:100%;height:100%;overflow:hidden;opacity:0.15}.bg-video video{height:100%;width:100%;-o-object-fit:cover;object-fit:cover}.form{height:100%}.form__group{position:relative;width:100%}.form__group:not(:last-child){margin-bottom:4.8rem}.form__input{padding:1.6rem 2.4rem;font-size:1.6rem;font-family:inherit;border:none;display:block;color:inherit;width:100%;border-radius:2px;border-bottom:3px solid transparent}@media only screen and (max-width: 56.25em){.form__input{box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.1)}}.form__input::-moz-placeholder{color:#999;font-size:1.4rem}.form__input::placeholder{color:#999;font-size:1.4rem}.form__input:focus{outline:none;border-bottom:3px solid #55c57a;box-shadow:0 1rem 2rem rgba(0,0,0,0.1)}@media only screen and (max-width: 56.25em){.form__input:focus{box-shadow:0 1.2rem 2.4rem rgba(0,0,0,0.15)}}.form__input:focus:invalid{border-bottom:3px solid #ff7730}.form__input-label{font-size:1.2rem;font-weight:700;padding-left:2.4rem;position:absolute;top:50%;transform:translateY(-50%);opacity:0;transition:all 0.4s}.form__input:not(:-moz-placeholder-shown)+.form__input-label{transform:translateY(160%);opacity:1}.form__input:not(:placeholder-shown)+.form__input-label{transform:translateY(160%);opacity:1}.form__group-radio{display:flex;align-items:center;gap:1.2rem}.form__radio{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #55c57a;width:2rem;height:2rem;border-radius:50%;position:relative}.form__radio:checked::after{content:"";width:1rem;height:1rem;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:50%;background-color:#55c57a}.modal{opacity:0;pointer-events:none;visibility:hidden;transition:all 0.2s;position:fixed;width:100%;height:100vh;top:0;left:0;z-index:3000;background-color:rgba(0,0,0,0.8)}@supports (-webkit-backdrop-filter: blur(10px)) or (backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px)){.modal{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:rgba(0,0,0,0.3)}}.modal__box{transition:all 0.6s 0.1s;transform:scale(0.1) translate(-50%, -50%);transform-origin:left;width:80%;height:90vh;position:absolute;top:50%;left:50%;z-index:900;background-color:#fff;display:flex;border-radius:3px;overflow:hidden}@media only screen and (max-width: 75em){.modal__box{width:90%}}@media only screen and (max-width: 56.25em){.modal__box{flex-wrap:wrap}}@media only screen and (max-width: 37.5em){.modal__box{width:95%;height:95vh}}.modal__img-box{flex-basis:40%;flex-shrink:0;flex-grow:0}@media only screen and (max-width: 56.25em){.modal__img-box{flex-basis:100%;display:flex;max-height:45%}}.modal__img{display:block;width:100%;height:50%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center}@media only screen and (max-width: 56.25em){.modal__img{width:50%;height:100%;align-self:flex-start}}.modal__text-box{padding:0 3.6rem;position:relative;margin:auto 0}@media only screen and (max-width: 56.25em){.modal__text-box{padding:0 2.4rem}}.modal__text{font-size:1.4rem;-moz-column-count:2;column-count:2;-moz-column-gap:3.6rem;column-gap:3.6rem;-moz-column-rule:1px solid #eee;column-rule:1px solid #eee;-webkit-hyphens:auto;hyphens:auto}@media only screen and (max-width: 56.25em){.modal__text{font-size:1.3rem;-moz-column-gap:2.4rem;column-gap:2.4rem}}@media only screen and (max-width: 37.5em){.modal__text{-moz-column-count:1;column-count:1;font-size:1.2rem}}.modal__close{position:absolute;width:2.4rem;height:2.4rem;top:2.4rem;right:4.8rem}.modal__close:hover .modal__close-icon::before,.modal__close:hover .modal__close-icon::after{background-color:#28b485}.modal__close-icon::before,.modal__close-icon::after{content:"";position:absolute;width:2rem;height:2px;top:50%;left:50%;background-color:#333;transition:all 0.3s}.modal__close-icon::before{transform:rotate(45deg)}.modal__close-icon::after{transform:rotate(135deg)}.modal:target{opacity:1;pointer-events:auto;visibility:visible}.modal:target .modal__box{transform:scale(1) translate(-50%, -50%)}.header{z-index:100;background-image:linear-gradient(to right bottom, rgba(126,213,111,0.8), rgba(40,180,133,0.8)),url("../img/hero-small.jpg");background-size:cover;background-position:top;position:relative;height:95vh;-webkit-clip-path:polygon(0 0, 100% 0, 100% 80%, 0 100%);clip-path:polygon(0 0, 100% 0, 100% 80%, 0 100%)}@media only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 37.5em), only screen and (min-resolution: 192dpi) and (min-width: 37.5em), only screen and (min-width: 125em){.header{background-image:linear-gradient(to right bottom, rgba(126,213,111,0.8), rgba(40,180,133,0.8)),url("../img/hero.jpg")}}@media only screen and (max-width: 56.25em){.header{-webkit-clip-path:polygon(0 0, 100% 0, 100% 85%, 0 100%);clip-path:polygon(0 0, 100% 0, 100% 85%, 0 100%)}}.header__logo-box{position:absolute;height:4rem;top:4rem;left:4rem}.header__logo{height:3.5rem}.header__text-box{position:absolute;top:40%;left:50%;transform:translate(-50%, -50%);text-align:center}.footer{padding:15rem 0;background-color:#333}@media only screen and (max-width: 75em){.footer{padding:10rem 0}}.footer__logo-box{text-align:center;margin-bottom:9.6rem}@media only screen and (max-width: 75em){.footer__logo-box{margin-bottom:6.4rem}}.footer__logo{max-height:12rem}.footer__copyright{max-width:75%;border-top:1px solid #f7f7f7;color:#fff;padding:2.4rem 2.4rem 0 2.4rem;font-size:1.4rem;margin-left:auto}@media only screen and (max-width: 75em){.footer__copyright{max-width:100%;margin-top:6.4rem}}.footer__nav{border-top:1px solid #f7f7f7;padding:0 2.4rem;padding-top:1.2rem;justify-self:start}@media only screen and (max-width: 75em){.footer__nav{justify-self:stretch}}.footer__nav-list{list-style:none;display:flex;justify-content:space-between}@media only screen and (max-width: 37.5em){.footer__nav-list{gap:0.6rem}}.footer__nav-link:link,.footer__nav-link:visited{text-decoration:none;color:#f7f7f7;transition:all 0.3s;display:inline-block;padding:0.3rem 0.8rem}@media only screen and (max-width: 37.5em){.footer__nav-link:link,.footer__nav-link:visited{font-size:1.2rem}}.footer__nav-link:hover{color:#55c57a;box-shadow:0 1.2rem 1.2rem rgba(0,0,0,0.3);transform:scale(1.1)}.navigation__checkbox{display:none}.navigation__background{background-image:radial-gradient(#7ed56f, #28b485);width:6.5rem;height:6.5rem;border-radius:50%;position:fixed;top:6.7rem;right:6.7rem;z-index:1000;transition:all 0.8s ease-out}@media only screen and (max-width: 75em){.navigation__background{top:5.2rem;right:5.2rem}}@media only screen and (max-width: 56.25em){.navigation__background{top:4.2rem;right:4.2rem}}@media only screen and (max-width: 37.5em){.navigation__background{top:3.2rem;right:3.2rem}}.navigation__btn{background-color:#fff;width:7.5rem;height:7.5rem;border-radius:50%;display:inline-block;box-shadow:0 1.6rem 1.6rem rgba(0,0,0,0.1);top:6.5rem;right:6.5rem;position:fixed;z-index:2000}@media only screen and (max-width: 75em){.navigation__btn{top:5rem;right:5rem}}@media only screen and (max-width: 56.25em){.navigation__btn{top:4rem;right:4rem}}@media only screen and (max-width: 37.5em){.navigation__btn{top:3rem;right:3rem}}.navigation__btn:hover .navigation__icon::before{height:2px;transform:translateY(-1.2rem)}.navigation__btn:hover .navigation__icon::after{height:2px;transform:translateY(1.2rem)}.navigation__icon{top:50%;left:50%;transform:translate(-50%, -50%)}.navigation__icon,.navigation__icon::before,.navigation__icon::after{position:absolute;z-index:inherit;width:3.5rem;height:1.5px;background-color:#333;display:inline-block;transition:transform 0.2s}.navigation__icon::before{content:"";transform:translateY(-1rem)}.navigation__icon::after{content:"";transform:translateY(1rem)}.navigation__checkbox:checked+.navigation__btn .navigation__icon{background-color:transparent}.navigation__checkbox:checked+.navigation__btn .navigation__icon::before{transform:rotate(135deg);height:3px}.navigation__checkbox:checked+.navigation__btn .navigation__icon::after{transform:rotate(-135deg);height:3px}.navigation__nav{position:fixed;left:0;top:0;width:0;height:100vh;z-index:1500;opacity:0;pointer-events:none;visibility:hidden;transition:all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55)}.navigation__list{position:absolute;list-style:none;top:50%;left:50%;transform:translate(-50%, -50%);text-align:center}.navigation__link{animation:navMoveOut 0.4s ease-in;animation-fill-mode:forwards}.navigation__link:link,.navigation__link:visited{text-decoration:none;color:#fff;font-size:3rem;text-transform:uppercase;font-weight:300;display:inline-block;padding:1rem 1rem;background-image:linear-gradient(120deg, transparent 0%, transparent 60%, #fff 60%);background-size:300%;transition:all 0.4s}.navigation__link:link span,.navigation__link:visited span{margin-right:1.2rem}@media only screen and (max-width: 37.5em){.navigation__link:link,.navigation__link:visited{font-size:2rem}.navigation__link:link span,.navigation__link:visited span{margin-right:0.5rem}}.navigation__link:hover,.navigation__link:active{background-position:100%;color:#55c57a;transform:translateX(1rem)}.navigation__checkbox:checked ~ .navigation__nav{opacity:1;pointer-events:auto;visibility:visible;width:100%}.navigation__checkbox:checked ~ .navigation__nav .navigation__link{animation:navMoveIn 0.4s ease-out 0.4s;animation-fill-mode:backwards}.navigation__checkbox:checked ~ .navigation__background{transform:scale(50)}.container{max-width:114rem;margin:0 auto;padding:0 2.4rem}@media only screen and (max-width: 56.25em){.container{padding:0 4.8rem}}@media only screen and (max-width: 37.5em){.container{padding:0 2.4rem}}.flex{display:flex}.flex-gap--sm{gap:3.6rem}.flex-gap--md{gap:6.4rem}.flex-gap--lg{gap:9.6rem}.flex--col{flex-direction:column}.flex-space--between{justify-content:space-between}.flex-align--center{align-items:center}.grid{display:grid}.grid--2-cols{grid-template-columns:repeat(2, 1fr)}@media only screen and (max-width: 56.25em){.grid--2-cols{grid-template-columns:1fr}}.grid--3-cols{grid-template-columns:repeat(3, 1fr)}@media only screen and (max-width: 56.25em){.grid--3-cols{grid-template-columns:1fr}}.grid--4-cols{grid-template-columns:repeat(4, 1fr)}@media only screen and (max-width: 56.25em){.grid--4-cols{grid-template-columns:1fr 1fr}}@media only screen and (max-width: 37.5em){.grid--4-cols{grid-template-columns:1fr}}.grid-cg-sm{-moz-column-gap:1.6rem;column-gap:1.6rem;row-gap:1.6rem}@media only screen and (max-width: 75em){.grid-cg-sm{-moz-column-gap:1rem;column-gap:1rem;row-gap:1rem}}.grid-cg-md{-moz-column-gap:4.8rem;column-gap:4.8rem;row-gap:4.8rem}@media only screen and (max-width: 75em){.grid-cg-md{-moz-column-gap:3.6rem;column-gap:3.6rem;row-gap:3.6rem}}.grid-cg-lg-1{-moz-column-gap:6.4rem;column-gap:6.4rem;row-gap:6.4rem}@media only screen and (max-width: 75em){.grid-cg-lg-1{-moz-column-gap:4.8rem;column-gap:4.8rem;row-gap:4.8rem}}.grid-cg-lg-2{-moz-column-gap:9.6rem;column-gap:9.6rem;column-gap:9.6rem}@media only screen and (max-width: 75em){.grid-cg-lg-2{-moz-column-gap:7.2rem;column-gap:7.2rem;row-gap:7.2rem}}.section-about{background-color:#f7f7f7;margin-top:-20vh;position:relative;padding:25rem 0 30rem 0;z-index:90}@media only screen and (max-width: 75em){.section-about{padding:20rem 0}}@media only screen and (max-width: 56.25em){.section-about{padding:20rem 0 25rem 0}}@media only screen and (max-width: 37.5em){.section-about{padding:20rem 0 20rem 0}}.section-features{position:relative;z-index:100;margin-top:-14vh;padding:25rem 0;transform:skewY(-7deg);background-image:linear-gradient(to right bottom, rgba(126,213,111,0.8), rgba(40,180,133,0.8)),url("../img/nat-4.jpg");background-size:cover;background-position:top left}.section-features>*{transform:skewY(7deg)}@media only screen and (max-width: 75em){.section-features{padding:20rem 0}}@media only screen and (max-width: 56.25em){.section-features{padding:15rem 0}}.section-tours{background-color:#f7f7f7;margin-top:-15vh;padding:25rem 0 15rem 0}.section-tours .grid{row-gap:9.6rem}@media only screen and (max-width: 75em){.section-tours{padding:20rem 0 15rem 0}}@media only screen and (max-width: 37.5em){.section-tours{padding:20rem 0 10rem 0}}.section-stories{position:relative;padding:15rem 0}.section-form{padding:15rem 0;background-image:linear-gradient(to right bottom, #7ed56f, #28b485)}.section-form .form__box{background-image:linear-gradient(105deg, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.9) 55%, transparent 55%),url("../../img/nat-10.jpg");background-size:cover;margin:0 auto;border-radius:3px;box-shadow:0 2.4rem 5rem rgba(0,0,0,0.2);width:100%;padding:4.8rem 6.4rem}@media only screen and (max-width: 56.25em){.section-form .form__box{background-image:linear-gradient(to right, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0.6) 100%),url("../../img/nat-10.jpg")}}@media only screen and (max-width: 37.5em){.section-form .form__box{background-image:linear-gradient(to right, rgba(255,255,255,0.9) 0%, rgba(255,255,255,0.8) 100%),url("../../img/nat-10.jpg");padding:3.6rem 2.4rem}}.section-form .form__box .form{width:45%}@media only screen and (max-width: 56.25em){.section-form .form__box .form{width:auto;max-width:40rem}}@media only screen and (max-width: 37.5em){.section-form .form__box .form{max-width:40rem;width:100%}}@font-face{font-family:"linea-basic-10";src:url("fonts/linea-basic-10.eot");src:url("fonts/linea-basic-10.eot?#iefix") format("embedded-opentype"),url("fonts/linea-basic-10.woff") format("woff"),url("fonts/linea-basic-10.ttf") format("truetype"),url("fonts/linea-basic-10.svg#linea-basic-10") format("svg");font-weight:normal;font-style:normal}[data-icon]:before{font-family:"linea-basic-10" !important;content:attr(data-icon);font-style:normal !important;font-weight:normal !important;font-variant:normal !important;text-transform:none !important;speak:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[class^="icon-basic"]:before,[class*=" icon-basic"]:before{font-family:"linea-basic-10" !important;font-style:normal !important;font-weight:normal !important;font-variant:normal !important;text-transform:none !important;speak:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.icon-basic-accelerator:before{content:"a"}.icon-basic-alarm:before{content:"b"}.icon-basic-anchor:before{content:"c"}.icon-basic-anticlockwise:before{content:"d"}.icon-basic-archive:before{content:"e"}.icon-basic-archive-full:before{content:"f"}.icon-basic-ban:before{content:"g"}.icon-basic-battery-charge:before{content:"h"}.icon-basic-battery-empty:before{content:"i"}.icon-basic-battery-full:before{content:"j"}.icon-basic-battery-half:before{content:"k"}.icon-basic-bolt:before{content:"l"}.icon-basic-book:before{content:"m"}.icon-basic-book-pen:before{content:"n"}.icon-basic-book-pencil:before{content:"o"}.icon-basic-bookmark:before{content:"p"}.icon-basic-calculator:before{content:"q"}.icon-basic-calendar:before{content:"r"}.icon-basic-cards-diamonds:before{content:"s"}.icon-basic-cards-hearts:before{content:"t"}.icon-basic-case:before{content:"u"}.icon-basic-chronometer:before{content:"v"}.icon-basic-clessidre:before{content:"w"}.icon-basic-clock:before{content:"x"}.icon-basic-clockwise:before{content:"y"}.icon-basic-cloud:before{content:"z"}.icon-basic-clubs:before{content:"A"}.icon-basic-compass:before{content:"B"}.icon-basic-cup:before{content:"C"}.icon-basic-diamonds:before{content:"D"}.icon-basic-display:before{content:"E"}.icon-basic-download:before{content:"F"}.icon-basic-exclamation:before{content:"G"}.icon-basic-eye:before{content:"H"}.icon-basic-eye-closed:before{content:"I"}.icon-basic-female:before{content:"J"}.icon-basic-flag1:before{content:"K"}.icon-basic-flag2:before{content:"L"}.icon-basic-floppydisk:before{content:"M"}.icon-basic-folder:before{content:"N"}.icon-basic-folder-multiple:before{content:"O"}.icon-basic-gear:before{content:"P"}.icon-basic-geolocalize-01:before{content:"Q"}.icon-basic-geolocalize-05:before{content:"R"}.icon-basic-globe:before{content:"S"}.icon-basic-gunsight:before{content:"T"}.icon-basic-hammer:before{content:"U"}.icon-basic-headset:before{content:"V"}.icon-basic-heart:before{content:"W"}.icon-basic-heart-broken:before{content:"X"}.icon-basic-helm:before{content:"Y"}.icon-basic-home:before{content:"Z"}.icon-basic-info:before{content:"0"}.icon-basic-ipod:before{content:"1"}.icon-basic-joypad:before{content:"2"}.icon-basic-key:before{content:"3"}.icon-basic-keyboard:before{content:"4"}.icon-basic-laptop:before{content:"5"}.icon-basic-life-buoy:before{content:"6"}.icon-basic-lightbulb:before{content:"7"}.icon-basic-link:before{content:"8"}.icon-basic-lock:before{content:"9"}.icon-basic-lock-open:before{content:"!"}.icon-basic-magic-mouse:before{content:"\""}.icon-basic-magnifier:before{content:"#"}.icon-basic-magnifier-minus:before{content:"$"}.icon-basic-magnifier-plus:before{content:"%"}.icon-basic-mail:before{content:"&"}.icon-basic-mail-multiple:before{content:"'"}.icon-basic-mail-open:before{content:"("}.icon-basic-mail-open-text:before{content:")"}.icon-basic-male:before{content:"*"}.icon-basic-map:before{content:"+"}.icon-basic-message:before{content:","}.icon-basic-message-multiple:before{content:"-"}.icon-basic-message-txt:before{content:"."}.icon-basic-mixer2:before{content:"/"}.icon-basic-mouse:before{content:":"}.icon-basic-notebook:before{content:";"}.icon-basic-notebook-pen:before{content:"<"}.icon-basic-notebook-pencil:before{content:"="}.icon-basic-paperplane:before{content:">"}.icon-basic-pencil-ruler:before{content:"?"}.icon-basic-pencil-ruler-pen:before{content:"@"}.icon-basic-photo:before{content:"["}.icon-basic-picture:before{content:"]"}.icon-basic-picture-multiple:before{content:"^"}.icon-basic-pin1:before{content:"_"}.icon-basic-pin2:before{content:"`"}.icon-basic-postcard:before{content:"{"}.icon-basic-postcard-multiple:before{content:"|"}.icon-basic-printer:before{content:"}"}.icon-basic-question:before{content:"~"}.icon-basic-rss:before{content:"\\"}.icon-basic-server:before{content:"\e000"}.icon-basic-server2:before{content:"\e001"}.icon-basic-server-cloud:before{content:"\e002"}.icon-basic-server-download:before{content:"\e003"}.icon-basic-server-upload:before{content:"\e004"}.icon-basic-settings:before{content:"\e005"}.icon-basic-share:before{content:"\e006"}.icon-basic-sheet:before{content:"\e007"}.icon-basic-sheet-multiple:before{content:"\e008"}.icon-basic-sheet-pen:before{content:"\e009"}.icon-basic-sheet-pencil:before{content:"\e00a"}.icon-basic-sheet-txt:before{content:"\e00b"}.icon-basic-signs:before{content:"\e00c"}.icon-basic-smartphone:before{content:"\e00d"}.icon-basic-spades:before{content:"\e00e"}.icon-basic-spread:before{content:"\e00f"}.icon-basic-spread-bookmark:before{content:"\e010"}.icon-basic-spread-text:before{content:"\e011"}.icon-basic-spread-text-bookmark:before{content:"\e012"}.icon-basic-star:before{content:"\e013"}.icon-basic-tablet:before{content:"\e014"}.icon-basic-target:before{content:"\e015"}.icon-basic-todo:before{content:"\e016"}.icon-basic-todo-pen:before{content:"\e017"}.icon-basic-todo-pencil:before{content:"\e018"}.icon-basic-todo-txt:before{content:"\e019"}.icon-basic-todolist-pen:before{content:"\e01a"}.icon-basic-todolist-pencil:before{content:"\e01b"}.icon-basic-trashcan:before{content:"\e01c"}.icon-basic-trashcan-full:before{content:"\e01d"}.icon-basic-trashcan-refresh:before{content:"\e01e"}.icon-basic-trashcan-remove:before{content:"\e01f"}.icon-basic-upload:before{content:"\e020"}.icon-basic-usb:before{content:"\e021"}.icon-basic-video:before{content:"\e022"}.icon-basic-watch:before{content:"\e023"}.icon-basic-webpage:before{content:"\e024"}.icon-basic-webpage-img-txt:before{content:"\e025"}.icon-basic-webpage-multiple:before{content:"\e026"}.icon-basic-webpage-txt:before{content:"\e027"}.icon-basic-world:before{content:"\e028"}
+@keyframes moveInBottom {
+  0% {
+    opacity: 0;
+    transform: translateY(3rem); }
+  100% {
+    opacity: 1;
+    transform: translateY(0); } }
+
+@keyframes moveInLeft {
+  0% {
+    opacity: 0;
+    transform: translateX(-10rem); }
+  80% {
+    transform: translateX(1rem); }
+  100% {
+    opacity: 1;
+    transform: translateX(0); } }
+
+@keyframes moveInRight {
+  0% {
+    opacity: 0;
+    transform: translateX(10rem); }
+  80% {
+    transform: translateX(-1rem); }
+  100% {
+    opacity: 1;
+    transform: translateX(0); } }
+
+* {
+  padding: 0;
+  margin: 0;
+  box-sizing: inherit; }
+
+html {
+  font-size: 62.5%; }
+  @media only screen and (min-width: 112.5em) {
+    html {
+      font-size: 75%; } }
+  @media only screen and (max-width: 75em) {
+    html {
+      font-size: 56.25%; } }
+  @media only screen and (max-width: 56.25em) {
+    html {
+      font-size: 50%; } }
+
+body {
+  padding: 3rem;
+  box-sizing: border-box; }
+  @media only screen and (max-width: 56.25em) {
+    body {
+      padding: 0; } }
+
+::selection {
+  background-color: #55c57a;
+  color: #fff; }
+
+body {
+  font-family: "Lato", sans-serif;
+  font-weight: 400;
+  font-size: 1.6rem;
+  line-height: 1.7;
+  color: #777; }
+
+.heading-primary {
+  color: #fff;
+  text-transform: uppercase;
+  backface-visibility: hidden;
+  margin-bottom: 6.4rem; }
+  .heading-primary--main {
+    display: block;
+    font-size: 6.4rem;
+    font-weight: 400;
+    letter-spacing: 3.6rem;
+    animation: moveInLeft 1s ease-out; }
+    @media only screen and (max-width: 37.5em) {
+      .heading-primary--main {
+        font-size: 4.8rem;
+        letter-spacing: 1rem; } }
+  .heading-primary--sub {
+    display: block;
+    font-size: 2.4rem;
+    font-weight: 700;
+    letter-spacing: 1.7rem;
+    animation: moveInRight 1s ease-out; }
+    @media only screen and (max-width: 37.5em) {
+      .heading-primary--sub {
+        font-size: 1.6rem;
+        letter-spacing: 0.7rem; } }
+
+.heading-secondary {
+  font-size: 3.6rem;
+  font-weight: 700;
+  text-transform: uppercase;
+  text-align: center;
+  background-image: linear-gradient(to right, #7ed56f, #28b485);
+  -webkit-background-clip: text;
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+  display: inline-block; }
+  @media only screen and (max-width: 56.25em) {
+    .heading-secondary {
+      font-size: 3rem; } }
+  @media only screen and (max-width: 37.5em) {
+    .heading-secondary {
+      font-size: 2.4rem; } }
+
+.heading-tertiary {
+  font-size: 1.6rem;
+  text-transform: uppercase; }
+
+.paragraph {
+  font-size: 1.6rem;
+  font-weight: 400;
+  line-height: 1.6; }
+  .paragraph:not(:last-child) {
+    margin-bottom: 2.4rem; }
+
+.u-center-text {
+  text-align: center !important; }
+
+.u-mb-sm {
+  margin-bottom: 1.6rem !important; }
+  @media only screen and (max-width: 56.25em) {
+    .u-mb-sm {
+      margin-bottom: 1rem !important; } }
+
+.u-mb-md {
+  margin-bottom: 3.6rem !important; }
+  @media only screen and (max-width: 56.25em) {
+    .u-mb-md {
+      margin-bottom: 2.4rem !important; } }
+
+.u-mb-lg-1 {
+  margin-bottom: 6.4rem !important; }
+  @media only screen and (max-width: 56.25em) {
+    .u-mb-lg-1 {
+      margin-bottom: 4.8rem !important; } }
+
+.u-mb-lg-2 {
+  margin-bottom: 9.6rem !important; }
+  @media only screen and (max-width: 56.25em) {
+    .u-mb-lg-2 {
+      margin-bottom: 6.4rem !important; } }
+
+.u-mt-lg-2 {
+  margin-top: 9.6rem !important; }
+
+.btn {
+  border: none;
+  display: inline-block;
+  border-radius: 10rem;
+  padding: 1.6rem 4rem;
+  position: relative;
+  text-transform: uppercase;
+  transition: all 0.2s;
+  font-size: 1.6rem;
+  font-weight: 400;
+  cursor: pointer; }
+  .btn:link, .btn:visited {
+    text-decoration: none; }
+  .btn--white {
+    background-color: #fff;
+    color: #777; }
+    .btn--white::after {
+      background-color: #fff; }
+  .btn--primary {
+    background-color: #55c57a;
+    color: #fff; }
+    .btn--primary::after {
+      background-color: #55c57a; }
+  .btn--animated {
+    animation: moveInBottom 0.5s ease-out 0.75s;
+    animation-fill-mode: backwards; }
+  .btn::after {
+    content: "";
+    display: inline-block;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+    z-index: -1;
+    top: 0;
+    left: 0;
+    border-radius: 10rem;
+    transition: all 0.3s ease-out; }
+  .btn:hover {
+    transform: translateY(-0.3rem);
+    box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.14); }
+    .btn:hover::after {
+      transform: scaleX(1.4) scaleY(1.6);
+      opacity: 0; }
+  .btn:active {
+    transform: translateX(-0.1rem);
+    box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.07); }
+
+.btn--simple:link, .btn--simple:visited {
+  text-decoration: none;
+  color: #55c57a;
+  display: inline-block;
+  padding: 0.3rem;
+  transition: all 0.3s;
+  border-bottom: solid 1px #55c57a; }
+
+.btn--simple:hover {
+  background-color: #55c57a;
+  color: #fff;
+  transform: translateY(-0.4rem);
+  box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.14); }
+
+.btn--simple:active {
+  transform: translateY(-0.1rem);
+  box-shadow: 0 0.6rem 1.2rem rgba(0, 0, 0, 0.07); }
+
+.composition {
+  position: relative; }
+  @media only screen and (max-width: 56.25em) {
+    .composition {
+      padding-top: 4.8rem; } }
+  .composition:hover .composition__img:not(:hover) {
+    transform: scale(0.95); }
+  .composition__img {
+    position: absolute;
+    display: block;
+    width: 55%;
+    transition: all 0.3s;
+    box-shadow: 0 0 2.4rem 1rem rgba(0, 0, 0, 0.15); }
+    @media only screen and (max-width: 56.25em) {
+      .composition__img {
+        position: relative;
+        width: 32%;
+        display: inline-block; } }
+    .composition__img:hover {
+      transform: scale(1.05) translateY(-5px);
+      z-index: 10;
+      outline: solid 1rem #55c57a;
+      outline-offset: 1rem;
+      box-shadow: 0 0 4.8rem 1rem rgba(0, 0, 0, 0.3); }
+    .composition__img--1 {
+      top: 0;
+      left: 0; }
+      @media only screen and (max-width: 56.25em) {
+        .composition__img--1 {
+          left: 3rem;
+          top: -3rem;
+          transform: scale(1.1); } }
+    .composition__img--2 {
+      top: 15%;
+      right: 0; }
+      @media only screen and (max-width: 56.25em) {
+        .composition__img--2 {
+          top: 0;
+          transform: scale(1.3);
+          z-index: 100; } }
+    .composition__img--3 {
+      bottom: 5%;
+      left: 15%; }
+      @media only screen and (max-width: 75em) {
+        .composition__img--3 {
+          bottom: 8%; } }
+      @media only screen and (max-width: 56.25em) {
+        .composition__img--3 {
+          top: 2rem;
+          bottom: 0;
+          left: -3rem;
+          transform: scale(1.2); } }
+
+.feature-card {
+  text-align: center;
+  background-color: rgba(255, 255, 255, 0.8);
+  border-radius: 4px;
+  padding: 3.2rem 1.6rem;
+  transition: all 0.3s;
+  box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.1); }
+  .feature-card:hover {
+    transform: scale(1.05) translateY(-2rem);
+    box-shadow: 0 2.4rem 3.6rem rgba(0, 0, 0, 0.2); }
+  .feature-card__icon {
+    display: inline-block;
+    font-size: 6.4rem;
+    background-image: linear-gradient(to right, #7ed56f, #28b485);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent; }
+
+.card {
+  width: 100%;
+  height: 52rem;
+  perspective: 150rem;
+  position: relative; }
+  .card__face {
+    z-index: 100;
+    box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.1);
+    border-radius: 3px;
+    overflow: hidden;
+    backface-visibility: hidden;
+    width: 100%;
+    height: 52rem;
+    position: absolute;
+    transition: all 0.6s ease; }
+    .card__face--back {
+      transform: rotateY(180deg); }
+    .card__face--front {
+      transform: rotateY(0deg); }
+  .card:hover .card__face--front {
+    transform: rotateY(-180deg); }
+  .card:hover .card__face--back {
+    transform: rotateY(0deg); }
+  .card__face--front {
+    background-color: #fff; }
+  .card__picture {
+    background-size: cover;
+    background-position: top;
+    background-blend-mode: screen;
+    clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%);
+    height: 23rem; }
+    .card__picture--1 {
+      background-image: linear-gradient(to right bottom, #ffb900, #ff7730), url("img/nat-5.jpg"); }
+    .card__picture--2 {
+      background-image: linear-gradient(to right bottom, #7ed56f, #28b485), url("img/nat-6.jpg"); }
+    .card__picture--3 {
+      background-image: linear-gradient(to right bottom, #2998ff, #5643fa), url("img/nat-7.jpg"); }
+  .card__heading {
+    position: absolute;
+    right: 2rem;
+    top: 12rem;
+    text-transform: uppercase;
+    color: #fff;
+    font-size: 2.8rem;
+    font-weight: 300;
+    width: 75%;
+    text-align: right;
+    display: inline-block; }
+    .card__heading-span {
+      padding: 1rem 1.5rem;
+      -webkit-box-decoration-break: clone;
+      box-decoration-break: clone;
+      text-align: right; }
+      .card__heading-span--1 {
+        background-image: linear-gradient(to bottom right, rgba(255, 185, 0, 0.8), rgba(255, 119, 48, 0.8)); }
+      .card__heading-span--2 {
+        background-image: linear-gradient(to bottom right, rgba(126, 213, 111, 0.8), rgba(40, 180, 133, 0.8)); }
+      .card__heading-span--3 {
+        background-image: linear-gradient(to bottom right, rgba(41, 152, 255, 0.8), rgba(86, 67, 250, 0.8)); }
+  .card__desc {
+    text-align: center;
+    padding: 3rem 0; }
+    .card__desc-list {
+      list-style: none;
+      display: inline-flex;
+      flex-direction: column; }
+    .card__desc-item {
+      padding: 0.8rem 2.4rem; }
+    .card__desc-item:not(:last-child) {
+      border-bottom: 1px solid #eee; }
+  .card__face--back {
+    position: relative; }
+    .card__face--back-1 {
+      background-image: linear-gradient(to bottom right, #ffb900, #ff7730); }
+    .card__face--back-2 {
+      background-image: linear-gradient(to bottom right, #7ed56f, #28b485); }
+    .card__face--back-3 {
+      background-image: linear-gradient(to bottom right, #2998ff, #5643fa); }
+  .card__price-box {
+    width: 100%;
+    text-align: center;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%); }
+  .card__price--only {
+    display: block;
+    color: #fff; }
+  .card__price {
+    display: block;
+    color: #fff;
+    font-size: 6.4rem;
+    font-weight: 100;
+    margin-bottom: 6.4rem; }
+  @media only screen and (max-width: 56.25em), only screen and (hover: none) {
+    .card {
+      height: auto;
+      box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.1);
+      border-radius: 3px;
+      overflow: auto;
+      background-color: #fff; }
+      .card__face {
+        border-radius: none;
+        box-shadow: none;
+        height: auto;
+        position: relative; }
+        .card__face--back {
+          transform: rotateY(0deg); }
+        .card__face--front {
+          transform: rotateY(0deg); }
+      .card:hover .card__face--front {
+        transform: rotateY(0); }
+      .card__picture {
+        clip-path: polygon(0 0, 100% 0, 100% 90%, 0 100%);
+        background-position: 10%;
+        height: 40rem; }
+      .card__heading {
+        top: 33rem;
+        line-height: 1.5;
+        font-size: 3.6rem;
+        width: 100%; }
+      .card__face--back {
+        position: relative;
+        clip-path: polygon(0 15%, 100% 0%, 100% 100%, 0 100%); }
+      .card__price-box {
+        position: relative;
+        top: 0;
+        left: 0;
+        transform: translate(0, 0);
+        padding: 4.8rem 0 3.6rem 0; }
+      .card__price {
+        font-size: 4.8rem;
+        margin-bottom: 2.4rem; } }
+  @media only screen and (max-width: 37.5em) {
+    .card__picture {
+      background-position: cover;
+      height: 23rem; }
+    .card__heading {
+      top: 16rem;
+      right: 1rem;
+      line-height: 1.7;
+      font-size: 2.4rem;
+      width: 50%; } }
+
+.story {
+  padding: 6.4rem;
+  width: 75%;
+  margin: 0 auto;
+  background-color: rgba(255, 255, 255, 0.6);
+  transform: skewX(-12deg);
+  box-shadow: 0 3rem 6rem rgba(0, 0, 0, 0.1);
+  border-radius: 3px; }
+  @media only screen and (max-width: 56.25em) {
+    .story {
+      width: 90%; } }
+  @media only screen and (max-width: 37.5em) {
+    .story {
+      transform: skewX(0);
+      padding: 3.6rem 2.4rem; } }
+  .story:not(:last-child) {
+    margin-bottom: 9.6rem; }
+  .story::after {
+    content: "";
+    clear: both;
+    display: table; }
+  .story__shape {
+    width: 15rem;
+    height: 15rem;
+    clip-path: circle(50% at 50% 50%);
+    shape-outside: circle(50% at 50% 50%);
+    transition: all 0.4s;
+    float: left;
+    position: relative;
+    transform: skewX(12deg); }
+    @media only screen and (max-width: 37.5em) {
+      .story__shape {
+        transform: skewX(0);
+        float: none;
+        margin: 0 auto;
+        margin-bottom: 2.4rem; } }
+  .story__img {
+    height: 100%;
+    transition: all 0.5s;
+    transform: scale(1.4) translateX(-3rem);
+    backface-visibility: hidden; }
+  .story__author {
+    position: absolute;
+    opacity: 0;
+    transform: translate(-50%, 0);
+    color: #fff;
+    transition: all 0.5s;
+    text-transform: uppercase;
+    text-align: center;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, 20%); }
+  .story__text {
+    transform: translateX(2rem) skewX(12deg); }
+    @media only screen and (max-width: 37.5em) {
+      .story__text {
+        transform: translateX(2rem) skewX(0); } }
+  .story:hover .story__author {
+    opacity: 1;
+    transform: translate(-50%, -50%); }
+  .story:hover .story__img {
+    filter: blur(4px) brightness(80%);
+    transform: scale(1) translateX(-3.5rem); }
+
+.bg-video {
+  position: absolute;
+  z-index: -1;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  opacity: 0.15; }
+  .bg-video video {
+    height: 100%;
+    width: 100%;
+    object-fit: cover; }
+
+.form {
+  height: 100%; }
+  .form__group {
+    position: relative;
+    width: 100%; }
+    .form__group:not(:last-child) {
+      margin-bottom: 4.8rem; }
+  .form__input {
+    padding: 1.6rem 2.4rem;
+    font-size: 1.6rem;
+    font-family: inherit;
+    border: none;
+    display: block;
+    color: inherit;
+    width: 100%;
+    border-radius: 2px;
+    border-bottom: 3px solid transparent; }
+    @media only screen and (max-width: 56.25em) {
+      .form__input {
+        box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.1); } }
+    .form__input::placeholder {
+      color: #999;
+      font-size: 1.4rem; }
+    .form__input:focus {
+      outline: none;
+      border-bottom: 3px solid #55c57a;
+      box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1); }
+      @media only screen and (max-width: 56.25em) {
+        .form__input:focus {
+          box-shadow: 0 1.2rem 2.4rem rgba(0, 0, 0, 0.15); } }
+    .form__input:focus:invalid {
+      border-bottom: 3px solid #ff7730; }
+    .form__input-label {
+      font-size: 1.2rem;
+      font-weight: 700;
+      padding-left: 2.4rem;
+      position: absolute;
+      top: 50%;
+      transform: translateY(-50%);
+      opacity: 0;
+      transition: all 0.4s; }
+    .form__input:not(:placeholder-shown) + .form__input-label {
+      transform: translateY(160%);
+      opacity: 1; }
+  .form__group-radio {
+    display: flex;
+    align-items: center;
+    gap: 1.2rem; }
+  .form__radio {
+    appearance: none;
+    border: 2px solid #55c57a;
+    width: 2rem;
+    height: 2rem;
+    border-radius: 50%;
+    position: relative; }
+    .form__radio:checked::after {
+      content: "";
+      width: 1rem;
+      height: 1rem;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      border-radius: 50%;
+      background-color: #55c57a; }
+
+.modal {
+  opacity: 0;
+  pointer-events: none;
+  visibility: hidden;
+  transition: all 0.2s;
+  position: fixed;
+  width: 100%;
+  height: 100vh;
+  top: 0;
+  left: 0;
+  z-index: 3000;
+  background-color: rgba(0, 0, 0, 0.8); }
+  @supports (backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px)) {
+    .modal {
+      backdrop-filter: blur(5px);
+      background-color: rgba(0, 0, 0, 0.3); } }
+  .modal__box {
+    transition: all 0.6s 0.1s;
+    transform: scale(0.1) translate(-50%, -50%);
+    transform-origin: left;
+    width: 80%;
+    height: 90vh;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    z-index: 900;
+    background-color: #fff;
+    display: flex;
+    border-radius: 3px;
+    overflow: hidden; }
+    @media only screen and (max-width: 75em) {
+      .modal__box {
+        width: 90%; } }
+    @media only screen and (max-width: 56.25em) {
+      .modal__box {
+        flex-wrap: wrap; } }
+    @media only screen and (max-width: 37.5em) {
+      .modal__box {
+        width: 95%;
+        height: 95vh; } }
+  .modal__img-box {
+    flex-basis: 40%;
+    flex-shrink: 0;
+    flex-grow: 0; }
+    @media only screen and (max-width: 56.25em) {
+      .modal__img-box {
+        flex-basis: 100%;
+        display: flex;
+        max-height: 45%; } }
+  .modal__img {
+    display: block;
+    width: 100%;
+    height: 50%;
+    object-fit: cover;
+    object-position: center; }
+    @media only screen and (max-width: 56.25em) {
+      .modal__img {
+        width: 50%;
+        height: 100%;
+        align-self: flex-start; } }
+  .modal__text-box {
+    padding: 0 3.6rem;
+    position: relative;
+    margin: auto 0; }
+    @media only screen and (max-width: 56.25em) {
+      .modal__text-box {
+        padding: 0 2.4rem; } }
+  .modal__text {
+    font-size: 1.4rem;
+    column-count: 2;
+    column-gap: 3.6rem;
+    column-rule: 1px solid #eee;
+    hyphens: auto; }
+    @media only screen and (max-width: 56.25em) {
+      .modal__text {
+        font-size: 1.3rem;
+        column-gap: 2.4rem; } }
+    @media only screen and (max-width: 37.5em) {
+      .modal__text {
+        column-count: 1;
+        font-size: 1.2rem; } }
+  .modal__close {
+    position: absolute;
+    width: 2.4rem;
+    height: 2.4rem;
+    top: 2.4rem;
+    right: 4.8rem; }
+    .modal__close:hover .modal__close-icon::before, .modal__close:hover .modal__close-icon::after {
+      background-color: #28b485; }
+  .modal__close-icon::before, .modal__close-icon::after {
+    content: "";
+    position: absolute;
+    width: 2rem;
+    height: 2px;
+    top: 50%;
+    left: 50%;
+    background-color: #333;
+    transition: all 0.3s; }
+  .modal__close-icon::before {
+    transform: rotate(45deg); }
+  .modal__close-icon::after {
+    transform: rotate(135deg); }
+
+.modal:target {
+  opacity: 1;
+  pointer-events: auto;
+  visibility: visible; }
+  .modal:target .modal__box {
+    transform: scale(1) translate(-50%, -50%); }
+
+.header {
+  z-index: 100;
+  background-image: linear-gradient(to right bottom, rgba(126, 213, 111, 0.8), rgba(40, 180, 133, 0.8)), url("../img/hero-small.jpg");
+  background-size: cover;
+  background-position: top;
+  position: relative;
+  height: 95vh;
+  clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%); }
+  @media only screen and (min-resolution: 192dpi) and (min-width: 37.5em), only screen and (min-width: 125em) {
+    .header {
+      background-image: linear-gradient(to right bottom, rgba(126, 213, 111, 0.8), rgba(40, 180, 133, 0.8)), url("../img/hero.jpg"); } }
+  @media only screen and (max-width: 56.25em) {
+    .header {
+      clip-path: polygon(0 0, 100% 0, 100% 85%, 0 100%); } }
+  .header__logo-box {
+    position: absolute;
+    height: 4rem;
+    top: 4rem;
+    left: 4rem; }
+  .header__logo {
+    height: 3.5rem; }
+  .header__text-box {
+    position: absolute;
+    top: 40%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    text-align: center; }
+
+.footer {
+  padding: 15rem 0;
+  background-color: #333; }
+  @media only screen and (max-width: 75em) {
+    .footer {
+      padding: 10rem 0; } }
+  .footer__logo-box {
+    text-align: center;
+    margin-bottom: 9.6rem; }
+    @media only screen and (max-width: 75em) {
+      .footer__logo-box {
+        margin-bottom: 6.4rem; } }
+  .footer__logo {
+    max-height: 12rem; }
+  .footer__copyright {
+    max-width: 75%;
+    border-top: 1px solid #f7f7f7;
+    color: #fff;
+    padding: 2.4rem 2.4rem 0 2.4rem;
+    font-size: 1.4rem;
+    margin-left: auto; }
+    @media only screen and (max-width: 75em) {
+      .footer__copyright {
+        max-width: 100%;
+        margin-top: 6.4rem; } }
+  .footer__nav {
+    border-top: 1px solid #f7f7f7;
+    padding: 0 2.4rem;
+    padding-top: 1.2rem;
+    justify-self: start; }
+    @media only screen and (max-width: 75em) {
+      .footer__nav {
+        justify-self: stretch; } }
+  .footer__nav-list {
+    list-style: none;
+    display: flex;
+    justify-content: space-between; }
+    @media only screen and (max-width: 37.5em) {
+      .footer__nav-list {
+        gap: 0.6rem; } }
+  .footer__nav-link:link, .footer__nav-link:visited {
+    text-decoration: none;
+    color: #f7f7f7;
+    transition: all 0.3s;
+    display: inline-block;
+    padding: 0.3rem 0.8rem; }
+    @media only screen and (max-width: 37.5em) {
+      .footer__nav-link:link, .footer__nav-link:visited {
+        font-size: 1.2rem; } }
+  .footer__nav-link:hover {
+    color: #55c57a;
+    box-shadow: 0 1.2rem 1.2rem rgba(0, 0, 0, 0.3);
+    transform: scale(1.1); }
+
+.navigation__checkbox {
+  display: none; }
+
+.navigation__background {
+  background-image: radial-gradient(#7ed56f, #28b485);
+  width: 6.5rem;
+  height: 6.5rem;
+  border-radius: 50%;
+  position: fixed;
+  top: 6.7rem;
+  right: 6.7rem;
+  z-index: 1000;
+  transition: all 0.8s ease-out; }
+  @media only screen and (max-width: 75em) {
+    .navigation__background {
+      top: 5.2rem;
+      right: 5.2rem; } }
+  @media only screen and (max-width: 56.25em) {
+    .navigation__background {
+      top: 4.2rem;
+      right: 4.2rem; } }
+  @media only screen and (max-width: 37.5em) {
+    .navigation__background {
+      top: 3.2rem;
+      right: 3.2rem; } }
+
+.navigation__btn {
+  background-color: #fff;
+  width: 7.5rem;
+  height: 7.5rem;
+  border-radius: 50%;
+  display: inline-block;
+  box-shadow: 0 1.6rem 1.6rem rgba(0, 0, 0, 0.1);
+  top: 6.5rem;
+  right: 6.5rem;
+  position: fixed;
+  z-index: 2000; }
+  @media only screen and (max-width: 75em) {
+    .navigation__btn {
+      top: 5rem;
+      right: 5rem; } }
+  @media only screen and (max-width: 56.25em) {
+    .navigation__btn {
+      top: 4rem;
+      right: 4rem; } }
+  @media only screen and (max-width: 37.5em) {
+    .navigation__btn {
+      top: 3rem;
+      right: 3rem; } }
+  .navigation__btn:hover .navigation__icon::before {
+    height: 2px;
+    transform: translateY(-1.2rem); }
+  .navigation__btn:hover .navigation__icon::after {
+    height: 2px;
+    transform: translateY(1.2rem); }
+
+.navigation__icon {
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%); }
+  .navigation__icon, .navigation__icon::before, .navigation__icon::after {
+    position: absolute;
+    z-index: inherit;
+    width: 3.5rem;
+    height: 1.5px;
+    background-color: #333;
+    display: inline-block;
+    transition: transform 0.2s; }
+  .navigation__icon::before {
+    content: "";
+    transform: translateY(-1rem); }
+  .navigation__icon::after {
+    content: "";
+    transform: translateY(1rem); }
+
+.navigation__checkbox:checked + .navigation__btn .navigation__icon {
+  background-color: transparent; }
+
+.navigation__checkbox:checked + .navigation__btn .navigation__icon::before {
+  transform: rotate(135deg);
+  height: 3px; }
+
+.navigation__checkbox:checked + .navigation__btn .navigation__icon::after {
+  transform: rotate(-135deg);
+  height: 3px; }
+
+.navigation__nav {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 0;
+  height: 100vh;
+  z-index: 1500;
+  opacity: 0;
+  pointer-events: none;
+  visibility: hidden;
+  transition: all 0.8s cubic-bezier(0.68, -0.55, 0.265, 1.55); }
+
+.navigation__list {
+  position: absolute;
+  list-style: none;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  text-align: center; }
+
+.navigation__link {
+  animation: navMoveOut 0.4s ease-in;
+  animation-fill-mode: forwards; }
+  .navigation__link:link, .navigation__link:visited {
+    text-decoration: none;
+    color: #fff;
+    font-size: 3rem;
+    text-transform: uppercase;
+    font-weight: 300;
+    display: inline-block;
+    padding: 1rem 1rem;
+    background-image: linear-gradient(120deg, transparent 0%, transparent 60%, #fff 60%);
+    background-size: 300%;
+    transition: all 0.4s; }
+    .navigation__link:link span, .navigation__link:visited span {
+      margin-right: 1.2rem; }
+    @media only screen and (max-width: 37.5em) {
+      .navigation__link:link, .navigation__link:visited {
+        font-size: 2rem; }
+        .navigation__link:link span, .navigation__link:visited span {
+          margin-right: 0.5rem; } }
+  .navigation__link:hover, .navigation__link:active {
+    background-position: 100%;
+    color: #55c57a;
+    transform: translateX(1rem); }
+
+.navigation__checkbox:checked ~ .navigation__nav {
+  opacity: 1;
+  pointer-events: auto;
+  visibility: visible;
+  width: 100%; }
+
+.navigation__checkbox:checked ~ .navigation__nav .navigation__link {
+  animation: navMoveIn 0.4s ease-out 0.4s;
+  animation-fill-mode: backwards; }
+
+.navigation__checkbox:checked ~ .navigation__background {
+  transform: scale(50); }
+
+.container {
+  max-width: 114rem;
+  margin: 0 auto;
+  padding: 0 2.4rem; }
+  @media only screen and (max-width: 56.25em) {
+    .container {
+      padding: 0 4.8rem; } }
+  @media only screen and (max-width: 37.5em) {
+    .container {
+      padding: 0 2.4rem; } }
+
+.flex {
+  display: flex; }
+
+.flex-gap--sm {
+  gap: 3.6rem; }
+
+.flex-gap--md {
+  gap: 6.4rem; }
+
+.flex-gap--lg {
+  gap: 9.6rem; }
+
+.flex--col {
+  flex-direction: column; }
+
+.flex-space--between {
+  justify-content: space-between; }
+
+.flex-align--center {
+  align-items: center; }
+
+.grid {
+  display: grid; }
+
+.grid--2-cols {
+  grid-template-columns: repeat(2, 1fr); }
+  @media only screen and (max-width: 56.25em) {
+    .grid--2-cols {
+      grid-template-columns: 1fr; } }
+
+.grid--3-cols {
+  grid-template-columns: repeat(3, 1fr); }
+  @media only screen and (max-width: 56.25em) {
+    .grid--3-cols {
+      grid-template-columns: 1fr; } }
+
+.grid--4-cols {
+  grid-template-columns: repeat(4, 1fr); }
+  @media only screen and (max-width: 56.25em) {
+    .grid--4-cols {
+      grid-template-columns: 1fr 1fr; } }
+  @media only screen and (max-width: 37.5em) {
+    .grid--4-cols {
+      grid-template-columns: 1fr; } }
+
+.grid-cg-sm {
+  column-gap: 1.6rem;
+  row-gap: 1.6rem; }
+  @media only screen and (max-width: 75em) {
+    .grid-cg-sm {
+      column-gap: 1rem;
+      row-gap: 1rem; } }
+
+.grid-cg-md {
+  column-gap: 4.8rem;
+  row-gap: 4.8rem; }
+  @media only screen and (max-width: 75em) {
+    .grid-cg-md {
+      column-gap: 3.6rem;
+      row-gap: 3.6rem; } }
+
+.grid-cg-lg-1 {
+  column-gap: 6.4rem;
+  row-gap: 6.4rem; }
+  @media only screen and (max-width: 75em) {
+    .grid-cg-lg-1 {
+      column-gap: 4.8rem;
+      row-gap: 4.8rem; } }
+
+.grid-cg-lg-2 {
+  column-gap: 9.6rem;
+  column-gap: 9.6rem; }
+  @media only screen and (max-width: 75em) {
+    .grid-cg-lg-2 {
+      column-gap: 7.2rem;
+      row-gap: 7.2rem; } }
+
+.section-about {
+  background-color: #f7f7f7;
+  margin-top: -20vh;
+  position: relative;
+  padding: 25rem 0 30rem 0;
+  z-index: 90; }
+  @media only screen and (max-width: 75em) {
+    .section-about {
+      padding: 20rem 0; } }
+  @media only screen and (max-width: 56.25em) {
+    .section-about {
+      padding: 20rem 0 25rem 0; } }
+  @media only screen and (max-width: 37.5em) {
+    .section-about {
+      padding: 20rem 0 20rem 0; } }
+
+.section-features {
+  position: relative;
+  z-index: 100;
+  margin-top: -14vh;
+  padding: 25rem 0;
+  transform: skewY(-7deg);
+  background-image: linear-gradient(to right bottom, rgba(126, 213, 111, 0.8), rgba(40, 180, 133, 0.8)), url("../img/nat-4.jpg");
+  background-size: cover;
+  background-position: top left; }
+  .section-features > * {
+    transform: skewY(7deg); }
+  @media only screen and (max-width: 75em) {
+    .section-features {
+      padding: 20rem 0; } }
+  @media only screen and (max-width: 56.25em) {
+    .section-features {
+      padding: 15rem 0; } }
+
+.section-tours {
+  background-color: #f7f7f7;
+  margin-top: -15vh;
+  padding: 25rem 0 15rem 0; }
+  .section-tours .grid {
+    row-gap: 9.6rem; }
+  @media only screen and (max-width: 75em) {
+    .section-tours {
+      padding: 20rem 0 15rem 0; } }
+  @media only screen and (max-width: 37.5em) {
+    .section-tours {
+      padding: 20rem 0 10rem 0; } }
+
+.section-stories {
+  position: relative;
+  padding: 15rem 0; }
+
+.section-form {
+  padding: 15rem 0;
+  background-image: linear-gradient(to right bottom, #7ed56f, #28b485); }
+  .section-form .form__box {
+    background-image: linear-gradient(105deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.9) 55%, transparent 55%), url("img/nat-10.jpg");
+    background-size: cover;
+    margin: 0 auto;
+    border-radius: 3px;
+    box-shadow: 0 2.4rem 5rem rgba(0, 0, 0, 0.2);
+    width: 100%;
+    padding: 4.8rem 6.4rem; }
+    @media only screen and (max-width: 56.25em) {
+      .section-form .form__box {
+        background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.9) 50%, rgba(255, 255, 255, 0.6) 100%), url("img/nat-10.jpg"); } }
+    @media only screen and (max-width: 37.5em) {
+      .section-form .form__box {
+        background-image: linear-gradient(to right, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.8) 100%), url("img/nat-10.jpg");
+        padding: 3.6rem 2.4rem; } }
+    .section-form .form__box .form {
+      width: 45%; }
+      @media only screen and (max-width: 56.25em) {
+        .section-form .form__box .form {
+          width: auto;
+          max-width: 40rem; } }
+      @media only screen and (max-width: 37.5em) {
+        .section-form .form__box .form {
+          max-width: 40rem;
+          width: 100%; } }
diff --git a/sass/components/_card.scss b/sass/components/_card.scss
index a2c4890..a12780f 100644
--- a/sass/components/_card.scss
+++ b/sass/components/_card.scss
@@ -52,7 +52,7 @@
           $color-secondary-light,
           $color-secondary-dark
         ),
-        url("../../img/nat-5.jpg");
+        url("img/nat-5.jpg");
     }
 
     &--2 {
@@ -61,7 +61,7 @@
           $color-primary-light,
           $color-primary-dark
         ),
-        url("../../img/nat-6.jpg");
+        url("img/nat-6.jpg");
     }
 
     &--3 {
@@ -70,7 +70,7 @@
           $color-tertiary-light,
           $color-tertiary-dark
         ),
-        url("../../img/nat-7.jpg");
+        url("img/nat-7.jpg");
     }
   }
 
diff --git a/sass/pages/_home.scss b/sass/pages/_home.scss
index 1c847b6..9f52479 100644
--- a/sass/pages/_home.scss
+++ b/sass/pages/_home.scss
@@ -87,7 +87,7 @@
         rgba($color-white, 0.9) 55%,
         transparent 55%
       ),
-      url("../../img/nat-10.jpg");
+      url("img/nat-10.jpg");
     background-size: cover;
     margin: 0 auto;
     border-radius: 3px;
@@ -103,7 +103,7 @@
           rgba($color-white, 0.9) 50%,
           rgba($color-white, 0.6) 100%
         ),
-        url("../../img/nat-10.jpg");
+        url("img/nat-10.jpg");
     }
 
     @include respond(phone) {
@@ -112,7 +112,7 @@
           rgba($color-white, 0.9) 0%,
           rgba($color-white, 0.8) 100%
         ),
-        url("../../img/nat-10.jpg");
+        url("img/nat-10.jpg");
 
       padding: 3.6rem 2.4rem;
     }