@font-face {
    font-family: 'OpenSans-Regular';
    src: url('webfonts/OpenSans-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body, html { background-color: #ffffff; color: #4b4e53; font-family: OpenSans-Regular, Helvetica, Arial, sans-serif; height: 100%; font-size: 15px; margin: 0; padding: 0; }

body { -webkit-text-size-adjust: 100%; -moz-text-size-adjust: none; -ms-text-size-adjust: 100%; }

:target { display: block; position: relative; top: -70px; visibility: hidden; }

h1 { font-size: 24px; margin: 30px 0; }
h2 { font-size: 16px; margin-top: 20px; }

br { margin-bottom: 5px; }

sup { font-size: 11px; position: relative; top: -0.5em; vertical-align: baseline; z-index: 1; }

a:link, a:visited, a:hover, a:active { color: #4b4e53; text-decoration: none; }
a.line { border-bottom: 1px solid #4b4e53; }


/* Side Navigation */

.sidenav { background-color: #ffffff; box-shadow: 3px 3px 5px rgba(0, 0, 0, .5); height: 100%; left: 0; max-height: 100%; overflow-x: hidden; overflow-y: hidden; position: fixed; top: 62px; transition: 0.2s; width: 0; z-index: 3; }
.cat { border-bottom: 1px solid #b8c4cb; border-top: 1px solid #b8c4cb; color: #3e6182; font-weight: bold; padding: 15px 0px 15px 20px; }
.sidenav a { color: #92989b; display: block; font-size: 16px; padding: 15px 5px 15px 25px; text-decoration: none; transition: 0.3s; }
.sidenav a:hover { color: #3e6182; }


/* Header */

table.header { background-color: #ffffff; border-bottom: 2px solid #ececec; height: 62px; margin: 0 auto; padding: 0; position: fixed; width: 100%; z-index: 2; }
table.header p { margin: 0; padding: 0; }
td.menu { padding-left: 20px; vertical-align: middle; }
td.logo { vertical-align: middle; }
@media screen and (max-width:799px) { td.logo { text-align: center; } }
img.logo { max-width: 190px; transition: all 0.5s ease 0s; width: 100%; }
@media screen and (max-width:375px) { img.logo { max-width: 138px; transition: all 0.5s ease 0s; } }
td.addressphone { display: none; padding-right: 20px; text-align: right; vertical-align: middle; }
@media screen and (min-width:800px) { td.addressphone { display: table-cell; } }
td.addressphone_icons { display: none; padding-right: 20px; text-align: right; vertical-align: middle; }
@media screen and (max-width:799px) { td.addressphone_icons { display: table-cell; } }


/* Section DIVs */

.div_transparent { padding: 100px 10px; text-align: center; transition: all 0.5s ease 0s; }
.div_lightgray { background-color: #f1f1f1; padding: 100px 10px; text-align: center; transition: all 0.5s ease 0s; }
.div_blue { background-color: #3e6182; padding: 100px 10px; text-align: center; transition: all 0.5s ease 0s; }
@media screen and (max-width:480px) { .div_transparent, .div_lightgray, .div_blue { padding: 50px 10px; transition: all 0.5s ease 0s; } }

.section_txt { font-size: 24px; margin: 0 auto; max-width: 1000px; padding-top: 20px; transition: all 0.5s ease 0s; }
@media screen and (max-width:479px) { .section_txt { font-size: 16px; padding-top: 10px; transition: all 0.5s ease 0s; } }


/* Home Page */

.home_banner { background-image: url('images/home_banner.webp'); background-repeat: no-repeat; background-position: right center; background-size: cover; }
img.home_request_appointment { margin-left: 15%; max-width: 608px; transition: all 0.5s ease 0s; width: calc(100% - 15%); }
@media screen and (max-width:850px) { img.home_request_appointment { margin-left: 5%; transition: all 0.5s ease 0s; } }


/* Counseling Services Strip */

.service_tab { margin: 15px; max-width: 300px; transition: all 0.5s ease 0s; }
@media screen and (max-width:684px) { .service_tab { margin: 10px; max-width: 220px; transition: all 0.5s ease 0s; } }
@media screen and (max-width:505px) { .service_tab { margin: 10px; max-width: 180px; transition: all 0.5s ease 0s; } }
@media screen and (max-width:425px) { .service_tab { margin: 10px; max-width: 140px; transition: all 0.5s ease 0s; } }
@media screen and (max-width:360px) { .service_tab { margin: 10px; max-width: 240px; transition: all 0.5s ease 0s; } }


/* Meet our Providers (1 Image) */

.providers { background-image: url('images/banner_samantha_vanessa_maeve_bo.webp'); background-repeat: no-repeat; background-position: top center; background-size: cover; height: 1100px; }
@media screen and (max-width:1100px) { .providers { height: 500px; } }
@media screen and (max-width:900px) { .providers { height: 400px; } }
@media screen and (max-width:700px) { .providers { height: 350px; } }
@media screen and (max-width:600px) { .providers { height: 300px; } }
@media screen and (max-width:500px) { .providers { height: 250px; } }
@media screen and (max-width:460px) { .providers { height: 200px; } }
@media screen and (max-width:330px) { .providers { height: 170px; } }


/* Meet Our Providers (2 Images)*/

.flexbox-meet { display: flex; flex-wrap: no-wrap; height: 340px; justify-content: center; max-width: 1920px; margin: 0 auto; }
.flexbox-meet > div.meet1 { background-image: url('images/banner_meet1.jpg'); background-repeat: no-repeat; background-size: cover; flex: 1 1 auto; }
.flexbox-meet > div.meet2 { background-image: url('images/banner_meet2.jpg'); background-position: right center; background-repeat: no-repeat; background-size: cover; flex: 1 1 auto; }
@media screen and (max-width:1000px) { .flexbox-meet { height: 250px; } }
@media screen and (max-width:800px) { .flexbox-meet { height: 150px; } }
@media screen and (max-width:480px) { .flexbox-meet { height: 100px; } }


/* Service Pages */

.service_txt { font-size: 18px; line-height: 30px; margin: 0 auto; max-width: 1400px; padding: 20px 15px; transition: all 0.5s ease 0s; }
@media screen and (max-width:479px) { .service_txt { font-size: 16px; line-height: 25px; padding: 20px 10px; transition: all 0.5s ease 0s; } }
.button_appointment { margin-top: 25px; max-width: 307px; transition: all 0.5s ease 0s; width: 100%; }
@media screen and (max-width:400px) { .button_appointment { max-width: 240px; transition: all 0.5s ease 0s; } }


/* General Pages */

.div_general { margin: 0 auto; max-width: 1400px; padding: 20px 10px; text-align: left; }


/* Contact Form */

.contact input, .contact textarea { background-color: #eee; color: #000000; font-family: inherit; font-size: inherit; padding: 1px 3px; }
.contact textarea { height: 150px; max-width: 600px; padding: 1px 3px; resize: none; width: 98%; }
.contact input:focus, .contact textarea:focus { border: 1px solid #ccc; }
.button-submit { background: none; background: url('images/button_submit.svg') no-repeat center center; background-size: cover; cursor: pointer; height: 45px; margin: 20px 0; width: 155px; }


/* Footer Schedule Appointment */

.footer-schedule { background-image: url('images/banner_schedule.webp'); background-repeat: no-repeat; background-position: right center; background-size: cover; }
.footer-schedule-title { max-width: 587px; width: 100%; }
.footer-schedule table { margin: 25px auto 0 auto; max-width: 500px; width: 100%; }
.footer-schedule td { text-align: center; vertical-align: bottom; }
.footer-schedule td.intake { padding-right: 10px; }
.footer-schedule-intake { max-width: 164px; width: 100%; }
.footer-schedule td.email { padding-left: 10px; }
.footer-schedule-email { max-width: 164px; width: 100%; }


/* Footer Links */

.footer-wrap { background-color: #ffffff; border: 1px solid #e4e4e4; }
.flexbox-footer { display: flex; flex-wrap: wrap; justify-content: center; max-width: 1200px; margin: 0 auto; padding-top: 25px; }
.flexbox-footer > div { flex: 1 1 auto; font-size: 14px; margin: 15px; max-width: 400px; }
.flexbox-footer > div div { margin-bottom: 7px; }
@media screen and (max-width:700px) { .flexbox-footer { justify-content: flex-start; } }

table.hours tr, table.hours td { margin: 0; padding: 0; width: 50%; }
