@charset "UTF-8";
/* Note to User: This CSS file is compiled by SASS. It should not be edited directly. If you are unfamiliar with SASS,you should take some time to understand its operation. If you do not understand how this file works, you will find yourself frustrated and risk your code being overwritten. */
/* Resets */
body {
  margin: 0;
  padding: 0;
}

* {
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

button:focus {
  outline: 0;
}

button {
  outline: 0;
}

button:hover {
  cursor: pointer;
}

button {
  border: none;
}

button {
  background-repeat: no-repeat;
  background-position: center;
}

section {
  overflow: hidden;
}

/*
::::::::::::::::::::::::::::::::::::::
::::::::::::: Typography :::::::::::::
::::::::::::::::::::::::::::::::::::::
*/
/*
:::::::::: Set Base Font Size ::::::::
*/
/*
:::::::::: Set Font Stacks :::::::::::
*/
/*
:::::: Color Weight Stack h1-h6 ::::::
*/
/*
:::::::: Color Weight Stack p ::::::::
*/
/*
::::::: Color Weight Stack ul ::::::::
*/
/*
:::::: Set Cite Color And Style ::::::
*/
/*
::::::::::::: Alignments :::::::::::::
*/
.center {
  text-align: center;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

/*
::::::::: Weights and Styles :::::::::
*/
.italic, i, em {
  font-style: italic;
}

.bold, b, strong {
  font-weight: bold;
}

/*
::::::::::::::::::::::::::::::::::::::
:::::::: Primary Typography ::::::::::
::::::::::::::::::::::::::::::::::::::
*/
/*
:::::::: Apply Base Font Size ::::::::
*/
body {
  font-size: 1em;
}

/*
:::: Apply Font Family, Line Heights, Colors & Weights ::::
*/
h1, .h1 {
  color: #616161;
}

h2, .h2 {
  line-height: 1.25em !important;
  color: #616161;
  font-weight: lighter !important;
}

h3, .h3 {
  line-height: 1.2em !important;
  color: #616161;
  font-weight: lighter !important;
}

h4, .h4 {
  line-height: 1.3em !important;
  color: #616161;
  font-weight: lighter !important;
}

h5, .h5 {
  line-height: 1.4em !important;
  color: #616161;
  font-weight: lighter !important;
}

h6, .h6 {
  line-height: 1.5em !important;
  color: #616161;
  font-weight: lighter !important;
}

p {
  line-height: 1.7em !important;
  color: #000;
}

dl {
  line-height: 1.7em !important;
  color: #000;
}

dt {
  text-transform: capitalize;
  color: #616161;
}

ul {
  line-height: 1.7em !important;
  color: #000;
}

cite {
  font-weight: bold;
  color: #999;
  font-style: italic !important;
}

nav#main > div {
  padding: 0;
  display: flex;
  background-image: linear-gradient(0, rgba(15, 15, 15, 0.75), rgba(15, 15, 15, 0.9));
}
nav#main div#branding {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
nav#main div#branding a {
  text-decoration: none;
}
nav#main div#branding p.casa {
  font-size: 215%;
  margin-left: 1px;
  padding: 0 !important;
  line-height: normal !important;
  letter-spacing: 2px;
  color: #f9d284;
  font-family: "Julius Sans One", sans-serif;
}
nav#main div#branding p.chiqueados {
  font-size: 340%;
  margin-left: -3px;
  letter-spacing: 3px;
  margin-bottom: 8px;
  padding: 0 !important;
  line-height: normal !important;
  color: #c7854c;
  font-family: "Julius Sans One", sans-serif;
}
nav#main div#branding p#phone {
  color: #ffffff;
  font-family: "Lato", sans-serif;
  letter-spacing: 2px;
  margin-left: 9px;
}
nav#main div#links {
  display: none;
}
nav#main div#links a {
  color: #ffffff;
  text-decoration: none;
}
nav#main div#links a:hover {
  text-decoration: underline;
}
nav#main div#navicon {
  display: none;
}

nav#sub {
  background-image: linear-gradient(0, rgba(15, 15, 15, 0.65), rgba(15, 15, 15, 0.9));
  padding: 14px 0;
}
nav#sub a {
  color: #ffffff;
  text-decoration: none;
}
nav#sub > div {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
nav#sub > div ul {
  list-style-type: none;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-size: 90%;
  width: 96%;
  max-width: 800px;
  display: flex;
  justify-content: space-between;
  color: #ffffff;
  font-family: "Lato", sans-serif;
}
nav#sub > div ul li a:hover {
  text-decoration: underline !important;
}

nav#panel {
  position: fixed;
  padding: 15px;
  top: 80px;
  left: 0;
  height: 100vh;
  width: 100%;
  display: none;
  background-image: linear-gradient(0, rgba(15, 15, 15, 0.95), #0f0f0f);
}
nav#panel ul#pages {
  margin-top: 15px;
  text-align: center;
  list-style-type: none;
  font-family: "Lato", sans-serif;
  font-size: 110%;
  letter-spacing: 2px;
  text-transform: uppercase;
}
nav#panel ul#pages a {
  color: #efefef;
  text-decoration: none;
}
nav#panel ul#pages li {
  margin-bottom: 20px;
}
nav#panel section#contact {
  border-top: 1px solid #efefef;
  font-size: 110%;
  padding-top: 15px;
  font-family: "Lato", sans-serif;
}
nav#panel section#contact a {
  color: #ffffff;
  text-decoration: none;
}
nav#panel section#contact ul {
  list-style-type: none;
}
nav#panel section#contact ul, nav#panel section#contact p {
  color: #efefef;
}

@media only screen and (max-width: 767px) {
  nav#main {
    overflow: hidden;
  }
  nav#main > div {
    padding: 8px;
    position: fixed;
    width: 100%;
    z-index: 1000;
    background-image: linear-gradient(0, rgba(15, 15, 15, 0.85), rgba(15, 15, 15, 0.9));
  }
  nav#main div#branding p.casa {
    font-size: 150%;
    margin-bottom: 2px;
  }
  nav#main div#branding p.chiqueados {
    font-size: 210%;
    margin-bottom: 0;
    margin-left: 1px;
  }
  nav#main div#branding p#phone {
    display: none;
  }
  nav#main div#navicon {
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
  nav#main div#navicon > div {
    display: flex;
    width: 40px;
    height: 40px;
    padding: 5px;
    border: 1px solid #c7642e;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    box-sizing: border-box;
  }
  nav#main div#navicon > div > p {
    color: #c7642e;
    text-align: center;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    font-size: 70%;
  }

  nav#sub {
    display: none;
  }
}
@media only screen and (min-width: 768px) {
  nav#main > div {
    padding: 15px;
  }
}
@media only screen and (min-width: 1300px) {
  nav#main > div {
    padding: 17px;
  }
  nav#main div#branding p#phone {
    display: none !important;
  }
  nav#main div#branding p.chiqueados {
    margin-bottom: 0 !important;
    font-size: 370%;
  }
  nav#main div#links {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    flex-grow: 1;
    padding-right: 20px;
  }
  nav#main div#links p {
    text-align: left;
    color: #ffffff;
    font-family: "Lato", sans-serif;
    word-spacing: 2px;
    line-height: normal !important;
    font-size: 95%;
    letter-spacing: 3px;
  }
  nav#main div#links p a {
    color: #ffffff;
    text-decoration: none;
  }
  nav#main div#links ul {
    list-style-type: none;
    text-transform: uppercase;
    letter-spacing: 4px;
    font-size: 90%;
    width: 750px;
    display: flex;
    justify-content: space-between;
    color: #ffffff;
    font-family: "Lato", sans-serif;
    margin-bottom: 24px;
  }

  nav#sub {
    display: none;
  }
}
footer#main {
  background-color: #0f0f0f;
}
footer#main ul {
  font-family: "Lato", sans-serif;
  list-style-type: none;
  color: #ffffff;
}
footer#main ul li {
  margin-bottom: 12px;
  letter-spacing: 2px;
}
footer#main ul li a {
  text-decoration: none;
  color: #ffffff;
}
footer#main section#contact p.casa {
  font-size: 180%;
  margin-left: 2px;
  margin-bottom: 5px;
  padding: 0 !important;
  line-height: normal !important;
  letter-spacing: 2px;
  color: #f9d284;
  font-family: "Julius Sans One", sans-serif;
}
footer#main section#contact p.chiqueados {
  font-size: 320%;
  margin-left: -3px;
  margin-bottom: 20px;
  letter-spacing: 2px;
  padding: 0 !important;
  line-height: normal !important;
  color: #c7854c;
  font-family: "Julius Sans One", sans-serif;
}
footer#main section#contact ul#socialAccounts {
  display: flex;
}
footer#main section#contact ul#socialAccounts li {
  flex-basis: 70px;
  padding: 8px;
}
footer#main section#contact ul#socialAccounts img {
  width: 100%;
}
footer#main section#siteMap {
  display: flex;
  justify-content: center;
  flex-direction: column;
  background-image: url("images/logo-footer.png");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
footer#main section#newsletter {
  color: #ffffff;
  font-family: "Lato", sans-serif;
}
footer#main section#newsletter input {
  width: 100%;
  border: none;
  padding: 10px;
}
footer#main section#newsletter input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
}
footer#main section#newsletter input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}
footer#main section#newsletter div.formGroup {
  padding-bottom: 1em;
}
footer#main section#newsletter h3 {
  color: #667657;
  font-size: 200%;
  text-transform: capitalize;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
footer#main section#newsletter h4 {
  color: #ffffff;
  font-size: 150%;
  text-transform: capitalize;
  margin-bottom: 10px;
  letter-spacing: 2px;
}
footer#main section#newsletter p {
  color: #ffffff;
  margin-bottom: 10px;
  font-size: 100%;
}

section#copyright {
  text-align: center;
  font-family: "Lato", sans-serif;
  background-color: #0f0f0f;
  padding: 30px 0;
}
section#copyright p {
  color: #ffffff !important;
  letter-spacing: 2px;
  line-height: normal;
  font-size: 75%;
}
section#copyright a {
  color: #ffffff;
  text-decoration: none;
}
section#copyright a:hover {
  text-decoration: underline;
}

