/* 
 Site Manager Version: 14.2.0
 Date Created: November 2025
 Account: holden-janelle
 Written by: Ricky Rivas
 Sesame Communications - All rights reserved. C2025
 Any reproduction or intentional misuse is strictly prohibited
*/

/* ==================================================================
Basic Stylings
These will affect every size of the site.
================================================================== */
html {
  scroll-behavior: smooth;
}
/* ===============================================
	body 
=============================================== */
body,
input,
select,
textarea {
  font-family: "Quicksand", Helvetica, Arial, sans-serif;
}
form button,
button {
  font-family: "Quicksand", Helvetica, Arial, sans-serif;
}
svg {
  display: inline-block;
}
body {
  color: #2b1a06;
  background: #ccc;
  position: relative;
  overflow: hidden;
}
@media only screen and (min-width: 1300px) {
  body {
    font-size: 20px;
  }
}
/* ===============================================
	links 
=============================================== */
a {
  text-decoration: none;
}
#content a {
  color: #16aa9c;
  text-decoration: underline;
  transition: color 0.33s ease-in-out;
}
#content a:focus,
#content a:hover {
  color: #8dc641;
  text-decoration: none;
}
/* ===============================================
	h family || hfam 
=============================================== */
h1,
h2:not(.topic),
h3:not(.topic),
h4,
h5,
h6 {
  line-height: 1;
  text-align: left;
  color: #774d25;
  text-rendering: auto;
  margin: 0 0 1.28571429em;
  font-weight: 400;
  text-transform: uppercase;
}
.sub h1 {
  font-size: 10vw;
  font-weight: 400;
  text-transform: uppercase;
  margin-bottom: 0.67857143em;
  color: #16aa9c;
}
@media only screen and (min-width: 480px) {
  .sub h1 {
    font-size: 2.8em;
  }
}
.home h1 {
  font-size: min(4.8em, 12vw);
  text-align: inherit;
  margin: 0 0 0.4em;
  color: #774d25;
  text-transform: none;
  letter-spacing: 0.042em;
  font-family: "shelby", sans-serif;
  font-weight: 400;
}
.home h1 .trait.bottom {
  display: inline-block;
  line-height: 1;
  font-size: clamp(12px, 0.1875em, 18px);
  text-transform: uppercase;
  font-weight: 300;
  letter-spacing: 0.025em;
  font-weight: 400;
  font-family: "Quicksand", Helvetica, Arial, sans-serif;
}
@media only screen and (min-width: 1024px) {
  .home h1 .trait.bottom {
    margin-left: -0.55em;
  }
}
h2:not(.topic) {
  font-size: 1.47368421em;
  color: ##774d25;
}
h3:not(.topic) {
  font-size: 1.47368421em;
}
h4 {
  font-size: 1.26315789em;
}
h5 {
  font-size: 1.15789474em;
}
h6 {
  font-size: 1.10526316em;
}
/* ===============================================
	containers
=============================================== */
.container {
  max-width: 64.5em;
}
@media only screen and (min-width: 1300px) {
  .container {
    width: 90%;
  }
}
/* ===============================================
	list styles - global overrides
=============================================== */
.what-sets-us-apart #content ol,
.meet-the-team #content ol,
.our-office #content ol,
.office-tour #content ol,
body[class*="-after"] #content ol {
  margin: 0;
}
#content ul li {
  list-style: disc outside;
}
/* ==================================================================
	masthead
=================================================================== */
#masthead {
  width: 100%;
  min-height: 44px;
  padding: 0;
  position: absolute;
  z-index: 3000;
  top: 0;
  left: 0;
}
#masthead::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #fff;
  transition: transform 0.33s ease-in-out;
}
@media only screen and (max-width: 1023px) {
  #masthead {
    height: 120px;
  }
  #masthead.ready.mobtron #logo {
    opacity: 0;
    transform: scale(0.5);
  }
  #masthead.ready.mobtron::before {
    transform: translate(0, -100%);
  }
  #masthead.ready.mobtron .contactinfo a {
    color: #fff;
  }
  #masthead.ready.mobtron .contactinfo a:hover,
  #masthead.ready.mobtron .contactinfo a:focus {
    color: #b3fff8;
  }
}
@media only screen and (min-width: 1024px) {
  #masthead {
    /* font-size: inherit; */
    font-size: min(1em, 1.325vw);
    height: 7.25em;
    position: fixed;
  }
  #masthead.ready #hd .mod {
    transform: translate(47.5%, 0);
  }
  #masthead.ready #hd .mod .utilitynav {
    opacity: 0;
  }
  #masthead.ready #logo {
    opacity: 0;
    transform: scale(0.5);
  }
  #masthead.ready .contactinfo a {
    color: #fff;
  }
  #masthead.ready .contactinfo a:hover,
  #masthead.ready .contactinfo a:focus {
    color: #b3fff8;
  }
  #masthead.ready a[id] {
    color: #fff;
  }
  #masthead.ready a[id]::after {
    background-color: #fff;
  }
  #masthead.ready::before {
    transform: translate(0, -100%);
  }
}
#masthead .container {
  max-width: none;
  width: calc(100% - 3em);
}
@media only screen and (max-width: 1023px) {
  #masthead .container {
    width: 100%;
  }
}
/* ===============================================
TRIGGER/NAVICON
=============================================== */
#trigger {
  line-height: 44px;
  color: #fff;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding: 5px 0 0;
  background: none;
  box-shadow: none;
  border: none;
  -webkit-display: none;
  position: relative;
  display: block;
  z-index: 600;
  transition: color 0.33s ease-in-out;
  cursor: pointer;
}
#trigger:focus-visible {
  color: #8dc641;
}
@media only screen and (min-width: 1024px) {
  #trigger {
    display: none;
  }
}
#trigger::after {
  content: "MENU";
  display: block;
  font-size: 23px;
  letter-spacing: 0.03em;
}
.open #trigger .navicon span:nth-child(1) {
  transform: translate(0, 17.5px) scaleX(0) rotate(0deg);
}
.open #trigger .navicon span:nth-child(4) {
  transform: translate(0, -17.5px) scaleX(0) rotate(0deg);
}
.open #trigger .navicon span:nth-child(2) {
  transform: translate(0, 0) scaleX(1) rotate(45deg);
}
.open #trigger .navicon span:nth-child(3) {
  transform: translate(0, 0) scaleX(1) rotate(-45deg);
}
#trigger .navicon {
  width: 70px;
  height: 35px;
  display: inline-block;
  vertical-align: -11.5px;
  position: relative;
}
#trigger .navicon span {
  width: 100%;
  height: 3px;
  margin: auto;
  background: currentcolor;
  display: block;
  position: absolute;
  left: 0;
  opacity: 1;
  transform: translate(0, 0) scaleX(1) rotate(0deg);
  transition: transform 0.3s ease;
}
#trigger .navicon span:nth-child(1) {
  top: 0;
}
#trigger .navicon span:nth-child(2),
#trigger .navicon span:nth-child(3) {
  top: 0;
  bottom: 0;
}
#trigger .navicon span:nth-child(4) {
  bottom: 0;
}
/* ==================================================================
	main-nav
=================================================================== */
#main-nav {
  font-size: 20px;
  text-align: center;
  width: 125px;
  height: 100%;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  clear: both;
  background-color: #16aa9c;
  /* a{ 
		@media only screen and (max-width: 1023px) { visibility:hidden; } 
	} */
}
@media only screen and (min-width: 1024px) {
  #main-nav {
    font-size: inherit;
    width: 100%;
    height: 2.9em;
    margin-top: 2em;
    background: none;
    box-shadow: none;
    top: auto;
    bottom: 0;
    z-index: 2900;
  }
}
#main-nav.open {
  /* a{  
			@media only screen and (max-width: 1023px) { visibility:visible; } 
		} */
}
@media only screen and (max-width: 1023px) {
  #main-nav.open .collapsible {
    transition-duration: 0.33s;
    transition-timing-function: ease;
    transform: translate(0, 0);
    visibility: visible;
    pointer-events: auto;
    opacity: 1;
  }
}
@media only screen and (max-width: 1023px) {
  #main-nav .collapsible {
    width: 100vw;
    max-width: 320px;
    position: absolute;
    top: 100%;
    right: 0;
    transition-property: transform, opacity, visibility;
    transition-duration: 0.09s;
    transition-timing-function: linear;
    transform: translate(100%, 0);
    visibility: hidden;
    pointer-events: none;
    opacity: 0;
  }
}
@media only screen and (min-width: 1024px) {
  #main-nav .collapsible {
    margin: 0 auto;
    position: relative;
  }
}
#main-nav .container {
  height: 100%;
  padding: 0;
}
@media only screen and (min-width: 1024px) {
  #main-nav .container {
    width: calc(100% - 3.2em);
    max-width: right;
  }
}
#main-nav .mod {
  background-color: #fff;
  width: 100%;
  padding: 40px 0;
}
@media only screen and (max-width: 767px) {
  #main-nav .mod {
    transition-property: transform, opacity;
    transition-duration: 0.6s, 0.9s;
    transition-timing-function: ease-in-out;
    transition-delay: 0.24s;
  }
  #main-nav .mod.mobtron {
    transform: translate(0, -33px);
    transition-duration: 0s;
    transition-delay: 0s;
    pointer-events: none;
    opacity: 0;
  }
  #main-nav .mod.mobtron * {
    pointer-events: none;
  }
  #main-nav .mod.mobtron:focus-within {
    transform: translate(0, 0);
    transition-duration: 0.3s;
    transition-timing-function: ease;
    transition-delay: 0s;
    pointer-events: auto;
    opacity: 1;
  }
  #main-nav .mod.mobtron:focus-within * {
    pointer-events: auto;
  }
}
#main-nav .mod .utilitynav {
  flex-direction: column;
}
#main-nav .mod .contactinfo .phone {
  line-height: 1.4;
  margin-bottom: 20px;
}
#main-nav .mod .contactinfo .phone .cta:nth-child(1) {
  display: block;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  #main-nav .mod .contactinfo {
    display: none;
  }
}
@media only screen and (min-width: 1024px) {
  #main-nav .mod {
    display: none;
  }
}
@media only screen and (max-width: 1299px) {
  #main-nav .mod {
    box-shadow: 0 15px 15px rgba(0, 0, 0, 0.15);
  }
}
/* ===============================================
TOP LEVEL ITEMS || top ul
=============================================== */
#main-nav ul {
  margin: 0;
  padding: 60px 0 40px;
  background-color: #16aa9c;
  position: relative;
  z-index: 550;
}
@media only screen and (max-width: 1023px) {
  #main-nav ul {
    display: flex;
    flex-direction: column;
  }
}
@media only screen and (min-width: 1024px) {
  #main-nav ul {
    height: 2.9em;
    width: auto;
    margin: 0;
    padding: 0;
    background: none;
    position: static;
    float: right;
  }
}
#main-nav ul li {
  clear: both;
  cursor: pointer;
}
@media (min-width: 1024px) and (max-width: 1299px) and (pointer: coarse) {
  #main-nav ul li {
    /* flyout appear on tablet click event */
  }
  #main-nav ul li.open > ul {
    width: auto;
    height: auto;
    margin: 0;
    clip: auto;
    pointer-events: auto;
  }
}
@media only screen and (min-width: 1024px) {
  #main-nav ul li {
    margin: 0 1.5em 0 0;
    background: none;
    vertical-align: top;
    clear: none;
  }
  #main-nav ul li a:focus-visible + ul,
  #main-nav ul li ul:focus-within,
  #main-nav ul li:hover > ul {
    width: auto;
    height: auto;
    margin: 0;
    clip: auto;
    pointer-events: auto;
  }
  #main-nav ul li.contact,
  #main-nav ul li.contact-us {
    margin-right: 0;
    padding-right: 0;
  }
  #main-nav ul li.contact:focus-visible > ul,
  #main-nav ul li.contact-us:focus-visible > ul,
  #main-nav ul li.contact:focus-within > ul,
  #main-nav ul li.contact-us:focus-within > ul,
  #main-nav ul li.contact.clicked > ul,
  #main-nav ul li.contact-us.clicked > ul,
  #main-nav ul li.contact.active > ul,
  #main-nav ul li.contact-us.active > ul,
  #main-nav ul li.contact:hover ul,
  #main-nav ul li.contact-us:hover ul {
    margin: 0;
    left: auto;
    right: 0em;
  }
  #main-nav ul li.contact ul li a,
  #main-nav ul li.contact-us ul li a {
    text-align: right;
    float: right;
  }
}
#main-nav ul li a[id] {
  line-height: 50px;
  font-size: 30px;
  color: #fff;
  height: 50px;
  margin: 0;
  transition: color 0.33s ease;
  pointer-events: none;
  letter-spacing: 0.03em;
}
@media only screen and (min-width: 1024px) {
  #main-nav ul li a[id] {
    line-height: 1.33333333;
    font-size: clamp(12px, 1.5em, 30px);
    text-align: center;
    height: 100%;
    z-index: 3000;
    pointer-events: auto;
    color: #774d25;
  }
}
@media (min-width: 1024px) and (max-width: 1299px) and (pointer: coarse) {
  #main-nav ul li a[id] {
    /* allows tablet users to access flyouts on desktop style nav */
    z-index: -1;
  }
  #main-nav ul li a[id].home {
    z-index: 1;
  }
}
#main-nav ul li a[id]:after {
  content: "";
  width: 100%;
  height: 6.5px;
  background-color: #8dc641;
  display: block;
  position: absolute;
  left: 0;
  transition:
    transform 0.33s ease-in-out,
    opacity 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  transform: translate(0, 0) scaleX(0);
  opacity: 0;
  border-radius: 3px;
}
@media only screen and (max-width: 1023px) {
  #main-nav ul li a[id]:after {
    bottom: 0px;
  }
}
@media only screen and (min-width: 1024px) {
  #main-nav ul li a[id]:after {
    bottom: 0.4em;
  }
}
#main-nav ul li a[id].home {
  pointer-events: auto;
}
#main-nav ul li:focus-within > a[id],
#main-nav ul li.clicked > a[id],
#main-nav ul li.active > a[id],
#main-nav ul li:hover > a[id] {
  text-decoration: none;
  transition-duration: 0.15s;
}
#main-nav ul li:focus-within > a[id]:after,
#main-nav ul li.clicked > a[id]:after,
#main-nav ul li.active > a[id]:after,
#main-nav ul li:hover > a[id]:after {
  transition-duration: 0.15s;
  transform: translate(0, 0) scaleX(1);
  opacity: 1;
}
/* ===============================================
Flyout || ul ul
=============================================== */
#main-nav ul ul {
  width: 100%;
  padding: 0;
  background: none;
  border: none;
  float: left;
  transition: visibility 0.33s ease-in-out;
}
@media only screen and (min-width: 1024px) {
  #main-nav ul ul {
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 1em 0;
    position: absolute;
    left: 0em;
    clip: rect(0 0 0 0);
    pointer-events: none;
    z-index: 2800;
    background: #09978a;
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 50px;
    overflow: hidden;
  }
}
#main-nav ul ul li {
  height: 0;
  background: none;
  opacity: 0;
  overflow: hidden;
  transition-duration: 0.33s;
}
#main-nav ul ul li:focus-within {
  overflow: visible;
}
@media only screen and (min-width: 1024px) {
  #main-nav ul ul li {
    height: 1.4em;
    margin: 0 0 0.35em;
    padding: 0;
    opacity: 1;
  }
}
#main-nav ul ul li a {
  line-height: 44px;
  font-size: clamp(12px, 0.8em, 16px);
  color: #fff;
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  transition: background-color 0.33s ease-in-out;
}
@media only screen and (min-width: 1024px) {
  #main-nav ul ul li a {
    line-height: 1.75;
    text-align: left;
    white-space: nowrap;
    height: 1.75em;
    padding: 0 2.15em 0 2.2em;
    float: left;
  }
}
#main-nav ul ul li a:focus-visible,
#main-nav ul ul li a:hover,
#main-nav ul ul li a.active {
  text-decoration: none;
  margin-bottom: 0;
  background: #8dc641;
  border: none;
}
/* ===============================================
TERTIARY || if ul ul ul exists
=============================================== */
/* ===============================================
Flyout animation
=============================================== */
@media only screen and (max-width: 1023px) {
  #main-nav.open ul ul {
    visibility: hidden;
  }
  #main-nav.open ul .clicked ul {
    padding: 0 0 1em;
    visibility: visible;
  }
  #main-nav.open ul .clicked ul li {
    height: 44px;
    opacity: 1;
  }
}
/* socialmedia */
.collapsible .socialmedia {
  line-height: 0;
  text-align: center;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  background: #f00;
  justify-content: center;
  position: relative;
}
@media only screen and (max-width: 1023px) {
  .collapsible .socialmedia {
    display: flex;
  }
}
@media only screen and (min-width: 1024px) {
  .collapsible .socialmedia {
    display: none;
  }
}
.collapsible .socialmedia a {
  line-height: 48px;
  font-size: 25px;
  color: #fff;
  width: 48px;
  height: 48px;
  display: inline-block;
  vertical-align: top;
  position: relative;
  transition:
    opacity 0.33s ease-in-out,
    color 0.33s ease-in-out;
}
.collapsible .socialmedia a:focus-visible {
  opacity: 0.5;
  outline: auto;
}
.collapsible .socialmedia a:focus:active {
  outline: transparent;
}
.collapsible .socialmedia a:hover {
  z-index: 400;
}
.collapsible .socialmedia a .icon {
  position: relative;
}
/* ===============================================
	FULLMOB RULES
=============================================== */
/* ==================================================================
	header
=================================================================== */
#hd {
  text-align: center;
  color: #16aa9c;
  height: 100%;
  padding: 0;
  position: relative;
  pointer-events: none;
}
@media only screen and (min-width: 666px) {
  #hd {
    text-align: right;
  }
}
@media only screen and (min-width: 1024px) {
  #hd {
    z-index: 3000;
  }
}
#hd .container {
  height: 100%;
  pointer-events: none;
}
#hd .mod {
  justify-content: center;
  z-index: 420;
}
@media only screen and (max-width: 767px) {
  #hd .mod {
    width: 100%;
    display: none;
    gap: 24px;
    position: absolute;
    top: calc(100% + 20px);
    right: 0;
  }
}
@media only screen and (min-width: 768px) {
  #hd .mod {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    vertical-align: top;
    transition: transform 0.33s ease-in-out;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  #hd .mod {
    height: 100%;
    margin-right: 150px;
  }
  #hd .mod .utilitynav {
    display: none;
  }
}
@media only screen and (min-width: 1024px) {
  #hd .mod {
    padding-top: 15px;
  }
}
/* ===============================================
	logo
=============================================== */
#logo {
  line-height: 0;
  width: 12.4em;
  margin: 0 auto 0 2%;
  display: block;
  position: absolute;
  top: 0em;
  left: 0;
  pointer-events: auto;
  transition:
    opacity 0.33s ease-in-out,
    transform 0.33s ease-in-out;
  font-size: 0.8em;
  z-index: 1000;
}
@media only screen and (min-width: 1024px) {
  #logo {
    font-size: inherit;
    margin: 0;
    top: -0.65em;
  }
}
#logo a {
  display: inline-block;
  vertical-align: top;
  transition: opacity 0.33s ease-in-out;
}
@media only screen and (max-width: 1023px) {
  #logo a {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
}
#logo a:focus {
  opacity: 0.51;
}
#logo svg {
  width: 12.4em;
  height: 12.4em;
}
/* ===============================================
	contact info
=============================================== */
.contactinfo {
  text-align: center;
  width: auto;
  margin: 0;
  display: inline-block;
  vertical-align: top;
  pointer-events: auto;
}
.contactinfo .phone {
  font-size: clamp(12px, 1.1em, 22px);
  display: inline-block;
  vertical-align: top;
  text-transform: uppercase;
  letter-spacing: 0.0175em;
}
@media only screen and (max-width: 1023px) {
  .contactinfo .phone {
    line-height: 44px;
    font-size: 22px;
  }
}
@media only screen and (min-width: 1024px) {
  .contactinfo .phone {
    line-height: 1.68181818;
  }
}
.contactinfo .phone .icon {
  letter-spacing: normal;
  margin: 0 -2px;
}
.contactinfo a {
  color: #16aa9c;
  transition: color 0.33s ease-in-out;
}
.contactinfo a:focus,
.contactinfo a:hover {
  color: #8dc641;
}
.contactinfo a:focus .icon,
.contactinfo a:hover .icon {
  animation: fa-bounce 1s ease-in-out;
}
/* ===============================================
	utility-nav
=============================================== */
.utilitynav {
  line-height: 0;
  width: auto;
  margin: 0;
  padding: 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  vertical-align: top;
  position: relative;
  z-index: 400;
  pointer-events: auto;
  transition: opacity 0.33s ease-in-out;
}
.utilitynav ul {
  display: contents;
}
.utilitynav ul li {
  display: contents;
}
.utilitynav ul li:nth-child(n + 2) {
  margin: 0 0 0 0.5em;
}
.utilitynav a {
  font-size: clamp(12px, 1em, 20px);
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  padding: 0 1.075em;
  background: #16aa9c;
  display: inline-block;
  vertical-align: top;
  transition:
    color 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  position: relative;
  z-index: 1;
  font-weight: 300;
  letter-spacing: 0.03em;
}
.utilitynav a.pay {
  font-size: clamp(12px, 0.95em, 19px);
  padding: 0 1.21052632em;
}
@media only screen and (max-width: 1023px) {
  .utilitynav a {
    line-height: 44px;
    border-radius: 1.25em;
  }
}
@media only screen and (min-width: 1024px) {
  .utilitynav a {
    line-height: 1.85;
    border-radius: 0.925em;
  }
  .utilitynav a.pay {
    line-height: 1.94736842;
    border-radius: 0.97368421em;
  }
}
.utilitynav a .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
.utilitynav a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
.utilitynav a::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #16aa9c;
  border-radius: inherit;
  z-index: -2;
}
.utilitynav a:hover .cta,
.utilitynav a:focus .cta {
  transform: scale(1.1);
}
.utilitynav a:hover::before,
.utilitynav a:focus::before {
  opacity: 0.1;
  transform: scale(1.05);
  animation: moveBackground 5s linear infinite;
}
.utilitynav a:hover::after,
.utilitynav a:focus::after {
  background-color: #8dc641;
  transform: scale(1.05);
}
/* ===============================================
	socialmedia
=============================================== */
#hd .socialmedia,
#masthead > .socialmedia {
  line-height: 0;
  text-align: center;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 2px;
  position: absolute;
  top: 100%;
  right: 0;
  pointer-events: auto;
}
@media only screen and (min-width: 1024px) {
  #hd .socialmedia,
  #masthead > .socialmedia {
    width: 2.2em;
    margin: 0;
    flex-direction: column;
    top: 12.5em;
    right: 1em;
  }
}
@media only screen and (min-width: 1300px) {
  #hd .socialmedia,
  #masthead > .socialmedia {
    position: fixed;
  }
}
#hd .socialmedia a,
#masthead > .socialmedia a {
  font-size: clamp(12px, 0.55em, 11px);
  color: #fff;
  min-width: 24px;
  min-height: 24px;
  border-radius: 50%;
  background: rgba(22, 170, 156, 0.7);
  display: inline-block;
  vertical-align: top;
  position: relative;
  transition:
    transform 0.33s ease-in-out,
    color 0.33s ease-in-out;
}
@media only screen and (max-width: 1023px) {
  #hd .socialmedia a,
  #masthead > .socialmedia a {
    line-height: 44px;
    width: 44px;
    height: 44px;
  }
}
@media only screen and (min-width: 1024px) {
  #hd .socialmedia a,
  #masthead > .socialmedia a {
    line-height: 4;
    width: auto;
    height: 4em;
  }
}
#hd .socialmedia a:focus,
#masthead > .socialmedia a:focus,
#hd .socialmedia a:hover,
#masthead > .socialmedia a:hover {
  color: #fff;
  background: #8dc641;
  z-index: 400;
  transform: translate(0, 0) scale(1.44);
}
#hd .socialmedia a .icon,
#masthead > .socialmedia a .icon {
  position: relative;
}
/* ==================================================================
	slideshow
=================================================================== */
#slideshow {
  text-align: center;
  min-height: 37.33333333vw;
  background: #000;
  position: relative;
  z-index: 400;
  color: #fff;
}
@media only screen and (max-width: 1275px) {
  #slideshow {
    min-height: 500px;
  }
}
@media only screen and (min-width: 1276px) and (max-width: 1299px) {
  #slideshow {
    width: 100%;
    margin-top: 0;
    top: 0;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1999px) {
  #slideshow {
    height: 784px;
    min-height: 784px;
  }
}
#slideshow::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #131516;
  opacity: 0.3;
  z-index: 400;
}
#slideshow .plants {
  width: 26.1em;
  height: auto;
  z-index: 410;
  position: absolute;
  filter: drop-shadow(0px 50px 25px #000000);
  -webkit-filter: drop-shadow(0px 50px 25px #000000);
  top: 0;
  left: 0;
  font-size: min(4vw, 1em);
}
@media only screen and (max-width: 1299px) {
  #slideshow .plants {
    top: -8em;
    filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.5));
    -webkit-filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.5));
    left: -2em;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1999px) {
  #slideshow .plants {
    right: calc(50% + 23.9em);
    left: auto;
  }
}
#slideshow .plants svg,
#slideshow .plants img {
  width: 100%;
  height: auto;
}
#slideshow #home-slideshow {
  width: 100%;
  margin: 0;
}
@media only screen and (max-width: 665px) {
  #slideshow #home-slideshow {
    width: 90em;
    margin: 0 calc(-45em + 50vw);
  }
}
@media only screen and (max-width: 1299px) {
  #slideshow #home-slideshow {
    transform: none !important;
  }
}
@media only screen and (min-width: 1300px) {
  #slideshow #home-slideshow {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
  }
}
@media only screen and (min-width: 666px) and (max-width: 1999px) {
  #slideshow #home-slideshow {
    width: 100em;
    margin: 0 calc(-50em + 50vw);
  }
}
#slideshow #home-slideshow .hpslide {
  width: 100%;
  max-width: none;
}
#slideshow .ssoverlay {
  width: 94%;
  padding: 0;
  display: block;
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 420;
  max-width: 70.9em;
}
@media only screen and (max-width: 1023px) {
  #slideshow .ssoverlay {
    top: 55%;
  }
}
@media only screen and (min-width: 1024px) {
  #slideshow .ssoverlay {
    top: calc(50% + 3.65em);
  }
}
#slideshow .ssoverlay .mod {
  width: 100%;
  display: block;
  margin: 0 auto;
  text-align: center;
}
@media only screen and (min-width: 1024px) {
  #slideshow .ssoverlay .mod {
    max-width: 32.6em;
    margin-right: 0;
  }
}

