@charset "UTF-8";

@import "//fonts.googleapis.com/css?family=Merriweather:400,300,700|Open+Sans:400,600";
@import "fontawesome.css";

/*
 * core.scss
 *
 * Core CSS structure for the application.
 *
 * By Jonathon McDonald <jonathon@agencyfusion.com>
 */
body {
  font-family:"Open Sans",sans-serif;
  margin-top:150px
}

html {
  box-sizing:border-box
}

*,:before,:after {
  box-sizing:inherit
}

input[type="text"],input[type="email"],input[type="number"],input[type="search"],input[type="tel"],input[type="url"],input[type="password"],textarea {
  border-radius:0;
  border:0;
  font-size:16px;
  height:initial;
  min-height: 62px;
  padding:20px;
  width:100%
}

img.fill {
  height: auto;
  max-width: 100%;
}

img.center {
  display: block;
  margin: 0 auto 75px;
}

/***************************************************************************************************
 * Media Queries
***************************************************************************************************/

@media (min-width: 1280px) {
  .container {
    max-width:1280px
  }


  #header .container {
    max-width:1280px
  }
}

@media (max-width: 480px) {
  .container {
    width:90%
  }
}

/* _components.scss
 *
 * Components are simple pieces that are used throughout multiple pages that are not directly
 * related to the layout.  A good example is the testimonial bubble.
 *
 * By Jonathon McDonald <jonathon@agencyfusion.com>
***************************************************************************************************/

.core-button,input[type="submit"].core-button,input[type="button"].core-button {
  background:#32A0A0;
  border-radius:0;
  border:0;
  box-shadow:0 6px #00646E;
  color:#fff;
  display:inline-block;
  font-family:"Merriweather",serif;
  font-size:22px;
  height:initial;
  padding:25px 25px 20px;
  text-decoration:none
}


.core-button:hover,input[type="submit"].core-button:hover,input[type="button"].core-button:hover {
  color:#fff
}


.core-button.large,input[type="submit"].core-button.large,input[type="button"].core-button.large {
  font-size:25px;
  padding:30px 30px 0
}


ul.social {
  margin:0
}


ul.social:after {
  clear:both;
  content:"";
  display:block
}


ul.social li {
  display:inline-block;
  margin-right:15px;
}


ul.social li a,ul.social li a:hover {
  display:block;
  height:32px;
  width:32px
}


ul.social li a.fb,ul.social li a:hover.fb {
  background:url(../cmsimages/icons-social-fb.png) center center no-repeat
}


ul.social li a.gplus,ul.social li a:hover.gplus {
  background:url(../cmsimages/icons-social-goog.png) center center no-repeat
}


ul.social li a.twitter,ul.social li a:hover.twitter {
  background:url(../cmsimages/icons-social-tw.png) center center no-repeat
}


ul.social li a.instagram,ul.social li a:hover.instagram {
  background:url(../cmsimages/icons-social-ig.png) center center no-repeat
}


.testimonial {
  display:block;
  margin:0 auto;
  position:relative;
  top:50%;
  transform:translateY(-50%);
  -webkit-transform:translateY(-50%);
  -moz-transform:translateY(-50%);
  -ms-transform:translateY(-50%);
  -o-transform:translateY(-50%);
  background:#32A0A0;
  border-radius:5px;
  box-shadow:0 5px #00646E;
  color:#fff;
  font-family:"Merriweather",serif;
  font-size:30px;
  padding:40px;
  position:relative;
  text-align:center;
  text-decoration:none;
  width:345px;
  z-index:1
}

.testimonial a {
  color:#fff;
  text-decoration:none
}


.testimonial a:hover {
  color:#fff;
  text-decoration:none
}


.testimonial .fa-star {
  margin:0 2px
}


.testimonial.bottom .triangle {
  border-width:35px 35px 0 0;
  right:80px;
  bottom:-35px;
  border-color:#32A0A0 transparent;
  border-style:solid;
  content:"";
  display:block;
  position:absolute;
  width:0;
  z-index:5
}


.testimonial.bottom .triangle-shadow {
  border-width:41px 41px 0 0;
  right:74px;
  bottom:-41px;
  border-color:#00646E transparent;
  border-style:solid;
  content:"";
  display:block;
  position:absolute;
  width:0;
  z-index:0
}


.testimonial.top .triangle {
  border-width:0 0 35px 35px;
  left:80px;
  top:-35px;
  border-color:#32A0A0 transparent;
  border-style:solid;
  content:"";
  display:block;
  position:absolute;
  width:0;
  z-index:5
}


.testimonial.top .triangle-shadow {
  display:none
}


