/*----------------------------------------
SCORR Overriding Styles for Symbio
----------------------------------------*/

:root {
    --primary-color: #0F2D49;
    --secondary-color: #70D4D7;
    --third-color: #93197F;
    --fourth-color: #FFD100;
    --fifth-color: #3177C0;
    --sixth-color: #D20086;
}


@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100..900;1,100..900&display=swap');


/* General Styles */
.page {
    margin-bottom: 0 !important;
}

.page-template-home {
    .site-content {
        padding-top: 108px;
    }
}

.main-content {
    margin: 0 auto;
    max-width: 1200px;
    padding: 3em 0.9375em;
    width: 100%;

    h2 {
        color: var(--primary-color) !important;
        font-family: 'Raleway', sans-serif !important;
        font-size: 2.1875em;
        font-weight: 900;
    }

    
}

.content-width {
    margin: 0 auto;
    max-width: 1200px;
    padding: 4em 0.9375em;
    width: 100%;
}

.yellow-btn {
    background: var(--fourth-color) !important;
    border: 3px solid var(--fourth-color) !important;
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1.25em !important;
    font-weight: 800 !important;
    padding: 0.5em 1em;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all 0.4s ease;

    &.sitenetwork {
        display: block;
        text-align: center;
    }

    &:hover, &:focus, &:focus-visible {
        background: #fff !important;
    }
}


@media (max-width: 770px) {
    .page-template-home {
        .site-content {
            padding-top: 0px;
        }
    }


    .yellow-btn {


    &.sitenetwork {
        display: inline-block;
       
    }

  
}
}

/* Top Navigation */
.top-bar {
    background: var(--primary-color) !important;

    .tel {
        display: none;
    }
}

.head-menu {
    width: 100% !important;
    ul li {
        font-family: 'Raleway', sans-serif !important;
        font-size: 1em !important;
        font-weight: 800 !important;
        letter-spacing: 0.05em;

        a {
            color: #fff !important;
            transition: all 0.4s ease;

            &:hover, &:focus, &:focus-visible {
                color: var(--secondary-color) !important;
            }
        }
    }

    ul li:last-child {
        margin-right: 0 !important;
    }
}


/* Main Navigation */

.site-branding  {
    background: #fff !important;
    .wrap {
        align-items: center;
        display: flex;
        flex-direction: row;
    }

    .wrap > div.logo {
        width: 18em !important;
    } 
 
}

.main-menu {
    padding: 0 !important;
    width: 100% !important;
    ul li {

        padding: 10px 0 !important;
        a {
            color: var(--primary-color) !important;
            font-family: 'Raleway', sans-serif !important;
            font-size: 1em !important;
            font-weight: 700 !important;
            text-transform: none !important;
            transition: all 0.4s ease !important;

            &:hover, &:focus, &:focus-visible {
                color: var(--third-color) !important;
            }
        }
    }

    ul {
        ul.sub-menu {
            max-width: 310px;
            min-width: 100%;
            top: 41px !important;
            width: max-content;

            li {
                border-bottom: none !important;
                display: block !important;
                padding: 0 !important;
                width: 100% !important;

           
             

                a {
                    display: block;
                    padding: 0.5rem !important;
                    width: 100% !important;
                }
            }

            li:not(:last-child) {
                border-bottom: 1px solid var(--secondary-color) !important;
        }
    }
    }
}

@media (max-width: 770px) {
#wprmenu_bar {
    align-items: center;
    background: var(--primary-color) !important;
    display: flex;
    gap: 0.5rem;

    .menu_title {
        a {
            text-decoration: none;
        }
    }
}

#mg-wprm-wrap {
    background: var(--primary-color) !important;

    li.current-menu-item > a {
        background: var(--third-color) !important;
    }
}

}



/* Footer Styles */

.site-footer {
    background: var(--primary-color) !important;
    padding: 2rem 1rem !important;

    .site-info {
        display: flex;
        flex-direction: column;
        gap: 3rem;
    }
    
}


.footer-top-row {
    align-items: center;
    display: flex;
    justify-content: space-between;

    .footer-social-container {
        align-items: center;
        display: flex;
        gap: 2rem;

        a {
            svg {
                max-width: 30px;
                width: 100%;

                #x, #li, #initiator {
                        transition: all 0.4s ease; 
                }
            }

            #x-logo {
                max-width: 26px;
            }

            &:hover, &:focus, &:focus-visible {
                svg {
                    #x, #li, #initiator {
                        fill: var(--secondary-color) !important;    
                    }
                }
            }
        }
    }
}