@media only screen and (max-width: 767px) {
  footer#main {
    display: flex;
    flex-direction: column;
  }
  footer#main section {
    padding: 15px;
  }
  footer#main section#contact {
    padding-top: 25px;
  }
  footer#main section#contact p.casa {
    font-size: 170%;
    margin-left: -2px;
  }
  footer#main section#contact p.chiqueados {
    font-size: 290%;
  }
  footer#main section#siteMap {
    background-size: 70%;
  }
}
@media only screen and (min-width: 768px) {
  footer#main {
    display: flex;
    flex-direction: column;
  }
  footer#main section {
    padding: 40px;
  }
  footer#main section#siteMap {
    background-size: 40%;
  }
}
@media only screen and (min-width: 992px) {
  footer#main {
    display: grid;
    grid-auto-columns: 1fr;
    grid-template-areas: "contact siteMap" "newsletter newsletter";
  }
  footer#main section#contact {
    grid-area: contact;
  }
  footer#main section#siteMap {
    grid-area: siteMap;
    background-size: 80%;
  }
  footer#main section#newsletter {
    grid-area: newsletter;
  }
  footer#main section {
    padding: 40px;
  }
}
@media only screen and (min-width: 1200px) {
  footer#main {
    grid-template-areas: "contact siteMap newsletter";
  }
}
main#home {
  display: flex;
  flex-direction: column;
}
main#home section#hero {
  order: 1;
}
main#home section#mobileHero {
  order: 1;
}
main#home section#casaDeLosChiqueados {
  order: 2;
}
main#home section#welcomeMap {
  order: 3;
}
main#home section#guestBook {
  order: 4;
}
main#home section#mobileHero {
  display: none;
}
main#home section#welcomeMap {
  padding: 2.5em 0;
  background-color: #413b3b;
}
main#home section#welcomeMap .wrap {
  width: 96%;
  max-width: 1600px;
  display: flex;
  flex-direction: column;
  margin: auto;
}
main#home section#welcomeMap .wrap article:first-child {
  margin-bottom: 30px;
}
@media only screen and (min-width: 1100px) {
  main#home section#welcomeMap .wrap article:first-child {
    padding-right: 30px;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 1100px) {
  main#home section#welcomeMap .wrap {
    flex-direction: row;
  }
  main#home section#welcomeMap .wrap article {
    width: 50%;
  }
}
main#home section#welcomeMap a {
  color: #ffffff;
}
main#home section#welcomeMap iframe {
  padding: 8px;
  outline: 1px solid #a8a8a8;
}
main#home section#welcomeMap h1 {
  font-family: "Julius Sans One", sans-serif;
  font-size: 200% !important;
  color: #f9d284;
  font-weight: lighter;
  margin-bottom: 10px;
}
@media only screen and (min-width: 768px) {
  main#home section#welcomeMap h1 {
    font-size: 300% !important;
  }
}
main#home section#welcomeMap h2 {
  font-family: "Lato", sans-serif;
  font-size: 150% !important;
  color: #c7854c;
  font-weight: lighter;
  margin-bottom: 20px;
  letter-spacing: 1px;
}
@media only screen and (min-width: 768px) {
  main#home section#welcomeMap h2 {
    font-size: 185% !important;
  }
}
main#home section#welcomeMap p {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  letter-spacing: 1px;
  color: #ffffff;
  margin-bottom: 15px;
}
main#home section#welcomeMap ul {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  letter-spacing: 1px;
  color: #ffffff;
  list-style-type: none;
}

section#guestBook {
  background-color: #f8f8f8;
}
section#guestBook h3 {
  font-family: "Julius Sans One", sans-serif;
  margin-bottom: 20px;
}
section#guestBook div.image img {
  border: 10px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
  width: 100%;
}
section#guestBook div.theTestimonial::before {
  content: "“";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 40px auto 10px auto;
}
section#guestBook div.theTestimonial::after {
  content: "”";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 35px auto 0 auto;
}
section#guestBook div.testimonial {
  flex-basis: 70%;
  padding: 0 50px;
  display: flex;
  align-content: center;
  justify-content: center;
  flex-direction: column;
  background-color: #ececec;
}
section#guestBook div.testimonial div.theTestimonial {
  margin-bottom: 10px;
}
section#guestBook div.testimonial div.theTestimonial p {
  font-size: 100%;
  color: #292929;
  line-height: 2em !important;
}
section#guestBook div.testimonial div.theAttribution {
  margin-bottom: 20px;
}
section#guestBook div.testimonial div.theAttribution p {
  font-family: "Lato", sans-serif;
  font-size: 110%;
  letter-spacing: 1px;
}
section#guestBook div.more {
  display: table;
  font-family: "Lato", sans-serif;
  background-color: #667657;
  text-align: center;
  margin: auto;
  padding: 16px;
  letter-spacing: 3px;
}
section#guestBook div.more p {
  color: #ffffff !important;
  font-size: 130%;
  line-height: normal !important;
}
section#guestBook div.more a {
  color: #ffffff;
  text-decoration: none;
}
section#guestBook div.more a:hover {
  text-decoration: underline;
}

@media (max-width: 414px) {
  main#home section#mobileHero {
    background-image: url("images/homeHero-mobile.jpg") !important;
  }
}
@media only screen and (max-width: 767px) {
  main#home section#mobileHero {
    display: block;
    background-image: url("images/homeHero-small.jpg");
    background-color: #0f0f0f;
    background-position: 50% 50%;
    height: 450px;
    background-repeat: no-repeat;
  }
  main#home section#guestBook {
    padding: 12px;
  }
  main#home section#guestBook h3 {
    font-size: 200%;
    text-align: center;
  }
  main#home section#guestBook div.wrap {
    display: flex;
    flex-direction: column;
  }
  main#home section#guestBook div.image {
    padding: 20px;
  }
  main#home section#guestBook div.image img {
    width: 80%;
    max-width: 400px;
    margin: auto;
    display: block;
  }
  main#home section#guestBook div.testimonial {
    padding: 20px;
  }
}
@media only screen and (min-width: 768px) {
  main#home section#hero {
    background-image: url("images/homeHero.jpg");
    background-size: cover;
    background-color: #0f0f0f;
    background-position: 50% 65%;
    height: 800px;
    background-repeat: no-repeat;
  }
  main#home section#guestBook {
    padding: 12px;
  }
  main#home section#guestBook h3 {
    font-size: 200%;
    text-align: center;
  }
  main#home section#guestBook div.wrap {
    display: flex;
    flex-direction: column;
  }
  main#home section#guestBook div.image {
    padding: 20px;
  }
  main#home section#guestBook div.image img {
    width: 80%;
    max-width: 400px;
    margin: auto;
    display: block;
  }
  main#home section#guestBook div.testimonial {
    padding: 20px;
  }
}
@media only screen and (min-width: 1100px) {
  main#home section#guestBook .wrap {
    display: flex;
    flex-direction: row !important;
  }
  main#home section#guestBook h3 {
    font-size: 250%;
    text-align: left;
  }
  main#home section#guestBook div.image {
    flex-basis: 40%;
  }
  main#home section#guestBook div.testimonial {
    flex-basis: 60%;
    padding: 40px 40px;
  }
}
@media only screen and (min-width: 1200px) {
  main#home section#guestBook div.image {
    flex-basis: 30%;
  }
  main#home section#guestBook div.testimonial {
    flex-basis: 70%;
  }
}
@media only screen and (min-width: 1300px) {
  main#home section#guestBook {
    padding: 50px 50px 50px 0;
  }
}
div.figureStyle1 {
  background-color: #ffffff;
  background-image: linear-gradient(#efefef, #efefef);
  background-repeat: no-repeat;
  display: flex;
  flex-direction: column;
  background-position: 0 50px;
}
div.figureStyle1 img {
  width: 90%;
  max-width: 800px;
  display: block;
  margin: auto;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
}

@media only screen and (min-width: 1200px) {
  div.figureStyle1 {
    flex-direction: row;
  }
  div.figureStyle1 img {
    width: 100%;
    margin: 0 !important;
  }
  div.figureStyle1 div.image {
    flex-basis: 55%;
    padding-bottom: 25px;
  }
  div.figureStyle1 div.copy {
    flex-basis: 45%;
    padding-top: 25px;
  }

  div.figureStyle1:nth-child(odd) {
    background-position: 25px 25px !important;
  }
  div.figureStyle1:nth-child(odd) div.image {
    order: 1;
  }
  div.figureStyle1:nth-child(odd) div.copy {
    order: 2;
  }

  div.figureStyle1:nth-child(even) {
    background-position: -25px 25px;
  }
  div.figureStyle1:nth-child(even) div.image {
    order: 2;
  }
  div.figureStyle1:nth-child(even) div.copy {
    order: 1;
  }
}
body.confirmation {
  background-image: url("images/bronze-among-the-olive-trees.jpeg");
  background-size: cover;
  background-repeat: no-repeat;
}

main#confirmation {
  padding: 40px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 400px;
}
main#confirmation h2, main#confirmation h3 {
  text-align: center;
}
main#confirmation h2 {
  margin-bottom: 20px;
  font-family: "Julius Sans One", sans-serif;
  font-size: 200%;
}
main#confirmation h3 {
  margin-bottom: 20px;
  text-transform: uppercase;
  font-family: "Lato", sans-serif;
  letter-spacing: 2px;
  font-size: 120%;
}
main#confirmation h6 {
  font-family: "Lato", sans-serif;
  font-size: 125%;
  color: #1b1e21;
  letter-spacing: 1px;
}
main#confirmation p {
  font-family: "Lato", sans-serif;
  font-size: 110%;
  color: #343434;
  letter-spacing: 1px;
}
main#confirmation > div {
  background-color: #f0f0f0;
  border: 12px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
  flex-grow: 0;
}
main#confirmation div.confirm, main#confirmation div.edit {
  width: 80%;
  margin: auto;
  text-align: center;
  padding: 10px;
}
main#confirmation div.confirm {
  margin-top: 15px;
  background-color: #667657;
  letter-spacing: 2px;
}
main#confirmation div.confirm a {
  color: #ffffff;
  text-decoration: none;
}
main#confirmation div.confirm a:hover {
  text-decoration: underline;
}
main#confirmation div.edit {
  margin-top: 15px;
}
main#confirmation div.edit a {
  color: #1d1d1d;
  text-decoration: none;
}
main#confirmation div.edit a:hover {
  text-decoration: underline;
}
main#confirmation form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
main#confirmation form div.formGroup {
  margin-bottom: 10px;
}
main#confirmation form input[type=text], main#confirmation form input[type=date] {
  border: 1px solid #d0d0d0;
  padding: 10px;
}
main#confirmation form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
main#confirmation form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}
main#confirmation form textarea {
  width: 100%;
  padding: 10px;
  height: 100px;
}
main#confirmation form div.specialEvent {
  display: flex;
  padding: 20px 0;
  margin-bottom: 0 !important;
}
main#confirmation form div.specialEvent label {
  font-size: 110%;
}
main#confirmation form div.specialEvent > div {
  display: flex;
  align-content: center;
}
main#confirmation form div.specialEvent > div p {
  font-size: 110% !important;
}
main#confirmation form div.specialEvent > div input {
  width: 12px !important;
}
main#confirmation form div.propertyId {
  display: flex;
}
main#confirmation form div.propertyId select {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  main#confirmation {
    padding-top: 7em;
  }
  main#confirmation > div {
    width: 90%;
    padding: 10px;
  }
  main#confirmation div.specialEvent {
    flex-direction: column;
  }
  main#confirmation div.specialEvent label {
    margin-bottom: 15px;
    flex-basis: 100%;
  }
  main#confirmation div.specialEvent > div {
    justify-content: flex-start;
    margin-bottom: 18px;
    flex-basis: 50%;
  }
  main#confirmation div.firstAndLastName, main#confirmation div.phoneAndEmail, main#confirmation div.datesOfStay, main#confirmation div.residence {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: 1fr;
    margin-bottom: 15px;
  }
  main#confirmation div.firstAndLastName label, main#confirmation div.phoneAndEmail label, main#confirmation div.datesOfStay label, main#confirmation div.residence label {
    display: inline-block;
    width: 100%;
    margin-bottom: 2px;
  }
  main#confirmation div.firstAndLastName input, main#confirmation div.phoneAndEmail input, main#confirmation div.datesOfStay input, main#confirmation div.residence input {
    width: 100%;
  }
  main#confirmation div.nameToAppear, main#confirmation div.cityState, main#confirmation div.theTestimonial, main#confirmation div.emailAddress, main#confirmation div.name {
    margin-bottom: 15px !important;
  }
  main#confirmation div.nameToAppear label, main#confirmation div.cityState label, main#confirmation div.theTestimonial label, main#confirmation div.emailAddress label, main#confirmation div.name label {
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
  }
  main#confirmation div.nameToAppear input, main#confirmation div.cityState input, main#confirmation div.theTestimonial input, main#confirmation div.emailAddress input, main#confirmation div.name input {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  main#confirmation > div {
    max-width: 700px;
    padding: 20px;
  }

  div.firstAndLastName, div.phoneAndEmail, div.datesOfStay, div.residence {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 15px;
  }
  div.firstAndLastName input, div.phoneAndEmail input, div.datesOfStay input, div.residence input {
    width: 100%;
  }

  div.specialEvent {
    flex-direction: row;
  }
  div.specialEvent label {
    flex-grow: 1;
  }
  div.specialEvent > div {
    padding-right: 10px;
    align-items: center;
    align-content: center;
  }
  div.specialEvent > div input {
    margin-right: 5px;
  }

  div.nameToAppear, div.cityState, div.theTestimonial, div.emailAddress, div.name {
    margin-bottom: 15px !important;
  }
  div.nameToAppear label, div.cityState label, div.theTestimonial label, div.emailAddress label, div.name label {
    display: inline-block;
    width: 100%;
    margin-bottom: 5px;
  }
  div.nameToAppear input, div.cityState input, div.theTestimonial input, div.emailAddress input, div.name input {
    width: 100%;
  }
}
main.page section#hero {
  display: flex;
  background-size: cover;
  background-position: 50% 50%;
  justify-content: center;
  align-items: center;
}
main.page section#hero div.headlines {
  width: 96%;
  max-width: 430px;
  font-family: "Lato", sans-serif;
  background-color: rgba(49, 43, 43, 0.84);
  padding: 12px;
}
main.page section#hero div.headlines h1 {
  color: #ffffff;
  margin: 0 auto 0 auto !important;
  padding: 0 !important;
  letter-spacing: 7px;
  text-transform: uppercase;
  text-align: center;
  font-weight: lighter !important;
}
main.page section#hero div.headlines h1:last-child {
  margin-bottom: 0 !important;
}
main.page section#hero div.headlines h2 {
  color: #ffffff;
  font-size: 145%;
  text-align: center;
  font-weight: lighter !important;
  line-height: 1.5em !important;
  letter-spacing: 1px;
}
main.page section#hero div.headlines h4 {
  color: #ffffff;
  padding: 0 !important;
  letter-spacing: 3px;
  margin: 0 auto 5px auto !important;
  text-align: center;
}
main.page section#hero div.headlines p {
  text-align: center;
  color: #ffffff;
  font-size: 100% !important;
}
main.page section#hero div.headlines ul {
  display: flex;
  list-style-type: none;
  align-content: space-between;
  color: #ffffff;
}
main.page section#hero div.headlines ul li {
  text-align: center;
  flex-grow: 1;
  letter-spacing: 2px;
}
main.page section#hero div.cta button {
  padding: 10px;
}
main.page nav#main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
main.page section#amenities {
  background-color: #efefef;
}
main.page section#amenities h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
}
main.page section#amenities h3 {
  font-family: "Lato", sans-serif;
  text-align: center;
}
main.page section#amenities h4 {
  font-family: "Lato", sans-serif;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 2px;
}
main.page section#amenities > div {
  display: flex;
}
main.page section#amenities div#amenitiesList {
  display: flex;
  justify-content: center;
  align-items: center;
}
main.page section#amenities div#amenitiesList ul {
  font-family: "Lato", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #343434;
  list-style-type: none;
  margin-bottom: 3em;
}
main.page section#amenities div#amenitiesList li {
  margin-bottom: 14px;
  line-height: normal;
  display: flex;
}
main.page section#amenities div#amenitiesList li:last-child {
  margin-bottom: 0 !important;
}
main.page section#amenities div#amenitiesList li::before {
  margin-right: 4px;
  content: "➤";
  font-size: 80%;
  color: #adadad;
}
main.page section#amenities div#terraza {
  display: flex;
  flex-direction: column;
  align-content: space-around;
}
main.page section#amenities div#terraza > div {
  background-color: #ffffff;
}
main.page section#theProperty {
  background-color: #f8f8f8;
}
main.page section#theProperty > div {
  display: flex;
}
main.page section#theProperty article {
  display: flex;
  background-color: #f0f0f0;
  justify-content: center;
  align-items: center;
}
main.page section#theProperty article h3 {
  font-family: "Julius Sans One", sans-serif;
}
main.page section#theProperty article div.theTestimonial p {
  color: #292929;
}
main.page section#theProperty article div.theAttribution {
  font-family: "Lato", sans-serif;
}
main.page section#theProperty aside {
  display: grid;
  background-color: #54687d;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, auto);
  font-family: "Lato", sans-serif;
}
main.page section#theProperty aside ul {
  list-style-type: none;
}
main.page section#theProperty aside #image {
  grid-area: 1/1/7/9;
  background-color: #ffffff;
}
main.page section#theProperty aside #data {
  grid-area: 3/7/7/13;
  background-color: #c7c425;
  padding: 2em;
}
main.page section#map {
  display: flex;
}
main.page section#map iframe {
  width: 100%;
}
main.page section#map > div {
  padding: 20px;
  flex-basis: 50%;
}
main.page section#photoGallery {
  background-color: #ffffff;
}
main.page section#photoGallery h2 {
  text-align: center;
  font-family: "Julius Sans One", sans-serif;
}
main.page div.more {
  padding: 16px;
  display: table;
  margin: auto;
  background-color: #667657;
  font-family: "Lato", sans-serif;
  text-align: center;
  letter-spacing: 2px;
}
main.page div.more a {
  color: #ffffff;
  text-decoration: none;
}
main.page div.more a:hover {
  text-decoration: underline;
}
main.page div.more p {
  color: #ffffff;
  font-size: 110%;
}