.well {
  background:#F0F0F0;
  color:#000;
  font-size:18px;
  margin:60px auto;
  max-width:936px;
  padding:60px
}


.well:after {
  clear:both;
  content:"";
  display:block
}


.well .well-col {
  display:inline-block;
  float:left;
  margin:0;
  min-width:220px;
  width:33.33333%
}


.well .well-col li {
  list-style:none;
  text-align:center
}

/***************************************************************************************************
 * Media Queries
***************************************************************************************************/
@media (max-width: 1280px) {
  .testimonial {
    font-size:22px;
    width:initial;
    word-wrap:break-word
  }
}

@media (max-width: 749px) {
  .testimonial {
    margin:40px auto;
    top:0;
    transform:translateY(0);
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    -ms-transform:translateY(0);
    -o-transform:transalteY(0);
    width:initial
  }


  .core-button,input[type="submit"].core-button,input[type="button"].core-button {
    font-size:16px;
    padding:15px 15px 10px;
    max-width:100%
  }


  ul.social {
    display:inline-block;
    margin:0 auto
  }


  .well {
    margin:20px auto;
    text-align:center;
    padding:20px
  }


  .well .well-col {
    display:block;
    float:none;
    min-width:initial;
    width:initial
  }
}

@media (max-width: 480px) {
  .testimonial {
    font-size:13px;
    padding:20px
  }
}

/***************************************************************************************************
 * Utility Nav
***************************************************************************************************/
.location-numbers li {
  line-height:19px;
  font-size:14px;
  width:120px;
  padding-top:10px;
  text-align:right;
  float:right;
}

.location-numbers {
  margin-top:25px;
  margin-bottom:0px;
  padding-right:32px
}

.mobile-location-numbers, .mobile-location-numbers li a {
  font-size:14px;
  padding:10px 15px 10px 0px;
}

/***************************************************************************************************
 * Header Navigation
***************************************************************************************************/
nav ul:after {
  clear:both;
  content:"";
  display:block
}

nav ul li {
  display:inline-block;
  float:left;
  list-style:none;
  text-align:center;
  width:165px
}

nav ul li.link a {
  color:#333;
  display:block;
  line-height:normal;
  text-decoration:none
}

nav ul li.text a {
  color:#32A0A0;
  font-weight:700;
  text-decoration: none
}

nav ul li.selected a {
  color:#32A0A0
}

#sub-navigation {
  background-color:#32A0A0;
  color:#fff;
  font-size:17px;
  height:65px;
  text-align:center
}

#sub-navigation .centered-nav {
  display:inline-block;
  margin:0 auto
}

#sub-navigation .centered-nav li {
  display:inline-block;
  float:left;
  line-height:65px;
  list-style:none;
  text-align:center;
  width:inherit;
  border-left:1px solid #fff
}

#sub-navigation .centered-nav li:first-child {
  border-left:0
}

#sub-navigation .centered-nav li a {
  color:#fff;
  display:block;
  line-height:65px;
  text-decoration:none;
  font-weight:700;
  padding:0 20px
}

/***************************************************************************************************
 * Footer Navigation
***************************************************************************************************/
.footer-navigation {
  display:inline-block;
  float:left;
  margin-bottom:10px;
  min-width:100px;
  width:35%
}


.footer-navigation li {
  display:block;
  list-style:none
}


.footer-navigation li a,.footer-navigation li a:hover {
  color:#fff;
  display:block;
  text-decoration:none;
  width:100%
}

/***************************************************************************************************
 * Media Queries
***************************************************************************************************/
@media (max-width: 1280px) {
  nav ul li {
    width:130px
  }


  nav ul li a,nav ul li.text {
    font-size:18px
  }

  .location-numbers li.text, .location-numbers li a {
    font-size:14px;
  }

  .location-numbers {
    padding-right:22px
  }
}

@media (max-width: 960px) {
  nav ul li {
    width:110px
  }


  nav ul li a,nav ul li.text {
    font-size:16px
  }

  .location-numbers li.text, .location-numbers li a {
    font-size:12px;
    width:100px;
  }

  .location-numbers {
    padding-right:16px
  }
}