.footer-middle-row {
    display: flex;
    gap: 3rem;

    .footer-menu {
        display: flex;
        flex-basis: 40%;
    }
    
    #footer-menu {
        display: flex;
        flex-wrap: wrap;
        list-style-type: none;
        margin: 0 !important;
        row-gap: 0.75rem;

        li {
            flex-basis: 50%;
            a {
                font-weight: 600;
                text-decoration: none;
            }
        }
    }

    .locations-container {
        display: flex;
        flex-basis: 60%;
        gap: 2rem;

        .location-item {

            .location-title {
                color: #fff;
                font-weight: 800;
                margin-top: 0px;
            }

            .location-information {
                color: #fff;
            }
        }
    }
}


.footer-bottom-row {
    
    .footer-bottom-information {

    }

    .copyright-links {
        color: #fff;
        
       

        a {
            color: #fff;
            text-decoration: none;

            &:hover, &:focus, &:focus-visible {
                color: var(--secondary-color) !important;
            }
        }
    }
}


@media (max-width: 770px) {
    .footer-top-row {
        flex-direction: column;
    }

    .footer-middle-row {
        flex-direction: column;

        .footer-menu {
            flex-basis: 100%;
            justify-content: center;
        }

        #footer-menu {
            align-items: center;
            flex-direction: column;
        }

        .locations-container {
            align-items: center;
            flex-basis: 100%;
            flex-direction: column;

            .location-item {
                text-align: center;
            }
        }
    }

    .footer-bottom-row {
        .copyright-links {
            text-align: center;
        }
    }
}



/* Hero Styles */

.symbio-hero-section {
    align-items: center;
    display: flex;
    font-size: min(16px,1.11vw);
    height: 100%;
    min-height: 31.875em;
}

.symbio-hero-inner-section {
    margin: 0 auto;
    max-width: 1200px;
    padding: 2em 0.9375em;
    width: 100%;
}

.symbio-hero-content {
    max-width: 41em;
    width: 100%;
}

.symbio-hero-icons {
display: flex;
gap: 2rem;
margin: 1em 0 2em 0;

    .symbio-icon-container {
        align-items: center;
        display: flex;
        flex-direction: column;

        p {
            font-weight: 900;
            margin: 0;
        }
    }

    img.symbio-hero-icon {
  
            max-width: 5em;
            width: 100%;
      
    }

    
}

.symbio-hero-title {
    color: var(--fifth-color);
    font-family: 'Raleway', sans-serif;
    font-weight: 900;
    font-size: max(22px, 3.5em);
    line-height: 1.25em;
    margin-bottom: 0px;
    margin-top: 0px;
}

ul.symbio-hero-number-container {
    align-items: center;
    display: flex;
    list-style-type: none;
    margin: 0;

    li.symbio-hero-number {
        color: #000;
        font-size: max(16px, 1.15em);
        font-weight: 700;
    }

    li:not(:first-child) {
        padding-left: 0.5em;
    }

    li:not(:last-child) {
        border-right: 0.1875em solid var(--sixth-color);
        padding-right: 0.5em;
    }

    
}


/* The Symbio Promise */

.symbio-promise-container {
    background: #eeeeee;
}

.symbio-promise-inner-container {
    align-items: center;
    display: flex;
    gap: 5rem;
    margin: 0 auto;
    max-width: 1200px;
    padding: 2rem 0.9375em;
    width: 100%;
}

 .symbio-promise-title {
        color: var(--primary-color) !important;
        font-family: 'Raleway', sans-serif;
        font-size: 1.625em !important;
        font-weight: 600 !important;
    }

.symbio-promise-content {
    flex-basis: 45%;

   
}

.symbio-promise-image {
    flex-basis: 55%;
}

.symbio-promise-solutions-container {
    list-style-type: none;
    margin: 2em 0 3em 0 !important;

    .symbio-promise-solution {
        margin-bottom: 2em;

        .symbio-promise-title {
            color: var(--third-color) !important;
            font-family: 'Open Sans', sans-serif !important;
            font-size: 1.375em !important;
            font-weight: 700 !important;
            margin: 0 !important;
        }

        .symbio-promise-text {
            margin: 0 !important;

            a {
                color: inherit !important;
                transition: all 0.4s ease;

                &:hover, &:focus, &:focus-visible, &:active {
                    color: var(--third-color) !important;
                }
            }
        }
    }
}