@media only screen and (max-width: 767px) {
  main.page section#hero {
    height: 450px;
  }
  main.page section#hero div.headlines {
    margin-top: 80px;
  }
  main.page section#hero div.headlines h1 {
    font-size: 16px;
  }
  main.page section#hero div.headlines h3 {
    font-size: 140%;
    margin-bottom: 12px !important;
  }
  main.page section#hero div.headlines h4 {
    font-size: 115%;
    margin-bottom: 12px !important;
  }
  main.page section#hero div.headlines ul {
    font-size: 100%;
  }
  main.page section#photoGallery {
    padding-top: 16px;
  }
  main.page section#photoGallery h2 {
    font-size: 220%;
  }
  main.page section#amenities {
    padding: 16px;
  }
  main.page section#amenities h2 {
    font-size: 200%;
    margin-bottom: 16px;
  }
  main.page section#amenities h3 {
    margin-bottom: 16px;
    line-height: 30px !important;
  }
  main.page section#amenities h4 {
    font-size: 90%;
    margin-bottom: 16px;
  }
  main.page section#amenities > div {
    flex-direction: column;
  }
  main.page section#amenities div#amenitiesList ul {
    color: #ffffff;
    background-color: #667657;
    padding: 14px;
    margin-bottom: 16px;
  }
  main.page section#map {
    flex-direction: column;
  }
  main.page section#map > div {
    flex-basis: 100% !important;
  }
  main.page section#map div#testimonial h3 {
    font-size: 200%;
    text-align: center;
    margin-bottom: 16px;
  }
  main.page section#map div#testimonial div.theTestimonial {
    margin-bottom: 16px;
  }
  main.page section#map div#testimonial div.theTestimonial p {
    font-size: 100%;
  }
  main.page section#map div#testimonial div.theAttribution {
    margin-bottom: 16px;
  }
  main.page section#map div#testimonial div.theAttribution p {
    font-size: 110%;
    letter-spacing: 1px;
  }
}
@media only screen and (min-width: 768px) {
  main.page section#hero {
    height: 700px;
  }
  main.page section#hero div.headlines {
    margin-top: 150px;
  }
  main.page section#hero div.headlines h1 {
    font-size: 18px;
  }
  main.page section#hero div.headlines h4 {
    font-size: 120%;
  }
  main.page section#hero div.headlines ul {
    font-size: 115%;
  }
  main.page section#photoGallery {
    padding-top: 20px;
  }
  main.page section#photoGallery h2 {
    font-size: 290%;
    margin-bottom: 20px;
  }
  main.page section#amenities {
    padding: 20px;
  }
  main.page section#amenities h2 {
    font-size: 260%;
    margin-bottom: 8px;
  }
  main.page section#amenities h3 {
    font-size: 150%;
    margin-bottom: calc(20px * 2);
    line-height: 40px !important;
  }
  main.page section#amenities h4 {
    font-size: 90%;
  }
  main.page section#amenities > div {
    flex-direction: column;
  }
  main.page section#amenities > div > div {
    margin-bottom: 20px;
  }
  main.page section#amenities div#terraza {
    padding: 1em 2em;
  }
  main.page section#map {
    flex-direction: column;
  }
  main.page section#map > div {
    flex-basis: 100% !important;
  }
  main.page section#map div#testimonial h3 {
    font-size: 200%;
    text-align: center;
    margin-bottom: 20px;
  }
  main.page section#map div#testimonial div.theTestimonial {
    margin-bottom: 20px;
  }
  main.page section#map div#testimonial div.theTestimonial p {
    font-size: 105%;
    line-height: 2em !important;
  }
  main.page section#map div#testimonial div.theAttribution {
    margin-bottom: 20px;
  }
  main.page section#map div#testimonial div.theAttribution p {
    font-size: 110%;
    letter-spacing: 1px;
  }
}
@media only screen and (min-width: 1100px) {
  main.page section#theProperty article h3 {
    font-size: 250%;
    text-align: left;
  }
  main.page section#map {
    flex-direction: row;
  }
  main.page section#map iframe {
    width: 100%;
  }
  main.page section#map > div {
    flex-basis: 50% !important;
  }
  main.page section#map div#testimonial {
    padding: 2em;
  }
  main.page section#map div#testimonial h3 {
    font-size: 250%;
    text-align: left;
  }
}
@media only screen and (min-width: 1200px) {
  main.page section#guestBook div.image {
    flex-basis: 30%;
  }
  main.page section#guestBook div.testimonial {
    flex-basis: 70%;
  }
}
@media only screen and (min-width: 1300px) {
  main.page section#guestBook {
    padding: 50px 50px 50px 0;
  }
  main.page section#guestBook img {
    margin-left: 30px;
  }
  main.page section#map div#testimonial {
    padding: 4em;
  }
}
section#photoGallery div.galleryStyle1 {
  padding: 12px;
  grid-gap: 12px;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, 1fr);
  margin: auto;
  display: none;
}
section#photoGallery div.galleryStyle1 img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section#photoGallery div.galleryStyle1 > div {
  background-color: #eaeaea;
}
section#photoGallery div.galleryStyle1 #div-1 {
  grid-area: 1/1/5/5;
}
section#photoGallery div.galleryStyle1 #div-2 {
  grid-area: 5/1/9/5;
}
section#photoGallery div.galleryStyle1 #div-3 {
  grid-area: 9/1/13/3;
}
section#photoGallery div.galleryStyle1 #div-4 {
  grid-area: 9/3/13/5;
}
section#photoGallery div.galleryStyle1 #div-5 {
  grid-area: 1/5/7/8;
}
section#photoGallery div.galleryStyle1 #div-6 {
  grid-area: 7/5/13/8;
}
section#photoGallery div.galleryStyle1 #div-7 {
  grid-area: 1/8/5/10;
}
section#photoGallery div.galleryStyle1 #div-8 {
  grid-area: 1/10/5/13;
}
section#photoGallery div.galleryStyle1 #div-9 {
  grid-area: 5/8/10/13;
}
section#photoGallery div.galleryStyle1 #div-10 {
  grid-area: 10/8/13/11;
}
section#photoGallery div.galleryStyle1 #div-11 {
  grid-area: 10/11/13/13;
}
section#photoGallery div.galleryStyle1 #div-12 {
  grid-area: 10/12/13/13;
}
section#photoGallery div.galleryStyle2 {
  width: 88%;
  margin: 12px auto;
  display: grid;
  grid-gap: 12px;
  grid-template-columns: repeat(4, 1fr);
}
section#photoGallery div.galleryStyle2 img {
  width: 100%;
  display: block;
}
section#photoGallery div.galleryStyle2 a {
  display: inline-block;
  line-height: normal;
}
section#photoGallery div.galleryStyle2 > div {
  margin: 0 !important;
  padding: 0 !important;
}
section#photoGallery div.mobileGallery {
  display: grid;
}

div#terrazaPhotoGrid {
  margin: 1em 0;
  display: grid;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.1);
  width: 100%;
}
div#terrazaPhotoGrid img {
  width: 100%;
  height: auto;
  display: block;
}

