/*
Resource Sharing Revolutionized homepage
/content/dam/oclc/resource-sharing/css/resource_sharing_revolutionized.css
*/


/* Reset */

html, body, #main-content {
	scroll-behavior: smooth;
}

@media screen and (prefers-reduced-motion: reduce) {
	html, body, #main-content {
		scroll-behavior: auto;
	}
}

.header.parbase.section,
.customjavascript.section,
.page-content .parsyscolumncontrol.section,
#main-content .parsyscolumncontrol.section {
	margin-bottom: 0 !important;
}

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

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

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

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

h1, h2, h3, h4, h5, h6 {
	text-wrap: auto;
}

ul {
	margin: 0 0 2rem 1.5rem;
}

#main-content p,
#main-content li {
	font-family: 'Graphik Regular', Helvetica, Arial, 'Arial Unicode MS', sans-serif;
	font-size: 18px;
	line-height: 23px;
	letter-spacing: 0;
	margin: 0 0 1.3rem 0;
}

#main-content p.cta {
	margin-bottom: 0;
}

.center {
	text-align: center;
}

.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;
}

strong, b {
	font-family: 'Graphik Bold', Helvetica, Arial, sans-serif;
}

hr {
	margin: 4rem 0 !important;
	border-top: 1px dotted #888B8D;
}

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

@media screen and (max-width: 600px) {
	.width-contain {
		width: 96%;
		margin-left: 2% !important;
		margin-right: 2% !important;
	}
	ul {
		margin-left: 1.25rem;
	}
	p.cta {
		margin-bottom: 3rem;
	}
}

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


/* main container overflow fix */

.cont-main {
	overflow: hidden;
}


/* Columns */

div.parsyscolumncontrol .parsys_column > .parsys {
	padding: 0 !important;
}

	/* 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: 100% !important;
			margin-left: 0;
			margin-right: 0;
			margin-bottom: 2rem;
		}
	}
	
	#main-content .parsys_column.cq-colctrl-lt2-r {
		margin-bottom: 1rem;
	}


/* Hero */

#rsr-hero {
	background-color: #333F48;
	background-image: url('/content/dam/oclc/resource-sharing/images/bg_hero_rsr.jpg');
	background-repeat: no-repeat;
	background-position: center right;
	background-size: cover;
}

@media screen and (min-width: 1400px) {
	#rsr-hero .parsyscolumncontrol .cq-colctrl-1-fc {
		width: 1280px;
	}
}

@media screen and (max-width: 600px) {
	.parsys.hero_area {
		background-position: top center;
	}
}

#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
	padding: 8rem 0 !important;
}

@media screen and (max-width: 1028px) {
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
		padding: 8rem 2rem !important;
	}
}

#rsr-hero .text.parbase.section {
	margin-bottom: 0;
}

#rsr-hero h1 {
	margin: 0 0 2rem;
}

#rsr-hero h1 .deck1,
#rsr-hero h1 .deck2 {
	display: table;
}

#rsr-hero h1 .deck1 {
	background: white;
	padding: 12px 16px 8px;
	font-family: 'Graphik Regular', Helvetica, Arial, 'Arial Unicode MS', sans-serif;
	font-size: 36px;
	line-height: 36px;
	color: #1D252D;
	letter-spacing: -1px;
}

#rsr-hero h1 .deck2 {
	border: 8px solid white;
	padding: 16px 22px;
	background: url('/content/dam/oclc/resource-sharing/images/bg_rsr_headline.png');
	font-family: 'OCLC Stencil', Helvetica, Arial, 'Arial Unicode MS', sans-serif;
	font-size: 96px;
	line-height: 96px;
	color: #ffffff;
	letter-spacing: 0.5px;
}

#rsr-hero p.subhed {
	width: 70%;
	margin: 0;
	font-family: 'Graphik Bold', Helvetica, Arial, 'Arial Unicode MS', sans-serif;
	font-size: 32px;
	line-height: 38px;
	color: #ffffff;
	letter-spacing: -0.5px;
	text-shadow: 0px -1px 30px rgba(29, 27, 45, 0.5);
}