.symbio-promise-link {
    color: var(--primary-color) !important;
    border-bottom: 2px solid var(--third-color);
    font-family: 'Raleway', sans-serif !important;
    font-size: clamp(0.9rem, 0.65rem + 0.667vw, 1.25rem) !important;
    font-weight: 900 !important;
    position: relative;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        color: var(--third-color) !important;
    }

    &:before {
        border-bottom: 7px solid transparent;
        border-left: 14px solid var(--third-color);
        border-top: 7px solid transparent;
        bottom: 50%;
        content: '';
        margin: auto;
        position: absolute;
        right: -25px;
        top: 50%;
    }

}

.symbio-promise-image-wrapper {
    transform: translateY(-50px);
}

@media (max-width: 770px ){
    .symbio-promise-inner-container {
        flex-direction: column;
    }

    .symbio-promise-image-wrapper {
        transform: translateY(0);
        img {
            max-width: clamp(15rem, 4.189rem + 43.243vw, 25rem);
        }
    }
} 



/* End-to-End Container */
.end-to-end-inner-container {
    margin: 0 auto;
    max-width: 1200px;
    padding: 2rem 0.9375em;
    width: 100%;
}

.end-to-end-title {
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif;
    font-size: 1.625em !important;
    font-weight: 600 !important;
}

/* Start a Conversation */

.start-a-conversation-container {
    font-size: min(16px, 1.11vw);
}

.start-a-conversation-container-inner-container {
    margin: 0 auto;
    max-width: 1200px;
    padding: 2em 0.9375em;
    width: 100%;
}

.start-a-conversation-content-container {
    align-items: center;
    display: flex;
    gap: 3rem;
    position: relative;
    z-index: 1;

    &:before {
        border: 3px solid var(--primary-color);
        content: '';
        height: 11.5em;
        position: absolute;
        width: 100%;
        z-index: -1;

    }
}

#symbio-logo {
    max-width: 20em;
    width: 100%;
}

.symbio-callout-title {
    color: var(--primary-color) !important;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.625em !important;
    font-weight: 600 !important;
    max-width: 14em;
    width: 100%;
}



/* Targeted Expertise Section */
.targeted-expertise-section {
    margin: 0 auto;
    max-width: 1200px;
    padding: 2rem 0.9375em;
    width: 100%;
}

.targeted-expertise-inner-section {
    display: flex;
    gap: 2rem;
}

.targeted-expertise-image {
    flex-basis: 50%;

    .targeted-expertise-image-wrapper {
        img {
            left: 0;
            max-width: 35em;
            /* position: absolute;
            transform: translateX(90px); */
        }
    }
}

.targeted-expertise-content {
    flex-basis: 50%;
}

.icon-link-container {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    justify-content: center;
    list-style-type: none;
    margin: 3em 0 0 0;

    .icon-link-item {
        flex-basis: 16em;

        a {
            align-items: center;
            border: 2px solid #eeeeee;
            display: flex;
            flex-direction: column;
            padding: 0.5em;
            text-decoration: none !important;
            transition: all 0.4s ease;


            img {
                filter: brightness(1) invert(0); 
                max-width: 10em;
                transition: all 0.4s ease;
                width: 100%;
            }

            h3 {
            color: var(--primary-color) !important;
            font-family: 'Raleway', sans-serif;
            font-size: 1.25em !important;
            font-weight: 600 !important;
            margin-top: 0 !important;
            text-align: center;
            transition: all 0.4s ease;
        }

            &:hover, &:focus, &:focus-visible {
                background: var(--primary-color) !important;
                border: 2px solid var(--primary-color);
                cursor: pointer;
                
                img {
                    filter: brightness(0) invert(1); 
                }

                h3 {
                    color: #fff !important;
                }

            }

        }

        
    }
}


@media (max-width: 770px) {
    .targeted-expertise-inner-section {
        align-items: center;
        flex-direction: column;
    }

    .targeted-expertise-image {
        .targeted-expertise-image-wrapper {

            img {
max-width: 23em;
            }
            
        }
    }
}


/* Insights Section */
.insights-section-inner-container {
    margin: 0 auto;
    max-width: 1200px;
    padding: 2rem 0.9375em;
    width: 100%;
}

.insights-section-title {
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif;
    font-size: 2.1875em !important;
    font-weight: 900 !important;
    text-align: center;
}

.button-container {
    display: flex;
    gap: 2rem;
}

