/*
OCLC Careers homepage
/content/dam/oclc/careers/css/careers_homepage.css
*/


/* Reset */

html {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

.customjavascript.section {
	margin: 0;
}

.hero_area div.parsyscolumncontrol {
	margin: 0 !important;
}

.parsys.hero_area {
	margin: 0;
	border: none;
	box-shadow: none;
	padding: 0;
	background: #ffffff;
}

.new.section {
	margin-bottom: 0px;
}

.parsys.headline {
	margin-top: 0px;
}

.parsys.header .section.header {
	margin-bottom: 0px;
}

.parbase.section,
.parbase.image.section img {
	margin: 0 !important;
}

.parbase.textimage.section .image img,
.text.parbase.section img,
.parbase.textimage.section img,
.parbase.image.section img,
.product-page .reference.parbase.section .image img,
.member-story img {
	border: none !important;
	padding: 0px !important;
	background: transparent !important;
	border-radius: 0px !important;
}

#main-content p,
#main-content li {
	font-weight: 400;
	font-size: 18px;
	line-height: 23px;
	letter-spacing: -0.25px;
	margin: 0 0 18px 0;
	color: #333F48;
}

#main-content strong,
#main-content b {
	font-weight: 700;
}

#main-content hr {
	margin: 56px 0 !important;
	border-top: 1px dotted #888B8D;
}

#main-content .hbox {
	border-radius: 0px !important;
	padding: 30px !important;
	margin: 0 0 28px;
}

@media screen and (max-width: 480px) {
	nobr {
		white-space: normal;
	}
}

@media screen and (max-width: 360px) {
	#main-content .hbox {
		padding: 24px 14px !important;
	}
}


/* https://webaim.org/techniques/css/invisiblecontent/ */

.visually-hidden:not(:focus):not(:active) {
	position: absolute;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height: 1px;
	width: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	white-space: nowrap;
}


/* main container overflow fix */

.cont-main {
	overflow: hidden;
}


/* Columns */

/* 50/50 */

div.parsyscolumncontrol .cq-colctrl-lt0-c0 {
	width: 48%;
	margin-right: 2%;
}

div.parsyscolumncontrol .cq-colctrl-lt0-c1 {
	width: 48%;
	margin-left: 2%;
}


/* 33/67 */

div.parsyscolumncontrol .cq-colctrl-lt1-c0 {
	width: 31%;
	margin-right: 2%;
}

div.parsyscolumncontrol .cq-colctrl-lt1-c1 {
	width: 65%;
	margin-left: 2%;
}


/* 67/33 */

div.parsyscolumncontrol .cq-colctrl-lt2-r-c0 {
	width: 65%;
	margin-right: 2%;
}

div.parsyscolumncontrol .cq-colctrl-lt2-r-c1 {
	width: 31%;
	margin-left: 2%;
}


/* 33/33/33 */

div.parsyscolumncontrol .cq-colctrl-lt2-c0,
div.parsyscolumncontrol .cq-colctrl-lt2-c1,
div.parsyscolumncontrol .cq-colctrl-lt2-c2 {
	width: 31%;
}

div.parsyscolumncontrol .cq-colctrl-lt2-c0 {
	margin-right: 1.75%;
}

div.parsyscolumncontrol .cq-colctrl-lt2-c1 {
	margin-left: 1.75%;
	margin-right: 1.75%;
}

div.parsyscolumncontrol .cq-colctrl-lt2-c2 {
	margin-left: 1.75%;
}

