a.header:link {
    color: black;
}

a.header:visited {
    color: black;
}

a.header::hover {
    color: #128ED5;
}

a.header:active {
    color: black;
}

a.mids:link {
    font-size: .8rem;
    color: #cccccc;
}

a.mids:hover {
    font-size: .8rem;
    color: #d4af37;
}

a.mids:visited {
    font-size: .8rem;
    color: #cccccc;
}

.blueOutline-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 1;
    border-style: solid;
    border-width: 1;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: 1rem 2rem 1.0625rem 2rem;
    font-size: 1rem;
    background-color: #383838;
    border-color: #D4AF37;
    color: #ffffff;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.blueOutline-button:hover,
.blueOutline-button:focus {
    background-color: #D4AF37;
    color: #fff;
    transition: background-color 300ms ease-out;
}

a.blueOutline-button:link {
    border: 1px solid #D4AF37!important;
}


/* line 89, ../scss/app.scss */

.white-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: 1rem 2rem 1.0625rem 2rem;
    font-size: 1rem;
    background-color: #F7F7F7;
    border-color: #D4AF37;
    color: #333333;
    transition: background-color 300ms ease-out;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.white-button:hover,
.white-button:focus {
    background-color: #D4AF37;
}


/* line 169, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.white-button:hover,
.white-button:focus {
    color: #ffffff;
}

a.white-button:link {
    border: 1px solid #D4AF37 !important;
    color: #333333 !important;
}


/* line 297, ../scss/app.scss */

.footer_font_header {
    color: #ffffff;
    font-family: 'PT Sans', sans-serif !important;
}

p.footer2 {
    padding-top: 0.5rem;
    margin-bottom: 0;
    font-size: 0.9rem;
    color: #8f8e8e;

}

.fullWidth {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
    background-color: #F9FDFF
}

.callout-fullWidth {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
}

.serviceGrid {
    top-padding: 10px;
}

.what_bg {
    background-color: white;
    padding: 4rem 2rem 1.0625rem 2rem !important;
}

.service-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 1;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: 3rem 2rem 1.0625rem 2rem;
    font-size: 1rem;
    background-color: #F9FDFF;
    border-color: #eff3f7;
    ;
    color: black;
    transition: background-color 300ms ease-out;
}

.service-button-text {
    color: #333;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.service-button:hover,
.service-button:focus {
    background-color: #0879BD;
    ;
}


/* line 169, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.service-button:hover,
.service-button:focus {
    color: black;
}

a.service-button:link {
    border: 1px solid #eff3f7!important;
    color: #33AAEE !important;
}

.servicelist li {
    padding: 0;
    margin: 0;
}


/* line 135, ../scss/app.scss */

.header-padding {
    padding-left: 26px;
}

hr.blue {
    border: 0;
    height: 1px;
    color: #D4AF37;
    background-color: #D4AF37;
}


/* line 160, ../scss/app.scss */

h1#smile_bar {
    color: white;
    border-bottom-color: #33AAEE;
    font-size: 50px;
    font-weight: 700;
    /* text-shadow: 1px 1px 1px black;*/
}

.mobileHero {
    color: white;
    border-bottom-color: #33AAEE;
    font-size: 35px;
    font-weight: 700;
    /* text-shadow: 1px 1px 1px black;*/
}

h2#service_bar {
    border-bottom-color: #33AAEE;
    font-size: 40px;
    font-weight: 800;
}

h4#smile_bar {
    color: white;
    /* text-shadow: 1px 1px 1px black;*/
}

.whiteText {
    color: white;
}

.aboutIcons {
    font-size: 35px;
    color: #333333;
}

.subFooter {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
    background-color: #111416;
    text-align: center;
}

.subFooter-text {
    text-align: center;
}

.subHeader-services {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    max-width: initial;
    background-color: #ffffff;
}

.servicesPadding {
    padding-left: 41px;
}

#subHeader {
    padding-top: 50px;
    padding-bottom: 50px;
}

.wrap {
    float: left;
    padding-right: 35px;
}

.footerA {
    color: #888888;
}

.container {
    background-color: #000000;
    padding: 3px;
    /*add this if you want a bit of space around the text*/
}

.logoPadding {
    padding-top: 3px;
}

.custom-panel {
    @include panel( // Sets the panel background color. Default: $panel-pg
    $bg: orange, // Sets the panel padding amount. Default: $panel-padding
    $padding: 20px, // Sets the font color based on the darkness of the bg & resets header line-heights for panels. Default: $panel-header-adjust
    $adjust: true);
}

a.serviceLink:link {
    color: #D4AF37;
}

a.serviceLink:visited {
    color: #D4AF37;
}

a.serviceLink:hover {
    color: black;
}

a.serviceLink:active {
    color: #D4AF37;
}

a.footer:link {
    color: #888888;
}

a.footer:visited {
    color: #888888;
}

a.footer:hover {
    color: #D4AF37;
}

a.footer:active {
    color: #888888;
}

a.contactLinkColor:link {
    color: #000000;
}

a.contactLinkColor:visited {
    color: #000000;
}

a.contactLinkColor:hover {
    color: #D4AF37;
}

a.contactLinkColor:active {
    color: #000000;
}

.smallerText {
    font-size: .9rem;
}

#map {
    min-width: 200px;
    max-width: 1400px;
    height: 500px;
    text-align: center;
    margin: 0px;
}

