/* Fonts */ @import url("@/assets/fonts/StapelS/style.css"); body { margin: 0; font-family: 'Inter', sans-serif; background-color: rgba(124, 173, 201, 1); font-size: 17px; color: white; background: black; line-height: 1.6; } *, *:before, *:after { box-sizing: border-box; } h1, h2, h3, h4, h5, h6 { margin: 0; } /* Main */ .main { width: 100%; } /* Container */ .container { width: 100%; max-width: 1920px; margin: 0 auto; } /* Intro */ .intro { width: 100%; height: 170vh; display: flex; flex-direction: column; align-items: center; padding-top: 250px; background-image: linear-gradient(to top, rgb(124, 173, 201, 1), rgb(94, 196, 242, 0.6)), url( "../../../raw/assets/images/intro.jpg"); background-size: cover; } .main { display: flex; flex-direction: column; justify-content: center; } .adv__info { display: flex; flex-direction: row; justify-content: center; } .adv__main { display: flex; flex-direction: column; justify-content: space-between; margin-right: 2%; } .adv__main__title { display: flex; flex-direction: column; } .mprice__fav { display: flex; flex-direction: row; justify-content: space-between; } .favorite { display: flex; flex-direction: row; justify-content: center; border-radius: 5px; padding: 5px; background-color: rgba(26, 137, 201, 1); } .favoritext { text-decoration: none; color: white; font-weight: 400; } .favoritextinf { text-decoration: none; color: white; font-weight: 400; display: flex; flex-direction: row; justify-content: center; } .adv__main__images { display: flex; flex-direction: column; justify-content: space-between; margin-top: 1%; } .other__images { display: flex; flex-direction: row; } .main__image { width: 728px; height: 416px; background-size: cover; background-repeat: no-repeat; transition: background 0.2s ease; } .other__images a{ margin-top: 2%; margin-right: 2%; } .other__images a > img{ margin-right: 2%; width: 220px; height: 140px; } .adv__host { display: flex; flex-direction: row; justify-content: space-between; } .adv__host__about__user { display: flex; flex-direction: column; } .username { margin: 3% 0; } .userlogo { width: 148px; height: 148px; border-radius: 50%; background: center no-repeat; background-size: cover; } .host__stat { display: flex; flex-direction: row; justify-content: space-between; margin: 3% 0; } .stat { margin-right: 2%; } .stars { display: flex; flex-direction: row; padding-bottom: 5%; } .number { width: 150px; height: 30px; display: flex; flex-direction: column; justify-content: space-around; background-color: rgba(26, 137, 201, 1); border-radius: 5px; margin: 3% 0; padding: 10% 0; } .message { width: 150px; height: 30px; background-color: rgba(26, 137, 201, 1); border-radius: 5px; margin: 3% 0; } .userlogo { margin-left: 2%; } .about__adv { display: flex; flex-direction: column; margin: 0 23%; } .about__adv__info { } .about__adv__descriptions { } .reviews { display: flex; flex-direction: column; margin: 0 23%; } .reviews__blocks { display: flex; flex-direction: column; } .review { width: 730px; height: 50px; display: flex; flex-direction: row; justify-content: space-around; align-items: center; background-color: rgba(26, 137, 201, 1); border-radius: 5px; margin: 1% 0; } .review__stars { display: flex; flex-direction: row; }