@media screen and (max-width: 800px) {
	div.parsyscolumncontrol .cq-colctrl-lt0-c0,
	div.parsyscolumncontrol .cq-colctrl-lt0-c1,
	div.parsyscolumncontrol .cq-colctrl-lt1-c0,
	div.parsyscolumncontrol .cq-colctrl-lt1-c1,
	div.parsyscolumncontrol .cq-colctrl-lt2-c0,
	div.parsyscolumncontrol .cq-colctrl-lt2-c1,
	div.parsyscolumncontrol .cq-colctrl-lt2-c2,
	div.parsyscolumncontrol .cq-colctrl-lt2-r-c0,
	div.parsyscolumncontrol .cq-colctrl-lt2-r-c1 {
		width: 92% !important;
		margin-left: 4%;
		margin-right: 4%;
	}
	.hbox div.parsyscolumncontrol .cq-colctrl-lt0-c0,
	.hbox div.parsyscolumncontrol .cq-colctrl-lt0-c1,
	.hbox div.parsyscolumncontrol .cq-colctrl-lt2-c0,
	.hbox div.parsyscolumncontrol .cq-colctrl-lt2-c1,
	.hbox div.parsyscolumncontrol .cq-colctrl-lt2-c2 {
		width: 100% !important;
		margin-left: 0;
		margin-right: 0;
	}
}


/* Hero */

#careers-hero {
	margin: 0 0 56px;
    background-color: #f9f9f9;
    background-image: url('/content/dam/oclc/careers/images/bg_careers_hero.jpg');
	background-repeat: no-repeat;
	background-position: center left;
	background-size: cover;
}

#careers-hero .parsys_column.cq-colctrl-lt0-c0,
#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
	height: 500px;
	width: 50%;
	margin: 0;
}

#careers-hero .parsys_column.cq-colctrl-lt0-c0 {
}

#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
	background-image: url('/content/dam/oclc/careers/images/bg_careers_hero_right.jpg');
	background-image: url('/content/dam/oclc/careers/images/bg_careers_hero_right_2024.svg'), linear-gradient(transparent, transparent);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

#careers-hero h1,
#careers-hero h2 {
	padding: 0 48px;
}

#careers-hero h1 {
	font-weight: 300;
	font-size: 44px;
	line-height: 48px;
	letter-spacing: -0.75px;
	margin-bottom: 36px;
}

#careers-hero h2 {
	margin-bottom: 0;
}

#careers-hero h2 .head-static {
	display: block;
	margin-bottom: 10px;
	font-weight: 700;
	font-size: 86px;
	line-height: 86px;
}

/* ---- Hero headline scroll text ---- */

#careers-hero h2 #scrolltext {
	overflow: hidden;
	position: relative;
	height: 150px;
}

#careers-hero h2 .head-scroll {
	font-weight: 700;
	font-size: 44px;
	line-height: 48px;
	letter-spacing: -0.25px;
	font-weight: bold;
	animation-duration: 18s;
	animation-fill-mode: forwards;
	animation-timing-function: ease-in;
	animation-iteration-count: 1;
	position: absolute;
	top: 0;
	text-wrap: auto;
}

#careers-hero h2 .head-scroll.one {
	animation-name: fadeOutUpOne;
	color: #236192;
}

#careers-hero h2 .head-scroll.two {
	animation-name: fadeOutUpTwo;
	color: #4C8C2B;
}

#careers-hero h2 .head-scroll.three {
	animation-name: fadeOutUpThree;
	color: #8A1B61;
}

@keyframes fadeOutUpOne {
	0% {
		opacity: 0;
	}
	3% {
		opacity: 1;
	}
	28% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	30% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	100% {
		opacity: 0;
	}
}

@keyframes fadeOutUpTwo {
	0% {
		opacity: 0;
	}
	31% {
		opacity: 0;
	}
	32% {
		opacity: 1;
	}
	60% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	62% {
		opacity: 0;
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
	100% {
		opacity: 0;
	}
}

@keyframes fadeOutUpThree {
	0% {
		opacity: 0;
	}
	63% {
		opacity: 0;
	}
	64% {
		opacity: 1;
	}
	92% {
		opacity: 1;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@media screen and (min-width: 2200px) {
	#careers-hero .parsys_column.cq-colctrl-lt0-c0 {
		width: 67% !important;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		width: 33% !important;
	}
}

@media screen and (min-width: 1760px) {
	#careers-hero .parsys_column.cq-colctrl-lt0-c0 {
		width: 60%;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		width: 40%;
	}
}

@media screen and (max-width: 1000px) {
	#careers-hero {
		margin-bottom: 28px;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c0,
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		width: 100% !important;
		float: none;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c0 {
		display: block !important;
		height: auto;
		padding-top: 48px !important;
		padding-bottom: 48px !important;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		height: 500px;
	}
}

@media screen and (max-width: 800px) {
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		height: 450px;
	}
}