.btn-width {
    flex-basis: 33.33%;
}

.yellow-inverse-btn {
    background: #fff;
    border: 3px solid var(--fourth-color) !important;
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: clamp(1rem, 0.821rem + 0.476vw, 1.25rem) !important;
    font-weight: 800 !important;
    padding: 1em 4em;
    text-align: center;
    text-decoration: none !important;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        background: var(--fourth-color) !important;
        /* color: #fff !important; */
    }
}

.blue-inverse-btn {
    background: #fff;
    border: 3px solid var(--secondary-color) !important;
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: clamp(1rem, 0.821rem + 0.476vw, 1.25rem) !important;
    font-weight: 800 !important;
    padding: 1em 5em;
    text-align: center;
    text-decoration: none !important;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        background: var(--secondary-color) !important;
        /* color: #fff !important; */
    }
}

.purple-inverse-btn {
    background: #fff;
    border: 3px solid var(--third-color) !important;
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: clamp(1rem, 0.821rem + 0.476vw, 1.25rem) !important;
    font-weight: 800 !important;
    padding: 1em 5em;
    text-align: center;
    text-decoration: none !important;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        background: var(--third-color) !important;
        color: #fff !important;
    }
}

@media (max-width: 855px) {
    .button-container {
        flex-direction: column;
    }
}


/* Home Prefooter Section */

.home-prefooter-section {
    background: linear-gradient(0deg,rgba(238, 238, 238, 1) 90%, rgba(255, 255, 255, 1) 90%);
    margin-top: 3rem;
    max-height: 370px;
   
}

.home-prefooter-inner-section {
    align-items: center;
    display: flex;
    margin: 0 auto;
    max-height: 370px;
    max-width: 1200px;
    padding: 0 0.9375em;
    width: 100%;
}

.prefooter-image-container {
    img {
        max-width: 25.625em;
        width: 100%;
    }
}

.prefooter-image-container {
    flex-basis: 40%;
}

.prefooter-content-container {
    flex-basis: 60%;
}

.prefooter-title {
    color: var(--primary-color) !important;
    font-family: 'Raleway', sans-serif;
    font-size: 1.625em !important;
    font-weight: 600 !important;
}

.prefooter-btn {
    background: var(--primary-color) !important;
    color: #fff !important;
    cursor: pointer;
    display: inline-block;
    border: 3px solid var(--primary-color) !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1.25em !important;
    font-weight: 800 !important;
    margin-top: 0.5em;
    padding: 0.75em 3em;
    text-decoration: none !important;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        background: #fff !important;
        color: var(--primary-color) !important;
    }
}

@media (max-width: 770px ){

    .home-prefooter-section {
        background: #eeeeee;
        max-height: 100%;
    }

    .home-prefooter-inner-section {
        flex-direction: column-reverse;
        max-height: 100%;
    }
}



/**********************************
* About Us Page Template Styles
**********************************/


.page-template-about {
    .site-content {
        padding-top: 108px;
    }

    .slider {
        display: none;
    }
	
	.page {
		 h1 {
        color: var(--primary-color) !important;
        font-weight: 900 !important;
    }
		
		
		
    ul {
        li {
            &::marker {
                color: var(--third-color) !important;
            }
        }
    }
		
		
		 p {
        a {
            color: #2a2b2e !important;
            &:hover, &:focus, &:focus-visible {
                color: var(--third-color) !important;
            }
        }
    }
	
	}

   


   
	
}

@media (max-width: 770px) {
    .page-template-about {
        .site-content {
            padding-top: 0px;
        }
    }
}

/* Timeline Section */
.timeline-section {
    background: #eeeeee;
}

