/* Responsive Pages - Hospital 150th Anniversary */

/* search overlap fix in mobile */

@media (max-width:575px) {
#search.main_search.form-inline {
width: 210px !important;
}
}

/* sticky CTA */

.sticky {
    position: sticky; 
    top: 136px;  
    z-index:100
}

.cta-btn.sticky {
  	margin: -48px 0 -24px 0;
}

.cta-btn.sticky:hover {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

@media (min-width:768px) {
  .cta-btn.sticky {
    margin-top: -64px;
    margin-bottom:-48px;
 	text-align:right;
  }
}

@media (min-width:859px) {
  .sticky {
    top: 148px;  
	}
}
  
@media (max-width:575px) {
.cta-btn.sticky .btn.btn-primary {
  display:block;
  margin-left:-20px;
  margin-right:-20px;
}
}  

/* smooth scrolling for timeline anchor links; scroll top margin setting to account for sticky header and nav */ 

html {
    scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
} 
.timeline-period,
.fullwidth-callout-body-content {
scroll-margin-top: 170px;
}

.shadow-effect {
   -moz-box-shadow: 0 8px 8px -6px rgba(51, 51, 51, .6);
   -webkit-box-shadow: 0 8px 8px -6px rgba(51, 51, 51, .6);
  box-shadow: 0 8px 8px -6px rgba(51, 51, 51, .6);
}

/*  TESTING IE11 fix for jump - before not working ....
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {   

article#1940s-1960s::before { 
  display: block; 
  content: " "; 
  margin-top: -200px; 
  height: 200px; 
  visibility: hidden; 
  pointer-events: none;
}  
} 
*/



/******************************************/
/******   marquee and badge styles   ******/
/******************************************/
.wide-marquee {
  background-color:#033266; 
  display: block;
}

.wide-marquee-wrapper {
  max-width: 1310px;
  margin: 0 auto;
  padding: 16px 32px 0;
  position:relative;
}

.mobile-image-wrapper {
  margin-top: -14px;
}

/* 150 years badge */

.wide-marquee .badge-150 {
    animation-name: fadeDown;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: 2s;
	animation-delay: 2s;
}

.wide-marquee.gradient-image-bg .badge-150 {
    width: 42%;
    position: absolute;
   	top:0;
	right: 0;
  	z-index:2;
  	margin-right:28px;
}

.wide-marquee.small-gradient .badge-150 {
    width: 36%;
    position: relative;
    float: right;
	margin-top: 0;
  	margin-right:-24px;
  	margin-left:24px;
}

@media (min-width:686px) {
.wide-marquee.small-gradient .badge-150 {
    width: 27%;
  }
}
@media (min-width:768px) {
  .wide-marquee.gradient-image-bg .badge-150 {
    width: 215px;
    left:10%;
}
.wide-marquee.small-gradient .badge-150 {
    margin-top: -64px;
    margin-right:0;
  	width: 173px;
    height: 285px; 
  } 
 .wide-marquee.small-gradient .badge-150 img {
 box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.7);
-webkit-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.7);
-moz-box-shadow: 0px 0px 5px 0px rgba(51,51,51,0.7);
 }
 
}

@media (min-width:992px) {
  .wide-marquee.gradient-image-bg .badge-150 {
    width: 230px;
    left:6%;
}   
.wide-marquee.small-gradient .badge-150 {
    margin-top: -80px;
  }
}

/* animation styles */

@-webkit-keyframes fadeDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

/* End animations */



.timeline-span {
  font-size: calc(65px + 50 * ((100vw - 375px) / 680));
  color: #cdd6e0;
  opacity: .3;
  font-family: freight-text-pro, serif;
  font-style: normal;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1;
  margin: 0 0 -28px -5px;
}

.wide-marquee-text {
	padding:0 8px 32px 16px;
}
.small-gradient .wide-marquee-text {
	padding: 32px 8px;
	margin-bottom: -10px;
}