@media screen and (max-width: 600px) {
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		height: 400px;
	}
}

@media screen and (max-width: 480px) {
	#careers-hero h1, #careers-hero h2 .head-scroll {
		font-size: 36px;
		line-height: 40px;
	}
	#careers-hero h2 .head-static {
		font-size: 72px;
		line-height: 72px;
	}
	#careers-hero h2 #scrolltext {
		max-width: 440px;
		height: 180px;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		height: 320px;
	}
}

@media screen and (max-width: 360px) {
	#careers-hero h1, #careers-hero h2 .head-scroll {
		font-size: 32px;
		line-height: 36px;
	}
	#careers-hero h2 .head-static {
		font-size: 60px;
		line-height: 60px;
	}
	#careers-hero h2 #scrolltext {
		max-width: 320px;
	}
	#careers-hero h1, #careers-hero h2 {
		padding: 0 24px;
	}
	#careers-hero .parsys_column.cq-colctrl-lt0-c1 {
		height: 280px;
	}
}


/* Vertical centered columns */

#careers-hero .parsys_column.cq-colctrl-lt0-c0,
#careers-feature .parsys_column.cq-colctrl-lt0,
#careers-life .parsys_column.cq-colctrl-lt0,
#careers-carousel .owl-carousel .item {
	display: flex;
	-webkit-box-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	align-items: center;
	margin-bottom: 0;
}

@media screen and (max-width: 800px) {
	#careers-hero .parsys_column.cq-colctrl-lt0-c0,
	#careers-feature #photo-right.parsys_column.cq-colctrl-lt0,
	#careers-life .parsys_column.cq-colctrl-lt0,
	#careers-carousel .owl-carousel .item {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-flow: column;
	}
	#careers-feature #photo-left.parsys_column.cq-colctrl-lt0 {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		flex-flow: column-reverse;
	}
}


/* Merged */

#careers-intro h2, #careers-life h2, #careers-whyjoin h2 {
	width: 88%;
	margin: 0 6% 28px;
}

#careers-intro h2, #careers-life h2, #careers-whyjoin h2, #careers-workplace h2,
#careers-workplace p, #careers-introduce h2, #careers-introduce p {
	text-align: center;
}

#careers-intro h2, #careers-life h2 {
	font-weight: 300;
}

#careers-feature h2, #careers-whyjoin h2, #careers-workplace h2, #careers-introduce h2 {
	font-weight: 600;
}

#careers-feature h2, #careers-life h2, #careers-whyjoin h2, #careers-workplace h2, #careers-introduce h2 {
	font-size: 36px;
	line-height: 40px;
	letter-spacing: -0.75px;
}

#careers-workplace h2, #careers-introduce h2 {
	margin: 0 6% 21px;
}

#careers-feature, #careers-carousel {
	width: 88%;
	margin: 0 6% 28px;
}

#careers-whyjoin, #careers-workplace, #careers-introduce {
	margin: 0;
}

#careers-intro p.careers-links, #careers-introduce p.introduce-links {
	margin-bottom: 0;
}

#careers-intro a.btn-link, #careers-introduce a.btn-link {
	margin: 0 18px 18px;
	font-weight: 600;
}

#careers-intro a.btn-link strong, #careers-introduce a.btn-link strong {
	font-weight: 700;
	font-weight: bold;
}


/* Careers intro */

#careers-intro {
	margin-bottom: 28px;
}

#careers-intro h2 {
	font-size: 44px;
	line-height: 50px;
	letter-spacing: -1px;
}

#careers-intro p {
	width: 92%;
	margin: 0 4% 21px;
	text-align: center;
	font-weight: 400;
	font-size: 21px;
	line-height: 28px;
	letter-spacing: -0.5px;
}

#careers-intro hr {
	margin: 28px 0 !important;
}

@media screen and (min-width: 1400px) {
	#careers-intro p {
		width: 84%;
		margin: 0 8% 21px;
	}
}


