﻿: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;--line: 1px solid var(--color-grey-light-2);--shadow-dark: 0 2rem 6rem rgba(0, 0, 0, 0.3);--shadow-light: 0 2rem 5rem rgba(0, 0, 0, 0.6)}*,*::after,*::before{margin:0px;padding:0px;box-sizing:inherit}html{font-size:62.5%;box-sizing:border-box}@media only screen and (max-width: 68.75em){html{font-size:50%}}body{font-weight:400;line-height:1.6;min-height:100vh;color:var(--color-grey-dark-2);font-family:"Open Sans",sans-serif;background-image:linear-gradient(to right bottom, var(--color-primary-light), var(--color-primary-dark));background-size:cover;background-repeat:no-repeat}.container{min-height:50rem;margin:8rem auto;max-width:120rem;box-shadow:var(--shadow-dark);background-color:var(--color-grey-light-1)}@media only screen and (max-width: 75em){.container{margin:0;width:100%;max-width:100%}}.header{display:flex;justify-content:space-between;align-items:center;height:7rem;font-size:1.4rem;background-color:#fff;border-bottom:var(--line)}@media only screen and (max-width: 31.25em){.header{flex-wrap:wrap;align-content:space-around;height:11rem}}.content{display:flex}@media only screen and (max-width: 56.25em){.content{flex-direction:column}}.sidebar{display:flex;justify-content:space-between;flex-direction:column;flex:0 0 18%;background-color:var(--color-grey-dark-1)}.hotel-view{flex:1 0 0}.detail{display:flex;padding:4.5rem;font-size:1.4rem;background-color:var(--color-grey-light-1);border-bottom:var(--line)}@media only screen and (max-width: 56.25em){.detail{padding:3rem}}@media only screen and (max-width: 37.5em){.detail{flex-direction:column}}.description{flex:0 0 60%;padding:3rem;margin-right:4.5rem;background-color:#fff;box-shadow:var(--shadow-light)}@media only screen and (max-width: 56.25em){.description{padding:2rem;margin-right:3rem}}@media only screen and (max-width: 37.5em){.description{margin-right:0;margin-bottom:3rem}}.user-reviews{display:flex;align-items:center;flex-direction:column;flex:1}.logo{height:3.25rem;margin-left:2rem}.search{flex:0 0 40%;display:flex;justify-content:center;align-items:center}@media only screen and (max-width: 31.25em){.search{order:1;flex:0 0 100%;background-color:var(--color-grey-light-2)}}.search__input{width:90%;border:none;color:inherit;font-size:inherit;font-family:inherit;padding:.7rem 2rem;border-radius:10rem;margin-right:-3.5rem;transition:all 200ms;background-color:var(--color-grey-light-2)}.search__input:focus{width:100%;outline:none;background-color:var(--color-grey-light-3)}.search__input::placeholder{font-weight:100;color:var(--color-grey-light-4)}.search__input:focus+.search__button{background-color:var(--color-grey-light-3)}.search__button{border:none;background-color:var(--color-grey-light-2)}.search__button:focus{outline:none}.search__button:active{transform:translateY(2px)}.search__icon{width:2rem;height:2rem;fill:var(--color-grey-dark-3)}.user-nav{display:flex;align-items:center;align-self:stretch}.user-nav>*{display:flex;align-items:center;height:100%;cursor:pointer;padding:0 2rem}.user-nav>*:hover{background-color:var(--color-grey-light-2)}.user-nav__icon-box{position:relative}.user-nav__icon{width:2.25rem;height:2.25rem;fill:var(--color-grey-dark-2)}.user-nav__notification{display:flex;justify-content:center;align-items:center;position:absolute;top:1.5rem;right:1.1rem;color:#fff;width:1.75rem;height:1.75rem;font-size:.8rem;border-radius:50%;background-color:var(--color-primary)}.user-nav__user-photo{height:3.75rem;margin-right:1rem;border-radius:50%}.side-nav{list-style:none;font-size:1.4rem;margin-top:3.5rem}@media only screen and (max-width: 56.25em){.side-nav{display:flex;margin:0}}.side-nav__item{position:relative}.side-nav__item:not(:last-child){margin-bottom:.5rem}@media only screen and (max-width: 56.25em){.side-nav__item:not(:last-child){margin:0}}@media only screen and (max-width: 56.25em){.side-nav__item{flex:1}}.side-nav__item::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;transform:scaleY(0);background-color:var(--color-primary);transition:transform 200ms,width 400ms cubic-bezier(1, 0, 0, 1) 200ms,background-color 100ms}.side-nav__item:hover::before,.side-nav__item--active::before{width:100%;transform:scaleY(1)}.side-nav__item:active::before{background-color:var(--color-primary-light)}.side-nav__link:link,.side-nav__link:visited{position:relative;display:flex;align-items:center;padding:1.5rem 3rem;text-decoration:none;text-transform:uppercase;color:var(--color-grey-light-1);z-index:10}@media only screen and (max-width: 56.25em){.side-nav__link:link,.side-nav__link:visited{justify-content:center;padding:2rem}}@media only screen and (max-width: 37.5em){.side-nav__link:link,.side-nav__link:visited{flex-direction:column;padding:1.5rem .5rem}}.side-nav__icon{width:1.75rem;height:1.75rem;margin-right:2rem;fill:currentColor}@media only screen and (max-width: 37.5em){.side-nav__icon{width:1.5rem;height:1.5rem;margin-right:0;margin-bottom:.7rem}}.legal{padding:2.5rem;font-size:1.2rem;text-align:center;color:var(--color-grey-light-4)}@media only screen and (max-width: 56.25em){.legal{display:none}}.gallery{display:flex}.gallery__photo{display:block;max-width:100%}.overview{display:flex;align-items:center;border-bottom:var(--line)}@media only screen and (max-width: 26.56em){.overview{flex-wrap:wrap}}.overview__heading{font-weight:300;font-size:2.25rem;letter-spacing:1px;padding:1.5rem 3rem;text-transform:uppercase}@media only screen and (max-width: 37.5em){.overview__heading{font-size:1.8rem;padding:1.25rem 2rem}}@media only screen and (max-width: 26.56em){.overview__heading{font-size:1.4rem;letter-spacing:0;padding:1rem 1rem}}.overview__stars{display:flex;margin-right:auto}.overview__icon-star,.overview__icon-location{width:1.75rem;height:1.75rem;fill:var(--color-primary)}.overview__location{display:flex;align-items:center;font-size:1.2rem}@media only screen and (max-width: 360px){.overview__location{margin-right:1rem}}.overview__icon-location{margin-right:.5rem}.overview__rating{display:flex;flex-direction:column;justify-content:center;align-items:center;align-self:stretch;color:#fff;margin-left:3rem;padding:0 2.25rem;background-color:var(--color-primary)}@media only screen and (max-width: 37.5em){.overview__rating{padding:0 1.5rem}}@media only screen and (max-width: 360.99px){.overview__rating{flex:1;margin-left:0}}.overview__rating-average{font-weight:300;font-size:2.25rem;margin-bottom:-3px}@media only screen and (max-width: 37.5em){.overview__rating-average{font-size:1.8rem}}@media only screen and (max-width: 360px){.overview__rating-average{font-size:3rem}}.overview__rating-count{font-size:.8rem;text-transform:uppercase}@media only screen and (max-width: 37.5em){.overview__rating-count{font-size:.5rem}}@media only screen and (max-width: 360px){.overview__rating-count{font-size:1.5rem}}.btn-inline{display:inline-block;border:none;cursor:pointer;font-size:inherit;padding-bottom:2px;transition:all 200ms;color:var(--color-primary);background-color:rgba(0,0,0,0);border-bottom:1px solid currentColor}.btn-inline span{margin-left:3px;transition:margin-left 400ms}.btn-inline:hover{color:var(--color-grey-dark-1)}.btn-inline:hover span{margin-left:8px}.btn-inline:focus{outline:none;animation:pulsate 1s infinite}@keyframes pulsate{0%{box-shadow:none;transform:scale(1)}50%{transform:scale(1.05);box-shadow:0 1rem 4rem rgba(0,0,0,.25)}100%{box-shadow:none;transform:scale(1)}}.paragraph:not(:last-of-type){margin-bottom:2rem}.list{display:flex;flex-wrap:wrap;margin:3rem 0;padding:3rem 0;list-style:none;border-top:var(--line);border-bottom:var(--line)}@media only screen and (max-width: 26.56em){.list{flex-direction:column}}.list__item{flex:0 0 50%;margin-bottom:.7rem}.list__item::before{content:"";display:inline-block;width:1rem;height:1rem;margin-right:.7rem;background-size:cover;background-image:url(../img/chevron-thin-right.svg)}@supports(-webkit-mask-image: url()) or (mask-image: url()){.list__item::before{mask-size:cover;-webkit-mask-size:cover;background-color:var(--color-primary);mask-image:url(../img/chevron-thin-right.svg);-webkit-mask-image:url(../img/chevron-thin-right.svg);background-image:none}}.recommend{display:flex;justify-content:space-between;align-items:center;font-size:1.3rem;color:var(--color-grey-dark-3)}.recommend__friends{display:flex}.recommend__photo{width:4rem;height:4rem;border-radius:50%;box-sizing:content-box;border:3px solid #fff}.recommend__photo:not(:last-child){margin-right:-2rem}.review{position:relative;padding:3rem;overflow:hidden;margin-bottom:3.5rem;background-color:#fff;box-shadow:var(--shadow-light)}@media only screen and (max-width: 56.25em){.review{padding:2rem;margin-bottom:3rem}}.review__text{position:relative;margin-bottom:2rem;z-index:10}.review__user{display:flex;align-items:center}.review__photo{width:4.5rem;height:4.5rem;border-radius:50%;margin-right:1.5rem}.review__user-box{margin-right:auto}.review__user-name{font-weight:600;font-size:1.1rem;margin-bottom:.4rem;text-transform:uppercase}.review__user-date{font-size:1rem;color:var(--color-grey-dark-3)}.review__rating{font-weight:300;font-size:2.2rem;color:var(--color-primary)}.review::before{content:"“";position:absolute;top:-2.75rem;left:-1rem;line-height:1;font-size:20rem;font-family:sans-serif;color:var(--color-grey-light-2);z-index:1}.cta{padding:3.5rem 0;text-align:center}@media only screen and (max-width: 56.25em){.cta{padding:2.5rem 0}}.cta__book-now{font-size:2rem;font-weight:300;margin-bottom:2.5rem;text-transform:uppercase}.btn{position:relative;border:none;color:#fff;cursor:pointer;overflow:hidden;font-weight:300;font-size:1.5rem;border-radius:100px;text-transform:uppercase;background-image:linear-gradient(to right, var(--color-primary), var(--color-primary-dark))}.btn>*{display:inline-block;width:100%;height:100%;transition:all 200ms}.btn__visible{padding:2rem 7.5rem}.btn__invisible{position:absolute;left:0;top:-100%;padding:2rem 0}.btn:hover{background-image:linear-gradient(to left, var(--color-primary), var(--color-primary-dark))}.btn:hover .btn__visible{transform:translateY(100%)}.btn:hover .btn__invisible{top:0}.btn:focus{outline:none;animation:pulsate 1000ms infinite}/*# sourceMappingURL=main.css.map */
