:root{--color-primary: #eb2f64;--color-primary-light: #ff3366;--color-primary-dark: #ba265d;--color-gray-light-1: #faf9f9;--color-gray-light-2: #f4f2f2;--color-gray-light-3: #f0eeee;--color-gray-light-4: #ccc;--color-gray-dark-1: #333;--color-gray-dark-2: #777;--color-gray-dark-3: #999;--shadow-box: 0 2rem 6rem rgba(0, 0, 0, 0.3);--shadow-light: 0 2rem 5rem rgba(0, 0, 0, 0.06);--line: 1px solid var(--color-gray-light-2)}*{margin:0;padding:0}*,*::after,*::before{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-family:"Open Sans" sans-serif;line-height:1.4;font-weight:400;color:var(--color-gray-dark-2);background-image:linear-gradient(to right bottom, var(--color-primary-dark), var(--color-primary-light));background-size:cover;background-repeat:no-repeat}.header__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-gray-light-2)}}.search__input{font-family:inherit;font-size:inherit;color:inherit;background-color:var(--color-gray-light-2);border:none;padding:0.7rem 2rem;border-radius:10rem;width:80%;margin-right:-3.25rem;transition:width 0.2s}.search__input:focus{width:90%;outline:none;background-color:var(--color-gray-light-3)}.search__input::-webkit-input-placeholder{font-weight:100;color:var(--color-gray-light-4)}.search__button{border:none;background-color:transparent}.search__icon{width:2rem;height:2rem;fill:var(--color-gray-dark-3)}.user-nav{display:flex;align-items:center;align-self:stretch}.user-nav>*{padding:0 2rem;cursor:pointer;display:flex;align-items:center;height:100%}.user-nav>*:hover{background-color:var(--color-gray-light-3)}.user-nav__icon-box{position:relative}.user-nav__icon{width:2.25rem;height:2.25rem;fill:var(--color-gray-dark-2)}.user-nav__notification{font-size:0.8rem;background-color:var(--color-primary);padding:0.5rem;width:2rem;height:2rem;border-radius:50%;color:#fff;position:absolute;top:1.5rem;right:1rem;display:flex;justify-content:center;align-items:center}.user-nav__user-photo{height:3.75rem;border-radius:50%;margin-right:1rem}.side-nav{margin-top:3.5rem;list-style:none;font-size:1.4rem}@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:0.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:"";background-color:var(--color-primary);width:3px;height:100%;position:absolute;top:0%;left:0%;transform:scaleY(0);transition:transform 0.2s,width 0.4s cubic-bezier(1, 0, 0, 1) 0.2s,background-color 0.1s}.side-nav__item:hover:before{transform:scaleY(1);width:100%}.side-nav__item:active::before,.side-nav .active{background-color:var(--color-primary-light)}.side-nav__link{text-decoration:none;text-transform:uppercase;color:var(--color-gray-light-1);font-weight:400;display:block;padding:1.5rem 3rem;display:flex;align-items:center;position:relative;z-index:1}@media only screen and (max-width: 56.25em){.side-nav__link{justify-content:center;padding:2rem}}@media only screen and (max-width: 37.5em){.side-nav__link{flex-direction:column;padding:1rem}}.side-nav__icon{width:2rem;height:2rem;margin-right:2rem;fill:currentColor}@media only screen and (max-width: 37.5em){.side-nav__icon{margin:0;margin-bottom:0.7rem}}.legal{font-size:1.2rem;color:var(--color-gray-light-4);text-align:center;padding:2.5rem}@media only screen and (max-width: 56.25em){.legal{display:none}}.gallary{display:flex}.gallary__photo{width:100%;display:block}.overview{display:flex;background-color:#fff;align-items:center;border-bottom:var(--line)}.overview__heading{font-size:2.25rem;font-weight:300;letter-spacing:1px;text-transform:uppercase;padding:1.5rem 3rem}@media only screen and (max-width: 37.5em){.overview__heading{font-size:1.8rem;padding:1.25rem 2rem}}.overview__stars{display:flex;margin-right:auto}.overview__location{display:flex;font-size:1.2rem;align-items:center}.overview__icon-location{margin-right:0.5rem}.overview__rating{font-size:1.5rem;padding:0 2.25rem;color:#fff;background-color:var(--color-primary);align-self:stretch;margin-left:3rem;display:flex;flex-direction:column;justify-content:center;align-items:center}@media only screen and (max-width: 37.5em){.overview__rating{padding:0 1.5rem}}.overview__rating-count{font-size:0.8rem;text-transform:uppercase}@media only screen and (max-width: 37.5em){.overview__rating-count{font-size:0.5rem}}.overview__rating-avarage{margin-bottom:-3px;font-size:2.25rem;font-weight:200}@media only screen and (max-width: 37.5em){.overview__rating-avarage{font-size:1.8rem}}.overview__icon-star,.overview__icon-location{width:1.75rem;height:1.75rem;fill:var(--color-primary)}.btn-inline{border:none;background-color:transparent;border-bottom:1px solid currentColor;padding-bottom:2px;display:inline-block;color:var(--color-primary);font-size:inherit;cursor:pointer}.btn-inline span{margin-left:3px;transition:all 0.2s}.btn-inline:hover{color:var(--color-gray-dark-1)}.btn-inline:hover span{margin-left:8px}.btn-inline:focus{animation:pulstate 1s 0s infinite}@keyframes pulstate{0%{transform:scale(1)}50%{transform:scale(1.05);box-shadow:0 1rem 4rem rgba(0,0,0,0.25)}100%{transform:scale(1)}}.list{list-style:none;display:flex;flex-wrap:wrap;border-bottom:var(--line);border-top:var(--line);margin:3rem 0;padding:3rem 0}.list__item{flex:0 0 50%;margin-bottom:0.7rem}.list__item::before{content:"";display:inline-block;height:1rem;width:1rem;margin-right:0.7rem;background-image:url("../img/chevron-thin-right.svg");background-size:cover}@supports (-webkit-mask-image: url()) or (mask-image: url()){.list__item::before{background-color:var(--color-primary);-webkit-mask-image:url("../img/chevron-thin-right.svg");-webkit-mask-size:cover;mask-image:url("../img/chevron-thin-right.svg");mask-size:cover;background-image:none}}.paragraph:not(:last-of-type){margin-bottom:2rem}.recommend{font-size:1.3rem;color:var(--color-gray-dark-3);display:flex;align-items:center}.recommend__count{margin-right:auto}.recommend__friends{display:flex}.recommend__photo{box-sizing:content-box;border-radius:50%;width:4rem;height:4rem;border:2px solid white}.recommend__photo:not(:last-child){margin-right:-2rem}.review{background-color:#fff;margin-bottom:3.5rem;padding:3rem;box-shadow:var(--shadow-light);overflow:hidden;position:relative}@media only screen and (max-width: 56.25em){.review{padding:2rem;margin-bottom:3rem}}.review__text{margin-bottom:1.5rem;z-index:2;position:relative}.review__user{display:flex;align-items:center}.review__user-box{margin-right:auto}.review__user-name{font-size:1.1rem;color:var(--color-gray-dark-2);text-transform:uppercase;font-weight:400;margin-bottom:0.4rem}.review__user-date{font-size:1rem;color:var(--color-gray-dark-2);font-weight:100}.review__rating{font-size:2rem;color:var(--color-primary);font-weight:300}.review__photo{width:4.5rem;height:4.5rem;border-radius:50%;margin-right:1.5rem}.review::before{content:"\201C";display:block;font-size:20rem;position:absolute;top:-7rem;left:-1rem;color:var(--color-gray-light-3);font-family:sans-serif;z-index:1}.cta{padding:3.5rem 0;text-align:center;text-transform:uppercase;background-color:var(--color-gray-light-1)}@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}.btn{text-transform:uppercase;border:none;font-size:1.5rem;font-weight:300;border-radius:100px;color:#fff;cursor:pointer;background:linear-gradient(to right, var(--color-primary-light), var(--color-primary-dark));position:relative;overflow:hidden}.btn>*{display:inline-block;height:100%;width:100%;transition:all 0.2s}.btn__visiable{padding:2rem 7.5rem}.btn__invisiable{padding:2rem 0;position:absolute;left:0%;top:-100%}.btn:hover{background:linear-gradient(to left, var(--color-primary-light), var(--color-primary-dark))}.btn:hover .btn__visiable{transform:translateY(100%)}.btn:hover .btn__invisiable{top:0}.btn:focus{animation:pulstate 1s infinite}:root{--color-primary: #eb2f64;--color-primary-light: #ff3366;--color-primary-dark: #ba265d;--color-gray-light-1: #faf9f9;--color-gray-light-2: #f4f2f2;--color-gray-light-3: #f0eeee;--color-gray-light-4: #ccc;--color-gray-dark-1: #333;--color-gray-dark-2: #777;--color-gray-dark-3: #999;--shadow-box: 0 2rem 6rem rgba(0, 0, 0, 0.3);--shadow-light: 0 2rem 5rem rgba(0, 0, 0, 0.06);--line: 1px solid var(--color-gray-light-2)}*{margin:0;padding:0}*,*::after,*::before{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-family:"Open Sans" sans-serif;line-height:1.4;font-weight:400;color:var(--color-gray-dark-2);background-image:linear-gradient(to right bottom, var(--color-primary-dark), var(--color-primary-light));background-size:cover;background-repeat:no-repeat}.container{max-width:120rem;margin:8rem auto;background-color:var(--color-gray-light-2);box-shadow:var(--shadow-box)}@media only screen and (max-width: 75em){.container{margin:0;max-width:100%;width:100%}}.container .header{font-size:1.4rem;height:7rem;background-color:#fff;border-bottom:var(--line);display:flex;justify-content:space-between;align-items:center}@media only screen and (max-width: 31.25em){.container .header{flex-wrap:wrap;align-content:space-around;height:11rem}}.container .content{display:flex}@media only screen and (max-width: 56.25em){.container .content{flex-direction:column}}.container .content .sidebar{display:flex;flex-direction:column;justify-content:space-between;flex:0 0 20%;background-color:var(--color-gray-dark-1)}.container .content .hotel-view{flex:1}.container .detail{display:flex;padding:4.5rem;font-size:1.4rem}@media only screen and (max-width: 56.25em){.container .detail{padding:3rem}}@media only screen and (max-width: 37.5em){.container .detail{flex-direction:column}}.container .description{flex:0 0 60%;background-color:#fff;margin-right:4.5rem;border-bottom:var(--line);box-shadow:var(--shadow-light);padding:3rem}@media only screen and (max-width: 56.25em){.container .description{padding:2rem;margin-right:3rem}}@media only screen and (max-width: 37.5em){.container .description{margin-bottom:3rem;margin-right:0}}.container .user-reviews{flex:1;display:flex;flex-direction:column;align-items:center}
