/*----------------------- Begin Base Font Sizes--------------------*/

/*This overrides what is in the GeneralSite.css*/
html {
    font-family: Arial;
    font-size: 16px;
}

/* Small mobile devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
    html {
        font-size: 18px;
    }
    
}

/* Mobile devices (portrait phones, 576px and up) */

@media (min-width: 576px) and (max-width: 767.98px) {

    html {
        font-size: 14px;
    }
    
}

/* Tablets in Portrait mode (landscape phones, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
    html {
        font-size: 16px;
    }
   
}

/* Tablets in Landscape mode / Small desktops (small desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
    html {
        font-size: 16px;
    }
   
}

/* Desktops (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    html {
        font-size: 18px;
    }
  
}

/* Larger screens (TVs, 1920px and up) */
@media (min-width: 1700px) {
    html {
        font-size: 20px;
    }
   
}

/* 4K screens (4K TVs, 3840px and up) */
@media (min-width: 3840px) {
    html {
        font-size: 20px;
    }
    
}

/* 8K screens (8K TVs, 7680px and up) */
@media (min-width: 7680px) {
    html {
        font-size: 22px;
    }

}


/*----------------------- End of Base Font Sizes--------------------*/

/*----------------------- Begin HTML Tags--------------------*/
body {
    font-family: Arial;
    font-size: 1rem;
    background-color: white;
    font-weight: 400;
/*line-heiht is supposed to have no units*/
    line-height: 1.5;
    color: #141719;
    text-align: left;
}

h1 {
    padding-top: 2rem;
    padding-bottom: .5rem;
    font-size: 1.4rem;
    font-weight: bold;
    text-align: center;
}

h2 {
    padding-top: .5rem;
    padding-bottom: .1rem;
    font-size: 1.2rem;
    font-weight: bold;
}

h3 {
    /*display: inline;*/
    padding-top: .1rem;
    padding-left:0px;
    margin-left:0px;
    padding-bottom: .1rem;
    font-size: 1rem;
    font-weight: bold;
    font-style: italic;
}



/*//This mess is to achieve a runin header for h4 tags. You also have to include a "dataheader" in next p tag*/
h4 {
    display: none;
}

    h4 + p::before {
        content: attr(data-header) ' ';
        font-size: 1rem;
        font-style: italic;
    }




p {
    margin: 0px;
    padding: 0rem 0rem 1rem 0rem;
    text-indent: 0px;
    font-size: 1rem;
}

ul {
    margin-top:.5rem;
}


    li {
        margin-bottom: .4rem; /* Adjust the spacing as per your preference */
    }

    .LiIntro
    { font-style:initial;
      font-weight:bold;
      padding-bottom:.1rem;

    }

    

.SectionContent {
    /* T R B L*/
    padding: 0rem 1.5rem 1.5rem 1.5rem;
    /*   padding: 5rem 1.5rem 5rem 1.5rem;*/
    font-size: 1rem;
    border: 1px green solid;
    margin-top:0px;
}

.IntroSectionContent {
    /* T R B L*/
    padding: 9rem 1.5rem 1.5rem 1.5rem;
    /*   padding: 5rem 1.5rem 5rem 1.5rem;*/
    font-size: 1rem;
    border:2px red solid;
}


.BreakoutSectionContent {
    /* T R B L*/
    /*<To restore back to a multisection app, uncomment this--% >*/
/*    padding: 10rem 1.5rem 1.5rem 1.5rem;*/
    /*<To restore back to a multisection app, coment this out--% >*/
    padding: 2rem 1.5rem 1.5rem 1.5rem;
}

/*----------------------- End Section CSS--------------------*/
/*-----------------------Begin General Counseling Intro Section--------------------*/
.SLCounselingSummary {
    clear: both;
    margin-top:1.5rem;
}
.LogoImg {
    max-width: 5vw;
    min-width: 3rem;
    height: auto;
}

.LogoDiv {
    float: left;
    margin: 1.5rem 1.5rem 1.5rem 0rem;
    /*margin: 1.5vh 4vh 1.5vh 1.5vh;*/
}


