﻿#physicianCareersAccent {
    right: 0;
}

.small-accent-photo {
    z-index: 1;
    background-position: center;
    background-size: cover;
    height: 250px;
}

.small-info-card-contents {
    position: relative;
    z-index: 5;
}

#joinOurTeamShield{
    height: 75px;
    width: 75px;
    stroke: #fff;
    stroke-width: 10px;
    margin-bottom: 30px;
    overflow: visible;
}

#galleryCarousel .card-accent-stripe-container{
    padding-left: 5px;
    padding-right: 5px;
}

#joinOurTeamShieldParent {
    position: relative;
}

#skylineStatContainer {
    position: relative;
    overflow: hidden;
}

#skylineStats {
    background-image: url('https://copcp.s3.us-east-2.amazonaws.com/Images/Skylines/Skyline.png');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    height: 60%;
    width: 100%;
    position: absolute;
    bottom: -1px;
    opacity: 1;
}

#skylineBackgroundBuildings {
    background-image: url('https://copcp.s3.us-east-2.amazonaws.com/Images/Skylines/Skyline+-+Background+Buildings.png');
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: contain;
    height: 45%;
    left: 0;
    right: 0;
    position: absolute;
    bottom: -1px;
    opacity: 0.5;
    margin: 0 auto;
}

.skyine-stat-number {
    color: #bcd331;
    text-shadow: 0px 0px 40px rgba(0, 0, 0, 0.5);
}

.plane {
    font-size: 3em;
    color: #fff;
    position: absolute;
    backface-visibility: hidden;
    will-change: transform;
    -webkit-backface-visibility: hidden;
    display: block;
    bottom: 0;
    left: 0;
    transform: rotate(-45deg);
}

.plane-container {
    animation: infinite;
    bottom: 0;
    left: 0;
    position: absolute;
}

.fly {
    -webkit-animation-timing-function: linear;
    animation-fill-mode: both;
    animation-name: fly;
    -webkit-animation-name: fly;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
    -webkit-animation-timing-function: ease-in;
    animation-duration: 20s;
}

@keyframes fly {
    0% {
        opacity: 0;
        -ms-transform: translate(0px, 0px);
        -webkit-transform: translate(0px, 0px);
        -o-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }

    50% {
        opacity: 1;
    }

    100% {
        -ms-transform: translate(700px, -700px);
        -webkit-transform: translate(700px, -700px);
        -o-transform: translate(700px, -700px);
        transform: translate(700px, -700px);
        opacity: 0;
    }
}


.aof-slider-shield {
    height: 150px;
    width: 150px;
    margin-bottom: 30px;
    fill: #b9b9b9;
}

#careerTypesAccent{
    position: absolute;
    right: -20%;
    top: 0;
    bottom: 0;
    left: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
    background-color: #ccc;
}

#careerTypesParent{
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    opacity: 0.2;
}

.award-wreath {
    height: 150px;
    width: 150px;
    max-width: 100%;
    margin-bottom: 30px;
    stroke-width: 2px;
    fill: transparent;
    overflow: visible;
}

.award-container {
    margin-bottom: 50px;
}

.award-container .animate-svg-outline-parent{
    height: 150px;
    width: 150px;
    position: relative;
    margin: 0 auto;
}

#areaOfFocusBlue .blue-shield-section{
    fill: #005792;
}

#areaOfFocusLightBlue .light-blue-shield-section{
    fill: #00add7;
}

#areaOfFocusLightGreen .light-green-shield-section{
    fill: #bcd331;
}

#testimonialsShieldAccent {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: -1;
    opacity: 0.2;
    height: 90%;
}

.quote-inner-left {
    padding-right: 100px;
}

.quote-inner-right {
    padding-left: 100px;
}

.career-quote-image {
    height: 450px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    box-shadow: 0 37px 50px -12px rgba(0,0,0,0.3);
    border-radius: 10px;
}

#bestForPrimaryCareTitle {
    font-size: 3em;
}

#missionBanner {
    font-size: 4em;
}

#galleryTaglineOne, #galleryTaglineTwo{
    font-size: 2em;
}

#physicianMissionBanner {
    font-size: 3em;
}

.animate-svg-outline-parent{
    z-index: 0;
}

#nationAccent {
    height: 450px;
    width: auto;
    position: absolute;
    top: -30px;
    right: 30px;
    z-index: 0;
    opacity: 0.3;
    stroke-width: 2px;
    stroke: #fff;
    fill: #005792;
    overflow: visible;
}

#numberPracticeAccent{
    height: 225px;
    width: auto;
    position: absolute;
    top: -30px;
    left: 0;
    z-index: 0;
    opacity: 0.3;
    stroke-width: 6px;
    stroke: #fff;
    fill: #005792;
    overflow: visible;
}