.wide-marquee-text h1 {
  font-size: 4.2rem;
  line-height: 1.1em;
  font-weight: 700;
  color: #fff;
  letter-spacing: .02em;
  margin-top:8px;	
}
.wide-marquee-text h1 span.subhead {
  display: block;
  font-size: 3rem;
  line-height: 1.3;
  padding-top: 8px;
  color: #00b2e3;
  font-family: freight-text-pro, serif;
  font-style: italic;
  font-weight: 500;
  letter-spacing: .01em;
}

.wide-marquee-text .eyebrow {
	font-size:26px;
	color:#ffbf00;
	text-transform: uppercase;
	font-family: freight-text-pro, serif;
  	font-style: normal;
  	font-weight: 400;
  	letter-spacing: .04em;
}

.ornamental-marker {
	content: "";
  	display: block;
  	height: 35px;
  	width: 96px;
  	background-size: 96px 16px;
  	background-image: url("../../150th-anniversary/images/svgs/deep-dive-marker.svg");
  	background-repeat: no-repeat;
  	margin-left: -16px;
  	margin-top: 0;
}

.wide-marquee-text h1 span.subhead.sizeup {
  font-size: 3.4rem;
  padding-top:4px;
}

@media (min-width:768px) {	
	
.wide-marquee-wrapper {
  padding: 64px 32px 80px;
}
	
.ornamental-marker {
		margin-top:-48px
		}	
	
.wide-marquee-text {
padding: 0 16px;
margin-bottom: 0;
}	
  .gradient-image-bg {
    background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(3, 50, 102, 1) 40%, rgba(3, 50, 102, 1) 100%), url("../../150th-anniversary/images/architectural-drawing-hospital-1915.jpg");
    background-repeat: repeat-y;
    background-position:left top;
    background-size: auto;
	background-attachment: fixed;   
    display: block;
  }
  	
.small-gradient {
    background-repeat: no-repeat;
    background-position:right 80px;
    background-size: auto;
	background-attachment: fixed;   
    display: block;
	}
 
.small-gradient.image-bg-1 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/architectural-drawing-small-marquee-848x500.jpg");
	}  
 .small-gradient.image-bg-2 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1930s-aerial-hospital-small-marquee-848x500.jpg");
	} 
  .small-gradient.image-bg-3 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1950s-CA-state-fair-map-small-marquee-848x500.jpg");
	}  
  .small-gradient.image-bg-4 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1969-Sacramento-Medical-Center-smaller-marquee-848x500.jpg");
	} 
  .small-gradient.image-bg-5 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1993-aerial-UC-Davis-Medical-Center-small-marquee-848x500.jpg");
	}  
  .small-gradient.image-bg-6 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/2010-Medical-Center-Pavilion-opening-small-marquee-848x500.jpg");
	}  
  .small-gradient.image-bg-7 {
	background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 55%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/2020-Tschannen-Eye-Institute-rendering-small-marquee-848x500.jpg");
	}  

  .timeline-span {
    margin-bottom: 0;
	font-size: calc(75px + 50 * ((100vw - 768px) / 680));
  }
	
	.top-layer-images.col-50percent-sm {
		width:45%;
	}	

.top-layer-images img {
    max-width: 320px;
    height: auto;
    float: right;
    margin-right: 8px;	
	padding-left:8px;
  					margin-top: 42px;  /* new */
}
}

@media (min-width:979px) and (max-width:1360px) {	
.small-gradient .wide-marquee-wrapper {
  padding: 64px 80px 80px;
}
} 

@media (min-width:992px) {
	.wide-marquee-wrapper {
  	padding-top: 15rem;
	}	
	
	.small-gradient .wide-marquee-wrapper {
  	padding-top: 8rem;
	}	
	
	.top-layer-images.col-50percent-sm {
		width:50%;
	}	
	
	.top-layer-images img {
  	max-width: 626px;
  	height: auto;
	float:none;
	}
	
  .timeline-span {
	font-size: calc(120px + 30 * ((100vw - 992px) / 680));  
    margin-top: -13.5rem; 
    margin-left: -25%; 
  }
}

	

/* Timeline header styles */

