:root{--color-primary: #eb2f64;--color-primary-light: #ff3366;--color-primary-dark: #ba265d;--color-grey-light-1: #faf9f9;--color-grey-light-2: #f4f2f2;--color-grey-light-3: #f0eeee;--color-grey-light-4: #ccc;--color-grey-dark-1: #333;--color-grey-dark-2: #777;--color-grey-dark-3: #999;--color-black: #000;--line: 1px solid var(--color-grey-light-2);--shadow-dark: 0 1rem 6rem rgba(0, 0, 0, 0.3);--shadow-light: 0 1rem 2rem rgba(0, 0, 0, 0.1)}@keyframes pulse{50%{transform:scale(1.02);box-shadow:0 1rem 3rem rgba(0,0,0,0.3)}100%{transform:scale(1);box-shadow:none}}*{padding:0;margin:0}*:focus{outline:none;outline:2px solid var(--color-primary)}*::-moz-selection{background-color:var(--color-primary);color:#fff}*::selection{background-color:var(--color-primary);color:#fff}*::after,*::before{box-sizing:inherit}html{font-size:62.5%;box-sizing:border-box}@media only screen and (max-width: 75em){html{font-size:56.25%}}@media only screen and (max-width: 48em){html{font-size:50%}}body{font-family:"Open Sans", sans-serif;line-height:1.6;color:var(--color-grey-dark-1);background-image:linear-gradient(var(--color-primary-light), var(--color-primary-dark));background-repeat:no-repeat}.box{padding:0 1rem}@media only screen and (max-width: 75em){.box{padding:0}}.container{max-width:120rem;margin:8rem auto;background-color:var(--color-grey-light-1);box-shadow:var(--shadow-dark);min-height:50rem}@media only screen and (max-width: 75em){.container{margin:0;max-width:100%}}.paragraph{font-size:1.4rem}.paragraph:not(:last-of-type){margin-bottom:2rem}.search{position:relative;display:flex;justify-content:center;align-items:center;flex:0 0 40%;transition:all 0.3s}.search__input{font-family:inherit;color:inherit;font-size:1.5rem;border:none;width:80%;background-color:var(--color-grey-light-3);border-radius:100px;padding:0.8rem 2rem;margin-right:-3.5rem;transition:all 0.3s}.search__input:focus{outline:none;width:100%;box-shadow:0 0.5rem 1rem rgba(0,0,0,0.08)}.search__input::-webkit-input-placeholder{font-size:1.4rem;color:var(--color-grey-dark-3)}.search__input:focus ~ .search__button{transform:translate(-0.08rem, 0.3rem)}.search__text{position:absolute;left:0;transform:translateX(-6rem);font-size:1.2rem;transition:all 0.3s}.search__button{border:none;background:none;transition:all 0.3s;cursor:pointer;transition:all 0.3s}.search__icon{font-size:1.8rem;color:var(--color-grey-dark-3)}@media only screen and (max-width: 30em){.search{position:absolute;left:0;width:0;opacity:0;pointer-events:none;visibility:hidden}}.search-mobile{width:0%;left:0;transition:all 0.3s}.search-open .search-mobile{position:fixed;top:0;left:0;background-color:rgba(0,0,0,0.95);height:100vh;width:100%;z-index:1500}.search-open .search{display:block;position:fixed;top:2rem;left:2rem;width:100%;opacity:1;pointer-events:auto;visibility:visible;z-index:2000}.search-open .search__input{padding:1.2rem 1.5rem}.search-open .search__input:focus{width:80%}.search-open .search__input:focus ~ .search-open .search__button{transform:translate(-0.08rem, 0.4rem)}.search-open .search__button{transform:translateY(0.3rem)}.user-nav{display:flex;align-items:center;align-self:stretch}.user-nav__icon-box{position:relative;cursor:pointer;padding:0 2rem;align-self:stretch;display:flex;align-items:center}.user-nav__icon-box:hover{background-color:var(--color-grey-light-4)}.user-nav__icon{font-size:2.5rem;align-self:center}.user-nav__notif{display:flex;align-items:center;justify-content:center;position:absolute;top:1rem;left:3rem;width:1.8rem;height:1.8rem;border-radius:50%;background-color:var(--color-primary);color:#fff}.user-nav__box{display:flex;align-items:center}.user-nav__img{height:3rem;border-radius:50%}.user-nav__name{font-size:1.5rem}.gallery{display:flex}.gallery__img{width:100%;display:block}.overview{display:flex;align-items:center;background-color:#fff;border-bottom:var(--line);flex-wrap:wrap}.overview__heading{font-size:2rem;font-weight:400;letter-spacing:1px;text-transform:uppercase;color:var(--color-grey-dark-2);padding:1.5rem 2rem}@media only screen and (max-width: 48em){.overview__heading{font-size:1.8rem;padding:1rem}}.overview__star{display:flex;margin-right:auto}.overview__star-icon,.overview__location-icon{color:var(--color-primary);font-size:1.8rem}.overview__location{display:flex;align-items:center;gap:0.2rem;font-size:1.3rem;margin-right:2rem}.overview__average{background-color:var(--color-primary);color:var(--color-grey-light-1);padding:0 1rem;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center}.overview__rate{font-size:2rem}.overview__count{font-size:1rem;text-transform:uppercase}.btn-inline:link,.btn-inline:visited{display:inline-block;text-decoration:none;font-weight:600;color:var(--color-primary);padding:0.2rem;border-bottom:1px solid currentColor;background:none;transition:all 0.2s}.btn-inline:hover,.btn-inline:active{color:var(--color-grey-dark-2);animation:pulse 1s infinite}.btn-inline:focus{animation:pulse 1s infinite}.btn:link,.btn:visited{position:relative;text-decoration:none;display:inline-block;background-image:linear-gradient(to right, var(--color-primary), var(--color-primary-dark));font-size:1.5rem;text-transform:uppercase;color:#fff;border-radius:100px;box-shadow:0 1rem 3rem rgba(0,0,0,0.3);overflow:hidden;transition:all 0.3s}.btn>*{transition:all 0.3s}.btn__visible{padding:1.5rem 7rem}.btn__invisible{position:absolute;top:-100%;left:0;width:100%;padding:1.5rem 0}.btn:hover .btn__invisible{top:0}.btn:hover .btn__visible{transform:translateY(100%)}.btn:hover{background-image:linear-gradient(to left, var(--color-primary), var(--color-primary-dark));animation:pulse 1s infinite}.review{display:flex;flex-direction:column;gap:3rem}.review__container{overflow:hidden;position:relative;padding:3rem;background-color:#fff;box-shadow:0 0.5rem 1rem rgba(0,0,0,0.2)}.review__container::before{content:"\201C";position:absolute;top:-10rem;left:1rem;font-size:20rem;color:var(--color-grey-light-2)}.review__text{margin-bottom:1.5rem;z-index:2;position:relative}.review__box{display:flex;align-items:center;gap:1.5rem}.review__user-box{margin-right:auto}.review__name{text-transform:uppercase;font-size:1.2rem}.review__date{color:var(--color-grey-dark-3)}.review__rate{font-size:2rem;color:var(--color-primary)}.review__img{height:4.5rem;border-radius:50%}.review__button-container{text-align:center;font-size:1.5rem}.header{height:7rem;background-color:#fff;border-bottom:var(--line);display:flex;align-items:center;justify-content:space-between}@media only screen and (max-width: 30em){.header>*{flex:1}}.logo-box__logo{height:4rem;margin-left:2rem}@media only screen and (max-width: 30em){.logo-box__logo{height:3rem}}.search-box{border:none;background:none;display:flex;justify-content:center;flex:0 0 20%;cursor:pointer}.search-box__icon{font-size:3rem;color:var(--color-grey-dark-2);display:none}@media only screen and (max-width: 30em){.search-box__icon{display:block}}.copy-rights{font-size:1.5rem;color:var(--color-grey-dark-3);text-align:center}@media only screen and (max-width: 60em){.copy-rights{position:absolute;left:0;bottom:0;width:100%;background-color:var(--color-grey-dark-1);padding:2rem 0}}.sidebar-nav{flex:0 0 20%;background-color:var(--color-grey-dark-1);padding:3rem 0;display:flex;flex-direction:column;justify-content:space-between}@media only screen and (max-width: 60em){.sidebar-nav{padding:0}}.sidebar-nav__list{list-style:none}@media only screen and (max-width: 60em){.sidebar-nav__list{display:flex}}.sidebar-nav__item{position:relative;padding:0.8rem 0}.sidebar-nav__item:not(:last-child){margin-bottom:0.8rem}.sidebar-nav__item::before{content:"";position:absolute;top:0;left:0;height:100%;background-color:var(--color-primary);width:2%;transform:scaleY(0);transition:transform 0.3s,width 0.5s cubic-bezier(0.83, 0, 0.17, 1) 0.3s}.sidebar-nav__item:hover::before,.sidebar-nav__item--active::before{transform:scaleY(1);width:100%}.sidebar-nav__item:active::before{background-color:var(--color-primary-light)}@media only screen and (max-width: 60em){.sidebar-nav__item{flex:1}.sidebar-nav__item:not(:last-child){margin:0}}.sidebar-nav__link:link,.sidebar-nav__link:visited{text-decoration:none;color:var(--color-grey-light-1);font-size:1.6rem;text-transform:uppercase;position:relative;display:flex;align-items:center;gap:2rem;padding:0 2rem}@media only screen and (max-width: 48em){.sidebar-nav__link:link,.sidebar-nav__link:visited{flex-direction:column;padding:0}}@media only screen and (max-width: 48em){.sidebar-nav__link:link,.sidebar-nav__link:visited{font-size:1.4rem;gap:1rem}}.sidebar-nav__icon{font-size:4rem;color:currentColor}@media only screen and (max-width: 48em){.sidebar-nav__icon{font-size:3rem}}.content{display:flex;background-color:var(--color-grey-light-2)}@media only screen and (max-width: 60em){.content{flex-direction:column;position:relative}}.hotel-view{flex:1}.hotel-details{padding:3rem;display:flex;gap:3rem;font-size:1.4rem}@media only screen and (max-width: 48em){.hotel-details{flex-direction:column}}@media only screen and (max-width: 30em){.hotel-details{padding:1.5rem}}.detail{flex:0 0 60%;padding:3rem;background-color:var(--color-grey-light-1);box-shadow:var(--shadow-light)}.detail__text-box{margin-bottom:3rem}.detail__list{padding:3rem;list-style:none;display:flex;flex-wrap:wrap;border-top:var(--line);border-bottom:var(--line)}@media only screen and (max-width: 75em){.detail__list{padding:1rem}}@media only screen and (max-width: 30em){.detail__list{flex-direction:column}}.detail__item{font-size:1.4rem;width:50%}.detail__item:not(:last-child){margin-bottom:1rem}@media only screen and (max-width: 30em){.detail__item{width:100%}}.detail__icon{color:var(--color-primary)}@media only screen and (max-width: 30em){.detail{padding:1.5rem}}.recommend{display:flex;align-items:center;justify-content:space-between}.recommend__text{color:var(--color-grey-dark-3)}.recommend__img{display:inline-block;height:4rem;border-radius:50%;border:2px solid #fff}.recommend__img:not(:last-of-type){margin-right:-1.5rem}@media only screen and (max-width: 30em){.recommend{flex-direction:column}}.cta{padding:4rem;text-align:center}@media only screen and (max-width: 60em){.cta{margin-bottom:5rem}}.cta__heading{font-size:2.2rem;margin-bottom:1rem;font-weight:300}@media only screen and (max-width: 48em){.cta__heading{font-size:1.8rem}}
