@font-face {
   font-family: "Avenir";
   src: url("https://1557540.fs1.hubspotusercontent-na1.net/hubfs/1557540/Avenir-Book.otf") format("opentype");
   font-weight: 300;
}

@font-face {
   font-family: "Didot";
   src: url("https://1557540.fs1.hubspotusercontent-na1.net/hubfs/1557540/Didot%20Bold.otf") format("opentype");
   font-weight: 800;
}

html {
   /* 10px */
   font-size: 62.5%;
}

body {
   font-family: "Avenir", sans-serif;
   font-size: 1.6rem;
}

h1,
h2 {
   font-family: "Didot", serif;
   font-size: 4rem;
   font-weight: 600;
}

h3 {
   font-family: "Didot", serif;
   font-size: 3rem;
}

h5 {
   font-family: "Didot", serif;
   font-size: 3rem;
}

p {
   font-family: "Avenir", sans-serif;
   font-size: 2.4rem;
}

.head-villa-sol {
   font-size: 5rem;
   line-height: 1.0em;
}

.villa-color-1 {
   color: #3d5b6a;
}

.villa-color-2 {
   color: #595959;
}

.villa-color-3 {
   color: #ecf0ee;
}

.bg-villa-1 {
   background-color: #3d5b6a;
}

.bg-villa-2 {
   background-color: #c4d5db;
}

.bg-villa-3 {
   background-color: #dbe6e9;
}

.bg-villa-4 {
   background-color: #93aeba;
}

.bg-villa-5 {
   background-color: #e1e8e4;
}

.bg-villa-6 {
   background-color: #a4b7af;
}

.bg-villa-7 {
   background-color: #d5dfda;
}

.bg-villa-8 {
   background-color: #5e7683;
}

.bg-villa-9 {
   background-color: #b8ccd3;
}

.bg-villa-10 {
   background-color: #ecf0ee;
}

.img-logo {
   max-width: 40%;
   height: auto;
}

ul li {
   font-size: 2.4rem;
   color: #3d5b6a;
   margin-left: 3rem;
}

ul li::marker {
   color: #3d5b6a;
}

.fix-left {
   margin-left: 0rem;
}

.u-none {
   text-decoration: none;
}

.cash-img {
   max-width: 66%;
   height: auto;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {

   h1,
   h2 {
      font-size: 2.8rem;
   }

   h3 {
      font-size: 2rem;
   }

   h5 {
      font-size: 2.5rem;
   }

   .head-villa-sol {
      font-size: 2.6rem;
   }

   p {
      font-size: 2rem;
   }

   .img-logo {
      max-width: 60%;
   }

   ul li {
      font-size: 1.8rem;
      margin-left: 0rem;
   }

   .fix-left {
      margin-left: 7.5rem;
   }

   .cash-img {
      max-width: 100%;
   }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {

   h1,
   h2 {
      font-size: 3rem;
   }

   h3 {
      font-size: 2rem;
   }

   h5 {
      font-size: 2.5rem;
   }

   .head-villa-sol {
      font-size: 3rem;
   }

   p {
      font-size: 2rem;
   }

   .img-logo {
      max-width: 80%;
   }

   ul li {
      font-size: 1.8rem;
      margin-left: 0rem;
   }

   .fix-left {
      margin-left: 11rem;
   }

   .cash-img {
      max-width: 100%;
   }

}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {

   h1,
   h2 {
      font-size: 3.5;
   }

   h3 {
      font-size: 2.4rem;
   }


   h5 {
      font-size: 3rem;
   }

   .head-villa-sol {
      font-size: 5rem;
   }

   p {
      font-size: 2.2rem;
   }

   .img-logo {
      max-width: 50%;
   }

   ul li {
      font-size: 2.2rem;
      margin-left: 1rem;
   }

   .fix-left {
      margin-left: 0rem;
   }

   .cash-img {
      max-width: 100%;
   }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

   h1,
   h2 {
      font-size: 4rem;
   }

   h3 {
      font-size: 3rem;
   }


   h5 {
      font-size: 3.5rem;
   }

   .head-villa-sol {
      font-size: 6rem;
   }

   p {
      font-size: 2.4rem;
   }

   .img-logo {
      max-width: 40%;
   }

   ul li {
      font-size: 2.4rem;
      margin-left: 3rem;
   }

   .fix-left {
      margin-left: 0rem;
   }

   .cash-img {
      max-width: 66%;
   }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {

   h1,
   h2 {
      font-size: 5.2rem;
   }

   h5 {
      font-size: 3.5rem;
   }

   .head-villa-sol {
      font-size: 7rem;
   }

   p {
      font-size: 2.6rem;
   }

   .img-logo {
      max-width: 40%;
   }

   ul li {
      font-size: 2.4rem;
      margin-left: 3rem;
   }

   .fix-left {
      margin-left: 0rem;
   }

   .cash-img {
      max-width: 66%;
   }
}