.timeline-header {
  padding: 8px 32px 2px;
  margin-top: -25px;
  background-color: #CDD6E0;
}

.panel-body .timeline-header h2 {
  font-size: 2em;
  font-weight: 700;
  color: #022851;
  letter-spacing: .01em;
}
.timeline-anchors {
  font-size: 1.25em;
  line-height:2em;
  background-color: #CDD6E0;
  padding: 0 32px 32px;
  box-shadow: 0px 2px 2px #ccc;
  position: relative;
  z-index: 2;
}

.timeline-anchors span::after {
	content:"|";
	font-size:22px;
	padding:0 16px 0 20px;
}

.timeline-anchors span:last-child::after {
	content:" ";
	padding:0;
}

.timeline-header,
.timeline-anchors {
  margin-left: -20px;
  margin-right: -20px;
}

@media (min-width:768px) {

.timeline-header {
  padding: 16px 32px;
  margin-top: -28px;
  background-image: linear-gradient(rgba(53, 91, 133, 1), rgba(104, 132, 163, .9));
}
	
.panel-body .timeline-header h2 {
  text-align: center;
  font-size: 2.6em;
  letter-spacing: .03em;
  color: #F7F7F7;
}	
	
.timeline-anchors {
	padding-top:16px;
	padding-bottom:16px;
    background-color: #ffbf00;
    text-align: center;
  }
}

@media (min-width:992px) {
	.timeline-anchors {
    font-size: 1em;
    line-height: 1.2;
  }
}

/********************************************/
/************   Article styles    ***********/
/********************************************/
p {
	hyphens: manual;
}
.panel {
  background-color: transparent;
  margin-bottom: 0;
}
.panel-body {
  padding: 0;
}
.d-block {
  display: block;
}
.d-none {
  display: none;
}
.article-wrapper {
  max-width: 1280px;
  margin: 0 auto;
}

article {
	display: -ms-grid;
	display:grid;
}

article.article {
	display: block;
}

.year-marker {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  background-color: #00B2E3;
  text-align: center;
  padding: 6px 32px;
  display:inline-block;	
  position: relative;
  z-index: 2;	
  margin-left:-35px;
  margin-bottom:24px;
}

.panel-body .timeline-period h2 {
  margin-bottom: 32px;
  font-size: calc(55px + 20 * ((100vw - 767px) / 680));	
  color: #355B85;
  font-family: freight-text-pro, serif;
  font-style: normal;
  font-weight: 700;
  margin-left:12px;
}

.timeline-period h2::before { 
    display: block;
    border-bottom: 7px solid #ffbf00;
    margin: 0 0 .2em;
    width: 70px;
    content: "";
}

.timeline-card {	
  padding: 32px;
  margin-left:-20px;	
  margin-right:-20px;		
}

.timeline-card p {
  font-size: 1.125em;
  line-height: 1.6;
  margin-bottom: 24px;
}

p.alt-style {
	font-size:1.625em; 
	color:#033266;
	font-family: freight-text-pro, serif;
    font-style: normal;
    font-weight: 700;
}

.timeline-photo {
	margin-left: -20px;
    margin-right: -20px;
}

.timeline-photo img.img-responsive {
  width: 100%;
} 

.timeline-photo figcaption {
		padding-left:32px;
		padding-right:32px;
	}	


@media (min-width:530px) {	
.timeline-photo figcaption {
		padding-left:32px;
		padding-right:32px;
	}	
}

.article-body {
	padding:0 12px;
}

/* drop cap */
.article .article-body:first-child p:nth-child(2):first-letter {
  color: #00b2e3;
  float: left;
  font-weight: 500;
	font-size: 6.75rem;
	line-height: 5rem;
	padding-top: 8px;
	padding-right: 8px;
	padding-left: 2px;
}

.article-body h2 {
	color:#022851;
	font-size:30px;
	font-weight:700;
	
}
.article-body p {
	font-size: 1.25em;
	font-family: freight-text-pro, serif;
	font-style: normal;
	font-weight: 400;
	line-height: 1.5;
	margin-bottom:16px;
}

