#main {
    padding: 0;
    color: #333;
}

#pathway-navigation {
    flex-grow: 1;
}

/* Pathway Header */
#kvcc-pathway-header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: relative;
    margin: 0;
}

#kvcc-pathway-title {
    background: linear-gradient(to right, #eee, white);
    text-transform: uppercase;
    padding: 1rem 2rem;
    border-top: 1rem solid #333;
    margin: 0;
}

/* Pathway Title Specific Colors */
/* PHP is generating the class that is appended to the h1 tag and limiting it to 8 characters. */
#kvcc-pathway-title.applieda {
    border-color: #DA2491;
}

#kvcc-pathway-title.business {
    border-color: #F36B24;
}

#kvcc-pathway-title.educatio {
    border-color: #AC1F2E;
}

#kvcc-pathway-title.healthca {
    border-color: #006271;
}

#kvcc-pathway-title.englishh {
    border-color: #0094C9;
}

#kvcc-pathway-title.industri {
    border-color: #86266A;
}

#kvcc-pathway-title.publicse {
    border-color: #D08B2A;
}

#kvcc-pathway-title.sciencea {
    border-color: #BFBA31;
}

#kvcc-pathway-title.sustaina {
    border-color: #76BE43;
}

#kvcc-pathway-title.corporat {
    border-color: #878686;
}

#kvcc-pathway-title.communit {
    border-color: #f7e94f;
}

#kvcc-pathway-title.careerac {
    border-color: #53862E;
}

#kvcc-pathway-image {
    height: 24rem;
    flex-grow: 1;
    width: 100%;
    object-fit: cover;
    display: none;
}

#kvcc-pathway-content {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}

/* Pathway Navigation */
#kvcc-pathway-links {
    width: 100%;
    color: black;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
}

#kvcc-pathway-links h2 {
    background-color: #007FB0;
    color: white;
    font-size: 200%;
    margin: 0 0 1rem;
    padding: 1rem;
    text-transform: uppercase;
    line-height: 100%;
    font-weight: 400;
}

#kvcc-pathway-links .blueButton {
    margin: 1.5rem 0 1rem;
    width: auto;
}

.kvcc-pathway-category {
    padding: 0 1rem 1rem;
}

.kvcc-pathway-category summary {
    display: flex;
    justify-content: center;
    align-items: center;
    outline: 0;
    cursor: pointer;
    transition: color 0.25s ease;
}

.kvcc-pathway-category summary:hover {
	background-color: #006A99;
	color: white;
	padding-left: .5rem;
	padding-top: .25rem;
	padding-bottom: .25rem;
	padding-right: .25rem;

	/*color: #007FB0;*/
}

.kvcc-pathway-category summary:focus {
	background-color: #006A99;
	color: white;
	padding-left: .5rem;
	padding-top: .25rem;
	padding-bottom: .25rem;
	padding-right: .25rem;
	/*color: #005E8F;*/
}

.kvcc-pathway-category summary h3 {
    margin: 0;
}

.kvcc-pathway-category a {
    display: block;
    margin-top: 0.5rem;
}

/* Pathway Information */
#kvcc-pathway-information {
    flex-grow: 1;
    padding: 1rem;
}

/* Additional Information */
.kvcc-pathway-additional-info h2 {
    font-size: 200%;
    margin: 1rem 0 0.25rem;
}

.stryker-testimonial {
    padding: 1rem 0;
    font-style: italic;
    font-size: 87.5%;
    line-height: 150%;
}

.stryker-testimonial img {
    width: 16rem;
}

/* Salary Information */
.pathway-salary-title {
    font-weight: bold;
    font-size: 125%;
}

.pathway-salary-range {
    font-size: 112.5%;
    font-weight: 400;
    margin: 0.25rem 0 0.75rem;
}

/* Prevent JavaScript from displaying FontAwesome Icons. */
#kvcc-pathway-links svg, #kvcc-pathway-information svg {
    display: none;
}

/* 768px Breakpoint*/
@media (min-width: 48rem) {
    #kvcc-pathway-links {
        width: auto;
        max-width: 32rem;
        flex-wrap: wrap;
        flex-shrink: 0;
        align-items: flex-end;
        text-align: right;
        list-style: none;
    }

    #kvcc-pathway-links h2 {
        padding-left: 2rem;
    }

    /* Marketing wants the desktop version to be right aligned, so we have to shift the details stuff around. */
    #kvcc-pathway-links summary::-webkit-details-marker {
        display: none;
    }

    #kvcc-pathway-links details h3::after {
        content: "▸";
		margin-left: 0.5rem;
    }

    #kvcc-pathway-links details[open] h3::after {
        content: "▾";
	}

    #kvcc-pathway-content {
        padding-top: 1rem;
        flex-direction: row;
    }

    #kvcc-pathway-title {
        font-size: 250%;
    }

    #kvcc-pathway-information {
        padding-left: 2rem;
    }

    #kvcc-pathway-image {
        display: block;
    }
}

/* 1440px Breakpoint*/
 #kvcc-pathway-links details h3::after {
        content: "▸";
		margin-left: 0.5rem;
    }

    #kvcc-pathway-links details[open] h3::after {
        content: "▾";
	}

@media (min-width: 90rem) {
    #kvcc-pathway-title {
        font-size: 300%;
    }

    #kvcc-pathway-image {
        height: 50vh;
	}
}