@charset "utf-8";
/* CSS Document */
@import url("https://use.typekit.net/rzm6lyu.css");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700;800&display=swap");
@import url("https://use.typekit.net/cwu0cei.css");

/*
Theme Name: Johns Hopkins Jobs Child Theme
Theme URI: https://github.com/tharman1jh/Johns-Hopkins-Jobs-child
Author: Technology Innovation Center at Johns Hopkins
Description: A WordPress starter theme for Johns Hopkins.
Version: 1.4.0
Text Domain: text-domain
Template: Johns-Hopkins-University
Johns Hopkins Jobs WordPress Theme, (C) 2023 Technology Innovation Center
*/
/*
...
GitHub Theme URI: tharman1jh/Johns-Hopkins-Jobs-child
GitHub Theme URI: https://github.com/tharman1jh/Johns-Hopkins-Jobs-child
GitHub Branch: master
*/
body {
	font-size: 18px !important;
	-webkit-animation: 1.85s ease 0s normal forwards 1 fadein;
	animation: 1.85s ease 0s normal forwards 1 fadein;
	min-width: 360px;
	overflow-x: hidden;
}
a, a:link, a:visited, a:active{
	text-decoration: none;
}
.bg-dk-blue {
	background: #002d72;
}

.bg-dk-blue h2 {
	color: #fff !important;
}

section {
	padding: 0;
	margin: 0;
}

.cta-join-talent-community a,
.cta-join-talent-community:visited {
	/* .cta-join-talent-community:hover { */
	color: white !important;
}

#tablepress-1 {
	margin: 0 auto;
	max-width: 1024px !important;
	border-spacing: 15px !important;
	display: table;
}

#tablepress-1 tr {
	background-color: transparent;
}

#tablepress-1 tr td {
	background-color: transparent !important;
	text-align: center;
	display: flex;
	justify-content: center;
	padding: 0 !important;
	margin: 0 !important;

}

#tablepress-1 tr td .btn {
	margin: 0 7px !important;
	border-radius: 0 !important;

}

#tablepress-1 tr td .btn-primary:hover {
	background: #fff !important;
	color: #002d72 !important;
}
.default .nav-cta {
    border: none !important;
}
.default .nav-cta:hover {
    border: none !important;
}
.text-white a {
	color: #fff;
	text-decoration: none;
}

.container {
	max-width: 1024px !important;
	margin: 0 auto !important;
}

.hopkins-voices .container {
	max-width: 1164px !important;
	margin: 0 auto !important;
}

.wp-block-button__link {
	background-color: #002D72 !important;
	font-family: "Work Sans", sans-serif !important;
	font-weight: 600 !important;
	font-size: 16px !important;
	color: #fff !important;
	padding: 5px 24px !important;
	border-radius: 0;
	text-transform: uppercase !important;
	border: none !important;
	letter-spacing: 1.2px !important;
}

.wp-block-button__link:hover {
	background-color: #fff !important;
	color: #002D72 !important
}

.meet-hopkins-container .wp-block-button__link {
	background-color: #0072CE !important;
}

.meet-hopkins-container .wp-block-button__link:hover {
	background-color: #fff;
	color: #002d72 !important;
}

.meet-hopkins-container h2 {
	font-family: "Factoria";
	font-weight: 700;
	color: #fff;
}

.meet-hopkins-container figure {
	position: relative;
}


figure a {
	border-bottom: none;
}

.meet-hopkins-container figure::after {
	content: '';
	position: absolute;
	background: url("assets/img/people-overlay.svg") no-repeat;
	background-size: cover;
	background-position: bottom;
	opacity: 0;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	transition: opacity 0.5s ease-in-out;
	cursor: pointer;
}

.meet-hopkins-container figure:hover::after {
	content: '';
	background: url("assets/img/people-overlay.svg") no-repeat;
	background-size: cover;
	background-position: bottom;
	opacity: 1;
	transition: opacity 0.5s ease-in-out;
}