.imagePanel {
    background-image: url('../img/image1.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 50%;
    padding-bottom: 54%;
}

.bannerDesktop {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 8%;
    padding-bottom: 8%;
    color: black;
    text-align: center;
    background-image: url("../img/hero.jpg");
}

.bannerMobile {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 20.5%;
    padding-bottom: 16.5%;
    color: black;
    text-align: center;
    background-image: url("../img/herom.jpg");
}

.bannerStyle-services {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 5%;
    padding-bottom: 7%;
    color: black;
    text-align: center;
    background-image: url("../img/service-banner.jpg");
}

.bannerStyle-braces {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/bracesbanner.jpg");
}

.bannerStyle-retainer {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/retainerbanner.jpg");
}

.bannerStyle-tmj {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/tmjbanner.jpg");
}

.bannerStyle-damon {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/damonbanner.jpg");
}

.bannerStyle-invisalign {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/invisalignbanner.jpg");
}

.bannerStyle-career {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 5%;
    padding-bottom: 7%;
    color: black;
    text-align: center;
    background-image: url("../img/career-banner.jpg");
}

.bannerStyle-quote {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 5%;
    padding-bottom: 7%;
    color: black;
    text-align: center;
    background-image: url("../img/quote-banner.jpg");
}

.bannerStyle-palat {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/palatbanner.jpg");
}

.bannerStyle-about {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 5%;
    padding-bottom: 7%;
    color: black;
    text-align: center;
    background-image: url("../img/about-banner.jpg");
}

.bannerStyle-gallery {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/gallerybanner.jpg");
}

.bannerStyle-contact {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 5%;
    padding-bottom: 7%;
    color: black;
    text-align: center;
    background-image: url("../img/contact-banner.jpg");
}

.bannerStyle-consult {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/consultbanner.jpg");
}

.bannerStyle-forms {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/formsbanner.jpg");
}

.bannerStyle-team {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding-top: 7%;
    padding-bottom: 10%;
    color: black;
    text-align: center;
    background-image: url("../img/doctors.jpg");
}

.thinOutline-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 1;
    border-style: solid;
    border-width: 1;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: .5rem 1rem .5rem 1rem;
    font-size: 1rem;
    background-color: #33AAEE;
    border-color: #D4AF37;
    color: #ffffff;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.thinOutline-button:hover,
.thinOutline-button:focus {
    background-color: #D4AF37;
    color: #fff;
    transition: background-color 300ms ease-out;
}

a.thinOutline-button:link {
    border: 1px solid #D4AF37!important;
}


/* line 149, ../scss/app.scss */

a.social:link {
    color: gray;
    padding: 10px;
}


/* line 154, ../scss/app.scss */

a.social:visited {
    color: gray;
}


/* line 159, ../scss/app.scss */

a.social:hover {
    color: #D4AF37;
}


/* line 212, ../scss/app.scss */

.blue_text {
    color: #D4AF37;
    text-align: center;
}


/* line 227, ../scss/app.scss */

h4.nav_menu:hover {
    color: #D4AF37;
}

.slim {
    margin-bottom: -.6rem;
}


/* Button in header */


/* line 273, ../scss/app.scss */

.blue-button-header {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    border-style: solid;
    border-width: 1px;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: .5rem 1rem .5rem 1rem;
    font-size: .8rem;
    background-color: #383838;
    border-color: #D4AF37;
    color: #FFFFFF;
    transition: background-color 300ms ease-out;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */


/* line 318, ../scss/app.scss */

.blue-button-header:hover,
.blue-button:focus {
    background-color: #D4AF37;
}


/* line 169, ../bower_components/foundation/scss/foundation/components/_buttons.scss */


/* line 323, ../scss/app.scss */

.blue-button-header:hover,
.blue-button:focus {
    color: #FFFFFF;
}


/* line 333, ../scss/app.scss */

#office_bg {
    background-color: #383838;
    height: 110px;
    padding-top: 10px;
}


/* line 339, ../scss/app.scss */

#phone_bg {
    background-color: #202020;
    height: 110px;
    padding-top: 10px;
}


/* line 345, ../scss/app.scss */

#mail_bg {
    background-color: #141414;
    height: 110px;
    padding-top: 10px;
}


/* line 327, ../scss/app.scss */

.footer_bottom {
    padding-top: 70px;
    background-color: black;
    color: #888888;
}


/* line 382, ../scss/app.scss */

.footer-icon {
    color: #D4AF37;
    font-size: 32px !important;
    padding: 15px;
    background-color: transparent;
}


/* line 88, ../bower_components/foundation/scss/foundation/components/_panels.scss */

.panel.callout {
    border-style: solid;
    border-width: 1px;
    border-color: #d8d8d8;
    margin-bottom: 1.25rem;
    padding: 1.25rem;
    background: #141414;
    color: #333333;
}


/* line 232, ../scss/app.scss */

#subHeader {
    background-color: #141414;
    position: relative;
    background-size: contain;
    color: white;
    padding-top: 25px;
    padding-bottom: 25px;
}


/* line 82, ../scss/app.scss */

.blue-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 0;
    border-style: solid;
    border-width: 0;
    cursor: pointer;
    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;
    font-weight: normal;
    line-height: normal;
    margin: 0 0 1.25rem;
    position: relative;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    padding: 1rem 2rem 1.0625rem 2rem;
    font-size: 1rem;
    background-color: black;
    border-color: #D4AF37;
    color: #FFFFFF;
    transition: background-color 300ms ease-out;
}


/* line 163, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.blue-button:hover,
.blue-button:focus {
    background-color: #D4AF37;
}


/* line 169, ../bower_components/foundation/scss/foundation/components/_buttons.scss */

.blue-button:hover,
.blue-button:focus {
    color: #FFFFFF;
}


/* line 246, ../scss/app.scss */

.blue-font {
    color: black;
}

.heroBG {
    border-radius: 5px;
    background-color: black;
    background: rgba(0, 0, 0, 0.7);
    background-size:
}
.serviceFooter{
    font-size: .8rem;
    color:#888888;
    text-align: center;
}

.footerMargin{
    margin-bottom:-3.3rem;
}