#numberProvidersAccent{
    height: 225px;
    width: auto;
    position: absolute;
    top: -30px;
    left: 0;
    z-index: 0;
    opacity: 0.3;
    stroke-width: 6px;
    stroke: #fff;
    fill: #005792;
    overflow: visible;
}

#historyAccentImageContainer{
    background-repeat: repeat;
    position: absolute;
    left: 0;
    top: 0;
    right:0;
    height: 100%;
    width: 100%;
    bottom: 0;
    opacity: 0.1;
    z-index: 0;
    background-image: url('https://copcp.s3.us-east-2.amazonaws.com/Images/Accent+Images/COPC+Stats/Shield+Dot.png')
}

#missionAccent{
    height: 450px;
    width: auto;
    position: absolute;
    bottom: 0;
    right: 30px;
    z-index: 0;
    opacity: .3;
}

#stickyApplyButton {
    margin: 5px 0px 5px 5px;
}

#stickyBackButton{
    margin-right: 5px;
}

.quote-wrapper, .career-quote-image {
    position: relative;
    z-index: 1;
}

#clinicalExcellenceSliderImage {
    background-position: left;
}

@media(min-width: 1041px) and (max-width: 1400px) {
    .quote-wrapper-container {
        flex: 100%;
        max-width: 100%;
    }
}

@media(min-width: 991px) and (max-width: 1040px) {

    .info-card-wrapper {
        flex: 50%;
        max-width: 50%;
    }

    .quote-wrapper-container {
        flex: 100%;
        max-width: 100%;
    }
}

@media(min-width: 768px) and (max-width: 990px) {

    .quote-inner-left {
        padding-right: 50px;
    }

    #missionBanner, 
    #bestForPrimaryCareTitle, 
    #physicianMissionBanner,
    #galleryTaglineOne, 
    #galleryTaglineTwo {
        font-size: 2em;
    }

    .quote-inner-right {
        padding-left: 50px;
    }

    .quote-wrapper-container {
        flex: 100%;
        max-width: 100%;
    }

    #learnMoreHistoryContainer .content-container {
        margin-bottom: 40px;
    }
    .aof-slider-shield {
        height: 100px;
        width: 100px;
    }
}

@media(max-width: 767px) {

    .skyline-stat-container {
        margin-bottom: 50px;
    }

    .plane {
        font-size: 20px !important;
    }

    #nationAccent{
        height: auto;
        width: 90%;
    }

    #areasOfFocusCarousel .slider-card-content {
        margin-top: 175px;
    }

    .quote-accent.left {
        top: 0;
        left: 25%;
    }

    .quote-accent.right {
        top: 0;
        right: 25%;
    }

    #benefits .nav-fill .nav-item{
        flex: 50%;
    }

    #leadershipAccent{
        height: unset;
        width: 100%;
        right: 0;
    }

    #historyCallout h3{
        font-size: 1.2em;
    }

    #historyCallout .content-container{
        margin-bottom: 25px;
    }

    #numberPracticeAccent, #numberProvidersAccent{
        height: 150px;
    }

    #copcStatsCallout h3{
        font-size: 1.2em;
    }

    #copcStatsCallout .content-container{
        margin-bottom: 30px;
    }

    #missionBanner, 
    #bestForPrimaryCareTitle, 
    #physicianMissionBanner,
    #galleryTaglineOne,
    #galleryTaglineTwo {
        font-size: 2em;
    }

    .aof-slider-shield {
        height: 50px;
        width: 50px;
        margin-bottom: 15px;
    }

    #missionAccent{
        height: 250px;
    }

    .quote-accent{
        font-size: 200px;
    }

    #learnMoreHistoryContainer .content-container{
        margin-bottom: 25px;
    }

    .quote-inner-left, .quote-inner-right {
        padding: 0px;
        margin-bottom: 30px;
    }

    .career-quote-image {
        order: 1;
    }

    .career-quote-image {
        height: 350px;
    }

    .cards-equal-height {
        height: auto !important;
    }

    #testimonialsShieldAccent {
        display: none;
    }

    .physician-career-card {
        height: auto !important;
    }

        .physician-career-card h3 {
            font-size: 1.25rem;
        }

        #stickyApplyButton {
            width: 49%;
            margin-left: auto;
        }

    #stickyBackButton{
        width: 49%;
    }

    #secondaryApplyButton {
        display: none;
    }

    #benefitsContainer .cards-equal-height {
        padding: 15px !important;
    }

    #benefitsAccentsContainer {
        height: 80vh;
    }

    #careerDetails {
        order: 2;
    }

    #careerOverview {
        order: 1;
        margin-bottom: 50px;
    }
}

@media(max-width: 320px) {
    .career-quote-image {
        height: 250px;
    }
}