.flex-container {
    padding-top:2.5rem;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.EverythingSocial, .CounselingEverythingConnect {
    box-sizing: border-box;
    /*   font-size: 2vw;*/
    font-size: 1.2rem;
    margin-bottom: 0px;
}

.EverythingSocial {
    color: #c14b15;
   /* margin-top: 25px;*/
}

.CounselingEverythingConnect {
    font-style: italic;
    color: #03417a;  
    text-shadow: -.25px -.25px 0 #03417a, .25px -.25px 0 #03417a, -.25px .25px 0 #03417a, .25px .25px 0 #03417a;
}
@supports (-webkit-touch-callout: none) {
    /* CSS specific to iOS devices */
    .LogoDiv {
        margin: 1.5rem 3.2rem 1.5rem 0rem;
        /*margin: 1.5vh 4vh 1.5vh 1.5vh;*/
    }

    .EverythingSocial {
        padding-bottom: 0px;
        margin-bottom:0px;
    }

    .CounselingEverythingConnect {
        margin-top:  -20px;
    }
}
    /* Small mobile devices (portrait phones, less than 576px) */
    @media (max-width: 900px) {

        .flex-container {
            padding-top: .5rem;
        }
    }
    /*----------------------- End General Counseling Intro Section--------------------*/
    /*----------------------- Begin Headshot Styles--------------------*/
.ProfileHeader {
    padding-top: 0px;
   
    margin-left:1.5rem;
    padding-bottom: .5rem;
    font-size: 1.5rem;
    font-weight: bold
}
    .ProfileImgDiv {
        float: left;
        margin: 1.5rem 1.5rem 1.5rem 1.5rem;
        max-width: 25%;
        min-width: 150px;
        margin-top: 0px;
        border-bottom: .1rem solid #ccc;
        border-right: .1rem solid #ccc;
        padding-right: .5rem;
        padding-bottom: .5rem;
        box-shadow: .2rem .2rem .3rem rgba(0, 0, 0, 0.1);
    }

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

    .SupervisorDiv {
        margin-top: .2rem;
    }

    .Credentials {
        font-size: 1rem;
        font-weight: bold;
        /* font-size: 15px;
            color: #5373ca;
            text-align: center;
            font-weight: bold;*/
    }

    .FloatText {
    }
    /* Small mobile devices (portrait phones, less than 576px) */
    @media (max-width: 575.98px) {

        .ProfileImgDiv {
            max-width: 47%;
            margin: .1rem .7rem .1rem .7rem;
        }

        .Credentials {
            font-size: .7rem;
        }
    }
    /*/*----------------------- End Headshot Styles--------------------*/
    /*/*----------------------- Begin Consult Button Styles--------------------*/
    /*See media call below-*/
    .ConsultAskCntrlDiv {
        margin-top: .5rem;
        margin-bottom: 4rem;
        border:1px red solid;
    }

.BreakoutConsultAskCntrlDiv {
    margin-top: .5rem;
    margin-bottom: 1rem;
    border: 1px red solid;
}

.HowItWorksLinkDiv {
    font-size: 1.5rem;
    margin-bottom: 1.75rem;
       display: flex;
    justify-content: center; /* horizontally center the content */
}
    /*See media call below-*/
    .ConsultationButton {
        display: inline-block;
        font-size: 1.4rem;
        margin-bottom: 1.25rem;
        width: 19rem;
        padding: 1% 1% 1% 1%;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        outline: none;
        color: white;
        background-color: #325475;
        border: none;
        border-radius: 15px;
        transition: transform 0.3s;
        box-sizing: border-box;
    }

        .ConsultationButton:hover {
            background-color: #b96c49;
            color: white;
            transform: scale(1.05);
            text-decoration: none;
        }

        .ConsultationButton:active {
            background-color: #b96c49;
            box-shadow: 0 5px #666;
            transform: translateY(4px);
        }

.BackButtonDiv {
    margin-top: .5rem;
    margin-bottom: 4rem;
    border: 1px red solid;
}

/*See media call below-*/
.BackButton {
    display: inline-block;
    font-size: 1.4rem;
    margin-bottom: 1.25rem;
    width: 7rem;
    padding: 1% 1% 1% 1%;
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    outline: none;
    color: white;
    background-color: #325475;
    border: none;
    border-radius: 15px;
    transition: transform 0.3s;
    box-sizing: border-box;
}

    .BackButton:hover {
        background-color: #b96c49;
        color: white;
        transform: scale(1.05);
        text-decoration: none;
    }

    .BackButton:active {
        background-color: #b96c49;
        box-shadow: 0 5px #666;
        transform: translateY(4px);
    }

    @media screen and (orientation: portrait) {
        .ConsultAskCntrlDiv {
            margin-bottom: 2rem;
            display: block;
      
        }
    }
    /*/*----------------------- Begin Consult Button Styles--------------------*/







    .ReadLessMoreDiv {
        margin-top: 1rem;
        margin-bottom: 0rem;
    }
    /*
.InPageHomeButDiv {
   
    min-width: 1rem;
    height: auto;
}*/

    .InPageHomeBut {
        width: 15.9vh;
        cursor: pointer;
        padding-top: 1rem;
        padding-bottom: 2px;
    }
    /*@media screen and (orientation: portrait) {


    .EverythingSocial, .CounselingEverythingConnect {
        width: 100%;
        font-size: 4.75vw;
        margin-top: 0px;
    }
    .CounselingEverythingConnect {
        margin-bottom: 25px;
    }

    .LogoImg {
        max-width: 15vw;
        height: auto;
    }
}

.ContactFormHeading
{
    font-weight:bold;
   
}

.HowItWorksLink {
}

.HowItWorksLinkDiv {
    margin-bottom: 20px;
    display: flex;
    justify-content: center;*/ /* horizontally center the content */
    /*}


    .ConsultAskCntrlDiv {
        margin-top: 40px;
        margin-bottom: 100px;
    }

.SectionContent {*/
    /* T R B L*/
    /*padding: 5px 1vw 5px 1vw;
    font-size: 2vw;
}

.InPageHomeBut {
    width: 15.9vh;
    cursor: pointer;
    padding-top: 12px;
    padding-bottom: 12px;
}*/
    /*@media screen and (orientation: portrait) {


    .SectionContent {       
        font-size: 4.75vw;

    }
    p {
        font-size: 4.75vw;
    }*/
    /*  html {
        font-size: 4.75vw;
    }*/
    /*body {
        font-size: 4.75vw;
    }



    h2 {
        
        font-size: 5.2vw;
    }

    h3 {
        
        font-size: 5vw;
    }
}*/
    table.NavBarTable td {
        /*top right bottom left*/
        padding: 0px 0px 0px 0px;
        border: 4px;
        border-style: solid;
        border-color: white;
        /*These two apply to cell spacing.*/
        border-spacing: 10px;
        border-collapse: separate;
        width: 33%
    }

    .PrivacyNotice {
        font-size: 1.5vw;
        color: white;
        padding-right: 5px;
        margin-top: 5px;
        position: relative;
        z-index: 1;
    }


    .HeaderImage {
        max-height: 50vh;
        width: auto;
    }


    .SlideShowImg {
        transition: opacity 1s ease-in-out;
        opacity: 0;
        max-width: auto;
    }

.OfcImgTxtDiv {
    display: flex;
    flex-direction: row;
/*    border: 2px red solid;*/
    
}

.OfcTxtDiv {
    order: 2;
    margin-left: 20px;
 /*   border: 2px green solid;*/
   
}

.OfcImgDiv {
    max-width: 50%;
    min-width: 50%;
   
    /* margin: 0 20px 20px 0;*/
    order: 1;
   /* border: 2px red blue;*/
}


.OfcSlideShowImg {
    width: 100%;
    height: auto;
    margin: 0 5px 5px 0;
    padding-right: 3px;
    padding-bottom: 1px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);
  
}

