/* Mixin for multiline */
/* Center the display accordingly to its parent */
@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes corner-expand {
  0% {
    width: 0;
    opacity: 0;
  }
  100% {
    width: 20px;
    opacity: 1;
  }
}
@keyframes slide-right {
  0% {
    opacity: 0;
    transform: translateX(-200px);
  }
}
@keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@-webkit-keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  8% {
    -webkit-transform: scale(0.94);
    transform: scale(0.94);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  14% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  28% {
    -webkit-transform: scale(0.92);
    transform: scale(0.92);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  8% {
    -webkit-transform: scale(0.94);
    transform: scale(0.94);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  14% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  28% {
    -webkit-transform: scale(0.92);
    transform: scale(0.92);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
:root {
  /** primary **/
  --ion-color-primary: #00b7b3;
  --ion-color-primary-rgb: 0, 183, 179;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
  --ion-color-primary-shade: #00a19e;
  --ion-color-primary-tint: #1abebb;
  /** secondary **/
  --ion-color-secondary: #00B1D0;
  --ion-color-secondary-rgb: 0, 177, 208;
  --ion-color-secondary-contrast: #ffffff;
  --ion-color-secondary-contrast-rgb: 255, 255, 255;
  --ion-color-secondary-shade: #009cb7;
  --ion-color-secondary-tint: #1ab9d5;
  /** tertiary **/
  --ion-color-tertiary: #3b3f3f;
  --ion-color-tertiary-rgb: 76, 110, 121;
  --ion-color-tertiary-contrast: #ffffff;
  --ion-color-tertiary-contrast-rgb: 255, 255, 255;
  --ion-color-tertiary-shade: #343737;
  --ion-color-tertiary-tint: #4f5252;
  /** success **/
  --ion-color-success: #10dc60;
  --ion-color-success-rgb: 16, 220, 96;
  --ion-color-success-contrast: #fff;
  --ion-color-success-contrast-rgb: 255, 255, 255;
  --ion-color-success-shade: #0ec254;
  --ion-color-success-tint: #28e070;
  /** warning **/
  --ion-color-warning: #ffce00;
  --ion-color-warning-rgb: 255, 206, 0;
  --ion-color-warning-contrast: #000;
  --ion-color-warning-contrast-rgb: 0, 0, 0;
  --ion-color-warning-shade: #e0b500;
  --ion-color-warning-tint: #ffd31a;
  /** danger **/
  --ion-color-danger: #f53d3d;
  --ion-color-danger-rgb: 245, 61, 61;
  --ion-color-danger-contrast: #fff;
  --ion-color-danger-contrast-rgb: 255, 255, 255;
  --ion-color-danger-shade: #d83636;
  --ion-color-danger-tint: #f65050;
  /** light **/
  --ion-color-light: #fdfdfd;
  --ion-color-light-rgb: 244, 244, 244;
  --ion-color-light-contrast: #000;
  --ion-color-light-contrast-rgb: 0, 0, 0;
  --ion-color-light-shade: #d7d7d7;
  --ion-color-light-tint: #f5f5f5;
  /** medium **/
  --ion-color-medium: #989aa2;
  --ion-color-medium-rgb: 152, 154, 162;
  --ion-color-medium-contrast: #000;
  --ion-color-medium-contrast-rgb: 0, 0, 0;
  --ion-color-medium-shade: #86888f;
  --ion-color-medium-tint: #a2a4ab;
  /** dark **/
  --ion-color-dark: #222;
  --ion-color-dark-rgb: 34, 34, 34;
  --ion-color-dark-contrast: #fff;
  --ion-color-dark-contrast-rgb: 255, 255, 255;
  --ion-color-dark-shade: #1e1e1e;
  --ion-color-dark-tint: #383838;
  /** mainPlaces */
  --ion-color-mainPlaces: #c06457;
  --ion-color-mainPlaces-rgb: 192, 100, 87;
  --ion-color-mainPlaces-contrast: #ffffff;
  --ion-color-mainPlaces-contrast-rgb: 255, 255, 255;
  --ion-color-mainPlaces-shade: #a9584d;
  --ion-color-mainPlaces-tint: #c67468;
  /** aroundPlaces */
  --ion-color-aroundPlaces: #222;
  --ion-color-aroundPlaces-rgb: 34, 34, 34;
  --ion-color-aroundPlaces-contrast: #fff;
  --ion-color-aroundPlaces-contrast-rgb: 255, 255, 255;
  --ion-color-aroundPlaces-shade: #1e1e1e;
  --ion-color-aroundPlaces-tint: #383838;
  /* Material Design Toolbar Variables */
  --ion-toolbar-md-background-color: var(--ion-color-primary);
  --ion-toolbar-md-text-color: #fff;
  /** gold **/
  --ion-color-gold: #b9b029;
}

body {
  margin: 0px !important;
  padding: 0px;
  font-family: "Raleway", serif;
}

.hidden {
  opacity: 0;
}

.heartbeat-button {
  -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
  animation: heartbeat 1.5s ease-in-out infinite both;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Nunito", serif;
}

.title {
  text-transform: uppercase;
  font-size: 1.2em;
  font-weight: 600;
}

/* Mixin for multiline */
/* Center the display accordingly to its parent */
@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes corner-expand {
  0% {
    width: 0;
    opacity: 0;
  }
  100% {
    width: 20px;
    opacity: 1;
  }
}
@keyframes slide-right {
  0% {
    opacity: 0;
    transform: translateX(-200px);
  }
}
@keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@-webkit-keyframes bounce2 {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  8% {
    -webkit-transform: scale(0.94);
    transform: scale(0.94);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  14% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  28% {
    -webkit-transform: scale(0.92);
    transform: scale(0.92);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  8% {
    -webkit-transform: scale(0.94);
    transform: scale(0.94);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  14% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
  28% {
    -webkit-transform: scale(0.92);
    transform: scale(0.92);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}
:root {
  /** primary **/
  --ion-color-primary: #00b7b3;
  --ion-color-primary-rgb: 0, 183, 179;
  --ion-color-primary-contrast: #ffffff;
  --ion-color-primary-contrast-rgb: 255, 255, 255;
  --ion-color-primary-shade: #00a19e;
  --ion-color-primary-tint: #1abebb;
  /** secondary **/
  --ion-color-secondary: #00B1D0;
  --ion-color-secondary-rgb: 0, 177, 208;
  --ion-color-secondary-contrast: #ffffff;
  --ion-color-secondary-contrast-rgb: 255, 255, 255;
  --ion-color-secondary-shade: #009cb7;
  --ion-color-secondary-tint: #1ab9d5;
  /** tertiary **/
  --ion-color-tertiary: #3b3f3f;
  --ion-color-tertiary-rgb: 76, 110, 121;
  --ion-color-tertiary-contrast: #ffffff;
  --ion-color-tertiary-contrast-rgb: 255, 255, 255;
  --ion-color-tertiary-shade: #343737;
  --ion-color-tertiary-tint: #4f5252;
  /** success **/
  --ion-color-success: #10dc60;
  --ion-color-success-rgb: 16, 220, 96;
  --ion-color-success-contrast: #fff;
  --ion-color-success-contrast-rgb: 255, 255, 255;
  --ion-color-success-shade: #0ec254;
  --ion-color-success-tint: #28e070;
  /** warning **/
  --ion-color-warning: #ffce00;
  --ion-color-warning-rgb: 255, 206, 0;
  --ion-color-warning-contrast: #000;
  --ion-color-warning-contrast-rgb: 0, 0, 0;
  --ion-color-warning-shade: #e0b500;
  --ion-color-warning-tint: #ffd31a;
  /** danger **/
  --ion-color-danger: #f53d3d;
  --ion-color-danger-rgb: 245, 61, 61;
  --ion-color-danger-contrast: #fff;
  --ion-color-danger-contrast-rgb: 255, 255, 255;
  --ion-color-danger-shade: #d83636;
  --ion-color-danger-tint: #f65050;
  /** light **/
  --ion-color-light: #fdfdfd;
  --ion-color-light-rgb: 244, 244, 244;
  --ion-color-light-contrast: #000;
  --ion-color-light-contrast-rgb: 0, 0, 0;
  --ion-color-light-shade: #d7d7d7;
  --ion-color-light-tint: #f5f5f5;
  /** medium **/
  --ion-color-medium: #989aa2;
  --ion-color-medium-rgb: 152, 154, 162;
  --ion-color-medium-contrast: #000;
  --ion-color-medium-contrast-rgb: 0, 0, 0;
  --ion-color-medium-shade: #86888f;
  --ion-color-medium-tint: #a2a4ab;
  /** dark **/
  --ion-color-dark: #222;
  --ion-color-dark-rgb: 34, 34, 34;
  --ion-color-dark-contrast: #fff;
  --ion-color-dark-contrast-rgb: 255, 255, 255;
  --ion-color-dark-shade: #1e1e1e;
  --ion-color-dark-tint: #383838;
  /** mainPlaces */
  --ion-color-mainPlaces: #c06457;
  --ion-color-mainPlaces-rgb: 192, 100, 87;
  --ion-color-mainPlaces-contrast: #ffffff;
  --ion-color-mainPlaces-contrast-rgb: 255, 255, 255;
  --ion-color-mainPlaces-shade: #a9584d;
  --ion-color-mainPlaces-tint: #c67468;
  /** aroundPlaces */
  --ion-color-aroundPlaces: #222;
  --ion-color-aroundPlaces-rgb: 34, 34, 34;
  --ion-color-aroundPlaces-contrast: #fff;
  --ion-color-aroundPlaces-contrast-rgb: 255, 255, 255;
  --ion-color-aroundPlaces-shade: #1e1e1e;
  --ion-color-aroundPlaces-tint: #383838;
  /* Material Design Toolbar Variables */
  --ion-toolbar-md-background-color: var(--ion-color-primary);
  --ion-toolbar-md-text-color: #fff;
  /** gold **/
  --ion-color-gold: #b9b029;
}

body {
  margin: 0px !important;
  padding: 0px;
  font-family: "Raleway", serif;
}

.hidden {
  opacity: 0;
}

.heartbeat-button {
  -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
  animation: heartbeat 1.5s ease-in-out infinite both;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Nunito", serif;
}

.title {
  text-transform: uppercase;
  font-size: 1.2em;
  font-weight: 600;
}

.place-section-title {
  font-family: "Caveat", serif;
  margin: 24px 0 2px 16px;
  font-size: 1.6em;
  font-weight: 600;
}

place-presentation-description .place-description {
  padding: 16px 16px 0 16px;
  margin: 0;
  color: var(--ion-color-dark);
}
place-presentation-description .place-description p {
  font-family: "Nunito", serif;
  margin: 0;
  font-size: 1.1em;
}
place-presentation-description ion-button {
  font-size: 1.1em;
  font-family: "EB Garamond", serif;
}