.article-body p span.italics {
  	font-family: freight-text-pro, serif;
	font-style: italic;
  	font-weight: 400;
}

.article-body hr {
	border-top: 3px solid #FFBF00;
	margin: 80px auto;
	width: 66%;
}

aside.box-item {
	background-color:#e6ecf7;
	margin: 32px -20px;
	overflow-x:hidden;
	}

.aside-content img.img-responsive {
	width:100%;
	box-shadow: 0 0 7px 1px #ccc;
}

.aside-copy {
	padding:16px 32px 32px;
}

.aside-copy p.alt-style {
	font-style:italic;
}

@media (min-width:768px) {
article {
  -ms-grid-columns:2fr 150px 2fr;
  grid-template-columns: 2fr 150px 2fr;
}	
.timeline-period-photos {
		-ms-grid-column: 1;
	}	
.timeline-markers {
		-ms-grid-column: 2;
	}	
.timeline-card {
		-ms-grid-column: 3;
}	
	
article.article {
	/* -ms-grid-columns:1fr;
    grid-template-columns: 1fr; */
	max-width: 83.33333333333334%;
	margin:0 auto;
	background-color:#fff;
  	padding: 32px;
  	box-shadow: 0 0 8px 1px #ccc;
}	
	
article.article .article-body {
	max-width: 83.33333333333334%;
	margin:0 auto;
	padding:0;
}		  
	
.article-body hr {
	width: 75%;
}	
	
aside.box-item {
	padding:32px 0;
	margin: 48px -32px;
	}
	
aside .aside-content {
		max-width: 83.33333333333334%;
		margin:0 auto;
		padding: 0 15px;
	}
  
 .aside-copy {
	padding:16px 0 0;
} 

.centerline {
    background: linear-gradient(#ffc519, #ffc519) no-repeat center/3px 100%;
    margin-top: -25px;
    position: relative;
    z-index: 1;
	 margin-bottom:-10px;
  }	
	
.year-marker {
	position: sticky;
	transform: translate(-155px, 0);
	padding: 6px 20px;
  	max-width: 100px;
	margin:0 0 -40px;
	display:block;
}	
	
.timeline-period {
		margin-left:12px;
		margin-right:12px;
	}	
	
.panel-body .timeline-period h2 {
	font-size: calc(50px + 15 * ((100vw - 992px) / 680));	
	margin-left:0;
	margin-bottom: 64px;
	}
	
.timeline-period h2::before { 
    display: none;
}	
	
.timeline-card {
  background-color:#fff;
  padding: 48px 32px;
  box-shadow: 0 0 8px 1px #ccc;
  margin-left:0;
  margin-right:0;
}	

.timeline-photo img {
    box-shadow: 0 0 7px 1px #ccc;
  }
	
.timeline-photo {
    margin-left: 0;
    margin-right: 0;	
	}

.timeline-photo figcaption {
		padding-left:0;
		padding-right:0;
		color:#333;
	}	
	
}	

@media (min-width:992px) {
article {
  -ms-grid-columns:2fr 220px 2fr;
  grid-template-columns: 2fr 220px 2fr;
}
article.article {
	-ms-grid-columns:1fr;
    grid-template-columns: 1fr;
}

.timeline-card {
  		padding: 48px 40px;
}
	
article.article {
  	padding: 48px 32px;
}		
.year-marker {
	transform: translate(-200px, 0);
	margin-bottom: -40px;
}	
  
.aside-copy {
	padding:0;
}
  
}

figcaption, p.caption {
  color: #355B85;
  margin-top: 8px;
  font-family: freight-text-pro, serif;
  font-style: normal;
  font-weight: 500;
}
figcaption span.italics,
p.caption span.italics {
  font-family: freight-text-pro, serif;
  font-style: italic;
}


/* full width callout container  - deep dives on home page */
.fullwidth-callout-container {
  padding: 0;
  color: #fff;
  background-color: #033266;
  display: block;
  text-align: left;
  position: relative; 
  z-index: 2;
  margin-left: -20px;
  margin-right: -20px;	
  overflow-x: hidden;
}

@media (min-width:768px) {
  
.fullwidth-callout-container {
  background-repeat: no-repeat;
  background-attachment: fixed; 
}
  
.bg-img-period-1 {
  background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 65%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1879-color-drawing-hospital-844x900.jpg");
  background-position: 100% 0;
  background-size: cover;
}
	
.bg-img-period-2 {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(3, 50, 102, 1) 35%, rgba(3, 50, 102, 1) 100%), url("../../150th-anniversary/images/1930s-aerial-hospital-844x900.jpg");
  background-position: 0 100%;
    background-size: cover;
}	
  
.bg-img-period-3 {
  background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 65%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/state-fair-map-1953-844x900.jpg");
  background-position: 100% 0;
    background-size: cover;
}  

.bg-img-period-4 {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(3, 50, 102, 1) 35%, rgba(3, 50, 102, 1) 100%), url("../../150th-anniversary/images/1969-Sacramento-Medical-Center-aerial-844x900.jpg");
  background-position: 0 100%;
    background-size: cover;
}	 

