/**************************************************/
/* GLOBALLY USED ON ALL WEBSITES                  */
/**************************************************/
*,
*::after,
*::before {
    box-sizing:border-box; padding:0; margin:0;   }
.bordertest1 {    border:3px solid red;}
.bordertest2 {    border:3px solid green;}
.bordertest3 {    border:3px solid blue;}
.bordertest4 {    border:3px solid yellow;}
.centerit { text-align:center; }
.ulit { border-bottom:1px solid black; }
.italit { font-style: italic;}
.boldit { font-weight:bold; }
.text-black { color:black; }
a { color:inherit; text-decoration:none; }
p { margin-bottom:1rem; }
.card{ box-shadow:0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12); padding:1rem; }
.card2{ box-shadow:0 4px 10px 0 rgba(0,0,0,.2),0 4px 20px 0 rgba(0,0,0,.19); padding:1rem; }
ul.circle{ list-style-type:circle; }
ul.disc{ list-style-type:disc;  }
ul.disc-i{ list-style-type:disc; list-style-position:inside; }
ul.square{ list-style-type:square; }

.text-deepgreen {  color:#9C9C9C; font-weight:bolder; }

/**************************************************/
/* WEBSITE SPECIFIC                   */
/**************************************************/
html {
    font-size:14px; scroll-behavior:smooth;
    -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; }
body {
    height:100%; font-family: "Ysabeau Office", sans-serif; font-size:1.4rem; line-height:1.7;  }
h1 { font-size:3rem; }
h2 { font-size:2rem; }
h3 { font-size:1.5rem; }
.page-title { text-align:center; margin-bottom:40px;  }
.container { max-width: 1200px; width:90%; margin:auto;  }

@media all and (max-width: 1000px) {
    body { font-size:1.4rem; line-height:1.3; }
    h1 { font-size:2.3rem;  }
    h2 { font-size: 1.7rem;  }
    h3 { font-size: 1.4rem;  }
}
@media all and (max-width: 768px) {
    .container { width:97%;  }
    body { font-size:1.4rem; line-height:1.3;    }
    h1 { font-size:2rem;  }
    h2 { font-size: 1.5rem;  }
    h3 { font-size: 1.4rem;  }
}
@media all and (max-width: 500px) {
    h1 { font-size:1.8rem;  }
    h2 { font-size: 1.4rem;  }
    h3 { font-size: 1.4em;  }
}
@media all and (max-width: 400px) {
    h1, h2, h3 {  font-size:1.4rem;}

}
@media all and (max-width: 320px) {
    body { font-size:1.3rem; line-height:1.1;   }
    h1, h2, h3 { font-size:1.3rem;     }
}

/*
@media (orientation: landscape)
320 × 480
480 × 640
768 × 1024

1024 × 768
1280 × 800
1366 × 768
1440 × 900
1920 × 1080
*/

/**************************************************/
/* HEADER AND NAVIGATION                   */
/**************************************************/
.header {
    width:100%; text-align:center; font-family:"Ysabeau SC"; font-size:3.3rem; line-height:1.4;}
.contact-btn {
    background:#9C9C9C; color:white!important; border-radius:33px; padding:.1em 1em; margin-left:2rem; }
.contact-btn:hover {
    color:black!important; }

.navbar input[type="checkbox"],
.navbar .hamburger-lines {
    display: none; }
.navbar {
    display:flex; justify-content:center; align-items:center; box-shadow:0px 5px 10px 0px #aaa; position:relative; width:100%; background:rgba(250,250,250,.8); color:#000; height:50px; z-index:4;    }
.navbar-container {
    display:flex; justify-content:center; align-items:center; height:50px; }
.menu-items {
    display: flex; }
.menu-items li {
    list-style: none; }
.menu-items a {
     text-decoration:none; color:#000000; font-size:1.3rem; font-weight:500; transition:color 0.3s ease-in-out; padding:.3em 1em; border-radius:33px; white-space: nowrap;  }
.menu-items a:hover {
    opacity:1; font-weight:bolder; transition: color 0.3s ease-in-out;  }
.logo a {
    font-size:1.3rem; line-height:1.2rem; text-decoration:none; color:#000000; font-weight:500; transition:color 0.3s ease-in-out; padding:.1em .7em; border-radius:33px;  }
.logo a:hover {
    color:white; background:#CCCCCC; transition: color 0.3s ease-in-out;  }
.logo {
    display:flex; flex-direction:row; flex-wrap: nowrap; justify-content:space-between; align-items:center; }

@media all and (max-width: 1280px) {
    .header {
        font-size:2.9rem; line-height:1.3;}
}
@media all and (max-width: 1050px) {
    .header {
        font-size:2.5rem; }
    .navbar {
        opacity: 0.95;      }
    /* display changed from display:none to display:block when max-width:1050 */
    .navbar-container input[type="checkbox"],
    .navbar-container .hamburger-lines {
        display: block;
      }
    .navbar-container {
        display: block; position: relative;   }
    /* the checkbox sits ontop of hamburger (z-index:5) but is not seen (opacity:0) */
    .navbar-container input[type="checkbox"] {
        position:absolute; display:block; height:32px; width:30px; top:20px; left:20px; z-index:5; opacity:0;  }
    .navbar-container .hamburger-lines {
        display:block; height:23px; width:35px; position:absolute; top:17px; left:20px; z-index:2; display:flex; flex-direction:column; justify-content:space-between;  }
    .navbar-container .hamburger-lines .line {
        display:block; height:4px; width:100%; border-radius:10px; background:#333;  }
    .navbar-container .hamburger-lines .line1 {
        transform-origin: 0% 0%; transition: transform 0.4s ease-in-out;      }
    .navbar-container .hamburger-lines .line2 {
        transition: transform 0.2s ease-in-out;     }
    .navbar-container .hamburger-lines .line3 {
        transform-origin: 0% 100%; transition: transform 0.4s ease-in-out;    }
    .navbar .menu-items {
        padding-top:80px; background:#fff; height:auto; max-width:333px; transform:translate(-150%); display:flex; flex-direction:column; margin-left:-20px; padding-left:10px;
        transition: transform 0.5s ease-in-out; box-shadow:5px 0px 10px 0px #aaa;      }
    .navbar .menu-items li {
        margin-bottom: .8rem; padding:0;  }
    .logo { position:absolute; top:15px; right:15px;           }
    .logo a {
        font-size:1.5rem;  }
    .navbar-container input[type="checkbox"]:checked ~ .menu-items {
        transform: translateX(0);  }
    .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line1 {
        transform: rotate(35deg);  }
    .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line2 {
        transform: scaleY(0);      }
    .navbar-container input[type="checkbox"]:checked ~ .hamburger-lines .line3 {
        transform: rotate(-35deg); }
}
@media all and (max-width: 700px) {
    .header {  font-size:2.3rem;}
    .navbar .menu-items li {  margin-bottom: 1rem; }
}
@media all and (max-width: 500px) {
    .header {  font-size:1.8rem;}
    .menu-items li a { font-size:2rem;  }
}
@media all and (max-width: 400px) {
    .header {  font-size:1.4rem;}
}


/**************************************************/
/* LANDING SECTION HOME PAGE                   */
/**************************************************/
.wrap-landing {
    height:auto; width:100%; overflow:hidden; }
.showcase-area {
    height:auto; position:relative; margin-top:-50px; overflow:hidden; display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start; border:1px solid green;}
.showcase-area img {
    height:auto; width:100%; }

.showcase-container {
    height:auto; width:100%; position:absolute; top:0; display:flex; justify-content:center; font-family: "Licorice", cursive; font-size:4rem; letter-spacing:.2rem; text-align:center; font-weight:normal; padding-top:100px; }

.sub-title {
    font-size:1.6rem; text-align:center; }

@media all and (max-width: 1280px) {
    .wrap-landing {  }
    .showcase-container {
        font-size:3.5rem;   }
    .sub-title {
        font-size:1.5rem;  }

}
@media all and (max-width: 1080px) {
    .showcase-container {
        font-size:3rem;   }
    .sub-title {
        font-size:1.3rem;  }
}
@media all and (orientation: portrait) {
    .showcase-area { margin-top:0;   }
}
@media all and (orientation: portrait) and (max-width:900px) {
    .showcase-container {  padding-top:25px;  }
    .showcase-area img {
        height:auto;  }
}
@media all and (orientation: portrait) and (max-width:600px) {
    .showcase-container { font-size:2rem; padding-top:25px;  }
    .showcase-area img {
        height:auto;  }
}

/**************************************************/
/* ABOUT SECTION HOME PAGE                   */
/**************************************************/
#about {
    padding:3rem 0; background: #f5f5f7; }
.about-wrapper {
    display: flex; align-items:center; justify-content:space-between; margin:0 auto; max-width:1100px!important; padding:0 1rem 0 2rem;  }
.service-wrapper {
    display: flex; flex-direction:column; margin:0 auto; max-width:1100px!important; padding:0 1rem 0 2rem }
#about h2 {
    line-height:1.3; padding:0 0 2rem;  }
#about p {
    color: #555; padding-right:1rem;  }

.about-text {
    margin:0 auto; text-align:center; transform: translate(-150%); animation: about-text-animation 1s ease-in-out forwards; padding:0 0 1.3rem; }
.wrap-servicelist { display:flex; justify-content:space-between; align-items:flex-start;   }
.wrap-servicelist ul { margin:0 2em; min-width:400px; }

@keyframes about-img-animation {
    100% { transform: translate(0);   }
}
@keyframes about-text-animation {
    100% {  transform: translate(0);   }
}
@media all and (max-width: 900px) {
    .wrap-servicelist ul { min-width:300px;  }
}

@media all and (max-width: 768px) {
    .service-wrapper { padding:2rem 1rem 0 2rem }
    .about-wrapper { flex-direction:column; justify-content:flex-start;    }
    .wrap-servicelist { flex-direction:column; justify-content:center; align-items:center;   }

}
/**************************************************/
/* PROVIDERS SECTION HOME PAGE                   */
/**************************************************/
#providers {
    padding: 4rem 0 10rem;  }
#providers .page-title {  }
.providers-container {
    max-width:1200px; display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.providers-container img {
    display: block; width:100%; margin: auto; object-fit: cover; object-position: center; border-radius:50%; border:3px solid black; }
.wrap-provider {
    display:flex; flex-direction:column; width:100%; justify-content:center; align-items:center; text-align:center;  }
.wrap-provider div {
    margin-top:1.5rem; }
.img-container {
    margin: 1rem; width:80%; position:relative; border-radius:50%; }
.provider-btn {
    background:#9C9C9C; color:white!important; border-radius:33px; padding:.3em 1em; text-decoration:none; }
.provider-btn:hover {
    background:#CCCCCC; transition: color 0.3s ease-in-out;  }
@media all and (max-width: 768px) {
    .providers-container {
        flex-direction: column; align-items: stretch; max-width:500px;     }
   .providers-container img {
        width:75%; }
    .wrap-provider:not(:last-child) {
        margin-bottom: 3rem;    }
    .img-container {
        margin: 0;     }
}

/**************************************************/
/* GENERAL CHILD PAGES                    */
/**************************************************/
main {
    width:100%; display:flex; flex-direction:column; justify-content:flex-start; align-items:center;  }

/**************************************************/
/* PROVIDERS CHILD PAGE                  */
/**************************************************/
.wrap-bio {
    width:100%; display:flex; flex-direction:column; justify-content:flex-start; align-items:center; background:url(../img/shutterstock-back1a.jpg) no-repeat center; background-size:cover; margin-top:-50px; padding:7rem 0; }
.bio-card {
   max-width:1000px; background:white; border-radius:15px; padding:4rem; margin:0; display:inline;  }
.bio-card img {
    float:left; margin:.5em 2em .5em 0; object-fit: cover; object-position: center; border-radius:50%; border:3px solid black;  }

.biga { font-weight:bolder; line-height:1; }
.wrap-bio .contact a:hover { color:#276D90;  }
@media all and (max-width: 1200px) {
    .bio-card {  max-width:900px;   }
}
@media all and (max-width: 768px) {
    .bio-card { max-width:500px; margin:0 1rem; padding:3rem 1rem; display:flex; flex-direction:column; align-items:center; }
    .bio-card img {  }

}
/**************************************************/
/* THERAPY CHILD PAGE                             */
/**************************************************/

/**************************************************/
/* ASSESSMENTS CHILD PAGE                         */
/**************************************************/
.wrap-assessment-details {
    padding:2rem; }
.wrap-assessment-details ul {
    padding-left:3rem; }

/**************************************************/
/* FEES CHILD PAGE                                */
/**************************************************/

/**************************************************/
/* CAREER OPPORTUNITIES CHILD PAGE                */
/**************************************************/
.wrap-career-details {
    padding:2rem; }
.wrap-career-details ul {
    padding-left:3rem; }
.wrap-career-details p {
    width:auto; }

/**************************************************/
/* FOOTER                                         */
/**************************************************/
.footer {
    width:100%; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; padding:3rem; margin:0; font-size:1rem; color:#fff; background:rgb(65, 65, 65); text-align:center; }
.footer div {
    min-width:50%; padding:0 1rem; }
.footer-title {
    font-size:2rem; font-family:"Ysabeau SC";  }
#footer a {
    color:#8A9C95; text-decoration:none; }
#footer a:hover {
    color:white; }
.copyright {
    width:100%; text-align:center; padding:2rem; font-size:.8rem; background:black; color:white; }
@media all and (max-width: 950px) {
    .footer {
        padding:3rem .5rem; font-size:1.5rem;  }
    .footer div {
        min-width:100%; padding:.5rem 0;     }
    .footer-title {
        font-size:2rem;  }
    .copyright {
        font-size:1.1rem;  }
}
@media all and (max-width: 400px) {
    .footer {
        padding:3rem .2rem; font-size:1.2rem;  }
    .footer-title {
        font-size:1.8rem;  }
}