@media only screen and (max-width: 400px) {
  section#photoGallery div.mobileGallery {
    padding: 6px;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 6px;
  }

  div#terrazaPhotoGrid {
    padding: 6px;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 6px;
  }
}
@media only screen and (min-width: 401px) {
  section#photoGallery div.mobileGallery {
    padding: 6px;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 6px;
  }

  div#terrazaPhotoGrid {
    padding: 6px;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 6px;
  }
}
@media only screen and (min-width: 768px) {
  section#photoGallery div.mobileGallery {
    display: none;
  }
  section#photoGallery div.galleryStyle1 {
    width: 98%;
    display: grid;
  }

  div#terrazaPhotoGrid {
    padding: 6px;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 6px;
  }
}
@media only screen and (min-width: 992px) {
  div#terrazaPhotoGrid {
    padding: 6px;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 6px;
  }
}
@media only screen and (min-width: 1100px) {
  section#photoGallery div.galleryStyle1 {
    width: 96%;
    max-width: 1350px;
  }
}
@media only screen and (min-width: 1200px) {
  div#terrazaPhotoGrid {
    padding: 6px;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 6px;
  }
}
main.property section#hero {
  display: flex;
  background-size: cover;
  background-position: 50% 50%;
  justify-content: center;
  align-items: center;
}
main.property section#hero div.headlines {
  width: 96%;
  max-width: 600px;
  font-family: "Lato", sans-serif;
  background-color: rgba(49, 43, 43, 0.75);
}
main.property section#hero div.headlines h3 {
  color: #ffffff;
  margin: 0 auto 5px auto !important;
  padding: 16px 0 0 0 !important;
  letter-spacing: 7px;
  text-transform: uppercase;
  text-align: center;
}
main.property section#hero div.headlines h4 {
  color: #ffffff;
  padding: 0 !important;
  letter-spacing: 3px;
  margin: 0 auto 5px auto !important;
  text-align: center;
}
main.property section#hero div.headlines h6 {
  color: #ffffff;
  padding: 0 !important;
  letter-spacing: 3px;
  margin: 8px auto 15px auto !important;
  text-align: center;
  font-size: 95% !important;
}
main.property section#hero div.headlines ul {
  display: flex;
  list-style-type: none;
  align-content: space-between;
  color: #ffffff;
}
main.property section#hero div.headlines ul a {
  color: #ffffff;
}
main.property section#hero div.headlines ul li {
  text-align: center;
  flex-grow: 1;
  letter-spacing: 2px;
}
main.property section#hero div.headlines div#reserveNow {
  padding: 12px;
  letter-spacing: 2px;
  background-color: #b37548;
  font-size: 130%;
}
main.property section#hero div.headlines div#reserveNow a {
  color: #ffffff;
  text-decoration: none;
}
main.property section#hero div.headlines div#reserveNow a:hover {
  text-decoration: underline;
}
main.property section#hero div.headlines div#reserveNow p {
  text-align: center;
  text-transform: uppercase;
}
main.property nav#main {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
main.property section#amenities {
  background-color: #efefef;
}
main.property section#amenities h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
}
main.property section#amenities h3 {
  font-family: "Lato", sans-serif;
  text-align: center;
}
main.property section#amenities h4 {
  font-family: "Lato", sans-serif;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 2px;
}
main.property section#amenities > div {
  display: flex;
}
main.property section#amenities div#amenitiesList {
  display: flex;
  justify-content: center;
  align-items: center;
}
main.property section#amenities div#amenitiesList ul {
  font-family: "Lato", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #343434;
  list-style-type: none;
  margin-bottom: 3em;
}
main.property section#amenities div#amenitiesList li {
  margin-bottom: 14px;
  line-height: normal;
  display: flex;
  align-items: center;
}
main.property section#amenities div#amenitiesList li:last-child {
  margin-bottom: 0 !important;
}
main.property section#amenities div#amenitiesList li::before {
  margin-right: 4px;
  content: "➤";
  font-size: 80%;
  color: #adadad;
}
main.property section#amenities div#terraza {
  display: flex;
  flex-direction: column;
  align-content: space-around;
}
main.property section#amenities div#terraza > div {
  background-color: #ffffff;
}
main.property section#theProperty {
  background-color: #f8f8f8;
}
main.property section#theProperty > div {
  display: flex;
}
main.property section#theProperty article {
  display: flex;
  background-color: #f0f0f0;
  justify-content: center;
  align-items: center;
}
main.property section#theProperty article h3 {
  font-family: "Julius Sans One", sans-serif;
}
main.property section#theProperty article div.theTestimonial p {
  color: #292929;
}
main.property section#theProperty article div.theAttribution {
  font-family: "Lato", sans-serif;
}
main.property section#theProperty aside {
  display: grid;
  background-color: #54687d;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(12, auto);
  font-family: "Lato", sans-serif;
}
main.property section#theProperty aside ul {
  list-style-type: none;
}
main.property section#theProperty aside #image {
  grid-area: 1/1/7/9;
  background-color: #ffffff;
}
main.property section#theProperty aside #data {
  grid-area: 3/7/7/13;
  background-color: #c7c425;
  padding: 2em;
}
main.property section#map {
  display: flex;
  flex-wrap: wrap;
}
main.property section#map iframe {
  width: 100%;
}
main.property section#map > div {
  padding: 20px;
  flex-basis: 50%;
}
main.property section#map nav#moreChiqueados {
  display: none;
  flex-direction: column;
  flex-basis: 100% !important;
  padding: 20px;
}
main.property section#map nav#moreChiqueados h2 {
  font-family: "Lato", sans-serif;
  text-align: center;
}
main.property section#map nav#moreChiqueados ul {
  display: flex;
  list-style-type: none;
  font-family: "Lato", sans-serif;
  justify-content: space-around;
  width: 80%;
  margin: auto;
}
main.property section#map nav#moreChiqueados ul a {
  text-decoration: none;
}
main.property section#map nav#moreChiqueados ul a:hover {
  text-decoration: underline;
}
main.property section#photoGallery {
  background-color: #ffffff;
}
main.property section#photoGallery h2 {
  text-align: center;
  font-family: "Julius Sans One", sans-serif;
}
main.property section#photoGallery h3 {
  text-align: center;
  font-family: "Lato", sans-serif;
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-bottom: 20px;
  font-size: 90%;
}
main.property div#testimonial {
  display: flex;
  background-color: #f0f0f0;
  justify-content: center;
  align-items: center;
}
main.property div#testimonial h3 {
  font-family: "Julius Sans One", sans-serif;
}
main.property div#testimonial div.theTestimonial p {
  color: #292929;
}
main.property div#testimonial div.theAttribution {
  font-family: "Lato", sans-serif;
}
main.property div#testimonial div.more {
  padding: 16px;
  display: table;
  margin: auto;
  background-color: #667657;
  font-family: "Lato", sans-serif;
  text-align: center;
  letter-spacing: 2px;
}
main.property div#testimonial div.more a {
  color: #ffffff;
  text-decoration: none;
}
main.property div#testimonial div.more a:hover {
  text-decoration: underline;
}
main.property div#testimonial div.more p {
  color: #ffffff;
  font-size: 110%;
}
main.property div.theTestimonial::before {
  content: "“";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 40px auto 10px auto;
}
main.property div.theTestimonial::after {
  content: "”";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 35px auto 0 auto;
}
main.property div.more {
  padding: 16px;
  display: table;
  margin: auto;
  background-color: #667657;
  font-family: "Lato", sans-serif;
  text-align: center;
  letter-spacing: 2px;
}
main.property div.more a {
  color: #ffffff;
  text-decoration: none;
}
main.property div.more a:hover {
  text-decoration: underline;
}
main.property div.more p {
  color: #ffffff;
  font-size: 110%;
}