#slideshow .ssoverlay h2.topic {
  line-height: 1;
  font-size: min(2.8em, 8vw);
  text-transform: uppercase;
  font-weight: bold;
}

#slideshow .ssoverlay h2.topic .trait {
  display: block;
  font-size: 1.2em;
  line-height: 0.5;
  text-transform: none;
  font-weight: 400;
  font-family: "shelby", sans-serif;
}

#slideshow .ssoverlay .slogan {
  line-height: 1;
  font-size: min(2.634em, 7.5vw);
  color: currentcolor;
  margin: 0 0 0.6833713em;
  display: block;
}
@media only screen and (min-width: 1300px) {
  #slideshow .ssoverlay .slogan span,
  #slideshow .ssoverlay h2.topic {
    opacity: 0;
  }
}
#slideshow .ssoverlay .slogan .name {
  line-height: 1.5;
  display: block;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.0525em;
}
#slideshow .ssoverlay .slogan .office {
  line-height: 2.70967742;
  font-size: clamp(12px, 0.58845862em, 31px);
  display: block;
  letter-spacing: 0.0375em;
}
#slideshow .ssoverlay .slogan .trait.top {
  line-height: 1;
  font-size: clamp(12px, 2.41078208em, 127px);
  display: block;
  letter-spacing: 0.045em;
  font-family: "shelby", sans-serif;
  font-weight: 400;
  white-space: nowrap;
  top: 0.2em;
  position: relative;
}
#slideshow .ssoverlay .slogan .trait.bottom {
  line-height: 1.33333333;
  font-size: clamp(12px, 0.56947608em, 30px);
  display: block;
  letter-spacing: 0.03em;
}
#slideshow .ssoverlay .spotbtn {
  font-size: 17px;
  text-align: center;
  color: #fff;
  padding: 0 1.94117647em;
  background: none;
  display: inline-block;
  vertical-align: top;
  position: relative;
  border-radius: 1.70588235em;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  background-color: #16aa9c;
  z-index: 1;
  line-height: 3.41176471;
}
#slideshow .ssoverlay .spotbtn .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
#slideshow .ssoverlay .spotbtn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
#slideshow .ssoverlay .spotbtn::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #8dc641;
  border-radius: inherit;
  z-index: -2;
}
#slideshow .ssoverlay .spotbtn:hover .cta,
#slideshow .ssoverlay .spotbtn:focus .cta {
  transform: scale(1.15);
}
#slideshow .ssoverlay .spotbtn:hover::before,
#slideshow .ssoverlay .spotbtn:focus::before {
  opacity: 0.1;
  transform: scale(1.1);
  animation: moveBackground 5s linear infinite;
}
#slideshow .ssoverlay .spotbtn:hover::after,
#slideshow .ssoverlay .spotbtn:focus::after {
  background-color: #16aa9c;
  transform: scale(1.1);
}
/* ==================================================================
	.spotlight
=================================================================== */
.spotlight {
  text-align: center;
  position: relative;
  z-index: 400;
}
.spotlight-bd-02 {
  background-color: #fff;
  overflow: hidden;
}
.spotlight-bd-02 .plants {
  position: static;
}
.spotlight-bd-02 .plants .plant01 {
  display: block;
  width: 54.35em;
  height: auto;
  position: absolute;
  top: 5em;
  left: 0%;
  z-index: -1;
}
@media only screen and (min-width: 1024px) {
  .spotlight-bd-02 .plants .plant01 {
    top: 10.35em;
    right: calc(50% + 3.3em);
    left: auto;
  }
}
@media only screen and (max-width: 767px) {
  .spotlight-bd-02 .plants .plant01 {
    display: none;
  }
}
.spotlight-bd-02 .plants .plant02 {
  display: block;
  width: 62.5em;
  height: 53.65em;
  position: absolute;
  top: calc(50% - 37em);
  right: 1%;
  z-index: -1;
}
@media only screen and (max-width: 767px) {
  .spotlight-bd-02 .plants .plant02 {
    display: none;
  }
}
@media only screen and (min-width: 1024px) {
  .spotlight-bd-02 .plants .plant02 {
    top: 45.5em;
    left: calc(50% + 1.55em);
    right: auto;
  }
}
.spotlight-bd-02 .plants .plant03 {
  display: block;
  width: 39em;
  height: 34em;
  position: absolute;
  bottom: 8%;
  right: -10%;
  z-index: -1;
}
@media only screen and (max-width: 767px) {
  .spotlight-bd-02 .plants .plant03 {
    display: none;
  }
}
@media only screen and (min-width: 1024px) {
  .spotlight-bd-02 .plants .plant03 {
    right: calc(50% + 17.7em);
    bottom: 0.5em;
  }
}
.spotlight > div {
  position: relative;
}
/* ==================================================================
	subnav
=================================================================== */
#subnav {
  text-align: center;
  color: #fff;
  padding: 3.75em 0;
  position: relative;
  overflow: hidden;
  background-color: #16aa9c;
}
@media only screen and (max-width: 1299px) {
  #subnav {
    display: none;
  }
}
@media only screen and (min-width: 1300px) {
  #subnav {
    padding-top: 11em;
  }
}
@media only screen and (max-width: 1299px) {
  #subnav nav {
    width: 100vw;
    display: none;
  }
}
#subnav p {
  font-size: clamp(12px, 0.75em, 15px);
  margin: 0 auto;
  padding: 0;
}
@media only screen and (max-width: 1299px) {
  #subnav p {
    line-height: 44px;
    white-space: nowrap;
    padding-right: 9%;
    scroll-snap-type: x;
    overflow-x: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  #subnav p::-webkit-scrollbar {
    display: none;
  }
}
@media only screen and (min-width: 1300px) {
  #subnav p {
    line-height: 1.66666667;
    width: 60.8365019%;
  }
}
#subnav a {
  color: #fff;
  margin: 0 0.8em;
  display: inline-block;
  vertical-align: top;
  position: relative;
  padding: 0 0.5em;
  transition: color 0.33s ease-in-out;
}
@media only screen and (min-width: 1024px) {
  #subnav a {
    margin: 0;
  }
}
#subnav a:after {
  content: "";
  width: 100%;
  height: 100%;
  background: #fff;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  transition:
    transform 0.33s ease-in-out,
    opacity 0.33s ease-in-out;
  transform: translate(0, 0) scaleX(0);
  opacity: 0;
  z-index: -1;
  border-radius: 12.5px;
}
#subnav a:focus,
#subnav a:hover,
#subnav a.active {
  color: #16aa9c;
  text-decoration: none;
}
#subnav a:focus:after,
#subnav a:hover:after,
#subnav a.active:after {
  transform: translate(0, 0) scaleX(1);
  opacity: 1;
}
#subnav .divider {
  margin: 0 0.45em;
  width: 5px;
  height: 5px;
  display: inline-block;
  vertical-align: 3px;
  background-color: #fff;
  border-radius: 50%;
}
/* ==================================================================
	content
=================================================================== */
#bd {
  padding: 12.5em 0 3em;
  background: #fff;
  position: relative;
  z-index: 400;
}
@media only screen and (min-width: 768px) {
  #bd {
    padding-top: 12.5em;
    padding-bottom: 3em;
  }
}
@media only screen and (min-width: 1024px) {
  #bd {
    padding-top: 15em;
  }
}
@media only screen and (min-width: 1300px) {
  #bd {
    padding-top: 4em;
  }
}
#bd .container {
  width: 90%;
  max-width: 65.75em;
}
#content {
  max-width: 800px;
  display: block;
}
@media only screen and (min-width: 768px) {
  #content {
    width: 60.8365019%;
    max-width: 40em;
    float: left;
  }
}
@media only screen and (min-width: 1300px) {
  #content {
    width: 60.8365019%;
  }
}
#content .content-text {
  line-height: 1.68421053;
}
@media only screen and (min-width: 666px) {
  #content .content-text {
    font-size: min(2.3vw, 19px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 1299px) {
  #content .content-text {
    max-width: 70ch;
  }
}
@media only screen and (min-width: 1300px) {
  #content .content-text {
    font-size: 19px;
  }
}
@keyframes patternScroll {
  0% {
    background-position: 0 center;
  }
  100% {
    background-position: 20px center;
  }
}
/* ==================================================================
	.home content
=================================================================== */
.home #bd {
  padding: 10em 0 3em;
  background: none;
  text-align: left;
  color: #433524;
}
.home #bd .dotted-line {
  display: block;
  width: 100%;
  position: absolute;
  background: url(../images/patterns/pattern01.svg) center / auto 100% repeat;
  height: 6px;
  top: 4.35em;
  animation: patternScroll 1s linear infinite;
}
@media only screen and (min-width: 768px) {
  .home #bd {
    padding: 11.8em 0 2em;
  }
}
@media only screen and (min-width: 1300px) {
  .home #bd {
    padding: 11.8em 0 1.3em;
  }
}
.home #bd .decoration {
  width: 90%;
  max-width: 26em;
  margin: 0 auto 3em;
  position: relative;
}
@media only screen and (min-width: 1024px) {
  .home #bd .decoration {
    position: absolute;
    top: 0.9em;
    right: calc(50% + 6.9em);
    width: 40%;
    margin: 0;
  }
}
.home #bd .decoration img {
  width: 100%;
  box-shadow: 12.5px 21.651px 25px 0px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  position: relative;
  z-index: 1;

  border: solid 5px #8dc641;
}
.home #bd .decoration .plants {
  position: absolute;
  top: -15.75%;
  left: -21%;
  width: 73.27%;
  height: auto;
}
@media only screen and (max-width: 665px) {
  .home #bd .decoration .plants {
    left: -10%;
  }
}
.home #bd .container {
  width: 90%;
  max-width: 65em;
  /* @media only screen and (min-width: 768px) and (max-width: 1299px) { 
			max-width:70ch; 
		} */
}
@media only screen and (min-width: 768px) {
  .home #bd #content {
    width: 100%;
    max-width: 60ch;
    margin-left: auto;
    margin-right: auto;
    float: none;
  }
}
@media only screen and (min-width: 1024px) {
  .home #bd #content {
    max-width: 37.4em;
    width: 57.53846154%;
    margin-right: 0;
  }
}
@media only screen and (min-width: 666px) {
}
@media only screen and (min-width: 1300px) {
}
.home #bd #content .content-text h2 {
  font-size: 1.31578947em;
  line-height: 1;
  margin-bottom: 0.85em;
  color: currentColor;
  text-transform: none;
  letter-spacing: 0.0375em;
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .home #bd #content .content-text h2 {
    font-size: min(2.75vw, 1em);
  }
}
.home #bd #content p {
  margin-bottom: 1.3em;
  letter-spacing: 0.01em;
}
/* ==================================================================
	custom content
=================================================================== */
.mediaslider {
  text-align: center;
  max-width: calc(100% - 88px);
  display: inline-block;
  vertical-align: top;
  position: relative;
}
.mediaslider button {
  background: none;
  border: none;
  -webkit-appearance: none;
  cursor: pointer;
  pointer-events: auto;
}
.mediaslider .cycle-slideshow {
  width: 100%;
  margin: 0.5em 0 1.5em;
  position: relative;
  pointer-events: none;
  z-index: 400;
}
.mediaslider .cycle-slideshow > button {
  font-size: 2.8em;
  color: #16aa9c;
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  transition: opacity 0.35s ease;
  pointer-events: auto;
}
.mediaslider .cycle-slideshow > button.cycle-prev {
  text-align: left;
  left: auto;
  right: 100%;
}
.mediaslider .cycle-slideshow > button.cycle-next {
  text-align: right;
  direction: rtl;
  right: auto;
  left: 100%;
}
.mediaslider .cycle-slideshow > button:focus,
.mediaslider .cycle-slideshow > button:hover {
  opacity: 0.69;
}
.mediaslider .cycle-slideshow > button .icon {
  transform-origin: 50% 50%;
}
.mediaslider.ba .cycle-slideshow:before,
.mediaslider.ba.top .cycle-slideshow:before,
.mediaslider.ba .cycle-slideshow:after,
.mediaslider.ba.top .cycle-slideshow:after {
  width: 50%;
  padding: 0.66em 0;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0.54) 0%,
    rgba(0, 0, 0, 0) 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0.54) 0%,
    rgba(0, 0, 0, 0) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.54) 0%,
    rgba(0, 0, 0, 0) 100%
  );
  display: block;
  position: absolute;
  top: 0;
  z-index: 420;
}
.mediaslider.ba .cycle-slideshow:before,
.mediaslider.ba.top .cycle-slideshow:before {
  content: "Before";
  left: 0;
}
.mediaslider.ba .cycle-slideshow:after,
.mediaslider.ba.top .cycle-slideshow:after {
  content: "After";
  right: 0;
}
.mediaslider.ba.bottom .cycle-slideshow:before,
.mediaslider.ba.bottom .cycle-slideshow:after {
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  top: auto;
  bottom: 0;
}
.mediaslider.multi .cycle-slide {
  display: flex !important;
}
.mediaslider.multi .cycle-slide img {
  width: 50%;
}
.mediaslider .custompager {
  margin-bottom: 1.58em;
  display: block;
  position: relative;
}
.mediaslider .custompager > button {
  height: 44px;
  display: inline-block;
  vertical-align: top;
  position: relative;
}
@media only screen and (max-width: 1299px) {
  .mediaslider .custompager > button {
    width: 44px;
  }
}
@media only screen and (min-width: 1300px) {
  .mediaslider .custompager > button {
    width: 1rem;
    margin: 0 6px;
    cursor: pointer;
  }
}
.mediaslider .custompager > button:before {
  content: "";
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background-color: #16aa9c;
  margin: auto;
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transition: background-color 0.33s ease-in-out;
}
.mediaslider .custompager > button:focus:before,
.mediaslider .custompager > button:hover:before,
.mediaslider .custompager > button.cycle-pager-active:before {
  background-color: #8dc641;
}
.mediaslider .cycle-caption.large,
.mediaslider .cycle-caption {
  font-size: min(1rem, 1em);
  white-space: normal;
  padding: 0.66em;
  display: block;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 420;
}
.mediaslider .cycle-caption.large:after,
.mediaslider .cycle-caption:after {
  content: "";
  width: auto;
  height: auto;
  background: -moz-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  background: -webkit-linear-gradient(
    top,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.54) 100%
  );
  display: block;
  position: absolute;
  top: -1.68em;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
}
.mediaslider .cycle-caption.large {
  position: relative;
}
.mediaslider .cycle-caption.large:after {
  background: #8dc641;
  top: 0;
}