.bg-img-period-5 {
  background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 65%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/1993-aerial-UC-Davis-Medical-Center-844x900.jpg");
  background-position: 100% 0;
  background-size: cover;
} 
  
.bg-img-period-6 {
  background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(3, 50, 102, 1) 35%, rgba(3, 50, 102, 1) 100%), url("../../150th-anniversary/images/2010-Medical-Center-Pavilion-opening-844x900.jpg");
  background-position: 0 100%;
    background-size: cover;
}	 
  
.bg-img-period-7 {
  background-image: linear-gradient(90deg, rgba(3, 50, 102, 1) 0%, rgba(3, 50, 102, 1) 65%, rgba(255, 255, 255, 0) 100%), url("../../150th-anniversary/images/2020-Tschannen-Eye-Institute-artist-building-rendering-844-900.jpg");
  background-position: 100% 0;
  background-size: cover;
}   
}

@media (min-width:992px) {
.bg-img-period-1,
.bg-img-period-2,
.bg-img-period-3,
.bg-img-period-4,
.bg-img-period-5,
.bg-img-period-6,
.bg-img-period-7 { 
  background-size: contain;
}
}	


@media screen and (max-device-width: 1024px){
.bg-img-period-1,
.bg-img-period-2,
.bg-img-period-3,
.bg-img-period-4,
.bg-img-period-5,
.bg-img-period-6,
.bg-img-period-7 { 
  background-size: cover;
  background-attachment:scroll;
}
}

.fullwidth-callout-body-content {
  max-width: 1320px;
  padding: 48px 32px 0;
  margin: 0 auto;
}
.panel-body .fullwidth-callout-container h2 {
  font-size: 2.5em;
  font-weight: 700;
  color: #fff;
  letter-spacing: .03em;
}
.panel-body .fullwidth-callout-container p {
  color: #fff;
  font-size: 1.25em;	
  line-height: 1.75em;
  padding-bottom: 0;
}


.fullwidth-callout-body-content .ornamental-marker {
  background-size:85px 14px;
  margin-top: 24px;
}

.fullwidth-callout-body-content .eyebrow {
  color: #ffbf00;
  font-size: 1.375em;
  letter-spacing: .1em;
  font-family: freight-text-pro, serif;
  font-style: normal;
  font-weight: 600;
}

.fullwidth-callout-body-content .col-75percent-sm {
  margin-bottom: 0;
}

.fullwidth-callout-body-content .col-25percent-sm {
	margin-left: -32px;
    margin-right: -32px;
	margin-bottom:24px;
}

.fullwidth-callout-container img {
    width: 100%;
}

@media (min-width:768px) {
.panel-body .fullwidth-callout-container h2 {
  font-size: 2.625em;
}
.panel-body .fullwidth-callout-container p {
  font-size: 1.5em;
}	

  .ml-offset {
    margin-left: 48px;
  }
   .ml-lg-offset {
    margin-left: 25%;
	padding-right:32px;   
  }	
}
@media (min-width:992px) {
  .ml-offset {
    margin-left: 8.33333333333%;
  }

}