@media only screen and (max-width: 767px) {
  main.property section#hero {
    height: 450px;
  }
  main.property section#hero div.headlines {
    margin-top: 80px;
  }
  main.property section#hero div.headlines h3 {
    font-size: 140%;
    margin-bottom: 12px !important;
  }
  main.property section#hero div.headlines h4 {
    font-size: 115%;
    margin-bottom: 12px !important;
  }
  main.property section#hero div.headlines ul {
    font-size: 100%;
  }
  main.property section#photoGallery {
    padding-top: 16px;
  }
  main.property section#photoGallery h2 {
    font-size: 220%;
  }
  main.property section#amenities {
    padding: 16px;
  }
  main.property section#amenities h2 {
    font-size: 200%;
    margin-bottom: 16px;
  }
  main.property section#amenities h3 {
    margin-bottom: 16px;
    line-height: 30px !important;
  }
  main.property section#amenities h4 {
    font-size: 90%;
    margin-bottom: 16px;
  }
  main.property section#amenities > div {
    flex-direction: column;
  }
  main.property section#amenities div#amenitiesList ul {
    color: #ffffff;
    background-color: #667657;
    padding: 25px 14px;
    margin-bottom: 16px;
  }
  main.property section#amenities div#amenitiesList ul li {
    margin-bottom: 20px;
    align-items: flex-start;
  }
  main.property section#map {
    flex-direction: column;
  }
  main.property section#map > div {
    flex-basis: 100% !important;
  }
  main.property section#map div#testimonial h3 {
    font-size: 200%;
    text-align: center;
    margin-bottom: 16px;
  }
  main.property section#map div#testimonial div.theTestimonial {
    margin-bottom: 16px;
  }
  main.property section#map div#testimonial div.theTestimonial p {
    font-size: 100%;
  }
  main.property section#map div#testimonial div.theAttribution {
    margin-bottom: 16px;
  }
  main.property section#map div#testimonial div.theAttribution p {
    font-size: 110%;
    letter-spacing: 1px;
  }
}
@media only screen and (min-width: 768px) {
  main.property section#hero {
    height: 700px;
  }
  main.property section#hero div.headlines {
    margin-top: 150px;
  }
  main.property section#hero div.headlines h3 {
    font-size: 160%;
  }
  main.property section#hero div.headlines h4 {
    font-size: 120%;
  }
  main.property section#hero div.headlines ul {
    font-size: 115%;
  }
  main.property section#photoGallery {
    padding-top: 20px;
  }
  main.property section#photoGallery h2 {
    font-size: 290%;
    margin-bottom: 4px;
  }
  main.property section#amenities {
    padding: 20px;
  }
  main.property section#amenities h2 {
    font-size: 260%;
    margin-bottom: 8px;
  }
  main.property section#amenities h3 {
    font-size: 150%;
    margin-bottom: calc(20px * 2);
    line-height: 40px !important;
  }
  main.property section#amenities h4 {
    font-size: 90%;
  }
  main.property section#amenities > div {
    flex-direction: column;
  }
  main.property section#amenities > div > div {
    margin-bottom: 20px;
  }
  main.property section#amenities div#terraza {
    padding: 1em 2em;
  }
  main.property section#map {
    flex-direction: column;
  }
  main.property section#map > div {
    flex-basis: 100% !important;
  }
  main.property section#map div#testimonial h3 {
    font-size: 200%;
    text-align: center;
    margin-bottom: 20px;
  }
  main.property section#map div#testimonial div.theTestimonial {
    margin-bottom: 20px;
  }
  main.property section#map div#testimonial div.theTestimonial p {
    font-size: 100%;
    line-height: 2em !important;
  }
  main.property section#map div#testimonial div.theAttribution {
    margin-bottom: 20px;
  }
  main.property section#map div#testimonial div.theAttribution p {
    font-size: 110%;
    letter-spacing: 1px;
  }
}
@media only screen and (min-width: 1100px) {
  main.property section#theProperty article h3 {
    font-size: 250%;
    text-align: left;
  }
  main.property section#map {
    flex-direction: row;
  }
  main.property section#map iframe {
    width: 100%;
  }
  main.property section#map > div {
    flex-basis: 50% !important;
  }
  main.property section#map div#testimonial {
    padding: 2em;
  }
  main.property section#map div#testimonial h3 {
    font-size: 250%;
    text-align: left;
  }
}
@media only screen and (min-width: 1200px) {
  main.property section#amenities > div {
    flex-direction: row;
  }
  main.property section#amenities > div div#amenitiesList {
    flex-basis: 45%;
  }
  main.property section#amenities > div div#terraza {
    flex-basis: 55%;
  }
}
@media only screen and (min-width: 1300px) {
  main.property section#hero {
    height: 800px;
  }
  main.property section#map div#testimonial {
    padding: 4em;
  }
}
section#casaDeLosChiqueados h2, section#townhouses h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
}
section#casaDeLosChiqueados h3, section#townhouses h3 {
  text-align: center;
  font-family: "Lato", sans-serif;
}
section#casaDeLosChiqueados h4, section#townhouses h4 {
  text-align: center;
  font-family: "Lato", sans-serif;
}
section#casaDeLosChiqueados img, section#townhouses img {
  width: 100%;
  display: block;
}
section#casaDeLosChiqueados div.rates a, section#townhouses div.rates a {
  color: #ffffff;
}
section#casaDeLosChiqueados div.rates ul, section#townhouses div.rates ul {
  max-width: 625px;
  color: #ffffff;
  display: flex;
  flex-direction: row;
  align-content: space-between;
  list-style-type: none;
  margin: 0 auto 15px auto;
}
section#casaDeLosChiqueados div.rates ul li, section#townhouses div.rates ul li {
  text-align: center;
  flex-grow: 1;
  letter-spacing: 2px;
  padding: 0 20px;
}
section#casaDeLosChiqueados div.info, section#townhouses div.info {
  background-color: #413b3b;
  font-family: "Lato", sans-serif !important;
  padding: 12px 0;
  border-top: 1px solid #565050;
}
section#casaDeLosChiqueados div.info h3, section#townhouses div.info h3 {
  color: #ffffff;
  margin: 0 auto 12px auto !important;
  padding: 0 !important;
  letter-spacing: 7px;
  text-transform: uppercase;
  text-align: center;
}
section#casaDeLosChiqueados div.info h3 a, section#townhouses div.info h3 a {
  color: #ffffff;
  text-decoration: none;
}
section#casaDeLosChiqueados div.info h3 a:hover, section#townhouses div.info h3 a:hover {
  text-decoration: underline;
}
section#casaDeLosChiqueados div.info h4, section#townhouses div.info h4 {
  color: #ffffff;
  padding: 0 10px !important;
  letter-spacing: 3px;
  margin: 0 auto 10px auto !important;
  text-align: center;
}
section#casaDeLosChiqueados div.moreInfo, section#townhouses div.moreInfo {
  text-align: center;
  font-weight: bold;
}
section#casaDeLosChiqueados div.moreInfo a, section#townhouses div.moreInfo a {
  color: #ffffff;
  text-decoration: none;
}
section#casaDeLosChiqueados div.moreInfo a:hover, section#townhouses div.moreInfo a:hover {
  text-decoration: underline;
}
section#casaDeLosChiqueados div.moreInfo p, section#townhouses div.moreInfo p {
  display: inline-block;
  padding: 0 0 10px 0;
  letter-spacing: 2px;
}
section#casaDeLosChiqueados ul.reserveNow, section#townhouses ul.reserveNow {
  display: flex;
  flex-direction: column;
  list-style-type: none;
  margin: 0 16px;
}
@media only screen and (min-width: 600px) {
  section#casaDeLosChiqueados ul.reserveNow, section#townhouses ul.reserveNow {
    flex-direction: row;
  }
}
section#casaDeLosChiqueados ul.reserveNow a, section#townhouses ul.reserveNow a {
  text-decoration: none;
  color: #ffffff;
}
section#casaDeLosChiqueados ul.reserveNow a:hover, section#townhouses ul.reserveNow a:hover {
  text-decoration: underline;
}
section#casaDeLosChiqueados ul.reserveNow li, section#townhouses ul.reserveNow li {
  text-align: center;
  flex-grow: 1;
  letter-spacing: 3px;
  padding: 5px 20px;
  text-transform: uppercase;
}
section#casaDeLosChiqueados ul.reserveNow li.information, section#townhouses ul.reserveNow li.information {
  border: 1px solid #ffffff;
  margin-bottom: 16px;
}
@media only screen and (min-width: 600px) {
  section#casaDeLosChiqueados ul.reserveNow li.information, section#townhouses ul.reserveNow li.information {
    margin-right: 8px;
    margin-bottom: 0 !important;
  }
}
section#casaDeLosChiqueados ul.reserveNow li.reservation, section#townhouses ul.reserveNow li.reservation {
  border: 1px solid #ffffff;
  background-color: #b37548;
}
@media only screen and (min-width: 600px) {
  section#casaDeLosChiqueados ul.reserveNow li.reservation, section#townhouses ul.reserveNow li.reservation {
    margin-left: 8px;
  }
}

section#sisterProperties {
  padding: 2em 0;
}
section#sisterProperties div.wrap {
  width: 90%;
  margin: auto;
  display: flex !important;
  flex-direction: column-reverse !important;
}
@media only screen and (min-width: 1300px) {
  section#sisterProperties div.wrap {
    flex-direction: row !important;
  }
}
@media only screen and (min-width: 1300px) {
  section#sisterProperties div#copy {
    flex-basis: 60%;
    padding-right: 3em;
  }
}
section#sisterProperties div#photo {
  padding-bottom: 1.5em;
}
@media only screen and (min-width: 1300px) {
  section#sisterProperties div#photo {
    flex-basis: 40%;
    padding-bottom: 0;
  }
}
section#sisterProperties div#photo img {
  width: 100%;
  margin: auto;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
}
section#sisterProperties h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
}
section#sisterProperties h3 {
  text-align: center;
  font-family: "Lato", sans-serif;
}
section#sisterProperties h4 {
  text-align: center;
  font-family: "Lato", sans-serif;
  margin-bottom: 2em !important;
}
section#sisterProperties p {
  font-family: "Lato", sans-serif;
  font-size: 120%;
  color: #616161;
  margin-bottom: 0.65em;
}
section#sisterProperties ul.moreInfo {
  list-style-type: none;
  display: flex;
  margin-top: 40px;
  flex-direction: column !important;
}
@media only screen and (min-width: 600px) {
  section#sisterProperties ul.moreInfo {
    flex-direction: row !important;
  }
}
section#sisterProperties ul.moreInfo a {
  color: #ffffff;
  text-decoration: none;
}
section#sisterProperties ul.moreInfo a:hover {
  text-decoration: underline;
}
section#sisterProperties ul.moreInfo li {
  flex-basis: 50%;
  text-align: center;
  text-transform: uppercase;
  color: #ffffff;
  letter-spacing: 3px;
  font-family: "Lato", sans-serif !important;
  padding: 12px 0;
  margin: 0 6px;
}
section#sisterProperties ul.moreInfo li.information {
  background-color: #413b3b;
  margin-bottom: 10px;
}
@media only screen and (min-width: 600px) {
  section#sisterProperties ul.moreInfo li.information {
    margin-bottom: 0px;
  }
}
section#sisterProperties ul.moreInfo li.reservation {
  background-color: #b37548;
}

@media only screen and (max-width: 767px) {
  section#casaDeLosChiqueados {
    padding-top: 12px;
  }
  section#casaDeLosChiqueados h2 {
    font-size: 210%;
    margin-bottom: 10px;
  }
  section#casaDeLosChiqueados h2 + h3 {
    font-size: 120%;
  }
  section#casaDeLosChiqueados h3 {
    font-size: 150%;
    margin-bottom: 20px;
    line-height: 28px !important;
  }
  section#casaDeLosChiqueados h4 {
    font-size: 105%;
    margin-bottom: 12px;
    font-weight: lighter !important;
    line-height: 28px !important;
    padding: 0 10px 0 10px;
  }
  section#casaDeLosChiqueados div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#casaDeLosChiqueados article {
    padding-bottom: 12px;
  }

  section#townhouses h2 {
    font-size: 210%;
    margin-bottom: 10px;
    padding: 0 10px 0 10px;
  }
  section#townhouses h2 + h3 {
    font-size: 120%;
  }
  section#townhouses h3 {
    font-size: 150%;
    margin-bottom: 20px;
    line-height: 28px !important;
  }
  section#townhouses h4 {
    font-size: 105%;
    margin-bottom: 12px;
    font-weight: lighter !important;
    line-height: 28px !important;
    padding: 0 10px 0 10px;
  }
  section#townhouses div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#townhouses article {
    padding-bottom: 12px;
  }

  section#sisterProperties h2 {
    font-size: 210%;
    margin-bottom: 10px;
    padding: 0 10px 0 10px;
  }
  section#sisterProperties h2 + h3 {
    font-size: 120%;
  }
  section#sisterProperties h3 {
    font-size: 150%;
    margin-bottom: 20px;
    line-height: 28px !important;
  }
  section#sisterProperties h4 {
    font-size: 105%;
    margin-bottom: 12px;
    font-weight: lighter !important;
    line-height: 28px !important;
    padding: 0 10px 0 10px;
  }
  section#sisterProperties div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#sisterProperties article {
    padding-bottom: 12px;
  }
}
@media only screen and (min-width: 768px) {
  section#casaDeLosChiqueados {
    padding-top: 12px;
  }
  section#casaDeLosChiqueados h2 {
    font-size: 300%;
    margin-bottom: 10px;
    margin-top: 12px;
  }
  section#casaDeLosChiqueados h3 {
    font-size: 145%;
    margin-bottom: 20px;
  }
  section#casaDeLosChiqueados h4 {
    font-size: 110%;
    margin-bottom: calc(12px + 5px);
  }
  section#casaDeLosChiqueados div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#casaDeLosChiqueados article {
    padding-bottom: 12px;
  }

  section#townhouses h2 {
    font-size: 300%;
    margin-bottom: 10px;
    margin-top: 12px;
  }
  section#townhouses h3 {
    font-size: 150%;
    margin-bottom: 20px;
  }
  section#townhouses h4 {
    font-size: 110%;
    margin-bottom: calc(12px + 5px);
  }
  section#townhouses div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#townhouses article {
    padding-bottom: 12px;
  }

  section#sisterProperties h2 {
    font-size: 300%;
    margin-bottom: 10px;
    margin-top: 12px;
  }
  section#sisterProperties h3 {
    font-size: 150%;
    margin-bottom: 20px;
  }
  section#sisterProperties h4 {
    font-size: 110%;
    margin-bottom: calc(12px + 5px);
  }
  section#sisterProperties div.wrap {
    display: flex;
    flex-direction: column;
    padding: 12px;
  }
  section#sisterProperties article {
    padding-bottom: 12px;
  }
}
@media only screen and (min-width: 992px) {
  section#townhouses div.wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#townhouses div.wrap article {
    padding-bottom: 0 !important;
  }

  section#casaDeLosChiqueados div.wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#casaDeLosChiqueados div.wrap article {
    padding-bottom: 0 !important;
  }

  section#sisterProperties div.wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#sisterProperties div.wrap article {
    padding-bottom: 0 !important;
  }
}
@media only screen and (min-width: 1300px) {
  section#townhouses div.wrap {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#townhouses div.wrap article {
    padding: 0 !important;
    margin-bottom: 0 !important;
  }

  section#casaDeLosChiqueados div.wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#casaDeLosChiqueados div.wrap article {
    padding: 0 !important;
  }

  section#sisterProperties div.wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 12px;
    padding: 12px;
  }
  section#sisterProperties div.wrap article {
    padding: 0 !important;
  }
}
section#reservation {
  padding: 40px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("images/bronze-among-the-olive-trees.jpeg");
  background-size: cover;
  background-repeat: no-repeat;
}
section#reservation h2, section#reservation h3 {
  text-align: center;
}
section#reservation h2 {
  font-family: "Julius Sans One", sans-serif;
}
section#reservation h3 {
  margin-bottom: 20px;
  text-transform: uppercase;
  font-family: "Lato", sans-serif;
  letter-spacing: 2px;
  font-size: 120%;
  margin-top: -10px;
}
section#reservation > div {
  background-color: #f0f0f0;
  border: 12px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
  flex-grow: 0;
}
section#reservation form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
section#reservation form div.formGroup {
  margin-bottom: 10px;
}
section#reservation form input[type=text], section#reservation form input[type=date] {
  border: 1px solid #d0d0d0;
  padding: 10px;
}
section#reservation form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
section#reservation form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}
section#reservation form select {
  font-size: 120% !important;
  background-color: #667657;
  box-shadow: 0 1px 0 1px rgba(0, 0, 0, 0.04);
  letter-spacing: 1px;
  border: none;
  padding: 8px;
  color: #ffffff;
  background-image: url("images/down_arrow.svg");
  background-repeat: no-repeat, repeat;
  background-position: right 0.7em top 50%, 0 0;
  background-size: 1em auto, 100%;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}
