:root {
    --main-bg-color: #393939;
}
  html {
  scroll-behavior: smooth;
}
.greybg {
    background-color: var(--main-bg-color);
}

html, body{
    background:#fff;
    margin:0;
    padding:0;
}

.aboveheader{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-between;
}

.more_top_padding{
    margin-top:5rem;
}

.logo{
    background: url(../img/logo.png) no-repeat 50% 50% #0000;
    height: 120px;
    width: 400px;
}

#bio_image{
background-image: url(../img/bio_pic_Marcia_McFee.jpg);
    width: 95%;
    float: left;
    background-size: contain;
    display: block;
    background-repeat: no-repeat;
    margin: 1.5rem 3rem 0 0;
}

#bio_wrapper{
    display: grid;
    grid-template-columns: 3fr 9fr;
    height: 100%;
}

.footer{
    padding:1%;
}

.footer .logo{
    margin:0 auto;
    
}

.footer p{
    text-align:center;
}

.footer p a{
    margin:0 20px 0 0;
}

.footer p a:hover{
    text-decoration:underline;
}

h1{
    font-family: 'Cardo', serif;
    font-size: 70px;
    font-weight: 400;
}

h2{
    font-family: 'Cardo', serif;
    font-weight: 400;
    font-size: 42px;
}

p,
li{
    font-family: 'Lato', sans-serif;
    font-size:22px;
}

body .aboveheader a{
    font-size:20px;
}

.aboveheader a .button{
    margin:0 40px 0 0;
    font-size:20px;
    width:140px;
}

#main_content_035 li{
    list-style:none;
}

.aboveheader a,
.footer a,
.footer span,
.header_main_content a,
.main_content a span.button,
.main_content a.button-wrap{
    color:#fff;
    text-decoration:none;
    font-size:30px;
    font-family: 'Cardo', serif;
    display:inline-block;
}

.footer a,
.footer span{
    font-size:20px;
}

.button,
.main_content a span.button{
    background: #804094;
    display: block;
    text-align: center;
    width: 330px;
    padding: 3% 3%;
}


.rightgrouping{
    margin: 2% 7%;
}

.header_wrapper {
    height: 880px;
    overflow: hidden;
    position: absolute;
    width: 100%;
        background-image: url(../img/static_WDS_bg_compressed.jpg) ;
        background-repeat:no-repeat;
        background-position:50% 50% ;
        background-color:#0000;
        background-size:cover;
}

#myVideo {
    z-index: 0;
    height: auto;
    overflow: hidden;
    object-fit: cover;
    width: 100%;
    height: 100%;
}

.header{
    border: none;
    margin: 0;
    box-shadow: inset 0 0 0 1000px rgba(0,0,0,.4);
    position: absolute;
    z-index: 1;
    height: 880px;
    overflow: hidden;
    width: 100%;
}

.header_main_content{
    max-width: 830px;
    color: #fff;
    margin: 100px 0 0 100px;
}

.main_content{
    width:90%;
    text-align:center;
    margin:0 auto;
    padding:1%;
    max-width:1600px;
}

iframe{
    width:60%;
}

.embed-container { 
    position: relative;
    padding-bottom: 28%;
    height: 0;
    overflow: hidden;
    max-width: 50%;
    margin: 0 auto;
} 

.embed-container iframe, 
.embed-container object, 
.embed-container embed { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
}

ul{
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    max-width: 1300px;
    margin: 25px auto;
    padding: 0;
}

li{
    width: 44%;
    padding: 1% 3% 1% 0;
    text-align: left;
}

.header_wrapper_wrapper{
    height: 880px;
}

.bg_wrapper{
    background: url(../img/background-whitemark.png) 100% 0% no-repeat #fff;
    padding:1%;

    background-attachment: fixed;
}

#bg_right{
    background-position: 0% 0%;
    padding: 1% 0 0 0;
}

.content-wrap {
    margin: 75px auto 0;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    display: flex;
}

.testi {
    padding: 325px 0 0 0;
    background-position: center 0;
    width: 400px;
    text-align: center;
}

.testi-one{
    background: url(../img/wds_block_01.jpg) no-repeat 50% 0%;
}

.testi-two{
    background: url(../img/wds_block_05.jpg) no-repeat 50% 0%;
}

.testi-three{
    background: url(../img/wds_block_03.jpg) no-repeat 50% 0%;
}

#more_margin{
    margin:2em 0 0 0;
}

.testi .name{
    display:none;
}

.graphic_blocks {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.graphic_blocks li {
    margin: 0 0 10px 0;
    overflow: hidden;
    width: auto;
    padding: 0;
}

.graphic_blocks li p {
    height: 450px;
    width: 340px;
    display: block;
    background: #fff;
    border: 1px solid #3333338a;
    -webkit-box-shadow: 0px 0px 10px 0px #3333338a;
    box-shadow: 0px 0px 10px 0px #3333338a;
    text-decoration: none;
}

.gb_top_image {
    height: 240px;
    width: 340px;
    display: block;
}

.gb_educ .gb_top_image{
    background: url(../img/box_01.jpg) 0 0 no-repeat;
}

.gb_inspir .gb_top_image{
    background: url(../img/box_02.jpg) 0 0 no-repeat;
}

.gb_exhal .gb_top_image {
    background: url(../img/box_03.jpg) 0 0 no-repeat #fff;
}

.gb_icon {
    border: 4px dashed #800080;
    display: none;
    height: 100px;
    width: 100px;
    margin: -60px auto 0;
    border-radius: 50%;
}

.gb_text {
    text-align: center;
    display: block;
    padding: 10px 0 0 0;
    text-decoration: none;
    font-size: 30px;
    font-family: 'Cardo', serif;
    color: #000;
}

.graphic_blocks .more_text{
    font-size: 22px;
    color: #000;
    line-height: 1.25em;
    display: block;
    padding: 0 4%;
    font-family: 'Lato', sans-serif;
}

#free_member_button{
    width:345px;
}

@media (max-width: 1550px) {
}

@media (max-width: 1200px) {
}

@media (max-width: 900px) {
    
    .button, .main_content a span.button,
    #free_member_button{
        width:94%;
    }

    .footer{
        overflow:hidden;
    }
    #bio_image{
    
        width: 22rem;
margin: 5rem auto 0.5rem;
    float: none;
}

#bio_wrapper{
    display: grid;
    grid-template-columns: 2fr;
    height: 100%;
}

#bio_image{
background-image: url(../img/bio_pic_Marcia_McFee.jpg);
    width: 95%;
    /* float: left; */
    background-size: contain;
    display: block;
    background-repeat: no-repeat;
    margin: 0 auto;
    height: 18rem;
    background-position: center;
}
    
    .footer .logo{
background: none;
    background-image: url(../img/logo.png);
    height: 70px;
    width: 80%;
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 375px;
    }
    
    .embed-container {
        height: 90px;
        max-width: 100%;
    }

    .logo {
        width: 480px;
    }

    .rightgrouping {
        margin: 1.5% 10%;
    }

    h1 {
        font-size: 55px;
    }

    .aboveheader{
        height:200px;
    }
    
    .header_main_content {
        margin: 0;
        padding: 0% 3%;
    }

    li {
        width: 85%;
    }

}

@media (max-width: 400px) {
        #bio_image{
    
        width: 100%;
margin: 5rem auto 0.5rem;
    float: none;
}
    
}