.timeline-inner-section {
    align-items: center;
    display: flex;
    gap: 6rem;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.timeline-image {
    img {
        display: block;
        max-width: 30em;
        width: 100%;
    }
}


/* Site Network Section */

.site-network-inner-section {
    display: flex;
    gap: 4rem;
}

.site-network-content {
    flex-basis: 70%;
}

.site-network-buttons-section {
    flex-basis: 30%;
}


@media (max-width: 770px) {
    .site-network-inner-section {
        flex-direction: column;
    }
}



.sponsor-investigator-text {
    color: var(--primary-color) !important;
    font-size: 1.15em !important;
    font-weight: 600;

    .sponsor {
        font-weight: 700 !important;
        text-decoration: underline solid var(--fourth-color) !important;
        text-decoration-thickness: 3px !important;
    }

    .investigator {
        font-weight: 700 !important;
        text-decoration: underline solid var(--secondary-color) !important;
        text-decoration-thickness: 3px !important;
    }

    &.last {
        margin-top: clamp(2rem, 0.571rem + 3.81vw, 4rem);
    }

  
}

.blue-btn {
    background: var(--secondary-color) !important;
    border: 3px solid var(--secondary-color) !important;
    color: var(--primary-color) !important;
    display: inline-block;
    font-family: 'Raleway', sans-serif !important;
    font-size: 1.25em !important;
    font-weight: 800 !important;
    padding: 0.5em 1em;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: all 0.4s ease;

    &:hover, &:focus, &:focus-visible {
        background: #fff !important;
        color: var(--primary-color) !important;
    }
}


/* Testimonial Section */

.testmonial-section {
    font-size: min(16px,1.11vw);
}


.testimonial-inner-section {
    display: flex;
    gap: 2rem;
}

.testimonial-content {
    align-items: center;
    background: #eeeeee;
    display: flex;
    justify-content: center;
    padding: 2em;
    position: relative;

    &:before {
        border-bottom: 30px solid transparent;
        border-left: 50px solid #eeeeee;
        border-top: 30px solid transparent;
        bottom: 50%;
        content: '';
        left: -50px;
        margin: auto;
        position: absolute;
        top: 50%;
        transform: rotate(180deg);
    }
}

.testimonial-image-container {
    flex-basis: 40%;
    text-align: center;

    img {
        max-width: 31.25em;
        width: 100%;
    }
}

.testimonial-content {
    flex-basis: 60%;
}

.testimonial-text {
    max-width: 39.375em;
    width: 100%;
}

.top-quote, .bottom-quote {
    max-width: 6em;
    width: 100%;
}

.top-quote {
    left: 0;
    position: absolute;
    top: 0;
    transform: translate(-3em, 2em);
}

.bottom-quote {
    bottom: 0;
    position: absolute;
    right: 0;
    transform: rotate(180deg) translate(3em, -1em);
}


@media (max-width: 1234px) {
    .top-quote, .bottom-quote {
    max-width: 4em;

}

.top-quote {
    transform: translate(-2em, 0em);
}
}



@media (max-width: 770px) {
  .testimonial-inner-section {
    flex-direction: column-reverse;
  }

  .testimonial-content {

    &:before {
        bottom: -3.25em;
        left: 50%;
        right: 50%;
        top: unset;
        transform: rotate(90deg);
    }
  }

  .top-quote {
    transform: translate(2em, -1em);
}
}


/* Get In Touch Section */

.start-a-conversation-container-inner-container.pad {
    padding: 4em 0.9375em
}

.start-a-conversation-content-container.get-in-touch {
    &:before {
        height: 14em;
    }
}

.get-in-touch-cta {
    .symbio-callout-title {
        max-width: 27em;
        width: 100%;
    }
}



/**********************************
* Sponsors Page Styles
**********************************/

.page-template-sponsors {
    .slider {
        display: none;
    }

    .site-content {
        padding-top: 112px;
    }

    .main-content {
        padding-bottom: 0px !important;
    }
}

.sponsors-header {
    /* background: var(--primary-color) !important; */
    font-size: min(16px, 1.11vw);
    position: relative;
    z-index: 1;

    &:before {
        background: var(--primary-color) !important;
        bottom: 50%;
        content: '';
        height: 17.0625em;
        margin: auto;
        position: absolute;
        top: 50%;
        width: 100%;
        z-index: -1;
    }

}

.sponsors-inner-header {
    align-items: center;
    display: flex;
    margin: 0 auto;
    max-width: 1200px;
    padding: 0 0.9375em;
    width: 100%;
}

.symbio-logo-container {
    flex-basis: 31em;
}

.sponsors-title {
    color: #fff;
    flex-basis: 100%;
    font-size: 2.5em;
    margin: 0 !important;
    text-transform: uppercase;
}

.sponsors-accordion-container {
    padding-bottom: 0px;
    padding-top: 0;

  

    .accordion-container {
        grid-template-rows: repeat(3, auto);
        margin-top: 0;

        a {
            color: inherit;

            &:hover, &:focus, &:focus-visible {
                color: var(--third-color)  !important;
            }
        }
    }
}





@media (max-width: 770px) {

.page-template-sponsors {
 

    .site-content {
        padding-top: 0px;
    }
}
}