@media (max-width: 750px) {
  nav.row .columns.three {
    width:10%
  }


  nav.row .columns.nine {
    width:90%
  }


  nav.row .columns.three,nav.row .columns.nine {
    margin-left:0
  }


  nav.row .columns.three ul,nav.row .columns.nine ul {
    max-height:150px;
    overflow:hidden
  }


  nav.row .columns.three ul li,nav.row .columns.nine ul li {
    width:initial
  }


  nav.row .columns.three ul li a,nav.row .columns.three ul li.text,nav.row .columns.nine ul li a,nav.row .columns.nine ul li.text {
    padding:0 10px
  }


  nav.row .columns.three ul li.text,nav.row .columns.nine ul li.text {
    font-size:75%
  }


  #sub-navigation .centered-nav li a {
    font-size:14px;
    padding:0 7px
  }

  nav.row .columns.nine .location-numbers li.text, .location-numbers li a {
    font-size:12px;
    width:117px;
  }

  nav.row .columns.nine .location-numbers li.text, nav.row .columns.nine .location-numbers li a {
    padding-right:0px;
  }
}

@media (max-width: 480px) {
  nav.row a {
    color:#333;
    float:right;
    line-height:50px;
    text-align:right
  }


  nav.row.mobile-nav ul {
    margin-bottom:0
  }


  nav.row.mobile-nav ul li {
    border-top:1px solid #F0F0F0;
    height:initial;
    display:block;
    margin-bottom:0;
    width:100%
  }


  nav.row.mobile-nav ul li a:not(.phone) {
    display:block;
    float:none;
    height:initial;
    line-height:20px;
    padding:10px 15px;
    text-align:left
  }


  nav.row.mobile-nav ul li.text {
    border-top:1px solid #F0F0F0;
    line-height:initial;
    padding:10px 15px;
    text-align:left
  }

  nav.row.mobile-nav ul li.text a {
    width:100%;
    text-align:left;
  }

  nav ul li.selected {
    background:#32A0A0
  }

  nav ul li.selected a {
    color:#fff
  }
}

/***************************************************************************************************
 * Section Styling (Shared)
***************************************************************************************************/
.section {
  display:block
}

.section .container .row.no-pad-bottom {
  padding-bottom:0
}

.section .container .row.no-pad-vertical {
  padding-bottom: 0;
  padding-top: 0;
}

.section .container .row.row-insurance-providers {
  margin: 0 -50px;
}

.section .container .row.row-insurance-providers ul.insurance-provider {
  float: left;
  font-size: 12px;
  padding: 0 15px;
  text-align: left;
  width: 25%;
  list-style-type: none;
}

.section .segment {
  clear:both;
  display:block
}

.section .segment:after {
  clear:both;
  content:"";
  display:block
}

.section.content {
  background:#fff
}

.section.content hr {
  margin:15px auto;
  max-width:820px
}

.section.content .row {
  padding:100px 0
}

.section.content .row img {
  max-width: 92%;
}

.section.content .row h2,.section.content .row h3,.section.content .row h4,.section.content .row h5,.section.content .row h6 {
  color:#32A0A0;
  font-family:"Merriweather",serif;
  font-size:25px;
  font-weight:700;
  text-align:center
}

.section.content .row h2 {
  font-size:42px;
  margin-bottom:30px
}

.section.content .row p {
  font-size:19px;
  margin:0 auto;
  margin-bottom:30px;
  max-width:820px;
  text-align:center
}

.section.emphasized {
  background:#F0EBDC;
  color:#333;
  font-family:"Merriweather",serif;
  font-size:19px;
  text-align:center
}

.section.emphasized h2 {
  font-family:"Merriweather",serif;
  font-size:40px
}

.section.emphasized .row {
  padding:80px 14%
}

.section.emphasized .segment {
  margin:60px 0
}

/***************************************************************************************************
 * Hero Elements
***************************************************************************************************/
.hero {
  background-color:#7A7E7A;
  display:block;
  width:100%
}

.hero.primary {
  height:530px
}

.hero.primary h1 {
  position:relative;
  top:50%;
  transform:translateY(-50%);
  -webkit-transform:translateY(-50%);
  -moz-transform:translateY(-50%);
  -ms-transform:translateY(-50%);
  -o-transform:translateY(-50%);
  color:#fff;
  font-family:"Merriweather",serif;
  font-size:68px;
  text-align:center
}

.hero.secondary {
  height:480px
}

.hero .container,.hero .container > .row,.hero .container > .row > .columns {
  height:inherit
}

.hero.healing {
  background:url(../cmsimages/header-healing.jpg) center no-repeat;
  background-size:cover
}

.hero.contact {
  background:url(../cmsimages/header-contact.jpg) center no-repeat;
  background-size:cover
}

.hero.home {
  background:url(../cmsimages/header-home.jpg) center no-repeat;
  background-size:cover
}

.hero.testimonials {
  background:url(../cmsimages/banner-testimonials.jpg) center no-repeat;
  background-size:cover
}

.hero.testimonials.secondary {
  padding:0 15%
}

.hero.testimonials-header {
  background:url(../cmsimages/header-testimonials.jpg) center no-repeat;
  background-size:cover
}