@media screen and (min-width: 1480px) {
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
		padding: 10rem 0px !important;
	}
	#rsr-hero p.subhed {
		width: 50%;
	}
}

@media screen and (max-width: 800px) {
	#rsr-hero {
		background-position: center right 20%;
	}
	#rsr-hero.parsys_column, #rsr-hero .parsys_column {
		margin-bottom: 0 !important;
	}
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
		padding: 0px !important;
		min-height: 540px;
		display: flex;
	}
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 .col0.parsys {
		align-self: flex-end;
		margin-bottom: 24px;
	}
	#rsr-hero h1, #rsr-hero p.subhed {
		margin: 0 24px;
	}
	#rsr-hero h1 .deck1 {
		font-size: 30px;
		line-height: 30px;
	}
	#rsr-hero h1 .deck2 {
		border: 6px solid white;
		font-size: 72px;
		line-height: 72px;
		letter-spacing: 0px;
	}
	#rsr-hero p.subhed {
		width: 60%;
		background: #007DBA;
		padding: 18px 22px;
		text-shadow: none;
	}
}

@media screen and (max-width: 540px) {
	#rsr-hero {
		background-position: center right 25%;
	}
	#rsr-hero h1 .deck1 {
		padding: 10px 16px 6px;
		font-size: 26px;
		line-height: 26px;
	}
	#rsr-hero h1 .deck2 {
		font-size: 64px;
		line-height: 64px;
	}
	#rsr-hero p.subhed {
		font-size: 28px;
		line-height: 32px;
	}
}

@media screen and (max-width: 480px) {
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
		min-height: 480px;
	}
	#rsr-hero h1 .deck2 {
		padding: 14px 20px;
		font-size: 56px;
		line-height: 56px;
	}
	#rsr-hero p.subhed {
		font-size: 26px;
		line-height: 30px;
	}
}

@media screen and (max-width: 420px) {
	#rsr-hero h1 .deck1 {
		font-size: 24px;
		line-height: 24px;
	}
	#rsr-hero h1 .deck2 {
		border: 5px solid white;
		font-size: 48px;
		line-height: 48px;
	}
	#rsr-hero p.subhed {
		font-size: 24px;
		line-height: 28px;
	}
}

@media screen and (max-width: 380px) {
	#rsr-hero .parsys_column.cq-colctrl-1-fc-c0 {
		min-height: 440px;
	}
	#rsr-hero h1 .deck2 {
		font-size: 42px;
		line-height: 42px;
	}
	#rsr-hero p.subhed {
		width: 60%;
		padding: 14px 22px;
		font-size: 22px;
		line-height: 26px;
	}
}

@media screen and (max-width: 340px) {
	#rsr-hero h1 .deck1 {
		font-size: 22px;
		line-height: 22px;
	}
	#rsr-hero h1 .deck2 {
		border: 4px solid white;
		padding: 12px 16px;
		font-size: 36px;
		line-height: 36px;
	}
	#rsr-hero p.subhed {
		width: 50%;
	}
	#intro-text p {
		font-size: 21px;
		line-height: 28px;
		letter-spacing: -0.25px;
	}
}


/* Tri-color bar */

.divider {
	height: 25px;
}

.divider .bar-1 {
	height: 25px;
	float: left;
	width: 30%;
}

.divider .bar-2 {
	height: 25px;
	float: left;
	width: 10%;
}

.divider.blue-green {
	background: #78be20;
}

.divider.blue-green .bar-1 {
	background: #00b5df;
}

.divider.blue-green .bar-2 {
	background: #3c9d6d;
}


/* Intro text */

#intro-text {
	background: #236192;
	margin: 0;
}

#intro-text p {
	margin: 0;
	padding: 48px 0;
	font-family: 'Graphik Light', Helvetica, Arial, sans-serif;
	font-size: 24px;
	line-height: 30px;
	color: #ffffff;
	letter-spacing: -0.5px;
}

@media screen and (max-width: 1028px) {
	#intro-text .parsys_column.cq-colctrl-1-fc-c0 {
		padding: 0 2rem !important;
	}
}