@media screen and (max-width: 600px) {
	#careers-intro h2 {
		margin-bottom: 28px;
		font-size: 40px;
		line-height: 46px;
	}
	#careers-intro p {
		width: 92%;
		margin: 0 4% 21px;
		text-align: center;
	}
	#careers-intro hr {
		margin-bottom: 56px !important;
	}
}

@media screen and (max-width: 360px) {
	#careers-intro h2 {
		font-size: 36px;
		line-height: 42px;
	}
}


/* Careers video */

#careers-video {
	display: none;
	/* margin-bottom: 56px; */
}

/*
#careers-video .video.parbase.section {
	width: 88%;
	margin: 0 6% !important;
}

@media screen and (max-width: 600px) {
	#careers-video .video.parbase.section {
		width: 96%;
		margin: 0 2% !important;
	}
}
*/

/* Careers carousel */

#careers-carousel {
}

#careers-carousel .owl-carousel .quote-cont {
	float: left;
	width: 55%;
	padding: 32px;
}

#careers-carousel .owl-carousel .quote-cont p {
	text-align: center;
}

#careers-carousel .owl-carousel .quote-cont p.quote {
	margin: 0 0 14px 0;
	font-weight: 300;
	font-size: 24px;
	line-height: 30px;
	letter-spacing: -0.25px;
}

#careers-carousel .owl-carousel .quote-cont p.quote strong,
#careers-carousel .owl-carousel .quote-cont p.quote b {
	font-weight: 600;
}

#careers-carousel .owl-carousel .quote-cont p.quote.dkerblue {
	color: #01426A;
}

#careers-carousel .owl-carousel .quote-cont p.quote.dkblue {
	color: #236192;
}

#careers-carousel .owl-carousel .quote-cont p.quote.green {
	color: #4C8C2B;
}

#careers-carousel .owl-carousel .quote-cont p.quote.magenta {
	color: #8A1B61;
}

#careers-carousel .owl-carousel .quote-cont p.quote.grey {
	color: #333F48;
}

#careers-carousel .owl-carousel .quote-cont p.attr {
	margin: 0;
	font-size: 16px;
	line-height: 20px;
	letter-spacing: -0.25px;
}

#careers-carousel .owl-carousel .photo-cont {
	float: right;
	width: 45%;
	padding: 32px;
}

@media screen and (min-width: 1400px) {
	#careers-carousel .owl-carousel .quote-cont {
		width: 50%;
	}
	#careers-carousel .owl-carousel .photo-cont {
		width: 50%;
	}
	#careers-carousel .owl-carousel .quote-cont p.quote {
		font-size: 28px;
		line-height: 34px;
		letter-spacing: -0.5px;
	}
}

@media screen and (max-width: 860px) {
	#careers-carousel {
		width: 96%;
		margin: 0 2% 56px;
	}
	#careers-carousel .owl-carousel .quote-cont,
	#careers-carousel .owl-carousel .photo-cont {
		float: none;
		display: block;
		width: 100%;
		padding: 32px;
	}
	#careers-carousel .owl-carousel .photo-cont img {
		margin: 0 auto;
		max-width: 480px;
	}
}

@media screen and (min-width: 480px) and (max-width: 600px) {
	#careers-carousel .owl-carousel .quote-cont p.quote {
		font-size: 28px;
		line-height: 34px;
		letter-spacing: -0.5px;
	}
}

@media screen and (max-width: 360px) {
	#careers-carousel .owl-carousel .quote-cont,
	#careers-carousel .owl-carousel .photo-cont {
		padding: 32px 18px;
	}
}


/* Careers feature */

#careers-feature {
    width: 88%;
    margin: 0 6% 28px;
}

#careers-feature .parsys_column.cq-colctrl-lt0 {
	margin-bottom: 56px;
}

#careers-feature h2 {
	margin: 0 0 21px;
}

@media screen and (max-width: 600px) {
	#careers-feature {
		width: 96%;
		margin: 0 2% 28px;
	}
}


/* Careers life */

#careers-life {
	margin: 0 0 56px;
}

#careers-life ul {
	margin: 0 !important;
}

#careers-life ul li {
	list-style-type: none;
	padding: 0;
}