h2:not(.wp-block-pb-accordion-item h2), {
	font-family: "Roboto Slab" !important;
	font-weight: 700 !important;
	font-size: 36px !important;
}
h3 {
	font-family: "Roboto Slab" !important;
	font-weight: 700 !important;
	font-size: 30px !important;
}
h4 {
	font-family: "Work Sans", sans-serif !important;
	font-weight: 700 !important;
	font-size: 24px !important;
}

.underline::after {
	content: '';
	display: block;
	margin: 1em auto;
	width: 70px;
	height: 9px;
	background: #0072CE;
}

.jumbotron-overlay:not(.secondary-jumbotron .jumbotron-overlay) {
	background: linear-gradient(98.6deg, #002D72 23.82%, rgba(104, 172, 229, 0) 82.06%) !important;
	mix-blend-mode: multiply;
	position: absolute;
}

.jumbotron .inner-wrap {
	max-width: 100% !important;
	position: absolute;
	top: 0;
	left: 0;
}
.secondary-jumbotron .inner-wrap {
    max-width: 1024px;
    height: 100%;
    display: flex;
    align-items: center;
    margin: 0 auto;
}
.inner-wrap:not(.lists .inner-wrap) {
	padding: 0;
}
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0;
    margin-bottom: 1rem;
    margin-top: 1rem;
    list-style: none;
}

/*
.jumbotron::after{
	content: '';
	display: block;
	background: url("assets/img/jobs-jumbotron-bottom-border.svg") no-repeat;
	background-size: cover;
	height: 15px;
	width: 100%
}
*/

.jumbotron h1 {
	font-family: "Roboto Slab";
	font-weight: 300;
	font-size: 64px !important;
	z-index: 9999;
	position: relative;
}

.decor {
	display: block;
	width: 70px;
	height: 71px;
	background: url("assets/img/banner-title-blocks.svg") no-repeat;
	position: absolute;
	top: -45px;
	right: -15px;
}

.jumbotron .green-bg {
	background-color: #008767;
	display: block;
	padding: 5px 1px;
	margin-right: 50px
}

.jumbotron .blue-bg {
	background-color: #0072CE;
	display: block;
	padding: 5px 10px;
	margin-top: 20px;
	margin-left: 50px;
}

.jobs-search-bar {
	background-color: #002D72;
	height: auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 1em;
}

.search-btn-wrap {
	position: relative;
}

.search-btn-wrap a {
	display: inline-flex;
	flex-direction: row;
	background: #fff;
	color: #002d72;
	font-size: 24px;
	font-weight: 700;
	height: 72px;
	width: 402px;
	text-decoration: none;
}

.search-btn-wrap .search-icon {
	background: #68ACE5 url("assets/img/search-icon.svg") no-repeat;
	background-position: center;
	width: 74px;
	height: 72px;
	display: block;
}

.search-btn-wrap .search-arrow-icon {
	background: url("assets/img/search-arrow-icon.svg") no-repeat;
	background-position: 25%;
	width: 64px;
	height: 72px;
	display: block;
	transition: all 0.25s ease-in-out;
}

.search-btn-wrap a:hover .search-arrow-icon {
	background-position: 40%;
	transition: all 0.25s ease-in-out;
}

.search-btn-wrap .btn-text {
	display: flex;
	align-self: center;
	margin: 0em 0.35em 0em 0.75em;
	height: 40px;
}

.default .nav-cta {
	border: none !important;
}

.utility-menu a {
	font-weight: 700;
}

.secondary-btn-wrap {
	display: flex;
	margin: 1em auto 0;
}

.secondary-btn-wrap a {
	display: inline-block;
	font-weight: 700;
	background: #68ACE5;
	color: #002D72;
	padding: 10px 20px;
	margin: 0 1em;
}