/************************************************/
/*** Full width settings + navigation changes ***/
/************************************************/
/* main section overrides */
#main section {
  margin: 0 auto;
  background-color: #ffffff;
  margin-top: 0;
}
@media (min-width:768px) {
  #main section {
  background: rgba(230, 236, 247, 0.5);	
  }
}

.maincol.col-66percent {
	width:100%;
}
.col-33percent.sidebar {
	width:100%;
}

.container {
  max-width: 100%;
  background: rgba(230, 236, 247, 0.5);	
}
.navtop .glyphicon-minus::before {
  display: none;
}


@media (min-width:992px) {
  #header {
    position: fixed;
    height: 90px;
    top: 0;
    z-index: 3;
    left: 0;
    right: 0;
    background-color: #f7f7f7;
  }
  header {
    max-width: 1320px;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
  }
}
@media (min-width:980px)and (max-width:1375px) { /* global override */
  .container, header {
    max-width: 100%;
  }
  .navtop .navbar {
    max-width: 1320px;
  }
}
@media (min-width:860px) and (max-width:1059px) {
  .navbar-collapse .navbar-nav.navbar-left:first-child {
    margin-left: 15px;
  }
}
@media (min-width:1060px) and (max-width:1340px) {
  .navbar-collapse .navbar-nav.navbar-left:first-child {
    margin-left: 10px;
  }
}
@media (max-width:859px) {
  .navbar {
    border: 1px solid #335379
  }
  .navbar:hover {
    border: 1px solid #1a3e68
  }
  .navbar-header {
    border: 0
  }
}
.navtop {
  border: none;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .30);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .30);
}
@media (min-width:860px) {
  .navtop .navbar-default {
    background-image: none;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  .navtop {
    background-image: url(../../../global/design/responsive/bootstrap/css/img/nav-top-gold.png); 
    background-repeat: repeat-x;
    background-color: #002855;
  }
	.navtop .navbar-default .navbar-nav > .open > a, 
	.navtop .navbar-default .navbar-nav > .open > a:hover, 
	.navtop .navbar-default .navbar-nav > .open > a:focus {
		background-color: #e6ecf7;  
	}
}

/* adjustments to nav and footer */

.navbar-default, .dropdown-menu {
 	  background-color: #e6ecf7;
}

footer {
  background: #fff;	
}

footer #row2cols3 {
	display:none;
}

@media (min-width:768px){
.footer-inner {
    margin-top: -21px;
}
}


/**************************************/
/**** blockquotes and pull quotes *****/
/**************************************/


blockquote {
    border-color: transparent;
    font-size: 1.5em;
    padding: 32px 37px 32px 32px;
    margin-bottom: 30px;
    margin-top: 16px;
}

blockquote.primary {
    color:#fff;
    background-color: rgba(3, 50, 102, 0.9);
}

blockquote.secondary {
  	color:#022851;
    background-color: rgba(255, 223, 128, 0.9);
}

@media (min-width:768px){
aside.quote-pull-left {
  float:left;
  margin-right:48px;
  margin-left: -22%;
  max-width:55%;
  padding-left:8px;
	}
	
aside.quote-pull-right {
	float: right;
	margin-left: 55px;
	margin-right: -22%;
	max-width: 55%;
	}	
}

@media (min-width:992px){
aside.quote-pull-left {
  margin-left: -18%;
	}
	
aside.quote-pull-right {
	margin-right: -18%;
	}	
}


/* ===================================== 
         Card Styles
======================================== */

.cards-wrapper .ornamental-marker {
  	background-image: url("../../150th-anniversary/images/svgs/deep-dive-marker-blue.svg");
	height:16px;
	margin-bottom:-8px;
}

h2.cards-header {
  color:#355B85;
  text-transform: uppercase;
  font-size: 26px;
  letter-spacing: .05em;
  font-family: freight-text-pro, serif;
  font-style: normal;
  font-weight: 500;
}