.office-tour .embed-container { max-width: calc(100% - 88px);  }
.office-tour .embed-container video { width:100%;  }

/* content centered for slideshow, video-centric, and/or full width content */
.before-and-after #content,
.office-tour #content,
.smile-gallery #content,
.invisalign-videos #content {
  text-align: center;
}
.before-and-after #content h1,
.office-tour #content h1,
.smile-gallery #content h1,
.invisalign-videos #content h1,
.before-and-after #content h2,
.office-tour #content h2,
.smile-gallery #content h2,
.invisalign-videos #content h2,
.before-and-after #content h3,
.office-tour #content h3,
.smile-gallery #content h3,
.invisalign-videos #content h3,
.before-and-after #content p,
.office-tour #content p,
.smile-gallery #content p,
.invisalign-videos #content p {
  text-align: center;
}
.before-and-after .img-left,
.office-tour .img-left,
.smile-gallery .img-left,
.invisalign-videos .img-left,
.before-and-after .img-right,
.office-tour .img-right,
.smile-gallery .img-right,
.invisalign-videos .img-right {
  margin: 0 auto;
  float: none;
}
/* blockquote styling */
#content blockquote {
  margin: 0 0 1.58em;
  padding: 0 0 0 1em;
  border-left: 0.33em solid #f0f0f0;
}
/* comment line below if patient-login is live and legit */
.financial-information #financial-online-services {
  display: none;
}
/* common treatments */
.before-after-image {
  width: 44%;
  display: inline-block;
  vertical-align: top;
}
.before-after-image img,
.before-after-image span {
  display: block;
}
@media only screen and (min-width: 768px) {
  .before-after-image img,
  .before-after-image span {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) {
  .before-after-box,
  p.before-after-text {
    width: 49%;
    display: inline-block;
    vertical-align: top;
  }
}
/* common procedures */
@media only screen and (min-width: 1300px) {
  #content,
  #content h2[id],
  .common-procedures #content h2[id] {
    scroll-margin-top: 200px;
  }
}
/* preventive-care */
.preventive-care #content ul {
  display: inline-block;
}
/* reduces dimensions of coronavirus tab */
#coronavirus-update {
  font-size: 0.84em;
  padding: 0.5em 1.25em !important;
  left: 0.5em !important;
}
@media only screen and (min-width: 1300px) {
  #coronavirus-update {
    font-size: 1em;
  }
}
/* ==================================================================
	meet the team page classes for individual and full team images 
=================================================================== */
.staff {
  width: 45%;
  max-width: 10em;
  margin: 0 0 1em 1em;
  display: block;
  float: right;
}
.team {
  width: 100%;
  max-width: 1000px;
  margin: 2% auto;
  display: block;
}
/* ==================================================================
	sitemap
=================================================================== */
.sitemap #content .column > ul > li {
  margin-bottom: 1.45em;
}
.sitemap #content ul {
  list-style: none;
  margin-left: 0;
  margin-bottom: 0;
}
.sitemap #content ul a {
  line-height: 1.25;
  font-size: clamp(12px, 1.4em, 28px);
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  color: #8dc641;
  transition-duration: 0s;
}
.sitemap #content ul ul li a {
  line-height: 1.68421053;
  font-size: 1em;
  font-style: normal;
  font-weight: 400;
  text-transform: none;
  color: #2b1a06;
  margin-left: 0;
}
.sitemap #content a:focus,
.sitemap #content a:hover {
  color: #16aa9c;
  text-decoration: none;
}
body.sitemap #bd ul li {
  list-style: none;
}
body.sitemap #bd ul ul li {
  list-style: none;
  margin-left: 0;
}
body.sitemap #content .width1 {
  width: 100%;
}
@media only screen and (min-width: 768px) {
  body.sitemap #content .width1 {
    width: 50%;
  }
  body.sitemap #content .width1:not(.first) {
    width: auto;
    float: right;
  }
}
/* global override */
/* ==================================================================
	sidebar
=================================================================== */
#sidebar {
  width: 100%;
  max-width: 24.05em;
  margin: 0 auto 2.5em;
  padding: 0;
  display: none;
  position: relative;
  z-index: 420;
}
@media only screen and (min-width: 768px) {
  #sidebar {
    width: 36.57794677%;
    margin: 1.15em -5px 1em 0;
    display: block;
    float: right;
    clear: right;
  }
}
/* ===============================================
	sitepics
=============================================== */
#hide-stock {
  position: relative;
}
@media only screen and (min-width: 1300px) {
  #hide-stock {
    opacity: 0;
  }
}
.stock {
  width: 100%;
  position: relative;
  border-radius: 50%;
  box-shadow: 12.5px 21.651px 25px 0px rgba(0, 0, 0, 0.15);
}
/* ===============================================
	show doctor image on all devices
=============================================== */
/*.home,*/
/*body[class^='meet-the-'],*/
/*body[class^='meet-our-'],*/
.meet-the-doctor #sidebar,
body[class*="meet-dr-"] #sidebar,
body[class*="meet-doctor-"] #sidebar {
  display: block;
}
body[class~="blog"] #sidebar {
  display: block;
}
body[class~="blog"] #hide-stock {
  display: none;
}
/* END SIDEBAR */
/* ===============================================
	spot00 || COMMON SERVICES/CALLOUT-LIKE SECTION EXAMPLE
=============================================== */
.spot01 {
  font-size: min(20px, 4.5vw);
  text-align: center;
  color: #16aa9c;
  margin: 0;
  padding: 5em 0 3em;
  position: relative;
  z-index: 410;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 6em;
}
@media only screen and (min-width: 768px) {
  .spot01 {
    padding: 5.6em 0;
  }
}
@media only screen and (min-width: 1024px) {
  .spot01 {
    flex-direction: row;
    font-size: min(1.3vw, 1em);
    gap: 4em;
    padding-bottom: 2.5em;
  }
}
@media only screen and (min-width: 1300px) {
  .spot01 {
    padding-left: 6.2em;
  }
}
.spot01 a {
  color: #fff;
  width: 90%;
  max-width: 20em;
  padding: 0 2em;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  vertical-align: top;
  position: relative;
  background-color: #16aa9c;
  height: 12.65em;
  border-radius: 50px;
  transition: background-color 0.33s ease-in-out;
  z-index: 1;
}
.spot01 a .pattern {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: center / cover repeat;
  background-position: 165% 185%;
  background-size: 16.55em auto;
  z-index: -1;
  opacity: 0.05;
  border-radius: inherit;
}
.spot01 a .decoration {
  width: 100%;
  position: absolute;
  top: -5.05em;
  left: 50%;
  transform: translate(-50%, 0);
  max-width: 10em;
  filter: drop-shadow(0px 15px 7.5px rgba(0, 0, 0, 0.15));
  -webkit-filter: drop-shadow(0px 15px 7.5px rgba(0, 0, 0, 0.15));
}
.spot01 a .decoration svg {
  width: 100%;
  height: auto;
}
.spot01 a .decoration svg g,
.spot01 a .decoration svg path {
  transform-origin: 50% 50%;
  transform-box: fill-box;
  transition: transform 0.33s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot01 a h2.topic {
  line-height: 1;
  font-size: clamp(12px, 1.85em, 37px);
  color: currentcolor;
  width: 100%;
  display: block;
  font-weight: 400;
  margin-bottom: 0.5em;
  letter-spacing: 0.03em;
}
.spot01 a h2.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.2;
  font-size: clamp(12px, 0.40540541em, 15px);
  font-weight: 700;
  font-style: italic;
  display: block;
}
.spot01 a .info {
  line-height: 1.2;
  font-size: clamp(12px, 0.8em, 16px);
  margin: 0;
}
.spot01 a:focus,
.spot01 a:hover {
  background-color: #8dc641;
}
.spot01 a:focus .pattern,
.spot01 a:hover .pattern {
  animation: patternMove 7.5s linear infinite;
}
.spot01 a:focus .decoration svg .animal__specimen,
.spot01 a:hover .decoration svg .animal__specimen {
  animation: animalBounce 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot01 a:focus .decoration svg .animal__dots,
.spot01 a:hover .decoration svg .animal__dots {
  animation: dotsRotate 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot01 a:focus .decoration svg .animal__plant,
.spot01 a:hover .decoration svg .animal__plant {
  animation: plantSway 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}
/* ===============================================
	spot00 || COMMON GENERAL INFORMATION SPOTLIGHT SECTION REVERSE
=============================================== */
.spot02 {
  color: #1b1b18;
  padding: 3em 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2em;
  flex-direction: column;
}
@media only screen and (min-width: 768px) {
  .spot02 {
    padding: 5em 0 2.5em;
    gap: 4em;
  }
}
@media only screen and (min-width: 1024px) {
  .spot02 {
    padding: 2.5em 0;
    flex-direction: row-reverse;
    font-size: min(1.3vw, 1em);
    gap: 6em;
  }
}
.spot02 .decoration {
  width: 80%;
  max-width: 26em;
  display: block;
  position: relative;
  color: #fff;
  margin-bottom: min(10em, 45vw);
}
@media only screen and (min-width: 768px) {
  .spot02 .decoration {
    margin-bottom: 6em;
  }
}
@media only screen and (min-width: 1024px) {
  .spot02 .decoration {
    margin-bottom: 0;
  }
}
.spot02 .decoration .plants {
  position: absolute;
  top: 10.25%;
  right: -14.25%;
  width: 83.08%;
  height: auto;
}
@media only screen and (max-width: 665px) {
  .spot02 .decoration .plants {
    right: -11%;
  }
}
.spot02 .decoration img {
  width: 100%;
  box-shadow: 12.5px 21.651px 25px 0px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  position: relative;
  z-index: 1;
  border: solid 5px #8dc641;
}
.spot02 .decoration .info-graphic {
  position: absolute;
  bottom: -23.5%;
  right: -0.5%;
  z-index: 1;
  width: 14.95em;
  height: 14.95em;
  text-align: left;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 0.5em 5.8em 0 3em;
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .spot02 .decoration .info-graphic {
    bottom: auto;
    font-size: min(4.5vw, 1em);
    top: calc(100% - 5em);
  }
}
@keyframes spot02patternMove {
  0% {
    background-position: 25% 390%;
  }
  100% {
    background-position: calc(25% + 16.55em) 390%;
  }
}
.spot02 .decoration .info-graphic .background {
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #8dc641;
  z-index: -1;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='299px' height='299px'%3E%3Cpath fill-rule='evenodd' fill='rgb(141, 198, 65)' d='M298.998,149.443 C298.998,153.082 290.124,156.366 289.860,159.938 C289.592,163.562 297.882,168.119 297.352,171.664 C296.815,175.255 287.553,177.186 286.757,180.685 C285.953,184.221 293.468,189.967 292.410,193.399 C291.343,196.862 281.896,197.382 280.581,200.728 C279.257,204.098 285.825,210.906 284.261,214.147 C282.689,217.405 273.270,216.504 271.467,219.620 C269.656,222.749 275.132,230.463 273.100,233.438 C271.061,236.422 261.882,234.127 259.633,236.944 C257.379,239.766 261.648,248.209 259.194,250.852 C256.739,253.497 248.002,249.867 245.356,252.323 C242.712,254.777 245.684,263.758 242.862,266.011 C240.044,268.261 231.942,263.376 228.959,265.413 C225.983,267.446 227.587,276.770 224.458,278.581 C221.341,280.384 214.058,274.347 210.799,275.918 C207.558,277.482 207.751,286.941 204.381,288.264 C201.034,289.579 194.739,282.519 191.276,283.585 C187.843,284.643 186.613,294.024 183.076,294.828 C179.577,295.623 174.413,287.699 170.822,288.235 C167.276,288.765 164.658,297.857 161.033,298.124 C157.461,298.389 153.531,289.784 149.893,289.784 C146.254,289.784 142.324,298.389 138.752,298.124 C135.128,297.857 132.509,288.765 128.964,288.235 C125.373,287.699 120.208,295.623 116.708,294.828 C113.172,294.024 111.942,284.643 108.509,283.585 C105.046,282.519 98.750,289.578 95.404,288.264 C92.034,286.941 92.226,277.482 88.985,275.918 C85.727,274.346 78.444,280.384 75.326,278.580 C72.197,276.769 73.801,267.446 70.825,265.413 C67.842,263.375 59.740,268.260 56.923,266.011 C54.101,263.757 57.072,254.776 54.428,252.322 C51.783,249.866 43.046,253.496 40.590,250.851 C38.136,248.208 42.405,239.765 40.152,236.944 C37.902,234.126 28.723,236.421 26.685,233.437 C24.653,230.463 30.129,222.749 28.318,219.620 C26.515,216.503 17.096,217.405 15.524,214.146 C13.960,210.905 20.527,204.097 19.204,200.727 C17.889,197.381 8.442,196.862 7.375,193.399 C6.317,189.967 13.832,184.221 13.028,180.685 C12.232,177.186 2.970,175.254 2.433,171.664 C1.903,168.119 10.193,163.562 9.925,159.938 C9.661,156.366 0.788,153.082 0.788,149.443 C0.788,145.805 9.661,142.520 9.925,138.949 C10.193,135.324 1.903,130.768 2.433,127.223 C2.970,123.632 12.232,121.701 13.028,118.201 C13.832,114.665 6.317,108.920 7.375,105.488 C8.442,102.025 17.890,101.505 19.204,98.158 C20.528,94.789 13.961,87.980 15.524,84.740 C17.096,81.481 26.515,82.383 28.318,79.267 C30.129,76.138 24.653,68.424 26.686,65.448 C28.724,62.465 37.903,64.760 40.152,61.942 C42.406,59.120 38.137,50.678 40.591,48.035 C43.047,45.390 51.783,49.020 54.429,46.564 C57.073,44.111 54.102,35.129 56.924,32.875 C59.741,30.626 67.843,35.511 70.826,33.473 C73.802,31.440 72.198,22.117 75.327,20.307 C78.444,18.503 85.727,24.540 88.986,22.969 C92.227,21.405 92.034,11.946 95.404,10.623 C98.751,9.308 105.046,16.368 108.509,15.301 C111.942,14.244 113.172,4.863 116.709,4.059 C120.208,3.264 125.373,11.189 128.964,10.652 C132.509,10.122 135.128,1.031 138.752,0.763 C142.324,0.498 146.254,9.103 149.893,9.103 C153.531,9.103 157.461,0.498 161.033,0.763 C164.657,1.031 167.276,10.122 170.822,10.652 C174.413,11.189 179.577,3.264 183.077,4.059 C186.614,4.863 187.843,14.244 191.276,15.301 C194.739,16.369 201.035,9.308 204.382,10.623 C207.752,11.946 207.559,21.405 210.800,22.969 C214.058,24.541 221.342,18.503 224.459,20.307 C227.588,22.117 225.984,31.441 228.960,33.474 C231.943,35.512 240.045,30.627 242.862,32.876 C245.684,35.129 242.713,44.111 245.357,46.565 C248.002,49.021 256.739,45.391 259.195,48.036 C261.649,50.679 257.380,59.121 259.633,61.943 C261.883,64.761 271.062,62.466 273.100,65.449 C275.133,68.424 269.657,76.138 271.467,79.267 C273.271,82.384 282.689,81.482 284.261,84.740 C285.825,87.981 279.258,94.790 280.581,98.159 C281.896,101.505 291.343,102.025 292.410,105.488 C293.468,108.920 285.953,114.665 286.757,118.202 C287.553,121.701 296.815,123.632 297.352,127.223 C297.882,130.768 289.592,135.324 289.860,138.949 C290.124,142.520 298.998,145.805 298.998,149.443 Z'/%3E%3C/svg%3E")
    center / cover no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='299px' height='299px'%3E%3Cpath fill-rule='evenodd' fill='rgb(141, 198, 65)' d='M298.998,149.443 C298.998,153.082 290.124,156.366 289.860,159.938 C289.592,163.562 297.882,168.119 297.352,171.664 C296.815,175.255 287.553,177.186 286.757,180.685 C285.953,184.221 293.468,189.967 292.410,193.399 C291.343,196.862 281.896,197.382 280.581,200.728 C279.257,204.098 285.825,210.906 284.261,214.147 C282.689,217.405 273.270,216.504 271.467,219.620 C269.656,222.749 275.132,230.463 273.100,233.438 C271.061,236.422 261.882,234.127 259.633,236.944 C257.379,239.766 261.648,248.209 259.194,250.852 C256.739,253.497 248.002,249.867 245.356,252.323 C242.712,254.777 245.684,263.758 242.862,266.011 C240.044,268.261 231.942,263.376 228.959,265.413 C225.983,267.446 227.587,276.770 224.458,278.581 C221.341,280.384 214.058,274.347 210.799,275.918 C207.558,277.482 207.751,286.941 204.381,288.264 C201.034,289.579 194.739,282.519 191.276,283.585 C187.843,284.643 186.613,294.024 183.076,294.828 C179.577,295.623 174.413,287.699 170.822,288.235 C167.276,288.765 164.658,297.857 161.033,298.124 C157.461,298.389 153.531,289.784 149.893,289.784 C146.254,289.784 142.324,298.389 138.752,298.124 C135.128,297.857 132.509,288.765 128.964,288.235 C125.373,287.699 120.208,295.623 116.708,294.828 C113.172,294.024 111.942,284.643 108.509,283.585 C105.046,282.519 98.750,289.578 95.404,288.264 C92.034,286.941 92.226,277.482 88.985,275.918 C85.727,274.346 78.444,280.384 75.326,278.580 C72.197,276.769 73.801,267.446 70.825,265.413 C67.842,263.375 59.740,268.260 56.923,266.011 C54.101,263.757 57.072,254.776 54.428,252.322 C51.783,249.866 43.046,253.496 40.590,250.851 C38.136,248.208 42.405,239.765 40.152,236.944 C37.902,234.126 28.723,236.421 26.685,233.437 C24.653,230.463 30.129,222.749 28.318,219.620 C26.515,216.503 17.096,217.405 15.524,214.146 C13.960,210.905 20.527,204.097 19.204,200.727 C17.889,197.381 8.442,196.862 7.375,193.399 C6.317,189.967 13.832,184.221 13.028,180.685 C12.232,177.186 2.970,175.254 2.433,171.664 C1.903,168.119 10.193,163.562 9.925,159.938 C9.661,156.366 0.788,153.082 0.788,149.443 C0.788,145.805 9.661,142.520 9.925,138.949 C10.193,135.324 1.903,130.768 2.433,127.223 C2.970,123.632 12.232,121.701 13.028,118.201 C13.832,114.665 6.317,108.920 7.375,105.488 C8.442,102.025 17.890,101.505 19.204,98.158 C20.528,94.789 13.961,87.980 15.524,84.740 C17.096,81.481 26.515,82.383 28.318,79.267 C30.129,76.138 24.653,68.424 26.686,65.448 C28.724,62.465 37.903,64.760 40.152,61.942 C42.406,59.120 38.137,50.678 40.591,48.035 C43.047,45.390 51.783,49.020 54.429,46.564 C57.073,44.111 54.102,35.129 56.924,32.875 C59.741,30.626 67.843,35.511 70.826,33.473 C73.802,31.440 72.198,22.117 75.327,20.307 C78.444,18.503 85.727,24.540 88.986,22.969 C92.227,21.405 92.034,11.946 95.404,10.623 C98.751,9.308 105.046,16.368 108.509,15.301 C111.942,14.244 113.172,4.863 116.709,4.059 C120.208,3.264 125.373,11.189 128.964,10.652 C132.509,10.122 135.128,1.031 138.752,0.763 C142.324,0.498 146.254,9.103 149.893,9.103 C153.531,9.103 157.461,0.498 161.033,0.763 C164.657,1.031 167.276,10.122 170.822,10.652 C174.413,11.189 179.577,3.264 183.077,4.059 C186.614,4.863 187.843,14.244 191.276,15.301 C194.739,16.369 201.035,9.308 204.382,10.623 C207.752,11.946 207.559,21.405 210.800,22.969 C214.058,24.541 221.342,18.503 224.459,20.307 C227.588,22.117 225.984,31.441 228.960,33.474 C231.943,35.512 240.045,30.627 242.862,32.876 C245.684,35.129 242.713,44.111 245.357,46.565 C248.002,49.021 256.739,45.391 259.195,48.036 C261.649,50.679 257.380,59.121 259.633,61.943 C261.883,64.761 271.062,62.466 273.100,65.449 C275.133,68.424 269.657,76.138 271.467,79.267 C273.271,82.384 282.689,81.482 284.261,84.740 C285.825,87.981 279.258,94.790 280.581,98.159 C281.896,101.505 291.343,102.025 292.410,105.488 C293.468,108.920 285.953,114.665 286.757,118.202 C287.553,121.701 296.815,123.632 297.352,127.223 C297.882,130.768 289.592,135.324 289.860,138.949 C290.124,142.520 298.998,145.805 298.998,149.443 Z'/%3E%3C/svg%3E")
    center / cover no-repeat;
  transition: background-color 0.33s ease-in-out;
}
.spot02 .decoration .info-graphic .background::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 16.55em auto;
  background-position: 25% 390%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0.05;
}
.spot02 .decoration .info-graphic .binoculars {
  position: absolute;
  z-index: 1;
  top: -1%;
  left: 0;
  filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.15));
  -webkit-filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.15));
  width: 6.3em;
  line-height: 0;
}
.spot02 .decoration .info-graphic .binoculars svg {
  width: 100%;
  height: auto;
}
.spot02 .decoration .info-graphic .toothpaste {
  position: absolute;
  border-radius: 0px;
  width: 5.85em;
  box-shadow: none;
  bottom: 10%;
  right: 3.5%;
  filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.15));
  -webkit-filter: drop-shadow(0px 25px 12.5px rgba(0, 0, 0, 0.15));
  border: none;
}
.spot02 .decoration .info-graphic h2.topic {
  line-height: 0.875;
  font-size: clamp(12px, 1.6em, 32px);
  font-weight: 400;
  color: #fff;
  margin: 0 0 0.15em;
  letter-spacing: 0.02em;
  font-weight: 900;
}
.spot02 .decoration .info-graphic p {
  line-height: 1.15294118;
  font-size: clamp(12px, 0.85em, 17px);
  margin: 0;
}
.spot02 .decoration .info-graphic:hover .background,
.spot02 .decoration .info-graphic :focus .background {
  background-color: #16aa9c;
}
.spot02 .decoration .info-graphic:hover .background::before,
.spot02 .decoration .info-graphic :focus .background::before {
  animation: spot02patternMove 7.5s linear infinite;
}
.spot02 .decoration .info-graphic:hover .toothpaste,
.spot02 .decoration .info-graphic :focus .toothpaste,
.spot02 .decoration .info-graphic:hover .binoculars,
.spot02 .decoration .info-graphic :focus .binoculars {
  animation: animalBounce 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot02 .mod {
  width: 90%;
  max-width: 34em;
  padding: 0;
  display: contents;
}
@media only screen and (max-width: 1023px) {
  .spot02 .mod .innermod {
    max-width: 550px;
    width: 90%;
  }
}
@media only screen and (min-width: 1024px) {
  .spot02 .mod {
    display: block;
    text-align: right;
    margin-top: 2.5em;
  }
}
.spot02 .mod h2.topic {
  line-height: 1;
  font-size: min(2.35em, 6vw);
  font-weight: 400;
  text-transform: uppercase;
  color: #774d25;
  letter-spacing: 0.045em;
  order: -1;
}
@media only screen and (max-width: 1023px) {
  .spot02 .mod h2.topic {
    margin: 0 auto;
    width: 90%;
  }
}
@media only screen and (min-width: 1024px) {
  .spot02 .mod h2.topic {
    margin: 0 0 0.95em;
  }
}
.spot02 .mod h2.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.19354839;
  font-size: clamp(12px, 0.65957447em, 31px);
  font-weight: 700;
}
.spot02 h3.topic {
  line-height: 1;
  font-size: clamp(12px, 1.2em, 24px);
  font-weight: 400;
  color: #8dc641;
  margin: 0 0 1.5em;
  letter-spacing: 0.0225em;
}
@media only screen and (max-width: 665px) {
  .spot02 h3.topic {
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
  }
}
.spot02 h3.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.19354839;
  font-size: clamp(12px, 1.29166667em, 31px);
  font-weight: 700;
}
.spot02 .info {
  line-height: 1.67;
  font-size: clamp(12px, 1em, 20px);
  margin: 0 0 2em;
  letter-spacing: 0.01em;
}
@media only screen and (min-width: 768px) {
  .spot02 .info {
    margin-bottom: 4.1em;
  }
}
.spot02 .spotbtn {
  font-size: clamp(12px, 1.25em, 25px);
  text-align: center;
  color: #fff;
  width: 14.16em;
  width: 16.16em;
  background-color: #8dc641;
  display: inline-block;
  vertical-align: top;
  position: relative;
  z-index: 420;
  transition:
    color 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  line-height: 3.52;
  border-radius: 1.76em;
  min-width: 44px;
  letter-spacing: 0.035em;
  font-weight: 300;
}
.spot02 .spotbtn .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot02 .spotbtn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
.spot02 .spotbtn::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #8dc641;
  border-radius: inherit;
  z-index: -2;
}
.spot02 .spotbtn:hover .cta,
.spot02 .spotbtn:focus .cta {
  transform: scale(1.1);
}
.spot02 .spotbtn:hover::before,
.spot02 .spotbtn:focus::before {
  opacity: 0.1;
  transform: scale(1.05);
  animation: moveBackground 7.5s linear infinite;
}
.spot02 .spotbtn:hover::after,
.spot02 .spotbtn:focus::after {
  background-color: #16aa9c;
  transform: scale(1.05);
}
/* ===============================================
	spot00 || COMMON GENERAL INFORMATION SPOTLIGHT SECTION
=============================================== */
.spot03 {
  color: #1b1b18;
  padding: 3em 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3em;
  flex-direction: column;
}
@media only screen and (min-width: 768px) {
  .spot03 {
    padding: 5em 0;
    gap: 4em;
  }
}
@media only screen and (min-width: 1024px) {
  .spot03 {
    padding: 4.25em 0 5.05em;
    flex-direction: row;
    font-size: min(1.3vw, 1em);
    gap: 6em;
  }
}
@media only screen and (min-width: 1300px) {
  .spot03 {
    padding-left: 2.4em;
  }
}
.spot03 .decoration {
  width: 80%;
  max-width: 26em;
  display: block;
  position: relative;
  color: #fff;
}
.spot03 .decoration .plants {
  position: absolute;
  top: -13.25%;
  left: -26.5%;
  width: 92.31%;
  height: auto;
}
@media only screen and (max-width: 665px) {
  .spot03 .decoration .plants {
    left: -10%;
    top: -10%;
  }
}
.spot03 .decoration img {
  width: 100%;
  box-shadow: 12.5px 21.651px 25px 0px rgba(0, 0, 0, 0.15);
  border-radius: 50%;
  position: relative;
  z-index: 1;
  border: solid 5px #8dc641;
}
.spot03 .mod {
  width: 90%;
  max-width: 36.25em;
  padding: 0;
  display: contents;
}
@media only screen and (max-width: 1023px) {
  .spot03 .mod .innermod {
    max-width: 575px;
    width: 90%;
  }
  .spot03 .mod .innermod p {
    margin-left: auto;
    margin-right: auto;
    max-width: 500px;
  }
}
@media only screen and (min-width: 1024px) {
  .spot03 .mod {
    display: block;
    text-align: left;
    margin-bottom: 0.25em;
  }
}
.spot03 .mod h2.topic {
  line-height: 1.27027027;
  font-size: min(1.85em, 5vw);
  font-weight: 400;
  text-transform: uppercase;
  color: #774d25;
  letter-spacing: 0.045em;
  order: -1;
}
@media only screen and (max-width: 1023px) {
  .spot03 .mod h2.topic {
    margin: 0 auto 2em;
    width: 90%;
    max-width: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .spot03 .mod h2.topic {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  .spot03 .mod h2.topic {
    margin: 0 0 0.5em;
  }
}
.spot03 .mod h2.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.19354839;
  font-size: clamp(12px, 0.83783784em, 31px);
  font-weight: 700;
}
.spot03 .info {
  line-height: 1.67;
  font-size: clamp(12px, 1em, 20px);
  margin: 0 0 2em;
  letter-spacing: 0.014em;
}
@media only screen and (min-width: 1024px) {
  .spot03 .info {
    width: 94%;
  }
}
.spot03 .spotbtns {
  display: inline-flex;
  vertical-align: top;
  gap: 9px;
  flex-direction: column;
}
@media only screen and (min-width: 768px) {
  .spot03 .spotbtns {
    flex-direction: row;
  }
}
.spot03 .spotbtn {
  font-size: clamp(12px, 1.45em, 29px);
  text-align: center;
  color: #fff;
  width: 12.20689655em;
  background-color: #8dc641;
  display: inline-block;
  vertical-align: top;
  position: relative;
  z-index: 420;
  transition:
    color 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  line-height: 3.03448276;
  border-radius: 1.51724138em;
  min-width: 44px;
  font-weight: 300;
  letter-spacing: 0.04em;
}
.spot03 .spotbtn .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot03 .spotbtn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
.spot03 .spotbtn::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #8dc641;
  border-radius: inherit;
  z-index: -2;
}
.spot03 .spotbtn:hover,
.spot03 .spotbtn:focus {
  z-index: 421;
}
.spot03 .spotbtn:hover .cta,
.spot03 .spotbtn:focus .cta {
  transform: scale(1.1);
}
.spot03 .spotbtn:hover::before,
.spot03 .spotbtn:focus::before {
  opacity: 0.1;
  transform: scale(1.05);
  animation: moveBackground 7.5s linear infinite;
}
.spot03 .spotbtn:hover::after,
.spot03 .spotbtn:focus::after {
  background-color: #16aa9c;
  transform: scale(1.05);
}
/* ===============================================
	spot00 || COMMON SERVICES/CALLOUT-LIKE SECTION EXAMPLE
=============================================== */
.spot04 {
  font-size: 3.4vw;
  text-align: center;
  color: #fff;
  margin: 0;
  padding:0;
  position: relative;
  z-index: 410;
  background: #ccc 70% 50% / cover no-repeat;
  height: 25em;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (min-width: 666px) {
  .spot04 {
    font-size: min(1.7vw, 1em);
  }
}
@media only screen and (min-width: 1024px) {
  .spot04 {
    background-position: center;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1999px) {
  .spot04 {
    background-size: auto;
  }
}

.spot04 .spotvid{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position:50% 75%;
}

.spot04::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #000;
  opacity: 0.1;
} 

/* 
.spot04 h2.topic {
  line-height: 1.2;
  font-size: clamp(12px, 1.3em, 26px);
  text-transform: uppercase;
  color: currentcolor;
  width: 90%;
  display: block;
  font-weight: 400;
  z-index: 1;
  position: relative;
  letter-spacing: 0.0325em;
  margin: 0 auto;
}
.spot04 h2.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.2;
  font-size: clamp(12px, 0.57692308em, 15px);
  font-weight: 700;
  font-style: italic;
   display: block;
}
*/

/* ===============================================
	spot00 || COMMON SERVICES/CALLOUT-LIKE SECTION EXAMPLE
=============================================== */
.spot05 {
  text-align: center;
  margin: 0;
  padding: 5em 0 3em;
  position: relative;
  z-index: 410;
  border-top: 9px solid #fff;
  border-bottom: 10px solid #fff;
  background: #ccc center / cover no-repeat;
  font-size: min(4vw, 1em);
  overflow: hidden;
}
@media only screen and (min-width: 666px) {
  .spot05 {
    font-size: min(2vw, 1em);
    padding: 7.5em 0 5em;
  }
}
@media only screen and (min-width: 768px) {
  .spot05 {
    padding: 4.4em 0 5em;
  }
}
@media only screen and (min-width: 1024px) {
  .spot05 {
    font-size: min(1.4vw, 1em);
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1999px) {
  .spot05 {
    background-size: auto;
  }
}
.spot05 h2.topic {
  line-height: 1.2;
  font-size: min(5.25vw, 2.5em);
  text-transform: uppercase;
  color: #fff;
  width: 90%;
  font-weight: 400;
  display: block;
  margin: 0 auto 100px;
  letter-spacing: 0.0475em;
}
@media only screen and (min-width: 666px) {
  .spot05 h2.topic {
    margin-bottom: 2.26em;
  }
}
.spot05 .container {
  display: grid;
  justify-content: center;
  align-items: center;
  place-content: center;
  gap: 5.5em 4em;
  grid-template-columns: repeat(1, 20em);
  max-width: none;
}
@media only screen and (min-width: 666px) {
  .spot05 .container {
    grid-template-columns: repeat(2, 20em);
  }
}
@media only screen and (min-width: 1024px) {
  .spot05 .container {
    grid-template-columns: repeat(3, 20em);
  }
}
.spot05 a {
  color: #000;
  width: 100%;
  max-width: 20em;
  padding: 4em 1.5em 2em;
  display: block;
  position: relative;
  background: #fff;
  transition:
    background-color 0.33s ease-in-out,
    color 0.33s ease-in-out;
  min-height: 12.65em;
  border-radius: 50px;
  z-index: 1;
}
.spot05 a::before {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/spot01pattern.png) center / cover repeat;
  background-position: 165% 185%;
  background-size: 16.55em auto;
  z-index: -1;
  opacity: 0;
  border-radius: inherit;
  transition: opacity 0.33s ease-in-out;
}
.spot05 a .decoration {
  width: 100%;
  position: absolute;
  top: -6.2em;
  left: 50%;
  transform: translate(-50%, 0);
  max-width: 15em;
  filter: drop-shadow(0px 15px 7.5px rgba(0, 0, 0, 0.15));
  -webkit-filter: drop-shadow(0px 15px 7.5px rgba(0, 0, 0, 0.15));
}
.spot05 a .decoration svg {
  width: 100%;
  height: auto;
}
.spot05 a h3.topic {
  line-height: 1;
  font-size: clamp(12px, 1.85em, 37px);
  color: #16aa9c;
  width: 100%;
  display: block;
  font-weight: 400;
  margin-bottom: 0.55em;
  letter-spacing: 0.035em;
  transition: color 0.33s ease-in-out;
}
.spot05 a h3.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.2;
  font-size: clamp(12px, 0.40540541em, 15px);
  font-weight: 700;
  font-style: italic;
  display: block;
}
.spot05 a .info {
  line-height: 1.2;
  font-size: clamp(12px, 0.85em, 17px);
  margin: 0;
}
.spot05 a:focus,
.spot05 a:hover {
  background-color: #16aa9c;
  color: #fff;
}
.spot05 a:focus h3.topic,
.spot05 a:hover h3.topic {
  color: #fff;
}
.spot05 a:focus::before,
.spot05 a:hover::before {
  opacity: 0.05;
}
.spot05 a:focus::before,
.spot05 a:hover::before {
  animation: patternMove 7.5s linear infinite;
}
.spot05 a:focus .decoration svg,
.spot05 a:hover .decoration svg {
  animation: animalBounce 1s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.spot05 .spot05plants01 {
  width: 46.6em;
  display: block;
  position: absolute;
  top: 0;
  left: calc(50% + 3.4em);
  z-index: -1;
  filter: drop-shadow(25px 50px 25px rgba(0, 0, 0, 0.35));
  -webkit-filter: drop-shadow(25px 50px 25px rgba(0, 0, 0, 0.35));
  line-height: 0;
}
@media only screen and (max-width: 767px) {
  .spot05 .spot05plants01 {
    width: 400px;
    left: 50%;
    top: -25px;
  }
}
@media only screen and (min-width: 2000px) {
  .spot05 .spot05plants01 {
    left: auto;
    right: 0;
  }
}
.spot05 .spot05plants01 svg,
.spot05 .spot05plants01 img {
  width: 100%;
  height: auto;
  transform: translate3d(0, 0, 0);
}
.spot05 .spot05plants02 {
  width: 74.7em;
  display: block;
  position: absolute;
  bottom: 0;
  right: calc(50% - 24.75em);
  z-index: -1;
  filter: drop-shadow(25px 50px 25px rgba(0, 0, 0, 0.35));
  -webkit-filter: drop-shadow(25px 50px 25px rgba(0, 0, 0, 0.35));
  line-height: 0;
}
@media only screen and (max-width: 767px) {
  .spot05 .spot05plants02 {
    width: 100%;
    right: 0;
  }
}
@media only screen and (min-width: 2000px) {
  .spot05 .spot05plants02 {
    left: 0;
    right: auto;
  }
}
.spot05 .spot05plants02 svg,
.spot05 .spot05plants02 img {
  width: 100%;
  height: auto;
  transform: translate3d(0, 0, 0);
}
/* ===============================================
	spot00 || COMMON TESTIMONIAL SLIDESHOW SECTION EXAMPLE
=============================================== */
.spot06 {
  font-size: min(4vw, 1em);
  padding: 3em 0;
  background: #8dc641 center / cover no-repeat;
  color: #fff;
}
@media only screen and (min-width: 666px) {
  .spot06 {
    padding: 5.75em 0 5em;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1999px) {
  .spot06 {
    background-size: auto;
  }
}
.spot06 h2.topic {
  line-height: 1.2;
  font-size: min(2.3em, 8vw);
  text-transform: uppercase;
  color: currentcolor;
  width: 90%;
  display: block;
  margin: 0 auto 1.25em;
  font-weight: 400;
  letter-spacing: 0.05em;
}
@media only screen and (max-width: 1023px) {
  .spot06 h2.topic {
    max-width: 400px;
  }
}
.spot06 .container {
  max-width: 73em;
  width: 90%;
}
@media only screen and (min-width: 1024px) {
  .spot06 .container {
    width: 96%;
  }
}
.spot06 .mod {
  display: block;
  padding: 3em 3em;
  background-color: #ffffff;
  max-width: 46.1em;
  margin: 0 auto;
  border-radius: 50px;
  min-height: 17.5em;
  letter-spacing: 0.075em;
}
@media only screen and (min-width: 666px) {
  .spot06 .mod {
    padding: 2.8em 2.5em 1.8em;
  }
}
.spot06 .cycle-slideshow {
  color: #774d25;
  width: 100%;
  display: block;
}
.spot06 .cycle-slideshow > div {
  position: absolute;
  opacity: 0;
}
.spot06 .cycle-slideshow:focus,
.spot06 .cycle-slideshow:hover {
  color: #72a331;
  transform: translate(0, 0) scale(1);
}
.spot06 .cycle-slide {
  width: 100%;
  margin: 0;
  display: block;
  transition: color 0.33s ease-in-out;
}
.spot06 .cycle-slide figure {
  margin: 0;
}
.spot06 .stars {
  display: block;
  margin-bottom: 1.9em;
}
.spot06 .stars .fa-star {
  font-size: clamp(12px, 1.85em, 37px);
  display: inline-block;
  vertical-align: top;
  margin: 0 -0.075em;
  color: #feb859;
}
.spot06 .testimony {
  line-height: 1.125;
  font-size: clamp(12px, 2em, 40px);
  margin: 0 auto 0.8em;
  display: block;
}
.spot06 .testifier {
  line-height: 1.48275862;
  font-size: clamp(12px, 1.45em, 29px);
  font-weight: 400;
  display: block;
  letter-spacing: 0.03em;
}
.spot06 .controls {
  line-height: 0;
  width: 90%;
  margin: 3em auto 0;
  display: block;
  pointer-events: none;
}
@media only screen and (min-width: 1024px) {
  .spot06 .controls {
    text-align: right;
    margin: 0 auto;
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    transform: translate(0, -50%);
  }
}
.spot06 .controls > button {
  font-size: clamp(12px, 3em, 60px);
  text-align: center;
  color: #fff;
  min-width: 24px;
  min-height: 24px;
  padding: 0;
  background: none;
  border: none;
  -webkit-appearance: none;
  border-radius: 50%;
  display: inline-block;
  vertical-align: top;
  transition: color 0.33s ease-in-out;
  pointer-events: auto;
  cursor: pointer;
}
@media only screen and (max-width: 1299px) {
  .spot06 .controls > button {
    line-height: 44px;
    font-size: 44px;
    width: 44px;
    height: 44px;
  }
}
@media only screen and (min-width: 1300px) {
  .spot06 .controls > button {
    line-height: 1;
    width: 1em;
    height: 1em;
  }
}
.spot06 .controls > button .icon {
  width: auto;
}
.spot06 .controls > button:focus,
.spot06 .controls > button:hover {
  color: #000;
}
.spot06 .controls > button.prev {
  margin-right: 1em;
}
@media only screen and (min-width: 1024px) {
  .spot06 .controls > button.prev {
    float: left;
  }
}
/* ==================================================================
	association logos 
=================================================================== */
.associationlogos {
  text-align: center;
  font-size: 3.2vw;
  padding: 3em 0;
  background: #fff;
  position: relative;
  z-index: 500;
}
@media only screen and (min-width: 768px) {
  .associationlogos {
    font-size: min(1.7vw, 1em);
    padding: 4.75em 0 5em;
  }
}
.associationlogos .dotted-line {
  content: "";
  display: block;
  width: 100%;
  background: url(../images/patterns/pattern01.svg) center / auto 100% repeat;
  height: 6px;
  margin-top: 3.65em;
  animation: patternScroll 1s linear infinite;
}
.associationlogos h2.topic {
  line-height: 1.2;
  font-size: clamp(12px, 1.25em, 25px);
  text-transform: uppercase;
  color: #896545;
  width: 90%;
  display: block;
  margin: 0 auto 1.75em;
  font-weight: 400;
  letter-spacing: 0.035em;
}
@media only screen and (max-width: 767px) {
  .associationlogos h2.topic {
    max-width: 18em;
  }
}
.associationlogos a {
  margin: 2%;
  display: inline-block;
  vertical-align: middle;
}
@media only screen and (min-width: 768px) {
  .associationlogos a {
    margin: 0 2.45em;
  }
}
@media only screen and (max-width: 1023px) {
  .associationlogos a {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}
.associationlogos a:focus img,
.associationlogos a:hover img,
.associationlogos a:focus svg,
.associationlogos a:hover svg {
  transform: scale(0.87);
  opacity: 0.48;
}
.associationlogos a.abpd {
  width: 7.35em;
  height: 6.85em;
}
.associationlogos a.ada {
  width: 8.4em;
  height: 2.95em;
}
.associationlogos a.aapd {
  width: 5.3em;
  height: 5.3em;
}
.associationlogos a.cspd {
  width: 5.3em;
  height: 5.3em;
}
.associationlogos a.cda {
  width: 4.65em;
  height: 4.65em;
}
.associationlogos a svg {
  width: 100%;
  height: 100%;
  display: block;
  transition:
    opacity 0.33s ease-in-out,
    transform 0.33s ease-in-out;
}
.associationlogos a img {
  transition:
    opacity 0.33s ease-in-out,
    transform 0.33s ease-in-out;
}
/* ===============================================
	spot00 || COMMON SERVICES/CALLOUT-LIKE SECTION EXAMPLE
=============================================== */
.spot07 {
  font-size: 2vw;
  text-align: center;
  color: #16aa9c;
  margin: 0;
  padding: 2em 0;
  position: relative;
  z-index: 410;
  height: 25em;
  background: #ccc center / cover no-repeat;
}
@media only screen and (min-width: 666px) {
  .spot07 {
    font-size: min(1.7vw, 1em);
    padding: 5em 0;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1999px) {
  .spot07 {
    background-size: auto;
  }
}
.spot07 a {
  color: #16aa9c;
  max-width: 11.8em;
  padding: 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  transition: color 0.33s ease-in-out;
}
@media only screen and (max-width: 665px) {
  .spot07 a {
    width: 44%;
    margin: 2%;
  }
}
@media only screen and (min-width: 666px) {
  .spot07 a {
    width: 90%;
    margin: 0 1em;
  }
}
.spot07 a:focus,
.spot07 a:hover {
  color: #666;
  z-index: 400;
}
.spot07 a .decoration {
  width: 100%;
  transition: transform 0.33s ease-in-out;
}
.spot07 a .info {
  width: 100%;
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0, -50%);
}
.spot07 a .icon {
  width: 2em;
  margin: 0 auto 1em;
  transition: transform 0.33s ease-in-out;
}
.spot07 a h2.topic {
  line-height: 1.11111111;
  font-size: clamp(12px, 0.9em, 18px);
  text-transform: uppercase;
  color: currentcolor;
  width: 100%;
  display: block;
}
.spot07 a h2.topic .trait {
  letter-spacing: 0.12em;
  line-height: 1.2;
  font-size: clamp(12px, 0.83333333em, 15px);
  font-weight: 700;
  font-style: italic;
  display: block;
}
/* ==================================================================
	#ft
=================================================================== */
#ft {
  text-align: center;
  color: #8d5a2a;
  width: 100%;
  padding: 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  z-index: 420;
  border-top: 10px solid #fff;
  font-size: min(1em, 4vw);
  background-color: #fff;
}
@media only screen and (max-width: 1023px) {
  #ft {
    background-repeat: no-repeat, no-repeat;
    background-image:
      url(../images/spotlight/spotlight-plant01.svg),
      url(../images/spotlight/spot03plants.svg);
    background-size:
      75% auto,
      40em auto;
    background-position:
      2% 2%,
      calc(100% + 15em) 70%;
  }
}
@media only screen and (max-width: 767px) {
  #ft {
    background-repeat: no-repeat;
    background-image: url(../images/spotlight/spot03plants.svg);
    background-size: 40em auto;
    background-position: calc(100% + 15em) 70%;
  }
}
@media only screen and (min-width: 1024px) {
  #ft {
    background: #fff url(../images/footer/footer-background.svg) center / cover
      no-repeat;
    font-size: min(1.4vw, 1em);
  }
}
#ft a {
  color: #8d5a2a;
  transition: color 0.33s ease-in-out;
}
#ft a:focus,
#ft a:hover {
  color: #000;
}
/* ===============================================
		locations
=============================================== */
#location {
  width: 100%;
  padding: 3em 0 2em;
  display: block;
}
@media only screen and (min-width: 768px) {
  #location {
    padding-top: 5em;
  }
}
@media only screen and (min-width: 1024px) {
  #location {
    padding: 5em 0 4.2em;
  }
}
#location .mod {
  text-align: center;
  width: 100%;
  max-width: 40em;
  display: block;
  margin: 0 auto 5em;
}
@media only screen and (min-width: 1024px) {
  #location .mod {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    margin: 0 3em 3.5em 0;
  }
}
#location .spotbtn {
  font-size: clamp(12px, 1em, 20px);
  text-align: center;
  color: #fff;
  padding: 0 0.8em;
  background-color: #8dc641;
  display: inline-block;
  vertical-align: top;
  position: relative;
  z-index: 420;
  transition:
    color 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  letter-spacing: 0.01em;
  min-width: 6.9em;
}
@media only screen and (max-width: 1299px) {
  #location .spotbtn {
    line-height: 44px;
    border-radius: 25.5px;
  }
}
@media only screen and (min-width: 1300px) {
  #location .spotbtn {
    line-height: 2.55;
    border-radius: 1.275em;
    margin-right: 0.75em;
  }
}
#location .spotbtn .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
#location .spotbtn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
#location .spotbtn::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #8dc641;
  border-radius: inherit;
  z-index: -2;
}
#location .spotbtn:hover,
#location .spotbtn:focus {
  color: #fff;
}
#location .spotbtn:hover .cta,
#location .spotbtn:focus .cta {
  transform: scale(1.15);
}
#location .spotbtn:hover::before,
#location .spotbtn:focus::before {
  opacity: 0.1;
  transform: scale(1.1);
  animation: moveBackground 5s linear infinite;
}
#location .spotbtn:hover::after,
#location .spotbtn:focus::after {
  background-color: #16aa9c;
  transform: scale(1.1);
}
#location .address {
  font-size: clamp(12px, 1.3em, 26px);
  margin: 0 auto;
  display: block;
  letter-spacing: 0.025em;
}
@media only screen and (max-width: 1023px) {
  #location .address [itemprop="streetAddress"] {
    display: block;
  }
}
@media only screen and (min-width: 1024px) {
  #location .address {
    line-height: 1.61538462;
    white-space: nowrap;
  }
}
#location .address .marker {
  line-height: 1;
  font-size: 2.53846154em;
  color: #8dc641;
  position: absolute;
  left: 50%;
  z-index: 400;
  transition: transform 0.33s ease-in-out;
  transform-origin: center bottom;
  width: auto;
  display: block;
}
@media only screen and (max-width: 1023px) {
  #location .address .marker {
    bottom: 5.7em;
    margin-left: -0.45em;
  }
}
@media only screen and (max-width: 665px) {
  #location .address .marker {
    bottom: calc(50% - 2.25em);
  }
}
@media only screen and (min-width: 1024px) {
  #location .address .marker {
    margin-left: 6.10606061em;
    top: 4.27272727em;
  }
}
#location .address .marker:before {
  color: currentcolor;
}
#location .address .marker:after {
  content: "";
  width: 1.10606061em;
  height: 1.01515152em;
  background: url(../images/footer/shadowalt.svg) no-repeat center center;
  bottom: -0.15em;
  left: 0.2em;
  z-index: -1;
  background-size: cover;
  position: absolute;
  pointer-events: none;
}
#location .address:focus .marker,
#location .address:hover .marker {
  transform: translate(0, 0) scale(2);
}
#location .officehours {
  line-height: 0;
  margin: 0 0 1.6em;
  display: block;
  letter-spacing: 0.02em;
}
#location .officehours .days,
#location .officehours .hours {
  line-height: 1.90909091;
  font-size: clamp(12px, 1.1em, 22px);
  display: inline-block;
  vertical-align: top;
}
#location .socialmedia {
  line-height: 0;
  text-align: center;
  height: auto;
  width: 100%;
  margin: 2em 0 0;
  padding: 0;
  display: inline-flex;
  justify-content: center;
  gap: 5px;
}
@media only screen and (min-width: 1024px) {
  #location .socialmedia {
    width: auto;
    margin-left: 0.0em;
    margin-top: 0;
  }
}
#location .socialmedia::before {
  content: "Let’s Get Social";
  font-size: clamp(12px, 1em, 20px);
  display: inline-block;
  vertical-align: top;
  color: #8dc641;
  margin-right: 0.5em;
  letter-spacing: 0.01em;
}
@media only screen and (max-width: 1299px) {
  #location .socialmedia::before {
    line-height: 44px;
    min-width: 44px;
  }
}
@media only screen and (min-width: 1300px) {
  #location .socialmedia::before {
    line-height: 2.55;
  }
}
#location .socialmedia a {
  font-size: clamp(12px, 1.15em, 23px);
  color: #fff;
  min-width: 24px;
  min-height: 24px;
  display: inline-block;
  vertical-align: top;
  position: relative;
  transition:
    transform 0.33s ease-in-out,
    color 0.33s ease-in-out;
  border-radius: 50%;
  overflow: hidden;
}
@media only screen and (max-width: 1023px) {
  #location .socialmedia a {
    line-height: 44px;
    width: 44px;
    height: 44px;
    font-size: 20px;
  }
}
@media only screen and (min-width: 1024px) {
  #location .socialmedia a {
    line-height: 2.2173913;
    width: 2.2173913em;
    height: 2.2173913em;
  }
}
#location .socialmedia a.facebook {
  background-color: #2a5fe9;
}
#location .socialmedia a.google {
  background-color: #d54e3f;
}
#location .socialmedia a.yelp {
  background-color: #FF1A1A;
}
#location .socialmedia a.instagram {
  background-image: -moz-linear-gradient(
    131deg,
    #ffd600 0%,
    #ff7a00 19%,
    #ff0069 45%,
    #d300c5 67%,
    #7638fa 100%
  );
  background-image: -webkit-linear-gradient(
    131deg,
    #ffd600 0%,
    #ff7a00 19%,
    #ff0069 45%,
    #d300c5 67%,
    #7638fa 100%
  );
  background-image: -ms-linear-gradient(
    131deg,
    #ffd600 0%,
    #ff7a00 19%,
    #ff0069 45%,
    #d300c5 67%,
    #7638fa 100%
  );
}
#location .socialmedia a .icon {
  position: relative;
}
#location .socialmedia a::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 200% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
#location .socialmedia a:hover,
#location .socialmedia a:focus {
  transform: scale(1.15);
}
#location .socialmedia a:hover::before,
#location .socialmedia a:focus::before {
  opacity: 0.1;
  transform: scale(1.1);
  animation: moveBackground 5s linear infinite;
}
#location .map {
  width: 90%;
  max-width: 22.55em;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  box-shadow: 25px 43.301px 50px 0px rgba(0, 0, 0, 0.35);
  margin-bottom: 2em;
}
@media only screen and (min-width: 1024px) {
  #location .map {
    margin-bottom: 0em;
  }
}
/* ==================================================================
		#links
=================================================================== */
#links {
  text-align: center;
  color: #8d5a2a;
  margin: 2em 0 0;
  position: relative;
  z-index: 420;
}
@media only screen and (min-width: 1024px) {
  #links {
    margin-top: -1.25em;
  }
}
#links .container {
  max-width: 65.8em;
}
#links .util {
  font-size: clamp(12px, 0.6em, 12px);
}
@media only screen and (min-width: 666px) {
  #links .util {
    width: auto;
    margin: 0;
    float: left;
  }
}
@media only screen and (max-width: 1299px) {
  #links .util {
    line-height: 44px;
  }
}
@media only screen and (min-width: 1300px) {
  #links .util {
    line-height: 3.66666667;
  }
}
#links .util a {
  color: #8d5a2a;
  transition: color 0.33s ease-in-out;
}
#links .util a:focus,
#links .util a:hover {
  color: #000;
}
#links .util a,
#links .util .divider {
  display: inline-block;
}
#links .util .divider {
  margin: 0 0.2em;
}
/* ===============================================
		sesame link
=============================================== */
a#sesame-link .sesameicon {
  width: 1.41666667em;
  height: 1.25em;
  margin-right: 0.5em;
  display: inline-block;
  vertical-align: middle;
}
a#sesame-link .sesameicon path {
  fill: currentcolor;
  transition: fill 0.33s ease-in-out;
}
/* ===============================================
	backToTop
=============================================== */
#btt {
  text-align: center;
  width: 100%;
  margin: 0;
  display: block;
  position: relative;
}
@media only screen and (min-width: 666px) {
  #btt {
    width: auto;
    float: right;
  }
}
a#backtotop {
  font-size: clamp(12px, 1.25em, 25px);
  color: #8dc641;
  display: inline-block;
  vertical-align: top;
  transition:
    color 0.33s ease-in-out,
    transform 0.33s ease-in-out;
}
@media only screen and (max-width: 1299px) {
  a#backtotop {
    line-height: 44px;
    font-size: 20px;
  }
}
@media only screen and (min-width: 1300px) {
  a#backtotop {
    line-height: 1.76;
  }
}
a#backtotop:focus,
a#backtotop:hover {
  color: #16aa9c;
  transform: scale(1.2);
}
@media only screen and (min-width: 1024px) {
  a#backtotop:focus,
  a#backtotop:hover {
    color: #fff;
  }
}
/*superlative*/
/************************************************************************************************************************************************/
/* hr element - div.hr */
hr,
.types-of-braces #content div.clear {
  font-size: inherit;
  width: 100%;
  margin: 1.58em 0;
  height: 2px;
  background: #774d25;
  border: none;
  display: block;
}
.brushing-and-flossing .content-text hr {
  float: left;
}
/* ===============================================
	Form Buttons
=============================================== */
form button {
  letter-spacing: normal;
  font-size: clamp(12px, 0.95em, 19px);
  font-weight: 400;
  text-transform: uppercase;
  color: #fff;
  height: 44px;
  padding: 0 1em;
  background-color: #16aa9c;
  border: none;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  position: relative;
  z-index: 1;
  border-radius: 25px;
}
form button .cta {
  display: block;
  transition-property: transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}