.hero.therapists {
  background:url(../cmsimages/header-therapists.jpg) center no-repeat;
  background-size:cover
}

/***************************************************************************************************
 * Shared Header
***************************************************************************************************/
#header {
  background:#fff;
  height:150px;
  font-size:20px;
  position:fixed;
  top:0;
  width:100%;
  z-index:10
}

#header .container {
  width:100%
}

#header .logo {
  background:url(../cmsimages/logo.png);
  background-size:cover;
  display:block;
  height:80px;
  margin:35px 0;
  width:260px
}

/***************************************************************************************************
 * Shared Footer
***************************************************************************************************/
#footer {
  background:#323233;
  color:#fff;
  font-size:10px;
  min-height:245px;
  padding:80px
}

#footer .segment {
  margin-bottom:10px
}

#footer .action,#footer .or {
  display:inline-block;
  font-family:"Merriweather",serif;
  font-size:22px
}

#footer .action {
  float: left;
  min-width:320px;
  width:55%
}

#footer .or {
  float: left;
  font-weight:300;
  margin-top: 25px;
  width:75%
}

#footer .or .phone {
  font-weight:700;
  color:#fff;
  text-decoration: none
}

#footer .logo {
  width:122px
}

/***************************************************************************************************
 * Other
***************************************************************************************************/
.mobile-only {
  display:none!important
}


.hidden {
  display:none
}

/***************************************************************************************************
 * Media Queries
***************************************************************************************************/
@media (max-width: 959px) {
  #footer .action, #footer .or {
    display: block;
    float: initial;
    font-size: 18px;
    width: 100%;
  }

  #footer .action .core-button {
    font-size: 18px;
  }

  #footer .or {
    margin-top: 10px;
  }

  #footer ul.social li {
    display: inline-block;
    float: none;
    margin-left: 0;
    margin-right: 15px;
  }

  #header .logo {
    background:url(../cmsimages/logo.png) center no-repeat
  }

  .location-numbers li.text, .location-numbers li a {
    font-size:12px;
    width:100px;
  }

  .location-numbers {
    padding-right:16px
  }
}

@media (max-width: 820px) {

  .hero.secondary {
    height:initial
  }

  .footer-navigation {
    font-size:14px;
    width:100%
  }

  .testimonials .row .columns.six {
    display:block;
    width:100%
  }

  .section .container .row.row-insurance-providers ul.insurance-provider {
    text-align:center;
    width: 50%;
    line-height:12px;
  }
  
  #header .logo {
    background:url(../cmsimages/mobile-logo.png) center no-repeat;
    background-size:contain;
    margin:35px auto;
    width:85%
  }


  #footer .columns.three,#footer .columns.six {
    display:block;
    float:none;
    margin:0 auto;
    text-align:center;
    width:90%
  }


  #footer .columns.three .segment,#footer .columns.six .segment {
    display:block;
    margin:15px auto
  }


  #footer .columns.three .segment .action,#footer .columns.three .segment .or,#footer .columns.six .segment .action,#footer .columns.six .segment .or {
    display:block;
    margin:15px auto;
    min-width:initial;
    width:100%
  }
}

@media (max-width: 480px) {
  .section.content .row h2 {
    font-size: 32px;
  }

  .section.emphasized .row {
    padding: 40px 14%;
  }

  .hidden-mobile {
    display:none!important
  }


  .mobile-only {
    display:block!important
  }

  .mobile-only:after {
    clear: both;
    content: "";
    display: block;
  }


  body {
    margin-top:50px
  }


  #sub-navigation {
    display:none
  }


  .section.content .row {
    padding:50px 0
  }


  .section.hero.primary {
    height:300px
  }


  .section.hero.primary h1 {
    font-size:38px
  }


  .section.emphasized {
    font-size:16px
  }


  .section.emphasized h2 {
    font-size:32px;
    margin-bottom:0
  }


  .section.emphasized .segment {
    margin:30px 0
  }

  .section .container .row.row-insurance-providers ul.insurance-provider {
    float:none;
    width: 100%;
    line-height:10px;
  }

  #header {
    border-bottom:1px solid #F0F0F0;
    height:initial;
    min-height:50px
  }


  #header .columns.three {
    height:50px;
    margin:0;
    width:15%
  }


  #header .columns.nine {
    height:50px;
    margin:0;
    width:80%
  }


  #header .container {
    padding:0
  }


  #header .logo {
    height:50px;
    margin:0 auto
  }


  #footer {
    padding:40px 0
  }


  #footer .columns.six .segment .or {
    font-size:18px
  }
}