.card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  }

.card-body {
  flex: 1 1 auto;
  min-height: 1px;
  padding: 1.25rem 0; }

.card-title {
  margin-bottom: 0.75rem; }

.panel-body h3.card-title {
    font-size: 1.75em;
color: #033266;
font-weight: 600;
padding-top: 8px;
line-height: 1.214;
}

.card-text:last-child {
  margin-bottom: 0; }


.card-img,
.card-img-top,
.card-img-bottom {
  flex-shrink: 0;
  width: 100%; 
  height:auto;
  transition: all 0.4s ease 0.1s; 
}

.card-img-top:hover {
-webkit-transform: scale(1.04);
-ms-transform: scale(1.04);
transform: scale(1.04);
}

.card-img,
.card-img-top {
  border-top-left-radius: calc(0.25rem - 1px);
  border-top-right-radius: calc(0.25rem - 1px); 
	border: 1px solid #cdd6e0; 
}


.card-deck .card {
  margin-bottom: 15px; }

@media (min-width: 576px) {
  .card-deck {
    display: flex;
    flex-flow: row wrap;
    margin-right: -15px;
    margin-left: -15px; 
	}
  
  .card-deck .card {
      flex: 1 0 0%;
      margin-right: 15px;
      margin-bottom: 0;
      margin-left: 15px; 
	} 
}

@media (min-width: 768px) {
  .card-deck .card.mr-offset {
      margin-right: 20px;
	}
    .card-deck .card.ml-offset {
      margin-left: 20px;
	}	
}

@media (min-width: 992px) {
  .card-deck .card.mr-offset {
      margin-right: 40px;
	}
    .card-deck .card.ml-offset {
      margin-left: 40px;
	}	
}
                            
                            
  /* color themes */
                            
                            
.card-deck.no-borders .card {
  border:transparent;
}

 .card-deck.gutters {
    margin-right: 0;
    margin-left: 0;
}                           
                          

/***********************************/
/********  Button styles   *********/
/***********************************/
.btn-primary, p > a.btn-primary {
  font-size: 18px;
  font-weight: 500;
  color: #022851 !important;
  background: #ffbf00;
  border: 2px solid #ffbf00;
  transition: all 0.3s ease 0s;
  border-radius: 0;
  padding: 8px 32px;
  margin-bottom: 48px;
}
.btn-primary:hover, a.btn-primary:hover, .btn-primary:focus, p > a.btn-primary:focus, .btn-primary:active, p > a.btn-primary:active, .btn-primary.active {
  color: #ffffff !important;
  background: #007991;
  border: 2px solid #007991;
}
.cta-btn {
  margin: 24px 0;
  text-align: center;
  transition: all 0.4s ease 0.1s; 
}