section#reservation form select::-ms-expand {
  display: none;
}
section#reservation form textarea {
  width: 100%;
  padding: 10px;
}
section#reservation form div.specialEvent {
  display: flex;
  padding: 20px 0;
}
section#reservation form div.specialEvent label {
  flex-grow: 1;
  font-size: 110%;
}
section#reservation form div.specialEvent > div {
  padding: 0;
  display: flex;
  justify-content: center;
  align-content: center;
}
section#reservation form div.specialEvent > div p {
  font-size: 110% !important;
}
section#reservation form div.specialEvent > div input {
  width: 12px !important;
  margin-right: 10px !important;
}
section#reservation form div.propertyId {
  display: flex;
}
section#reservation form div.propertyId select {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  section#reservation {
    padding: 10px 0;
  }
  section#reservation > div {
    padding: 10px;
    width: 92%;
  }
  section#reservation form div.specialEvent {
    flex-direction: column;
  }
  section#reservation form div.specialEvent label {
    margin-bottom: 15px;
  }
  section#reservation form div.specialEvent > div {
    justify-content: flex-start;
    margin-bottom: 18px;
  }
  section#reservation form div.propertyId {
    flex-direction: column;
    margin-bottom: 20px;
  }
  section#reservation form div.propertyId label {
    margin-bottom: 8px;
  }
  section#reservation form div.firstAndLastName, section#reservation form div.phoneAndEmail, section#reservation form div.datesOfStay {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: 1fr;
    margin-bottom: 15px;
  }
  section#reservation form div.firstAndLastName label, section#reservation form div.phoneAndEmail label, section#reservation form div.datesOfStay label {
    display: inline-block;
    width: 100%;
    margin-bottom: 2px;
  }
  section#reservation form div.firstAndLastName input, section#reservation form div.phoneAndEmail input, section#reservation form div.datesOfStay input {
    width: 100%;
  }
  section#reservation h2 {
    font-size: 200%;
    margin-bottom: 10px;
  }
}
@media only screen and (min-width: 768px) {
  section#reservation {
    padding: 20px 0;
  }
  section#reservation > div {
    padding: 20px;
  }
  section#reservation form div.specialEvent {
    flex-direction: row;
    flex-wrap: wrap;
  }
  section#reservation form div.specialEvent label {
    margin-bottom: 15px;
    width: 100%;
  }
  section#reservation form div.specialEvent > div {
    justify-content: flex-start;
    margin-bottom: 18px;
    width: 70px;
  }
  section#reservation form div.propertyId {
    flex-direction: column;
    margin-bottom: 20px;
  }
  section#reservation form div.propertyId label {
    margin-bottom: 8px;
  }
  section#reservation form div.firstAndLastName, section#reservation form div.phoneAndEmail, section#reservation form div.datesOfStay {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: 1fr;
    margin-bottom: 15px;
  }
  section#reservation form div.firstAndLastName label, section#reservation form div.phoneAndEmail label, section#reservation form div.datesOfStay label {
    display: inline-block;
    width: 100%;
    margin-bottom: 2px;
  }
  section#reservation form div.firstAndLastName input, section#reservation form div.phoneAndEmail input, section#reservation form div.datesOfStay input {
    width: 100%;
  }
  section#reservation h2 {
    font-size: 260%;
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 1100px) {
  section#reservation form div.firstAndLastName, section#reservation form div.phoneAndEmail, section#reservation form div.datesOfStay {
    display: grid;
    grid-gap: 15px;
    grid-template-columns: repeat(2, 1fr);
    margin-bottom: 15px;
  }
  section#reservation form div.firstAndLastName label, section#reservation form div.phoneAndEmail label, section#reservation form div.datesOfStay label {
    display: inline-block;
    width: 100%;
    margin-bottom: 2px;
  }
  section#reservation form div.firstAndLastName input, section#reservation form div.phoneAndEmail input, section#reservation form div.datesOfStay input {
    width: 100%;
  }
}
main#overlay {
  background-color: rgba(0, 0, 0, 0.8);
  height: 100vh;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 20000;
}
main#overlay div.theTestimonial::before {
  display: none !important;
}
main#overlay div.theTestimonial::after {
  display: none !important;
}
main#overlay button {
  margin: auto;
  display: block !important;
  background-color: transparent;
  padding: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
}
main#overlay h2, main#overlay h3 {
  text-align: center;
}
main#overlay h2 {
  margin-bottom: 20px;
  font-family: "Julius Sans One", sans-serif;
  font-size: 200%;
}
main#overlay h3 {
  margin-bottom: 20px;
  text-transform: uppercase;
  font-family: "Lato", sans-serif;
  letter-spacing: 2px;
  font-size: 120%;
}
main#overlay h6 {
  font-family: "Lato", sans-serif;
  font-size: 125%;
  color: #1b1e21;
  letter-spacing: 1px;
}
main#overlay > div {
  width: 90%;
  max-width: 600px;
  background-color: #ffffff;
  box-shadow: 0px 0px 15px 5px rgba(0, 0, 0, 0.5);
}
main#overlay > div > div {
  padding: 15px;
  background-color: #efefef;
  margin: 15px;
}
main#overlay form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
main#overlay form div.formGroup {
  margin-bottom: 10px;
}
main#overlay form div.formGroup * {
  width: 100%;
}
main#overlay form input[type=text], main#overlay form input[type=date] {
  border: 1px solid #d0d0d0;
  padding: 10px;
}
main#overlay form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
main#overlay form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}
main#overlay form textarea {
  width: 100%;
  padding: 10px;
  height: 220px;
  font-size: 125% !important;
  resize: vertical;
}
main#overlay form button#cancelGuestbookEntry:hover {
  text-decoration: underline;
}

main#guestbook {
  padding-bottom: 2em;
}
main#guestbook section#featuredTestimonials {
  width: 96%;
  max-width: 600px;
}
main#guestbook section#featuredTestimonials > div {
  background-color: rgba(49, 43, 43, 0.84);
  padding: 20px;
  color: #ffffff !important;
}
main#guestbook section#featuredTestimonials > div p {
  color: #ffffff;
  margin-bottom: 0 !important;
}
main#guestbook section#testimonials {
  padding-top: 20px;
}
main#guestbook section#testimonials > div {
  width: 80%;
  max-width: 700px;
  margin: auto;
}
main#guestbook div.theTestimonial {
  margin-bottom: 5px;
}
main#guestbook div.theTestimonial p {
  font-size: 100%;
  color: #343434;
  line-height: 2em !important;
}
main#guestbook div.theAttribution p {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  letter-spacing: 1px;
  margin-bottom: 80px;
}
main#guestbook button.createGuestbookEntry {
  width: 100%;
  margin: auto;
  display: block;
  background-color: #667657;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 18px !important;
  letter-spacing: 5px;
  padding: 10px;
  line-height: normal;
  border: none;
}
main#guestbook button:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
}
main#guestbook div.cta {
  width: 96%;
  margin-top: 15px;
}

section#guestbookHero {
  display: flex;
  flex-direction: column;
  background-size: cover;
  background-position: 50% 50%;
  justify-content: center;
  align-items: center;
}
section#guestbookHero > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
section#guestbookHero div.headlines {
  width: 96%;
  max-width: 600px;
  font-family: "Lato", sans-serif;
  background-color: rgba(49, 43, 43, 0.84);
  padding: 12px;
}
section#guestbookHero div.headlines h1 {
  color: #ffffff;
  margin: auto !important;
  padding: 0 !important;
  letter-spacing: 7px;
  text-transform: uppercase;
  text-align: center;
  font-weight: lighter !important;
  line-height: 1.5em !important;
}
section#guestbookHero div.headlines h3 {
  color: #ffffff;
  margin: 0 auto 5px auto !important;
  padding: 0 !important;
  letter-spacing: 7px;
  text-transform: uppercase;
  text-align: center;
}
section#guestbookHero div.headlines h4 {
  color: #ffffff;
  padding: 0 !important;
  letter-spacing: 3px;
  margin: 0 auto 5px auto !important;
  text-align: center;
}
section#guestbookHero div.headlines ul {
  display: flex;
  list-style-type: none;
  align-content: space-between;
  color: #ffffff;
}
section#guestbookHero div.headlines ul li {
  text-align: center;
  flex-grow: 1;
  letter-spacing: 2px;
}
section#guestbookHero button.createGuestbookEntry {
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.5);
}

@media only screen and (max-width: 767px) {
  section#guestbookHero div.headlines {
    margin-top: 80px;
  }
  section#guestbookHero div.headlines h1 {
    font-size: 16px;
  }
  section#guestbookHero div.headlines h3 {
    font-size: 140%;
    margin-bottom: 12px !important;
  }
  section#guestbookHero div.headlines h4 {
    font-size: 115%;
    margin-bottom: 12px !important;
  }
  section#guestbookHero div.headlines ul {
    font-size: 100%;
  }
}
@media only screen and (min-width: 768px) {
  section#guestbookHero div.headlines {
    margin-top: 150px;
  }
  section#guestbookHero div.headlines h1 {
    font-size: 18px;
  }
  section#guestbookHero div.headlines h4 {
    font-size: 120%;
  }
  section#guestbookHero div.headlines ul {
    font-size: 115%;
  }
}
main#login {
  background-image: url("../css/images/bronze-among-the-olive-trees.jpeg");
  background-size: 100%;
  background-repeat: no-repeat;
}
main#login div.formErrors {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  letter-spacing: 2px;
}
main#login div.formErrors i {
  color: darkred;
  padding: 5px;
}
main#login div.formErrors div {
  flex-grow: 1;
  padding: 10px;
  color: #1b1e21;
}
main#login div.formErrors ul {
  flex-basis: 100%;
  list-style-type: none;
  font-size: 95%;
  margin: 10px 0;
  padding: 10px;
  background-color: darkred;
  color: #ffffff;
}
main#login > section {
  font-family: "Lato", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}
main#login > section > div {
  margin-top: 10%;
  margin-bottom: 10%;
  width: 98%;
  max-width: 400px;
  padding: 1em;
  background-color: #f0f0f0;
  border: 12px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
}
main#login form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
main#login form div.formGroup {
  margin-bottom: 20px;
}
main#login form div#button {
  margin-bottom: 20px;
}
main#login form label {
  display: block;
  width: 100%;
  font-size: 90%;
  margin-bottom: 5px;
  color: #1b1e21;
  letter-spacing: 2px;
  text-transform: uppercase;
}
main#login form input[type=text], main#login form input[type=password] {
  border: 1px solid #d0d0d0;
  padding: 10px;
  width: 100%;
}
main#login form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
main#login form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}
main#login p.forgotPassword {
  text-align: center;
  text-transform: uppercase;
  font-size: 80%;
  letter-spacing: 2px;
}
main#login p.forgotPassword a {
  text-decoration: none;
  color: #1b1e21;
}
main#login p.forgotPassword a:hover {
  text-decoration: underline;
}