@media screen and (max-width: 800px) {
	#intro-text div.parsys_column {
		margin-bottom: 0 !important;
	}
}


/* Headlines */

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

#main-content h2.section {
	margin: 60px 0 24px
}

#main-content h2.section.first,
#main-content h2.section.home {
	margin-top: 0px
}

#main-content h2.section.blue {
	color: #236192
}

#main-content h3 {
	margin: 0 0 32px 0;
	letter-spacing: -0.75px;
}

#main-content h4 {
	font-size: 20px;
	font-family: 'Graphik Bold', Helvetica, Arial, sans-serif;
	letter-spacing: -0.5px;
}

#main-content h5 {
	font-size: 16px;
	font-family: 'Graphik Bold', Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #000;
}

@media screen and (max-width:480px) {
	#main-content h2 {
		font-size: 36px;
		line-height: 42px;
	}
}


/* Member story fix */

.member-story {
	display: inline-block;
	margin: 0 4% 32px 0 !important;
}

.member-story-list h3.member-story-title {
	font-family: 'Graphik Semibold', Helvetica, Arial, sans-serif !important;
    letter-spacing: -0.25px !important;
    margin-bottom: 8px !important;
}

.member-story-text p {
	font-size: 15px !important;
	line-height: 19px !important;
}

@media screen and (max-width: 480px) {
	.member-story {
		display: block;
		width: 100% !important;
		margin-right: 0 !important;
	}
}


/* Bar quotes */

.barquote {
	margin: 0 0 24px
}

.barquote-header,
.barquote-image {
	height: 48px
}

.barquote-header {
	margin: 0 0 14px;
	padding-right: 14px
}

.barquote-image {
	float: left;
	width: 62px
}

.barquote-header img {
	border: none !important;
	border-radius: 0px !important;
	background: transparent !important;
	padding: 0 !important;
}

.barquote-header h3 {
	margin: 0;
	padding: 0 12px 0 0;
	font-family: 'Graphik Bold', Helvetica, sans-serif !important;
	letter-spacing: -0.25px !important;
	color: #fff;
	font-size: 18px !important;
	line-height: 22px !important;
	position: relative;
	top: 12px;
	left: 12px;
}

p.barquote-text {
	font-size: 18px !important;
	line-height: 26px !important;
	margin-bottom: 14px;
	padding-bottom: 12px;
	border-bottom-style: solid;
	border-bottom-width: 1px
}

p.barquote-attr {
	margin: 0 0 8px;
	font-size: 14px !important;
	line-height: 18px !important;
	color: #333F48
}

p.barquote-attr b {
	font-weight: 700 !important
}

p.barquote-morelink {
	font-size: 14px;
	line-height: 14px
}


/* Bar quote colors */

.barquote.ltblue .barquote-header {
	background: #00afd7
}

.barquote.ltblue .barquote-image {
	background: #007dba
}

.barquote.ltblue .barquote-text {
	color: #007dba;
	border-bottom-color: #007dba
}


/* Call to action box links */

a.cta-box-link {
	display: inline-block;
	border: 4px solid #008ccc;
	color: #008ccc;
	font-family: 'Graphik Bold', Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 20px;
	font-weight: bold;
	margin: 0 0 14px;
	padding: 8px 15px;
	text-decoration: none !important
}

a.cta-box-link:hover,
a.cta-box-link:focus {
	border-color: #f57f29;
	color: #f57f29;
}

a.cta-box-link.white,
a.cta-box-link.white:hover,
a.cta-box-link.white:focus {
	border-color: #ffffff;
	color: #ffffff;
}

@media screen and (max-width: 600px) {
	#main-content h2.main,
	#main-content h2.section {
		font-size: 36px;
		line-height: 40px
	}
	.barquote {
		margin-bottom: 36px
	}
	.barquote-header,
	.barquote-image,
	.barquote-image img {
		height: 68px
	}
	.barquote-image {
		width: 82px
	}
	.barquote-image img {
		width: 68px
	}
	#wcint-hero p.wclogorevblock {
		margin: 0;
		padding: 24px;
	}
	#wcint-hero p.wclogorevblock img {
		width: 100%;
		height: auto;
		max-width: 275px
	}
	#wcint-hero h1 {
		font-size: 42px;
		line-height: 46px;
		margin: 0 18px 36px 18px;
	}
}