.cta-join-talent-community {
	background: #0072CE url("assets/img/join-talent-community-overlay.png") no-repeat;
	background-size: contain;
	background-position: left;
	display: flex;
	align-items: center !important;
	justify-content: center !important;
	min-height: 450px;
	color: #fff;
	padding: 2em 0;
}

.cta-join-talent-community .container {
	max-width: 800px;
	margin: 0 auto;
}

.cta-join-talent-community h2 {
	color: #fff;
	font-weight: 700;
}

.cta-join-talent-community h2::after {
	content: '';
	display: block;
	width: 10%;
	height: 9px;
	margin: 1em auto;
	background: #fff;
}

.meet-hopkins-container {
	background-color: #002D72;
	background-image: url("assets/img/meet-hopkins-bg.svg");
	background-repeat: no-repeat;
	background-size: cover;
}

.video-container {
	background-color: #EFEEEE;
	background-image: url("assets/img/excellence.png");
	background-size: cover;
	background-repeat: no-repeat;
	background-blend-mode: multiply;
	padding: 2em 0;
	text-align: center;
}

.video-cap {
	position: relative;
}

.video-cap a:after {
	content: '';
	position: absolute;
	background: url("assets/img/careers-video-play-btn.png") no-repeat;
	background-position: center;
	background-size: 126px;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	transition: all 0.5s ease-in-out;
	cursor: pointer;
}

.video-cap a:hover::after {
	content: '';
	position: absolute;
	background: url("assets/img/careers-video-play-btn-hover.png") no-repeat;
	background-position: center;
	background-size: 126px;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	transition: all 0.5s ease-in-out;
	cursor: pointer;
}

.video-container figure {
	margin: 0 auto;
}

.video-container {
	position: relative;
}

.custom-info-box-container::before {
	content: '';
	display: block;
	width: calc(100% - 30px);
	height: 100%;
	position: absolute;
	bottom: -10px;
	left: -10px;
}

.home .custom-info-box-container img {
	width: 220px !important;
	height: 210px !important;
}

.home .custom-info-box-container .icon-container {
	width: 22% !important;
}

.home .custom-info-box-container .txt-container {
	width: 78% !important;
}

.home .custom-info-box-container .txt-container p {
	color: #002d72 !important;
}

.custom-info-box-container {
	margin-bottom: 3em;
}

.home .custom-info-box-container .inner-wrap {
	background: #68ACE5;
	display: flex;
	flex-direction: row;
	padding: 1.5em;
}