body.hidden-scroll {
  overflow: hidden;
}

.sl-overlay {
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #141414;
  opacity: 0.8;
  display: none;
  z-index: 1035;
}

.sl-wrapper {
  z-index: 1040;
}
.sl-wrapper button {
  border: 0 none;
  background: transparent;
  font-size: 28px;
  padding: 0;
  cursor: pointer;
}
.sl-wrapper button:hover {
  opacity: 0.7;
}
.sl-wrapper .sl-close {
  display: none;
  position: fixed;
  right: 30px;
  top: 30px;
  z-index: 10060;
  margin-top: -14px;
  margin-right: -14px;
  height: 44px;
  width: 44px;
  line-height: 44px;
  font-family: "Julius Sans One", sans-serif;
  color: #fcfcfc;
  font-size: 3rem;
}
.sl-wrapper .sl-close:focus {
  outline: none;
}
.sl-wrapper .sl-counter {
  display: none;
  position: fixed;
  top: 30px;
  left: 30px;
  z-index: 1060;
  color: #fcfcfc;
  font-size: 1rem;
  font-family: "Lato", sans-serif !important;
}
.sl-wrapper .sl-navigation {
  width: 100%;
  display: none;
}
.sl-wrapper .sl-navigation button {
  position: fixed;
  top: 50%;
  margin-top: -22px;
  height: 44px;
  width: 22px;
  line-height: 44px;
  text-align: center;
  display: block;
  z-index: 10060;
  font-family: "Julius Sans One", sans-serif;
  color: #fcfcfc;
}
.sl-wrapper .sl-navigation button.sl-next {
  right: 5px;
  font-size: 2rem;
}
.sl-wrapper .sl-navigation button.sl-prev {
  left: 5px;
  font-size: 2rem;
}
.sl-wrapper .sl-navigation button:focus {
  outline: none;
}
@media (min-width: 35.5em) {
  .sl-wrapper .sl-navigation button {
    width: 44px;
  }
  .sl-wrapper .sl-navigation button.sl-next {
    right: 10px;
    font-size: 3rem;
  }
  .sl-wrapper .sl-navigation button.sl-prev {
    left: 10px;
    font-size: 3rem;
  }
}
@media (min-width: 50em) {
  .sl-wrapper .sl-navigation button {
    width: 44px;
  }
  .sl-wrapper .sl-navigation button.sl-next {
    right: 20px;
    font-size: 3rem;
  }
  .sl-wrapper .sl-navigation button.sl-prev {
    left: 20px;
    font-size: 3rem;
  }
}
.sl-wrapper .sl-image {
  position: fixed;
  -ms-touch-action: none;
  touch-action: none;
  z-index: 10000;
}
.sl-wrapper .sl-image img {
  margin: 0;
  padding: 0;
  display: block;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
  width: 100%;
  height: auto;
  border: 12px solid #ffffff;
}
@media (min-width: 35.5em) {
  .sl-wrapper .sl-image img {
    border: 6px solid #ffffff;
  }
}
@media (min-width: 50em) {
  .sl-wrapper .sl-image img {
    border: 12px solid #ffffff;
  }
}
.sl-wrapper .sl-image iframe {
  background: #000;
  border: 0 none;
}
@media (min-width: 35.5em) {
  .sl-wrapper .sl-image iframe {
    border: 0 none;
  }
}
@media (min-width: 50em) {
  .sl-wrapper .sl-image iframe {
    border: 0 none;
  }
}
.sl-wrapper .sl-image .sl-caption {
  display: none;
  padding: 10px;
  color: #fff;
  background: rgba(0, 0, 0, 0.8);
  font-size: 1rem;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}
.sl-wrapper .sl-image .sl-caption.pos-top {
  bottom: auto;
  top: 0;
}
.sl-wrapper .sl-image .sl-caption.pos-outside {
  bottom: auto;
}
.sl-wrapper .sl-image .sl-download {
  display: none;
  position: absolute;
  bottom: 5px;
  right: 5px;
  color: #fcfcfc;
  z-index: 1060;
}

.sl-spinner {
  display: none;
  border: 5px solid #333;
  border-radius: 40px;
  height: 40px;
  left: 50%;
  margin: -20px 0 0 -20px;
  opacity: 0;
  position: fixed;
  top: 50%;
  width: 40px;
  z-index: 1007;
  -webkit-animation: pulsate 1s ease-out infinite;
  -moz-animation: pulsate 1s ease-out infinite;
  -ms-animation: pulsate 1s ease-out infinite;
  -o-animation: pulsate 1s ease-out infinite;
  animation: pulsate 1s ease-out infinite;
}

.sl-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}

.sl-transition {
  transition: -moz-transform ease 200ms;
  transition: -ms-transform ease 200ms;
  transition: -o-transform ease 200ms;
  transition: -webkit-transform ease 200ms;
  transition: transform ease 200ms;
}

@-webkit-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2);
    opacity: 0;
  }
}
@keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2);
    opacity: 0;
  }
}
@-moz-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2);
    opacity: 0;
  }
}
@-o-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2);
    opacity: 0;
  }
}
@-ms-keyframes pulsate {
  0% {
    transform: scale(0.1);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.2);
    opacity: 0;
  }
}
main#amenities section#hero {
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
}

section#amenitiesGrid {
  padding-top: 50px;
}
section#amenitiesGrid > div {
  width: 90%;
  max-width: 1400px;
  margin: 0 auto 50px auto;
}

article.amenities {
  padding: 50px;
}
article.amenities h3 {
  font-size: 180% !important;
  font-family: "Julius Sans One", sans-serif !important;
  line-height: normal !important;
  margin-bottom: 15px;
}
article.amenities ul {
  font-family: "Lato", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #343434;
  list-style-type: none;
  margin-bottom: 3em;
}
article.amenities li {
  margin-bottom: 14px;
  line-height: normal;
  display: flex;
  align-items: center;
}
article.amenities li:last-child {
  margin-bottom: 0 !important;
}
article.amenities li::before {
  margin-right: 4px;
  content: "➤";
  font-size: 80%;
  color: #adadad;
}

main#about div.figureStyle1 {
  min-height: 555px;
  margin: 2em auto;
  width: 90%;
  background-image: linear-gradient(#eeeeee, #f8f8f8) !important;
  max-width: 1400px;
}
main#about div.figureStyle1 div.image {
  position: relative;
}
main#about div.figureStyle1 figure {
  max-width: 800px;
  margin: auto;
  box-sizing: border-box;
}
main#about div.figureStyle1 figure img {
  max-width: 800px;
}
main#about div.figureStyle1 figcaption {
  background-color: #423c3c;
  padding: 15px;
}
main#about div.figureStyle1 figcaption p {
  font-size: 100% !important;
  text-align: center;
  margin: 0 !important;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #ffffff;
  line-height: 1.5em;
}
main#about div.copy {
  display: flex;
  justify-content: center;
}
main#about div.copy h2 {
  font-size: 200% !important;
  margin-bottom: 20px !important;
}
main#about div.copy h3 {
  margin-bottom: 20px !important;
}
main#about div.copy h4 {
  font-size: 120%;
}
main#about div.copy article > p {
  line-height: 2em !important;
}
main#about section.content > article {
  padding-top: 2em;
}
main#about section.content > article a {
  color: #343434;
}
main#about section.content > article p {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  margin-bottom: 1.4em;
}
main#about section.content > article h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
  margin-bottom: 10px;
  letter-spacing: 1px;
}
main#about section.content > article h3 {
  font-family: "Lato", sans-serif;
  text-align: center;
  letter-spacing: 2px;
  text-transform: uppercase;
}
main#about section.content > article h4 {
  font-family: "Lato", sans-serif;
}
main#about figure.slide img {
  position: absolute;
}
main#about section#headlineTicker {
  background-image: url("/images/ticker-bg.jpeg");
  height: 550px;
  background-position: 100% 50%;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
}
main#about section#headlineTicker > div {
  background-color: rgba(49, 43, 43, 0.84);
  display: flex;
  flex-direction: column;
}
main#about section#headlineTicker h6 {
  text-align: center;
  color: #ffffff;
  font-family: "Julius Sans One", sans-serif;
  text-transform: uppercase;
  letter-spacing: 5px;
  font-weight: lighter !important;
}
main#about section#headlineTicker ul.ticker {
  list-style-type: none;
  font-family: "Julius Sans One", sans-serif;
  color: #ffffff;
  text-align: center;
  position: relative;
}
main#about section#headlineTicker ul.ticker li {
  position: absolute;
  width: 100%;
  display: block;
  text-align: center;
  letter-spacing: 5px;
}

@media only screen and (max-width: 767px) {
  main#about section.content > article h2 {
    font-size: 200%;
    padding: 0 10px;
  }
  main#about section.content > article h3 {
    font-size: 110%;
    padding: 0 30px;
  }
  main#about div.copy {
    padding: 20px;
  }
  main#about div.figureStyle1 figcaption {
    width: 90%;
    margin: auto;
  }
  main#about div.figureStyle1 figcaption p {
    font-size: 90% !important;
  }

  section#headlineTicker > div {
    flex-basis: 90%;
    padding: 10px 0;
  }
  section#headlineTicker h6 {
    font-size: 110%;
    margin-top: 30px;
  }
  section#headlineTicker ul.ticker {
    font-size: 140%;
    line-height: normal !important;
    margin-bottom: 20px;
    height: 100% !important;
  }
  section#headlineTicker ul.ticker li {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 768px) {
  section#headlineTicker > div {
    flex-basis: 80%;
    padding: 15px 0;
  }
  section#headlineTicker h6 {
    font-size: 150%;
    margin-top: 40px;
  }
  section#headlineTicker ul.ticker {
    font-size: 190%;
    line-height: normal !important;
  }

  main#about section.content > article h2 {
    font-size: 300%;
    padding: 0 20px;
  }
  main#about section.content > article h3 {
    font-size: 130%;
    padding: 0 30px;
  }
  main#about div.copy {
    padding: 30px;
  }
  main#about div.figureStyle1 figcaption {
    width: 90%;
    margin: auto;
  }
}
@media only screen and (min-width: 992px) {
  section#headlineTicker > div {
    flex-basis: 70%;
    padding: 15px 0;
  }
  section#headlineTicker h6 {
    font-size: 160%;
    margin-top: 40px;
  }
  section#headlineTicker ul.ticker {
    font-size: 200%;
    line-height: normal !important;
  }
}
@media only screen and (min-width: 1200px) {
  section#headlineTicker > div {
    flex-basis: 50%;
  }

  main#about div.copy {
    padding: 70px 40px 20px 40px;
  }
  main#about div.figureStyle1 figcaption {
    width: 100%;
    margin: auto;
  }
}
main#contact-and-directions article {
  width: 80%;
  min-width: 300px;
  max-width: 800px;
  margin: auto;
  padding-top: 40px;
}
main#contact-and-directions article a {
  text-decoration: none;
  color: #000;
}
main#contact-and-directions article a:hover {
  text-decoration: underline;
}
main#contact-and-directions article h2 {
  font-family: "Julius Sans One", sans-serif;
  text-align: center;
  font-size: 210%;
  margin-bottom: 25px;
}
main#contact-and-directions article h3 {
  font-family: "Lato", sans-serif;
  margin-bottom: 7px;
  line-height: normal;
  font-size: 130%;
  letter-spacing: 1px;
}
main#contact-and-directions article p {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  margin-bottom: 25px;
}
main#contact-and-directions article ul {
  font-family: "Lato", sans-serif;
  font-size: 100%;
  list-style-type: none;
  margin-bottom: 25px;
}
main#contact-and-directions section#maps {
  display: flex;
  padding-bottom: 20px;
  padding-top: 20px;
  flex-direction: column;
}
main#contact-and-directions section#maps h4 {
  font-family: "Lato", sans-serif;
  margin-bottom: 7px;
  line-height: normal;
  font-size: 130%;
  letter-spacing: 1px;
}
main#contact-and-directions section#maps iframe {
  width: 100% !important;
  border: none !important;
}
main#contact-and-directions section#maps > div {
  margin-bottom: 20px;
}