form button::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
form button::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #16aa9c;
  border-radius: inherit;
  z-index: -2;
}
form button:hover,
form button:focus {
  transform: scale(1.15);
}
form button:hover::before,
form button:focus::before {
  opacity: 0.1;
  animation: moveBackground 5s linear infinite;
}
form button:hover::after,
form button:focus::after {
  background-color: #8dc641;
}
form p {
  height: auto;
}
/* ===============================================
	skip link styles
=============================================== */
.skiplink {
  line-height: 2;
  font-size: 12px;
  color: #fff;
  padding: 0.5em 1em;
  background-color: #8dc641;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  flex-direction: column;
  position: absolute;
  top: 0;
  left: 6px;
  z-index: 3333;
  transition: transform 0.33s ease-in-out;
  transform: translate(0, -100%);
}
.skiplink:focus {
  transform: translate(0, 0);
}
.skiplink:focus .cta {
  transform: translate(0, 0);
}
.skiplink:focus .icon {
  transform: translate(0, 0);
}
.skiplink.alt .icon .trait {
  display: none;
}
.skiplink .cta {
  display: block;
  transition: transform 0.33s ease-in-out 0.33s;
  transform: translate(0, -44px);
}
.skiplink .icon {
  width: 1.1em;
  height: 1.1em;
  margin: 0 auto;
  display: block;
  transition: transform 0.33s ease-in-out 0.165s;
  transform: translate(0, -44px);
}
/* ===============================================
	chat widget resize for mobile use comfort
=============================================== */
#bc-chat-container {
  font-size: 0.8em !important;
}
.bc-minimize-state {
  width: 11.8em !important;
  height: 7.7em !important;
}
/* ===============================================
	blog sidebar sharethiswidget styles
=============================================== */
#blog_search label,
p.share-text {
  margin-bottom: 10px;
}
/* ===============================================
	generic button for quick use by PM/PAs
=============================================== */
a.intbtn,
#content a.intbtn {
  font-size: clamp(12px, 1em, 20px);
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  padding: 0 1.075em;
  background: #16aa9c;
  display: inline-block;
  vertical-align: top;
  transition:
    color 0.33s ease-in-out,
    background-color 0.33s ease-in-out;
  position: relative;
  z-index: 1;
  font-weight: 300;
  letter-spacing: 0.03em;
  text-decoration: none;
  border-radius: 2em;
  line-height: 2;
}