.video-wrapper {
	/* Telling our absolute positioned video to 
  be relative to this element */
	position: relative;

	width: 100vw;
	height: 100%;

	/* Will not allow the video to overflow the 
  container */
	overflow: hidden;

	/* Centering the container's content vertically 
  and horizontally */
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

video {
	/** Simulationg background-size: cover */
	object-fit: cover;
	height: 100%;
	width: 100%;

	position: absolute;
	top: 0;
	left: 0;
}

.hopkins-voices {
	background: url("assets/img/hopkins-voices.png");
	background-size: cover;
	padding: 2em 0;
	    margin-bottom: 0;
}

.rss-articles {
	margin: 2em 0 0 !important;

}

.rss-articles .rss-article {
	border: none !important;
	max-width: 375px;
}

.rss-articles .rss-article .wp-block-group__inner-container {
	height: 100% !important;
}

.rss-articles .rss-article .article-image {
	position: relative !important;
	z-index: 998 !important;

}

.rss-articles .rss-article .article-text {
	background: #fff !important;
	padding: 10px !important;
	margin-left: 5% !important;
	margin-right: 5% !important;
	margin-top: -2.75em !important;
	width: 90% !important;
	position: relative !important;
	z-index: 999 !important;
	height: 50% !important;
}

.rss-articles .rss-article .article-title {
	margin-bottom: 10px !important;
	/* color: #002D72; */
}

.rss-articles .rss-article .article-image a {
	border: none;
}

.rss-articles .rss-article .article-title a,
.rss-articles .rss-article .article-title a:visited {
	color: #002D72 !important;
	font-size: 22px !important;
	text-decoration: none !important;
	font-family: "Work Sans", sans-serif !important;
	font-weight: 700 !important;
	letter-spacing: -0.5px !important;
	border: none;
	line-height: 1;
}

.rss-articles .rss-article .article-title a:hover {
	background: none;
	color: #0077d8 !important;
	font-size: 22px !important;
	text-decoration: underline !important;
	font-family: "Work Sans", sans-serif !important;
	font-weight: 700 !important;
	letter-spacing: -0.5px !important;
	border: none;
}

.rss-articles .rss-article .article-meta {
	color: #766e68 !important;
	font-size: 13px !important;
	margin: 5px 0 !important;
	padding: 0 !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.rss-articles .rss-article .article-description {
	color: #534a43 !important;
	font-size: 15px !important;
	line-height: 21px !important;
}

.stories .img-container {
	aspect-ratio: 1/1;
	/* overflow: hidden; */
}

.stories .img-container::before {
	width: 100% !important;
	height: 100% !important;
	/* overflow: hidden; */
}

.stories .row::before {
	content: '';
	background: url("assets/img/stories-top-block.svg") no-repeat;
	background-size: contain;
	width: 170px;
	height: 55px;
	position: absolute;
	display: block;
	z-index: 9998;

}

.img-container::after {
	content: '';
	background: url("assets/img/stories-bottom-block.svg") no-repeat;
	background-size: contain;
	width: 96px;
	height: 105px;
	position: absolute;
	bottom: -50px;
	right: 0px;
	display: block;
	z-index: 9998;
}

.img-container img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
}
.btn-primary:not(.jumbotron .btn-primary), .btn-primary:active, .wp-block-file .wp-block-file__button, .wp-block-file .wp-block-file__button:active {
    margin-top: 1em;
}

/* .article-title {
	color: #002D72;
} */

/* removed heading gap in "Benefits and Career support" */

.wp-block-media-text__content h4 {
	margin-top: 0px !important;
}

.secondary-btn-wrap a {
	text-align: center;
}

.footer-nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-around;
	flex-grow: 3.5 !important;
	margin-left: -32px;
}