.cta-btn:hover {
  -webkit-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

/* link button */
.btn.btn-link, p > a.btn.btn-link /* sets styles for buttons wrapped in a p tag */ {
    color: #002855;
    font-size:16px;
    text-decoration: underline !important;  /* new Apr 2021 */
    -webkit-text-decoration-color: rgba(0,121,145,0.25); /* Safari */   
	text-decoration-color: rgba(0,121,145,0.25);
    background: none;
    border: none;
    transition: all 0.3s ease 0s;
    padding: 8px 0 0;
}

.btn-link:after {
  		display: inline-block;
  		content: url("data:image/svg+xml,<svg viewBox='0 12 18 16' width='16' height='32' fill='%23ffbf00' stroke='%23ffbf00' stroke-width='2.5' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M6.646 3.646a.5.5 0 01.708 0l6 6a.5.5 0 010 .708l-6 6a.5.5 0 01-.708-.708L12.293 10 6.646 4.354a.5.5 0 010-.708z'/></svg>");
 		padding-left:0.125rem;
		vertical-align: middle;
		width:1.25rem;
		height:1.6rem;
		margin-right: -1.5rem;
		}


.btn.btn-link:hover, a.btn.btn-link:hover,
.btn.btn-link:focus, a.btn.btn-link:focus,
.btn.btn-link:active, p > a.btn.btn-link:active,
.btn.btn-link.active {
    color: #007991 !important;
    text-decoration: underline !important;
    -webkit-text-decoration-color: rgba(0,121,145,1); /* Safari */   
	text-decoration-color: rgba(0,121,145,1);
}   

/* spacing */	

.pt-0 {  padding-top: 0 } 
.pt-1 {  padding-top: 4px }
.pt-2 {  padding-top: 8px }
.pt-3 {  padding-top: 16px }
.pt-4 {  padding-top: 24px }
.pt-5 {  padding-top: 32px }
.pt-6 {  padding-top: 48px }
.pt-7 {  padding-top: 64px }
.pt-8 {  padding-top: 80px }
.pt-9 {  padding-top: 96px }

.pb-0 {  padding-bottom: 0 }
.pb-1 {  padding-bottom: 4px }
.pb-2 {  padding-bottom: 8px }
.pb-3 {  padding-bottom: 16px }
.pb-4 {  padding-bottom: 24px }
.pb-5 {  padding-bottom: 32px }
.pb-6 {  padding-bottom: 48px }
.pb-7 {  padding-bottom: 64px }
.pb-8 {  padding-bottom: 80px }
.pb-9 {  padding-bottom: 96px }


.mt-0 {  margin-top: 0 }
.mt-2 {  margin-top: 8px }
.mt-3 {  margin-top: 16px }
.mt-4 {  margin-top: 24px }
.mt-5 {  margin-top: 32px }
.mt-6 {  margin-top: 48px }
.mt-7 {  margin-top: 64px}

.mb-0 {  margin-bottom: 0 }
.mb-3 {  margin-bottom: 16px }
.mb-4 {  margin-bottom: 24px }
.mb-5 {  margin-bottom: 32px }
.mb-6 {  margin-bottom: 48px }
.mb-7 {  margin-bottom: 64px }

.mt-n3 {  margin-top: -16px }
.mt-n4 {  margin-top: -24px }
.mt-n5 {  margin-top: -32px }
.mt-n6 {  margin-top: -48px }
.mt-n7 {  margin-top: -64px }

.mx-n5 { margin-left:-32px; margin-right:-32px }

@media (min-width:768px) {
	.pb-sm-3 {  padding-bottom: 16px }
	.pb-sm-4 {  padding-bottom: 24px }
	.pb-sm-5 {  padding-bottom: 32px }
	.pb-sm-6 {  padding-bottom: 48px }
	.pb-sm-7 {  padding-bottom: 64px }
	.pb-sm-8 {  padding-bottom: 80px }
	.pb-sm-9 {  padding-bottom: 96px }
	
	.pt-sm-3 {  padding-top: 16px }
	.pt-sm-4 {  padding-top: 24px }
	.pt-sm-5 {  padding-top: 32px }
	.pt-sm-6 {  padding-top: 48px }
	.pt-sm-7 {  padding-top: 64px }
	.pt-sm-8 {  padding-top: 80px }
	.pt-sm-9 {  padding-top: 96px }
	

	.mt-sm-2 {  margin-top: 8px }
	.mt-sm-3 {  margin-top: 16px }
	.mt-sm-4 {  margin-top: 24px }
	.mt-sm-5 {  margin-top: 32px }
	.mt-sm-6 {  margin-top: 48px }
	.mt-sm-7 {  margin-top: 64px }
	.mt-sm-8 {  margin-top: 80px }
	.mt-sm-9 {  margin-top: 96px }
	
	.mb-sm-3 {  margin-bottom: 16px }
	.mb-sm-4 {  margin-bottom: 24px }
	.mb-sm-5 {  margin-bottom: 32px }
	.mb-sm-6 {  margin-bottom: 48px }
	.mb-sm-7 {  margin-bottom: 64px }
	.mb-sm-8 {  margin-bottom: 80px }
	.mb-sm-9 {  margin-bottom: 96px }
}