#content a.intbtn::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/patterns/pattern02.png);
  background-size: 150% auto;
  background-position: 50% 50%;
  transition-property: opacity, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  border-radius: inherit;
  z-index: -1;
  opacity: 0;
}
#content a.intbtn::after {
  content: "";
  transition-property: background-color, transform;
  transition-duration: 0.33s;
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #16aa9c;
  border-radius: inherit;
  z-index: -2;
}
#content a.intbtn:hover .cta,
#content a.intbtn:focus .cta {
  transform: scale(1.1);
}
#content a.intbtn:hover::before,
#content a.intbtn:focus::before {
  opacity: 0.1;
  transform: scale(1.05);
  animation: moveBackground 5s linear infinite;
}
#content a.intbtn:hover::after,
#content a.intbtn:focus::after {
  background-color: #8dc641;
  transform: scale(1.05);
}

/* ===============================================
	.screenreader 
	a11y support for descriptive text on vaguely worded buttons
	https://gomakethings.com/hidden-content-for-better-a11y/#hidden-labels
=============================================== */
.screenreader {
  white-space: nowrap;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
/************************************************************************************************************************************************/
/* end superlatives */
/* ===============================================
Tablet || Supports 768px and up
=============================================== */
@media only screen and (min-width: 768px) {
  /* ===============================================
	blanket content sidebar hide
=============================================== */
  .sitemap #bd.sub:after,
  .layout-full-width #bd.sub:after {
    content: none;
  }
  .sitemap #content,
  .layout-full-width #content {
    width: 70%;
    /* count out 90-100 characters per line to determine width */
    max-width: none;
    margin-right: auto;
    margin-left: auto;
    float: none;
  }
  .sitemap #sidebar,
  .layout-full-width #sidebar {
    display: none;
  }
  /* ===============================================
	custom content
=============================================== */
  .speed-system img[alt="Speed Braces"] {
    display: block;
  }
  /* ===============================================
	PAGE SPECIFIC
=============================================== */
  .which-is-right-for-me #content p {
    display: inline-block;
    float: left;
  }
  .which-is-right-for-me #content a[href^="/sesame_media/docs/"] {
    text-align: center;
    width: 100%;
    display: block;
    clear: both;
  }
  .which-is-right-for-me #content a[href^="/sesame_media/docs/"] img {
    display: inline-block;
  }
  .in-ovation-testimonials .embed-container {
    margin-right: auto;
    margin-left: auto;
    display: block;
  }
  [class^="inovation-chart-"] {
    max-width: 50%;
    display: inline-block;
  }
  .in-ovation-before-after #content p {
    text-align: center;
    margin-bottom: 0;
  }
  .in-ovation-before-after .content-text h3 {
    text-align: center;
  }
  .in-ovation-before-after .content-text .img-left,
  .in-ovation-before-after .content-text .border {
    max-width: 44%;
    margin: 2%;
    display: inline-block;
    float: none;
  }
  .in-ovation-videos .content-text h2 {
    text-align: center;
  }
  .in-ovation-videos .content-text .embed-container {
    margin-right: auto;
    margin-left: auto;
    display: block;
  }
  body[class*="in-ovation"] .img-right {
    max-width: 40%;
  }
  /*END*/
}
/* ===============================================
	embed-container enhanced support
=============================================== */
@supports (aspect-ratio: 16 / 9) and (object-fit: cover) {
  @media only screen and (max-width: 1299px) {
    .embed-container,
    .embed-container.ratio16x9 {
      max-width: min(42.10526316em, 90%);
    }
  }
  @media only screen and (min-width: 1300px) {
    .embed-container,
    .embed-container.ratio16x9 {
      max-width: min(42.10526316em, 1200px);
    }
  }
}
@keyframes moveBackground {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: -150% 50%;
  }
}
@keyframes animalBounce {
  0%,
  100% {
    transform: scale(1) translateY(0);
  }
  50% {
    transform: scale(1.05) translateY(-5px);
  }
}
@keyframes dotsRotate {
  0% {
    transform: rotate(0deg) scale(1);
  }
  50% {
    transform: rotate(-180deg) scale(1.1);
  }
  100% {
    transform: rotate(-360deg) scale(1);
  }
}
@keyframes plantSway {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(5deg);
  }
  75% {
    transform: rotate(-5deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes patternMove {
  0% {
    background-position: 165% 185%;
  }
  100% {
    background-position: calc(165% + 16.55em) 185%;
  }
}