#careers-life ul li strong {
	font-weight: 600;
	text-transform: uppercase;
}

#careers-life .image.parbase.section {
	margin-bottom: 14px !important;
}

#careers-life .image.parbase.section img {
	max-height: 420px;
}

#careers-life .figure-stack-image {
	margin: 0 auto;
}

@media screen and (max-width: 600px) {
	#careers-life h2 {
		width: 96%;
		margin: 0 2% 32px;
	}
}


/* Careers why join */

#careers-whyjoin #whyjoin-columns {
	width: 94%;
	margin: 0 3%;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c3 {
	width: 25% !important;
	padding: 0 3% !important;
	min-height: 220px;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0 .col0.parsys,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1 .col1.parsys,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2 .col2.parsys,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c3 .col3.parsys {
	padding: 0 !important;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1,
#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2 {
	border-right: 1px solid #BBBCBC;
}

#careers-whyjoin #whyjoin-columns h3,
#careers-whyjoin #whyjoin-columns p {
	text-align: center;
}

#whyjoin-columns h3 {
	margin: 0 0 8px 0;
	font-weight: 700;
	font-size: 21px;
	line-height: 26px;
	letter-spacing: -0.5px;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0 h3 {
	color: #4C8C2B;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1 h3 {
	color: #007DBA;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2 h3 {
	color: #8A1B61;
}

#whyjoin-columns .parsys_column.cq-colctrl-lt4-c3 h3 {
	color: #E87722;
}

@media screen and (min-width: 1400px) {
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c3 {
		padding: 0 2% !important;
		min-height: 170px;
	}
}

@media screen and (max-width: 800px) {
	#careers-whyjoin #whyjoin-columns {
		width: 96%;
		margin: 0 2%;
	}
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c0,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c1,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c2,
	#whyjoin-columns .parsys_column.cq-colctrl-lt4-c3 {
		float: none;
		display: block;
		width: 100% !important;
		padding: 0 !important;
		min-height: 0px;
		border-right: none;
	}
}

  
/* Careers workplace */

#careers-workplace {
	margin: 0;
}

#careers-workplace p {
	margin: 0 6% 48px;
}

#workplace-badge-row.parsys_column.cq-colctrl-default,
#workplace-badge-row .parsys_column.cq-colctrl-default-c0 {
	margin: 0 !important;
}

#workplace-badge-row .parsys_column.cq-colctrl-default-c0 {
	text-align: center;
}

#workplace-badge-row .image.parbase.section {
	width: 200px;
	float: none;
	display: inline-block;
	margin: 0 10px !important;
}

@media screen and (max-width: 600px) {
	#workplace-badge-row .image.parbase.section {
		margin-bottom: 14px !important;
	}
}


/* Careers introduce */

#careers-introduce h2,
#careers-introduce p {
	width: 88%;
}

#careers-introduce p {
	margin: 0 6% 24px;
}


/* EOE */
p.eoe-statement {
	margin: 56px 10% 0 !important;
	padding: 18px 24px;
	border: 1px solid #BBBCBC;
	font-size: 12px !important;
	line-height: 16px !important;
	letter-spacing: 0px !important;
	color: #4C5876 !important;
	text-align: center;
}

@media screen and (max-width:600px) {
	p.eoe-statement {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: auto;
	}
}


/* Link buttons */

a.btn-link {
	display: inline-block;
	margin: 0;
	padding: 12px 18px 10px;
	font-weight: 700;
	font-size: 18px;
	line-height: 22px;
	letter-spacing: -0.25px;
	text-decoration: none !important;
	transition: 0.3s;
	box-shadow: none;
	text-shadow: none;
	border: none;
	outline: none !important;
	border-radius: 0px;
	color: #ffffff !important;
}

a.btn-link.blue {
	background: #007dba;
}

a.btn-link.blue:hover,
a.btn-link.blue:active {
	color: #ffffff;
	background: #005da1;
}

a.btn-link.green {
	background: #4c8c2b;
}

a.btn-link.green:hover,
a.btn-link.green:active {
	color: #ffffff;
	background: #316c19;
}