/* Carousel */

#rsr-carousel .owl-carousel-container {
	margin: 0 0 4rem !important;
	border: none !important;
}

#rsr-carousel .owl-carousel {
	padding: 0px !important;
}

#rsr-carousel .owl-carousel .owl-nav button.owl-prev,
#rsr-carousel .owl-carousel .owl-nav button.owl-prev:hover,
#rsr-carousel .owl-carousel .owl-nav button.owl-prev:focus {
	background-image: url('/content/dam/common/images/carousel_btn_left_reverse.png');
}

#rsr-carousel .owl-carousel .owl-nav button.owl-next,
#rsr-carousel .owl-carousel .owl-nav button.owl-next:hover,
#rsr-carousel .owl-carousel .owl-nav button.owl-next:focus {
	background-image: url('/content/dam/common/images/carousel_btn_right_reverse.png');
}

#rsr-carousel .owl-carousel .owl-nav button.owl-prev,
#rsr-carousel .owl-carousel .owl-nav button.owl-next {
	background-position: 0px -80px !important;
}

#rsr-carousel .owl-carousel .owl-nav button.owl-prev, 
#rsr-carousel .owl-carousel .owl-nav button.owl-next {
	top: 33%;
}

#rsr-carousel .owl-carousel-container .owl-dots {
	display: none;
}

#rsr-carousel .carousel-overlay {
	background-color: rgba(51, 63, 72, 0.8);
	position: absolute;
	bottom: 0;
	inset-inline: 0;
	height: auto;
	padding: 14px 20px;
	border-bottom-width: 18px;
	border-bottom-style: solid;
}

#rsr-carousel .carousel-overlay.magenta {
	border-bottom-color: #AE2573
}

#rsr-carousel .carousel-overlay.orange {
	border-bottom-color: #E87722
}

#rsr-carousel .carousel-overlay.yellow {
	border-bottom-color: #F6BE00
}

#rsr-carousel .carousel-overlay.green {
	border-bottom-color: #78BE20
}

#rsr-carousel .carousel-overlay.blue {
	border-bottom-color: #00AFD7
}

#rsr-carousel .carousel-overlay p {
	margin: 0 10%;
	font-size: 1rem;
	text-align: center;
	line-height: 1.3em;
}

#rsr-carousel a .carousel-overlay,
#rsr-carousel .carousel-overlay a {
	color: #ffffff !important;
}

@media screen and (min-width: 1800px) {
	#rsr-carousel .owl-carousel .owl-nav button.owl-prev, 
	#rsr-carousel .owl-carousel .owl-nav button.owl-next {
		top: 36%;
	}
}

@media screen and (min-width: 2400px) {
	#rsr-carousel .owl-carousel .owl-nav button.owl-prev, 
	#rsr-carousel .owl-carousel .owl-nav button.owl-next {
		top: 38%;
	}
}

@media screen and (max-width: 960px) {
	#rsr-carousel .owl-theme .owl-nav,
	#rsr-carousel .carousel-overlay p {
		margin: 0 !important;
	}
	#rsr-carousel .carousel-overlay {
		border-bottom-width: 12px !important;
	}
	#rsr-carousel .owl-carousel .owl-nav button.owl-prev,
	#rsr-carousel .owl-carousel .owl-nav button.owl-next {
		display: none !important;
	}
	#rsr-carousel .owl-carousel-container .mobile-hint {
		display: block !important;
		margin-top: 0 !important;
		padding: 0.75rem 0 !important;
		background: var(--background-1) !important;
	}
	#rsr-carousel .owl-carousel-container .mobile-hint p {
		margin: 0 !important;
		font-size: var(--font-size-sm) !important;
		line-height: var(--line-height-xs) !important;
		text-align: center;
		color: var(--gray-dark);
	}
}