@media only screen and (min-width: 1300px) {
  section#maps {
    flex-direction: row !important;
  }
  section#maps > div {
    flex-basis: 50%;
  }
  section#maps > div:first-child {
    padding-right: 10px;
  }
  section#maps > div:last-child {
    padding-left: 10px;
  }
}
div.defaultGallery {
  display: none;
  grid-template-columns: repeat(4, 1fr);
  width: 98%;
  max-width: 1600px;
  grid-gap: 14px;
  margin: auto;
}
div.defaultGallery > div a {
  display: block;
  margin-bottom: 14px !important;
}
div.defaultGallery > div img {
  width: 100%;
  display: block;
}

div.defaultMobileGallery {
  width: 88%;
  max-width: 1200px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 14px;
  margin: 0 auto 14px auto;
}
div.defaultMobileGallery a {
  display: block;
}
div.defaultMobileGallery img {
  width: 100%;
  display: block;
}

@media only screen and (max-width: 767px) {
  div.defaultMobileGallery {
    grid-template-columns: repeat(2, 1fr);
    padding: 7px;
    grid-gap: 7px;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  div.defaultMobileGallery {
    grid-template-columns: repeat(3, 1fr);
    padding: 7px;
    grid-gap: 7px;
    width: 100%;
  }
}
@media only screen and (min-width: 992px) {
  div.defaultMobileGallery {
    grid-template-columns: repeat(4, 1fr);
    padding: 7px;
    grid-gap: 7px;
    width: 100%;
  }
}
@media only screen and (min-width: 1100px) {
  div.defaultGallery {
    display: grid;
  }

  div.defaultMobileGallery {
    display: none;
  }
}
div#testimonial {
  display: flex;
  background-color: #f0f0f0;
  justify-content: center;
  align-items: center;
}
div#testimonial h3 {
  font-family: "Julius Sans One", sans-serif;
}
div#testimonial div.theTestimonial p {
  color: #292929;
}
div#testimonial div.theAttribution {
  font-family: "Lato", sans-serif;
}
div#testimonial div.more {
  padding: 16px;
  display: table;
  margin: auto;
  background-color: #667657;
  font-family: "Lato", sans-serif;
  text-align: center;
  letter-spacing: 2px;
}
div#testimonial div.more a {
  color: #ffffff;
  text-decoration: none;
}
div#testimonial div.more a:hover {
  text-decoration: underline;
}
div#testimonial div.more p {
  color: #ffffff;
  font-size: 110%;
}

div.theTestimonial::before {
  content: "“";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 40px auto 10px auto;
}

div.theTestimonial::after {
  content: "”";
  font-size: 400%;
  line-height: 0 !important;
  color: #bfbfbf;
  font-family: Georgia, "Times New Roman", Times, serif;
  display: block;
  width: 50%;
  text-align: center;
  margin: 35px auto 0 auto;
}

section#guestBook {
  background-color: #f8f8f8;
}
section#guestBook h3 {
  font-family: "Julius Sans One", sans-serif;
  margin-bottom: 20px;
}
section#guestBook div.image img {
  border: 10px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
  width: 100%;
}
section#guestBook div.testimonial {
  flex-basis: 70%;
  padding: 0 50px;
  display: flex;
  align-content: center;
  justify-content: center;
  flex-direction: column;
  background-color: #ececec;
}
section#guestBook div.testimonial div.theTestimonial {
  margin-bottom: 10px;
}
section#guestBook div.testimonial div.theTestimonial p {
  font-size: 100%;
  color: #292929;
  line-height: 2em !important;
}
section#guestBook div.testimonial div.theAttribution {
  margin-bottom: 20px;
}
section#guestBook div.testimonial div.theAttribution p {
  font-family: "Lato", sans-serif;
  font-size: 110%;
  letter-spacing: 1px;
}
section#guestBook div.more {
  display: table;
  font-family: "Lato", sans-serif;
  background-color: #667657;
  text-align: center;
  margin: auto;
  padding: 16px;
  letter-spacing: 3px;
}
section#guestBook div.more p {
  color: #ffffff !important;
  font-size: 130%;
  line-height: normal !important;
}
section#guestBook div.more a {
  color: #ffffff;
  text-decoration: none;
}
section#guestBook div.more a:hover {
  text-decoration: underline;
}

@media only screen and (max-width: 767px) {
  section#guestBook {
    padding: 12px;
  }
  section#guestBook h3 {
    font-size: 200%;
    text-align: center;
  }
  section#guestBook div.wrap {
    display: flex;
    flex-direction: column;
  }
  section#guestBook div.image {
    padding: 20px;
  }
  section#guestBook div.image img {
    width: 80%;
    max-width: 400px;
    margin: auto;
    display: block;
  }
  section#guestBook div.testimonial {
    padding: 20px;
  }
}
@media only screen and (min-width: 768px) {
  section#guestBook {
    padding: 20px;
  }
  section#guestBook h3 {
    font-size: 200%;
    text-align: center;
  }
  section#guestBook div.wrap {
    display: flex;
    flex-direction: column;
  }
  section#guestBook div.image {
    padding: 20px 20px 20px 0;
  }
  section#guestBook div.image img {
    width: 80%;
    max-width: 400px;
    margin: auto;
    display: block;
  }
  section#guestBook div.testimonial {
    padding: 20px;
  }
}
@media only screen and (min-width: 1100px) {
  section#guestBook .wrap {
    display: flex;
    flex-direction: row !important;
  }
  section#guestBook h3 {
    font-size: 250%;
    text-align: left;
  }
  section#guestBook div.image {
    flex-basis: 40%;
  }
  section#guestBook div.testimonial {
    flex-basis: 60%;
    padding: 40px 40px;
  }
}
@media only screen and (min-width: 1200px) {
  main.page section#guestBook div.image {
    flex-basis: 30%;
  }
  main.page section#guestBook div.testimonial {
    flex-basis: 70%;
  }
}
main#newsletterSubscriber {
  background-image: url("../css/images/bronze-among-the-olive-trees.jpeg");
  background-size: cover;
  background-repeat: no-repeat;
}
main#newsletterSubscriber div.formErrors {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  letter-spacing: 2px;
}
main#newsletterSubscriber div.formErrors i {
  color: darkred;
  padding: 5px;
}
main#newsletterSubscriber div.formErrors div {
  flex-grow: 1;
  padding: 10px;
  color: #1b1e21;
}
main#newsletterSubscriber div.formErrors ul {
  flex-basis: 100%;
  list-style-type: none;
  font-size: 95%;
  margin: 10px 0;
  padding: 10px;
  background-color: darkred;
  color: #ffffff;
}
main#newsletterSubscriber > section {
  font-family: "Lato", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}
main#newsletterSubscriber > section > div {
  margin: 100px 0;
  width: 98%;
  max-width: 400px;
  padding: 1em;
  background-color: #f0f0f0;
  border: 12px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
}
main#newsletterSubscriber > section > div h2 {
  text-align: center;
  font-family: "Julius Sans One", sans-serif;
  margin-bottom: 10px;
  line-height: normal !important;
  font-size: 200%;
}
main#newsletterSubscriber > section > div h3 {
  text-align: center;
  font-family: "Lato", sans-serif;
  margin-bottom: 10px;
  letter-spacing: 1px;
  font-size: 95%;
}
main#newsletterSubscriber > section > div p {
  font-size: 90%;
  text-align: center;
  margin-top: 15px;
  color: #616161;
}
main#newsletterSubscriber form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
main#newsletterSubscriber form div.formGroup {
  margin-bottom: 20px;
}
main#newsletterSubscriber form div#button {
  margin-bottom: 20px;
}
main#newsletterSubscriber form label {
  display: block;
  width: 100%;
  font-size: 90%;
  margin-bottom: 5px;
  color: #1b1e21;
  letter-spacing: 2px;
  text-transform: uppercase;
}
main#newsletterSubscriber form input[type=text], main#newsletterSubscriber form input[type=password] {
  border: 1px solid #d0d0d0;
  padding: 10px;
  width: 100%;
}
main#newsletterSubscriber form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
main#newsletterSubscriber form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}

main#guestbookEntry {
  background-image: url("../css/images/bronze-among-the-olive-trees.jpeg");
  background-size: cover;
  background-repeat: no-repeat;
}
main#guestbookEntry div.formGroup.theTestimonial::before, main#guestbookEntry div.formGroup.theTestimonial::after {
  display: none;
}
main#guestbookEntry button {
  margin: auto;
  display: block !important;
  background-color: transparent;
  padding: 10px;
  text-transform: uppercase;
  letter-spacing: 2px;
}
main#guestbookEntry textarea#theTestimonial {
  width: 100%;
  padding: 10px;
  font-size: 100%;
  font-family: "Lato", sans-serif;
}
main#guestbookEntry div.formErrors {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  letter-spacing: 2px;
}
main#guestbookEntry div.formErrors i {
  color: darkred;
  padding: 5px;
}
main#guestbookEntry div.formErrors div {
  flex-grow: 1;
  padding: 10px;
  color: #1b1e21;
}
main#guestbookEntry div.formErrors ul {
  flex-basis: 100%;
  list-style-type: none;
  font-size: 95%;
  margin: 10px 0;
  padding: 10px;
  background-color: darkred;
  color: #ffffff;
}
main#guestbookEntry > section {
  font-family: "Lato", sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
}
main#guestbookEntry > section > div {
  margin: 100px 0;
  width: 98%;
  max-width: 600px;
  padding: 1em;
  background-color: #f0f0f0;
  border: 12px solid #ffffff;
  box-shadow: 2px 2px 10px 4px rgba(0, 0, 0, 0.25);
}
main#guestbookEntry > section > div h2 {
  text-align: center;
  font-family: "Julius Sans One", sans-serif;
  margin-bottom: 10px;
  line-height: normal !important;
  font-size: 200%;
}
main#guestbookEntry > section > div h3 {
  text-align: center;
  font-family: "Lato", sans-serif;
  margin-bottom: 10px;
  letter-spacing: 1px;
  font-size: 95%;
}
main#guestbookEntry > section > div p {
  font-size: 90%;
  text-align: center;
  margin-top: 15px;
  color: #616161;
}
main#guestbookEntry form {
  padding: 20px;
  outline: 1px solid #d0d0d0;
  font-family: "Lato", sans-serif;
  background-color: #e4e4e4;
}
main#guestbookEntry form div.formGroup {
  margin-bottom: 20px;
}
main#guestbookEntry form div#button {
  margin-bottom: 20px;
}
main#guestbookEntry form label {
  display: block;
  width: 100%;
  font-size: 90%;
  margin-bottom: 5px;
  color: #1b1e21;
  letter-spacing: 2px;
  text-transform: uppercase;
}
main#guestbookEntry form input[type=text], main#guestbookEntry form input[type=password] {
  border: 1px solid #d0d0d0;
  padding: 10px;
  width: 100%;
}
main#guestbookEntry form input[type=submit] {
  background-color: #c7642e;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
  width: 100%;
  border: none;
  padding: 10px;
  line-height: normal;
}
main#guestbookEntry form input[type=submit]:hover {
  background-color: #232323;
  color: #ffffff;
  text-transform: uppercase;
  font-size: 125% !important;
  letter-spacing: 5px;
}

/*# sourceMappingURL=stylesBrochure-11-15-2023.css.map */