@keyframes fadein {
	0% {
		opacity: 0;
	}

	56% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadein {
	0% {
		opacity: 0;
	}

	56% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@media (max-width: 1200px) {
	.wp-block-feedzy-rss-feeds-loop.feedzy-loop-columns-3 {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
	}

	.custom-info-box-container .row {
		margin: 0px auto 0px auto !important;
	}

	.custom-info-box-container::before {
		width: 100%;
	}
}

@media (max-width: 1024px) {

	/* .decor {
		width: 60px;
		height: 60px;
		background-size: contain;
		right: 30px;
	} */
	.decor {
		right: 32px;
	}

	.custom-info-box-container .row {
		width: 90%;
	}

	.custom-info-box-container::before {
		width: 90%;
		left: 40px;
	}

	.footer-nav {
		align-items: flex-start;
	}
}

@media (max-width: 991px) {
	.jumbotron h1 {
		font-size: 48px !important;
	}

	.decor {
		width: 60px;
		height: 60px;
		background-size: contain;
		top: -40px;
		right: 45px;
	}

	/* .stories .row {
		max-width: 85%;
	} */
	.wp-block-columns-is-layout-flex .container {
		width: 90%;
	}

	.stories .img-container {
		margin-left: 0px;
	}

	.custom-image-box-container .txt-container {
		padding: 0px !important;

	}

	#tablepress-1 tr td a {
		font-size: 13px !important;
	}

	/* .custom-info-box-container .row {
		margin: 0px 25px 0px 25px !important;
	}

	.custom-info-box-container::before {
		margin: 0px 25px 0px 25px !important;
		width: calc(100% - 50px);
	} */

	footer .row {
		max-width: none !important;
	}

	.custom-info-box-container .row {
		width: 85%;
	}

	.custom-info-box-container::before {
		width: 85%;
		left: 6%;
	}

	.footer-nav {
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
		gap: 1em;
		margin-bottom: 3em;
		margin-left: 0px;
	}
}

@media (max-width: 768px) {
	/* .jumbotron .green-bg {
		margin-right: 0px
	}

	.jumbotron .blue-bg {
		margin-left: 0px;
	} */
	    .stories .row:nth-child(odd) {
        margin: 3em 0;
    }
	.search-btn-wrap a {
		width: 360px;
	}

	.search-btn-wrap .search-arrow-icon {
		width: 50px;
	}

	.search-btn-wrap .btn-text {
		font-size: 20px;
		margin-right: 0.75em;
		line-height: 40px;
	}

	.jumbotron h1 {
		font-size: 40px !important;
	}

	.decor {
		width: 50px;
		height: 50px;
		background-size: contain;
		top: -32px;
		right: 52px;
	}

	.stories .row::before {
		left: 20px;
	}

	.img-container::after {
		width: 83px;
		height: 92px;
		bottom: -44px;
		right: 20px;
	}

	.stories .txt-container {
		margin-top: 32px;
	}

	.meet-hopkins-container figure {
		display: inline-block;
		margin: 0 auto;
	}


	.meet-hopkins-container figure img {
		display: block;
	}

	#tablepress-1 {
		display: flex;
		flex-direction: column;
		align-items: center;
		border-spacing: 10px !important;

	}

	#tablepress-1 tr td {
		display: flex;
		flex-direction: column;
		gap: 10px;
		align-items: center;
	}

	#tablepress-1 tr td a {
		width: fit-content;
	}

	.wp-block-feedzy-rss-feeds-loop.feedzy-loop-columns-3 {
		display: flex;
		flex-wrap: wrap;
	}

	.rss-articles .rss-article {
		max-width: 80%;
		margin-left: auto;
		margin-right: auto;
	}

	.stories .row {
		gap: 10px;
	}

	.stories .txt-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.is-layout-flex {
		justify-content: center;
	}

	.article-text p {
		text-align: center !important;
	}

	/* .custom-info-box-container .row {
		width: 90%;
	}

	.custom-info-box-container::before {
		margin: 0px auto 0px auto !important;
		width: calc(100% - 50px);
	} */

	/* 
	.article-description {
		text-align: center;
	} */
	.wp-block-media-text__media{
		max-width:300px;
		margin: 2em auto !important;
	}
	section div:nth-child(0){
		padding: 0 2em;
	}
	.wp-block-heading{
		padding: 0 2em;
	}
}

@media (max-width: 600px) {

	.wp-block-media-text__content h4 {
		margin-top: 20px !important;
	}

	.wp-block-media-text__content {
		text-align: center;
	}

	.stories .row::before {
		width: 120px;
	}

	.img-container::after {
		width: 70px;
		bottom: -52px;
		/* bottom: -44px;
		right: 20px; */
	}
}

@media (max-width: 480px) {
	.jumbotron h1 {
		font-size: 36px !important;
	}

	.decor {
		width: 30px;
		height: 30px;
		background-size: contain;
		top: -20px;
		right: 72px;
	}

	.stories .row::before {
		width: 100px;
	}

	.img-container::after {
		width: 50px;
		bottom: -63px;
		/* bottom: -44px;
		right: 20px; */
	}

	.custom-info-box-container::before {
		left: 5%;
	}
}

@media (max-width: 360px) {
	/* .search-btn-wrap a {
		width: 100vw;
	} */
	/* 
	.search-btn-wrap .search-arrow-icon {
		width: 50px;
	}

	.search-btn-wrap .btn-text {
		font-size: 22px;
		margin-right: 0.75em;
		line-height: 40px;
	} */
}