@charset "utf-8";

/* Import of fonts. */
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");

/* ---------------------------------------------
  Style sheet for the typografic styles.
--------------------------------------------- */

/* For mobile phones - (phones, 450px and down). */
/* General. */
body {
  font: 300 16px/1.5em "Roboto", "Arial", "Helvetica",sans-serif;
  color: #323232;
  -webkit-font-smoothing:antialiased;
}

h2 {
  font: 300 1.8em "Josefin Sans", "Arial", "Helvetica", sans-serif;
}

h3 {
  font: 300 1.6em "Roboto", "Arial", "Helvetica",sans-serif;
}

h4 {
  font: 300 1.4em "Roboto", "Arial", "Helvetica",sans-serif;
}

a,
a:link,
a:visited {
  color: #FAFAFA;
  text-decoration: none;
}

a:hover {
  color: #666;
  text-decoration: none;
}

a:active {
  color: #FAFAFA;
  text-decoration: none;
}

.bold {
  font-weight: bold;
}

/* Header. */
.nav-link {
  font-size: 1em;
  font-family: "Josefin Sans", "Arial", "Helvetica", sans-serif;
}

.navbar-dark .navbar-nav > .active > a,
.navbar-dark .navbar-nav > .active > a:hover,
.navbar-dark .navbar-nav > .active > a:focus {
  color: #FAFAFA !important;
}

/* Home section. */
.caption-info {
  text-align: center;
  color: #FAFAFA;
}

.caption-info h1 {
  font: normal 2.1em "Lobster", "Arial", "Helvetica", cursive;
  text-transform: capitalize;
}

.caption-info h2 {
  font: 600 1.2em "Josefin Sans", "Arial", "Helvetica", sans-serif;
}

#button_vr_mobile,
#button_vr,
#button_emdr_mobile,
#button_emdr {
  text-decoration: none;
  color: #FAFAFA;
  font-weight: bold;
}

#home span.explore,
#home span.explore-text {
  color: #FAFAFA;
}

#home span.explore i:hover,
#home span.explore i:active {
  color: #222;
}

/* EMDR section. */
.highlight-info1,
.highlight-info2,
.highlight-info3,
.highlight-info4,
.highlight-info5 {
  color: #FAFAFA;
}

/* Unreal fears and other sections. */
#unreal .panel-group a,
#other .panel-group a,
#unreal .panel-group button,
#other .panel-group button,
#unreal .panel-group a:link,
#other .panel-group a:link,
#unreal .panel-group button:link,
#other .panel-group button:link,
#unreal .panel-group a:visited,
#other .panel-group a:visited,
#unreal .panel-group button:visited,
#other .panel-group button:visited {
  color: #323232;
  text-decoration: none;
  font-size: 16px;
}

#unreal .panel-group a:hover,
#other .panel-group a:hover,
#unreal .panel-group button:hover,
#other .panel-group button:hover {
  color: #666;
  text-decoration: none;
}

#unreal .panel-group a:active,
#other .panel-group a:active,
#unreal .panel-group button:active,
#other .panel-group button:active {
  color: #323232;
  text-decoration: none;
}

.card-item a,
.card-item a:link,
.card-item a:visited,
.card-item a:hover,
.card-item a:active {
  color: #FAFAFA !important;
  text-decoration: none;
}

/* Locations section. */
#locations h4 {
  font-size: 1.2em;
}

/* Contact section. */
span.error {
  color: red;
}

#contact .btn {
  text-transform: uppercase;
}

#contact h4,
span.contact-info {
  font-size: 1.1em;
}

/* Google Maps section. */
#map p {
  line-height: 1.7em;
}

#map a {
  color: #00A9C6;
}

#map a:hover {
  color: #666;
}

/* Footer. */
.page-footer {
  color: #FAFAFA;
}

.page-footer a {
  font-weight: bold;
}

/* For small devices - (portrait tablets and large phones, 600px and up). */
@media only screen and (min-width: 600px) {
  /* Home section. */
  .caption-info h1 {
    font-size: 2.5em;
  }

  .caption-info h2 {
    font-size: 1.3em;
  }
}

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

}

/* For large devices - (laptops/desktops, 992px and up). */
@media only screen and (min-width: 992px) {
  /* General. */
  body {
    font: 300 18px/1.5em "Roboto", "Arial", "Helvetica",sans-serif;
  }

  h2 {
    font: 300 2.5em "Josefin Sans", "Arial", "Helvetica", sans-serif;
  }

  h3 {
    font: 300 2em "Roboto", "Arial", "Helvetica",sans-serif;
  }

  h4 {
    font: 300 1.5em "Roboto", "Arial", "Helvetica",sans-serif;
  }

  /* Header. */
  .nav-link {
    font-size: 0.64em;
    font-family: "Josefin Sans", "Arial", "Helvetica", sans-serif;
  }

  /* Home section. */
  .caption-info h1 {
    font: normal 4.5em "Lobster", "Arial", "Helvetica", cursive;
  }

  .caption-info h2 {
    font: 600 1.7em "Josefin Sans", "Arial", "Helvetica", sans-serif;
  }

  /* Locations section. */
  #locations h4 {
    font-size: 1.4em;
  }

  /* Contact section. */
  #contact h4,
  span.contact-info {
    font-size: 1.3em;
  }

  /* Back-to-top button. */
  a.back-to-top {
    color: #FAFAFA;
  }
}

/* For extra large devices (large laptops and desktops, 1200px and up). */
@media only screen and (min-width: 1200px) {
  /* Header. */
  .nav-link {
    font-size: 0.84em;
    font-family: "Josefin Sans", "Arial", "Helvetica", sans-serif;
  }
}