.OfcSlideShowControlDiv {
    background: #eeeeee;
}


    @media screen and (orientation: portrait) {

        .OfcImgTxtDiv {
            flex-direction: column;
        }

        .OfcImgDiv {
            max-width: 100%;
            margin: 5px 0;
            order: 2;
        }

        .OfcTxtDiv {
            order: 1;
            margin-left: 0px;
        }
    }

    .LocLongDescCss {
        padding-top: 20px;
    }


    /*-------------Headshot Styles Begin------------------------------*/
ul.checklist {
    list-style-type: none;
    font-size: 1rem;

}
   

    ul.checklist li::before {
        content: "✓";
        margin-right:1rem;
    }
    ul.checklist li:nth-last-child(1)::before {
        content: "✕";
    }

.RelatHdr {
    color: #362f30;
}
    .AllTitleBGCouns {
        position: absolute;
        opacity: 0.92;
        text-align: center;
        font-size: 4.2vw;
        padding: 3px 3px 3px 3px;
        bottom: -4.1vh;
    }
    /*Applies to all title and decorative squares*/
    .AllTitleDecSqCouns {
        border: 1.5px;
        border-style: solid;
        border-color: white;
        color: white;
        font-family: Arial;
        font-weight: bold;
    }
    /*.BannerImgContainer2 {
    padding-bottom:20px;
}*/
    /*.HeadshotDiv {
        float: left;
        max-width: 30%;*/ /* Adjust this value to make the profile image take up more of the screen */
    /* margin-right: 15%;*/
    /*margin-right: 5vw;
        margin-bottom: 3px;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
        box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1);*/
    /*padding-right: 30vw;       
    padding-top: 1vh;*/
    /*padding-right: 20px;
        min-width: 40%;
    }

    .Headshot {
        max-width: 100%;
        min-width: 150px;*/ /* Adjust this value as needed */
    /*height: auto;
        transition: transform 0.25s ease;
    }

        .Headshot:hover {
            transform: scale(1.5);
        }

        .Headshot.enlarged {
            transform: scale(1.5);
        }

    .ImgWrapParagraph {*/
    /*margin-left: 20px;*/
    /*}


    .Credentials {*/
    /* white-space: nowrap;*/
    /*font-size: 1.5vw;*/ /* Adjust this value as needed */
    /*width: 100%;
        font-weight: 500;
    }*/
    /* Styles for portrait layout */
    /*@media screen and (orientation: portrait) {
       
    
        .PrivacyNotice {
            font-size: 1.7vw;
            color: white;
            padding-right: 1px;
            margin-top: 5px;
            position: relative;
            z-index: 1;
        }

        .ReadLessMore {
            font-size: 1rem;
        }
    }*/

    @media only screen and (max-width: 375px) {
        /* styles for iPhone 6, 7, 8, and SE in portrait mode */
        .PrivacyNotice {
            font-size: 1.5vw;
            color: white;
            padding-right: 5px;
            margin-top: 5px;
            position: relative;
            z-index: 1;
        }
    }