@charset "utf-8";
/* CSS Document */


:root {
--accentcolor: #976C4A;
--fontcolor: #4B2C1D;
--bs-body-font-family: 'Roboto', Amplitude, Arial, Helvetica, sans-serif;
}

.raw-html-body {
	
	color: #4B2C1D;

/* Body/medium */
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 24px */
}

img {
max-width: 100%;
}

p a { color: #005075;
    
}

p {
margin-bottom: 2rem;
}

p a:hover {
    text-decoration: none;
}


    
    /*********   start  --  main column container  ***********/

    #main-content, #main-content2, #main-content3 {

        display: flex;
        /* Required in case of using an infinite scroll */
        align-items: flex-start;
    }

    #main-col-container,
    #main-col-container2,
    #main-col-container3 {
        
        margin-bottom: 6em;
        position: relative;
        max-width: 1800px;
        padding: 1em 10%!important;

    }
.main-content-article {
    padding: 0 2em;
}
  

    #sidebar-mobile, #sidebar-mobile2  {
        margin-top: -6px;
        padding: 4em 1em;

    }


    .sticky-sidebar-container {
        

    
    }

  
    
    .sticky-sidebar {
        width: 100%;
        
        
        padding: 10px 0;
        color: #4B2C1D;
        
        /**
        background: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume2/banner-body-article3-2x.jpg');
        background-position: top right;
        
        background-repeat: no-repeat;
        background-size: contain;

        **/
    }



.info-box {
    
    border-radius: 4px;
border: 1px solid #4B2C1D;
background: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-4/bck-plus-pattern.svg')  repeat,  radial-gradient(1763.69% 375.5% at 33.88% 35.82%, rgba(255, 255, 255, 0.02) 0%, rgba(0, 0, 0, 0.00) 100%), rgba(255, 255, 255, 0.40);
background-blend-mode: overlay, normal, normal;
backdrop-filter: blur(25px);
    margin: 80px 0;
    padding: 25px;
    text-decoration: none!important;
}



a.info-box-link,
a.related-box-link,
a.other-content-link,
.related-title,
.recommended-title {
    text-decoration: none;
}

a > .info-box:hover,
a > .related-box:hover,
a.other-content-link:hover {
    text-decoration: underline;
}

.other-content .arrow-7 {
	background-image: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-7/arrow-right-button7.svg');
	background-size: contain;
	background-repeat: no-repeat;
	width: 32px;
	height: 32px;
	
	
	
}

a.other-content-link:hover .arrow-7 {
	background-image: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume2/button-right.svg');
	
	
}

.info-box-header {
   

font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 18px; /* 128.571% */
letter-spacing: 1.12px;
text-transform: uppercase;
    margin-bottom: 6px;
    text-decoration: none!important;
}

.info-box-title {
    
font-family: 'Open Sans',  'Open Sans Medium';
font-size: 16px;
font-style: normal;
font-weight: 750;
line-height: normal;
letter-spacing: 0.16px;
    margin: 10px 0 15px;
    
}



.info-box-info {
    
    
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: normal;
    opacity: 0.8;
    border-left: 1px solid #3DA1B7;
padding-left: 14px;
    text-decoration: none!important;
}

/*.info-box-info::after {
    
  
    background-image: none;
    
    content: "\f08e";
    font-family: "Font Awesome 6 Pro";
    font-size: 12px;
    line-height: 12px;
    color: #4B2C1D;
    margin-left: 8px;
}*/
    
  
a.info-box-link:hover .info-box-title {
    text-decoration: underline;
}

a.related-box-link:hover  .recommended-title ,
a.related-box-link:hover  .related-title {
    text-decoration: underline;
	color: #4B2C1D;

text-decoration-style: solid;
text-decoration-skip-ink: auto;
text-decoration-thickness: 10%; /* 2px */
text-underline-offset: 10%; /* 2px */
text-underline-position: from-font;
}

a.info-box-link:hover .info-box-info {
    opacity: 1;
}



    .side-scroll-header {
        color: #500E51;
        
        font-weight: 500;
        font-size: 16px;
        line-height: 1.5;
        margin: 40px 0;
        letter-spacing: 1.28px; 
        text-transform: uppercase;
    }

    .side-scroll-blurb {
        font-size: 16px;
        
        font-weight: 500;
        letter-spacing: 0.02em;
        line-height: 1.4;
        color: #4B2C1D;
        margin-bottom: 30px;
    }

    .side-scroll-subhead {
        font-size: 16px;
        font-family: 'Open Sans',  'Open Sans Medium';
        font-weight: 750;
        letter-spacing: 0.02em;
        line-height: 1.4;
        color: #4B2C1D;
        margin-bottom: 20px;
    }


.gotham28 
    {
        font-size: 28px;
        font-family: 'Open Sans',  'Open Sans Medium';
        font-weight: 750;
        line-height: normal;
        color: #4B2C1D;
        margin-bottom: 20px;
    
}

.subhead {

    color: #3A5178;
    font-family: 'Open Sans',  'Open Sans Medium';
    font-weight: 700;
    font-size: 28px;
    margin-bottom: 40px;
    line-height: normal;
    
    }
    
    .subhead.larger {
    font-size: 32px;
    }




.related-content {
	background-color: #f5f7f8;
	padding: 60px 120px;
	border-radius: 15px;
	margin: 15px;
}


.related-content h2 {
    color: #4B2C1D;
    font-family: 'Open Sans',  'Open Sans Medium';
    font-weight: 700;
    font-size: 32px;
    
    line-height: normal;
	font-style: normal;
	margin-bottom: 50px;
    
    }

.related-content .related-title  {
        font-size: 28px;
        font-family: 'Open Sans',  'Open Sans Medium';
        font-weight: 750;
        line-height: normal;
        color: #4B2C1D;
        
}
.related-content.related-content-two .related-title {
	font-size: 20px;
}


.related-content .related-image  {
	
	overflow: hidden;
}

.related-content .related-image img {
	object-fit: cover;
	width: 100%;
	border-radius: 8px;
}

.related-content .related-text {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 20px;
}

.related-content .related-tag {
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1.28px;
}

.related-content .related-time {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.16px;
	font-family: 'Open Sans',  'Open Sans Medium';
}

.related-content a {
	text-decoration: none;
}

.related-content a:hover .related-title {
	text-decoration: underline;
}

.related-content .related-arrow {
	width: 49px;
	height: 49px;
	min-width: 49px;
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

.related-content a:hover .related-arrow {
	
	-webkit-transform: scale(1);
	transform: scale(1);
	
}


    .sticky-sidebar p {
        font-size: 14px;
        font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
        font-weight: 400;
        line-height: 1.4;
        margin-bottom: 30px;
    }

    .sticky-sidebar nav ul {
        line-height: 3;
        margin-top: 2em;
    }

    .side-scroll-bottom-image {
        margin-right:  auto;
        display: block;
        max-width: 90px;
        width: 100%;
    }

    .side-scroll-full-image {
        width: 100%;
    }

    /**
    .sticky-sidebar nav ul li {
        border-left:1px solid #474C50;
        padding-left: 30px;


    }

    .sticky-sidebar nav ul li.current {
        border-left: 2px solid #936846;
    }
    **/



/**********   ADDING P7 STYLES  *************/

	/* related side content */
	.sidebar-related-container {
		display: flex;
		justify-content: space-between;
		align-content: center;
		padding: 32px 0;
		border-top: 1px solid #4B2C1D;
	}
	.sidebar-related-left {
		color: #4B2C1D;
font-family: Roboto;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 120%; /* 24px */
letter-spacing: 0.15px;
	}
	
	.related-container-7  .lockup {
		color: #4B2C1D;
		border-bottom: none;
		font-size: 16px;
		line-height: 1.5;
		margin-bottom: 8px;
		margin-top: 8px;
	}
	
	.related-container-7 .readTime {
		color: #4B2C1D;
font-feature-settings: 'liga' off, 'clig' off;

/* Eyebrow/small */
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 18px; /* 128.571% */
letter-spacing: 1.12px;
text-transform: uppercase;
		margin-bottom: 8px;
		margin-top: 0;
	}
	
	.sidebar-related-image {
		width: 68px;
		height: 68px;
		object-fit: contain;
	}
	
	.info-box-link-img {
		color: #4B2C1D;
	}
	
	.info-box {
		display: flex;
		align-items: center;
		padding: 24px;
	}
	
	.info-box-image img {
		width: 145px;
		height: 145px;
		object-fit: contain;
	}
	
	.info-box-text {
		padding-left: 24px;
		display: flex;
		flex-direction: column;
		column-gap: 16px;
		padding-right: 20px;
		position: relative;
	}
	
	.info-box-info {
		border-left: 4px solid #1B8096;
        font-size: 14px;
		font-weight: 400;
        padding-left: 8px;
	}
	
	.info-box-text::after {
    content: "\f08e";
    font-family: "Font Awesome 6 Pro";
    color: var(--fontcolor);
    font-weight: 400;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
		position: absolute;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 14px;
    font-size: 12px;
    
  /*  margin-right: 2.5rem; */
    right: 2px;
		bottom: 20px;
}
	
	.footer-wired-image {
		max-width: 120px;
		height: auto;
	}
	
	h2.section__header7 {
		
		color: #4B2C1D;

/* H4 */
font-family: Roboto;
font-size: 34px;
font-style: italic;
font-weight: 300;
line-height: 120%; /* 40.8px */
letter-spacing: 0.25px;
text-transform: uppercase;
		margin-bottom: 48px;
	}
	
	.recommended-lockup {
		
		color: #4B2C1D;
		border-bottom: 1px solid #4B2C1D;
padding-bottom: 8px;
font-family: Roboto;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: 24px; /* 150% */
letter-spacing: 1.28px;
text-transform: uppercase;
		margin-bottom: 20px;
	}
	
	.recommended-container .readTime {
		margin-top: 8px;
		margin-bottom: 8px;
	}
	
	.recommended-container .recommended-text {
		
		color: #4B2C1D;
font-family: Roboto;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 120%; /* 28.8px */
	}
	
	.recommended-container .recommended-image {
		width: 100%;
		height: auto;
	}
	
	.section--background-newsletter {
		background-image: conic-gradient(from 97deg at 73.98% 126.47%,  #FFFBF3 0deg,  #CCC5BA 69deg, #7C6658 133deg,  #4B2C1D 185deg, #836F61 278deg, #CCC5BA 360deg);
			color: #ffffff;
			padding: 64px 48px;
	margin-inline: calc(50% - 50vw);
  padding-inline: calc(50vw - 50%);
  
  background-size: cover;
			
	}
	
	.section--background-newsletter .lockup {
		color: #ffffff;
		margin: 8px 0;
		font-size: 14px;
		border-bottom: none;
	}
	
	.other-content {
		
		background: linear-gradient(176deg, #FAF8F6 10.08%, rgba(250, 248, 246, 0.00) 91.06%), conic-gradient(from 145deg at 72.96% 82.73%, rgba(211, 195, 176, 0.70) 52.994415163993835deg, rgba(230, 223, 210, 0.70) 105.86407542228699deg, rgba(240, 232, 216, 0.70) 153.16047549247742deg, rgba(255, 247, 225, 0.70) 225.32851696014404deg, rgba(231, 220, 203, 0.70) 255.95337867736816deg, rgba(223, 210, 195, 0.70) 269.13461208343506deg, rgba(224, 212, 198, 0.70) 304.5569157600403deg);
		
		background-image: linear-gradient(176deg, #FAF8F6 10.08%, rgba(250, 248, 246, 0.00) 91.06%), conic-gradient(from 145deg at 72.96% 82.73%, rgba(211, 195, 176, 0.70) 52.994415163993835deg, rgba(230, 223, 210, 0.70) 105.86407542228699deg, rgba(240, 232, 216, 0.70) 153.16047549247742deg, rgba(255, 247, 225, 0.70) 225.32851696014404deg, rgba(231, 220, 203, 0.70) 255.95337867736816deg, rgba(223, 210, 195, 0.70) 269.13461208343506deg, rgba(224, 212, 198, 0.70) 304.5569157600403deg);
		
		display: flex;
		align-items: flex-end;
		padding: 80px 24px 24px;
		justify-content: space-between;
		color: #4B2C1D;
font-family: Roboto;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 120%; /* 28.8px */
		
		
	}
	
	.other-content .arrow-7 {
		width: 32px;
	}


.puTagsContainer {
		display: flex;
		align-items: center;
		column-gap: 8px;
		gap: 8px;
		align-self: stretch;
	}
	
	.puTag {
		color: #4B2C1D;
text-align: center;

/* Subtitle 3 */
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 21px */
letter-spacing: 0.1px;
		display: flex;
min-width: 48px;
padding: 8px;
justify-content: center;
align-items: center;
gap: 8px;
		border-radius: 3px;
border: 1px solid #4B2C1D;
	}
	
.section--font-white .puTag {
	color: #ffffff;
	border-color: #ffffff;
}




















   
    /* Only stick if you can fit */
    @media only screen and (max-width: 901px) {
        .sticky-sidebar nav ul {

            position: relative;

        }
        
        .sticky-sidebar {
            text-align: center;
            margin-bottom: 40px;
        }
    }

@media only screen and (max-width: 991px) {
	
	.related-content {
	background-color: #f5f7f8;
	padding: 20px;
	}

     #main-col-container,
    #main-col-container2,
    #main-col-container3 {
        
        margin-bottom: 10px;
        
        

        }
	
	.emptyContainer {
		display: none;
	}
    }


    .sticky-sidebar nav ul li a {
        display: block;
        padding: 0.5rem 1rem;
        color: #4B2C1D;
        text-decoration: none;
    }

    .sticky-sidebar nav ul li a {
        border-left: 1px solid #474c50;
        padding-left: 30px;
    }

    .sticky-sidebar nav ul li a.current {
        border-left: 4px solid #936846;
        font-weight: bold;
    }

    .sticky-sidebar nav ul li a:hover {
        font-weight: bold;
    }
    
    .bold-body-subhead {
    font-size: 18px;
    font-weight: 500;
    margin-top: 40px;
    margin-bottom: 2px;
    }
	
	.bold-body-name {
    font-size: 18px;
    font-weight: 500;
    margin-top: 40px;
    
    }
    
    .bold-body-text,
    .sticky-sidebar p.bold-body-text {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.33;
    margin: 10px 0;
    }


.article-subheader {
    font-weight: 500;
    margin-bottom: 10px;
    margin-top: 40px;
}
p strong .article-color, .article-subheader {
    font-size: 18px;
}


   .article-mid-image {
        margin: 50px 0 80px;
    }
    
.sticky-sidebar-spacer {
    display: block;
    height: 148px;
}
    
    .sticky-image {
        
        border-radius: 30px;
        max-height: 370px;
        width: 100%;
            height: auto;
        max-width: 370px;
        filter: brightness(88%);
        margin-bottom: 30px;
    
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
        
    }
    
    
    /* once pinned */
.sticky-sidebar.Zebra_Pin .sticky-image {
    
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    opacity: 1;
    
    
    filter: brightness(100%);
}



 .overlay-cta-button-right  {
        color: #ffffff;
        font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
        font-size: 18px;
        font-weight: 400;
        cursor: pointer;
  position: fixed;
  top: 50%;
  right: -68px;
  background-color: #101820;
  
  z-index: 4;
  border-radius: 0 0 8px 8px;
  
  padding: 26px 16px 6px;
  transform: translate(0%, -50%) rotate(90deg);
transition: .2s ease;

  /* Legacy vendor prefixes that you probably don't need... */

  /* Safari */
  -webkit-transform: translate(0%, -50%) rotate(90deg);
  /* Firefox */
  -moz-transform: translate(0%, -50%) rotate(90deg);

  /* IE */
  -ms-transform: translate(0%, -50%) rotate(90deg);
  
}



.overlay-cta-button-right::before {
  content: "";
  position: absolute;
  
  background-color: transparent;
  right: -50px;
  height: 25px;
  width: 50px;
  top: 0;
  border-top-left-radius: 25px;
  box-shadow: -25px 0 0 0 #101820;
}

.overlay-cta-button-right::after {
  content: "";
  position: absolute;
  
  background-color: transparent;
  left: -50px;
  height: 25px;
  top: 0;
  width: 50px;
  border-top-right-radius: 25px;
  box-shadow:  25px 0  0 0 #101820;
}



.overlay-cta-button-right a {
    color: #ffffff;
    text-decoration: none;
}

.overlay-cta-button-right:hover {

box-shadow: .25rem .25rem 1rem .25rem rgba(255,255,255,0.25);
right: -62px;
text-decoration: underline;



}











    
/**  trying hover effect on next article  **/

    .footer-next-article-container, .footer-previous-article-container, .footer-articles-link-container {
    /**    -webkit-transition: border-color 0.1s;
    transition: border-color 0.1s;
    **/
    overflow: hidden;
    cursor: pointer;
    max-height: 425px;
    height: 100%;
    width: 100%;
    min-height: 80px;
    
    }

    


    .footer-next-article {
        overflow: hidden;
        height: 100%;
        text-align: right;
        position: relative;
        max-width: 600px;
        min-width: 450px;
        
    }

    .footer-next-article-text {
        position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

        -webkit-transition: all 0.4s ease-in-out ;
        transition: all 0.4s ease-in-out ;
        opacity: .9;
        z-index: 3;
        background: transparent;
        border-radius: 54px;

    }

    .footer-next-article-container:hover .footer-next-article-text  {
        
        left: 60%;
        background: rgba(255,255,255, 0.9);
        font-weight: 500;

/*
      animation: slideRight 2s ease-in-out ;
      animation-direction: reverse;
        
        */
    }

    /*

    @keyframes slideRight {

        0%
         {
            transform: translate(0, 0);
        }

        100% {
            transform: translate(40px, 0);
        }
    }

    */


    .footer-next-article-image {
        -webkit-transition: all 0.4s;
        transition: all 0.4s;
        opacity: .9;
        right: 0;
        max-height: 425px;
        height: 100%;

    }

    .footer-articles-link-image {
        -webkit-transition: all 0.4s;
        transition: all 0.4s;
        opacity: .9;
        
        
        width: 20px;
        height: 20px;

    }

    .footer-next-article-container:hover .footer-next-article-image,
    .footer-articles-link-container:hover .footer-articles-link-image  {
            -webkit-transform: scale(1.15) rotate(0.01deg);
            transform: scale(1.15) rotate(0.01deg);
            opacity: 1;
        }




    


.footer-previous-article {
        overflow: hidden;
        height: 100%;
        text-align: right;
        position: relative;
        max-width: 600px;
        min-width: 450px;
        
    }


    .footer-previous-article-text {
        position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

        -webkit-transition: all 0.4s ease-in-out ;
        transition: all 0.4s ease-in-out ;
        opacity: .9;
        z-index: 3;

    }

    .footer-previous-article-container:hover .footer-previous-article-text  {
        
        left: 48%;

/*
      animation: slideRight 2s ease-in-out ;
      animation-direction: reverse;
        
        */
    }


.footer-back-home, .digital-exclusive {
    display: flex;
	position: relative;
padding: 0px 274px;
justify-content: center;
align-items: center;
gap: 10px;
align-self: stretch;
    border-radius: 4px;
border: 1px solid #3DA1B7;
background: #FFF;
    font-size: 12px;
	line-height: 24px;
    font-weight: 500;
    text-transform: uppercase;
	letter-spacing: 0.08em;
	border-image: 
    linear-gradient(to right, 
		rgba(61, 161, 183, 0.5),
		rgba(71, 56, 155, 0.5) 48%,
		rgba(165, 49, 175, 0.5) 100%) 1;
    
}

.footer-back-home {
	background: linear-gradient(white, white) padding-box,
              linear-gradient(to right, rgba(61, 161, 183, 0.5),
		rgba(71, 56, 155, 0.5) 48%,
		rgba(165, 49, 175, 0.5) 100%) border-box;
  border-radius: 0.5em;
  border: 1px solid transparent;
	
}



.footer-back-home a, .digital-exclusive a {
    text-decoration: none;
	line-height: 24px;
}
.footer-back-home a::after, 
.digital-exclusive a::after {
    
    content: "\f054";
    font-family: "Font Awesome 6 Pro";
    color: #4B2C1D;
    font-weight: 700;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    font-size: 8px;
    width: 2rem;
    margin-right: -2.5rem;
    margin-left: 0.5rem;
    
}
.digital-exclusive a::after {
    
   
content: "\f33d";
}


.footer-back-home a:hover::after {
animation: slide 2s ease-in-out infinite;
    transition: 0.6s;
    -o-transition: 0.6s;
    -ms-transition: 0.6s;
    -moz-transition: 0.6s;
    -webkit-transition: 0.6s;
}

@media only screen  and (max-width: 991px) {

.footer-next-article-container:hover .footer-next-article-text  {
        background: transparent;
        }
    
    .overlay-cta-button-right {
        display: none;
    }
         .footer-next-article-container img, .footer-previous-article-container img {
                 
                 padding: 2em 1em;
             }

              .footer-next-article-container, .footer-previous-article-container {
                  overflow: visible;
    font-size: 1px;
    color: transparent;}

    
    .footer-back-home, .digital-exclusive {
    
padding: 4px 20px;
        
    }
                  .footer-next-article, .footer-previous-article {
                      text-align: center;
                      min-width: 160px;
                      width: 100%;
					  white-space: nowrap;
                  }

                  .footer-articles-link-container {
                      display: none;
                  }

             
         }





section.section {
    padding: 44px 0;
}

         

.section-blurb {
  padding-top: 60px; 
}


.section-blurb .intro  {
    color: #4B2C1D;
font-family: 'Open Sans',  'Open Sans Medium';
font-size: 32px;
font-style: normal;
font-weight: 750;
line-height: normal;
    margin: 80px 0;

    }

.intro-small {
    font-size: 12px;
    
}
    .section-blurb .section-blurb-logo {
        margin-right: auto;
        width: 180px;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        
    }

.section-blurb .logos {
    display: flex;
    margin: 0 auto;
}
    
    .section-blurb .section-blurb-title {
        text-transform: uppercase;
        font-weight: 500;
        font-size: 16px;
        letter-spacing: 0.32px;
        
    }

.section-blurb .section__header {
    font-size: 16px;
    padding-bottom: 6px;
    border-bottom: 1px solid #474C50;
    text-transform: uppercase;
    font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
    letter-spacing: 1.28px;
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 50px;
}


.section__header-large {
        
        font-weight: 500;
        line-height: 1.37;
        font-size: 32px;
        color: #4B2C1D;
        
        margin-bottom: 1em;
        text-transform: uppercase;
        padding-top: 30px;


    }
    
    .section-blurb .section-blurb-row {
        margin-bottom: 80px;
        padding-bottom: 20px;
    border-bottom: 1px solid #4B2C1D;
    }

.puTagsContainer {
		display: flex;
		align-items: center;
		column-gap: 8px;
		gap: 8px;
		align-self: stretch;
	}
	
	.puTag {
		color: #4B2C1D;
text-align: center;

/* Subtitle 3 */
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 21px */
letter-spacing: 0.1px;
		display: flex;
min-width: 48px;
padding: 8px;
justify-content: center;
align-items: center;
gap: 8px;
		border-radius: 3px;
border: 1px solid #4B2C1D;
	}

.puButton7Outline {
		color: #4B2C1D;
	cursor: pointer;
text-align: center;
text-decoration: none;
/* Subtitle 3 */
font-family: Roboto, sans-serif;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 21px */
letter-spacing: 0.1px;
		display: flex;
min-width: 48px;
padding: 8px;
justify-content: center;
align-items: center;
gap: 8px;
		border-radius: 3px;
border: 1px solid #4B2C1D;
	
	
	}

.primaryButton {
	
	
padding: 8px 60px;
cursor: pointer;
gap: 10px;
	
	color: #FFF;
text-align: center;
font-feature-settings: 'liga' off, 'clig' off;

/* Button/medium */
font-family: Roboto;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 24px; /* 171.429% */
letter-spacing: 2.25px;
text-transform: uppercase;
	border-radius: 3px;
background: #1B8096;
	text-decoration: none;
	
}

.primaryButton:hover {
	background-color: #005075;
    text-decoration: underline;
	color: #ffffff;
}
	
	.hero-gradient-7 {
		height: 42px;
	/*	width: 100%; */
	/*	background: conic-gradient(from -83deg at 73.98% 126.47%,  #FFFBF3 0deg,  #CCC5BA 69.23077046871185deg, #7C6658 133.26923489570618deg,  #4B2C1D 185.19230604171753deg, #836F61 278.6538362503052deg,  #CCC5BA 360deg); */
		background-image: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-7/divider.png');
		background-size: 100%;
		background-repeat: repeat-y;
		margin-inline: calc(50% - 50vw);
  padding-inline: calc(50vw - 50%);
  
  background-size: cover;
		
	}
	
	
	
	.section-blurb 	.author .author-by {
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 0.08em;
		text-transform: uppercase;
	}
	
	

.section-blurb .author {
    font-size: 16px;
    
    
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 0.08em;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}


.section-blurb .author .name {
    color: #4B2C1D;


font-family: 'Roboto';
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 30px */
letter-spacing: 0.15px;
    
    margin-bottom: 20px;
}


.author.author7 {
	font-size: 14px;
	font-weight: 400;
}


.author.author7 .name {
	color: #4B2C1D;

/* Subtitle 1 */
font-family: Roboto;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 150%; /* 30px */
letter-spacing: 0.15px;
	
}
.section-blurb.section-blurb-pu6  .author .name {
	font-weight: 600;
	line-height: 1.2;
}


.section-blurb .author-image {
    max-width: 160px;
    width: 100%;
    margin: 10px;
    text-align: right;
}
    

.margin-80 {
    margin: 80px 0;
}

.padding-60 {
	padding-top: 60px;
	padding-bottom: 60px;
}
    
    .emphasis-text {
        font-weight: 400;
        font-size: 16px;
        
        padding: 30px 0;
        line-height: 1.8;
        
    }

.roboto24-emphasis-text {
	color: #4B2C1D;

/* H5 */
font-family: Roboto;
font-size: 24px;
font-style: italic;
font-weight: 300;
line-height: 150%; /* 36px */
text-transform: uppercase;
}

.roboto24-subheader {
	color: #4B2C1D;
font-family: Roboto;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 120%; /* 28.8px */
	margin-bottom: 16px;
}
    
    
    
    .first-letter::first-letter {
        color: #1E5073;

font-family: CelestePro, CelesteOT, Times, 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
font-size: 130px;
font-style: normal;
font-weight: 300;
line-height: 110px; /* 79.231% */
letter-spacing: 2.6px;
        float: left;
        margin: -2px -2px 0 0;
        
    }
    
    
    
    



    /**  //  Quotes section //  **/

    #quote-container {
        padding: 4em 0;
        background-color: #ffffff;
    }


.quote-text-container {
	padding-left: 40px;
	padding-bottom: 60px;
}

    .quote-text-container .quote-name {
        font-size: 16px;
        font-weight: 600;
		margin-bottom: 10px;
        
    }


    .quote-text-container .quote-title {
        font-size: 14px;
		font-weight: 400;
    }



    .quote-text {
        font-family: CelestePro, CelesteOT, Times, serif;
        font-weight: 400;
        border-left: 6px solid #2B9AB3;
        font-size: 32px;
        padding-left: 36px;
        font-style: italic;
        color: #4B2C1D;
        letter-spacing: 0.48px;
        line-height: 1.16;
        margin-top: 60px;
        margin-bottom: 36px;
    }

.quote-text-large {
    font-size:  48px;
}

.quote-text-small {
    font-size:  32px;
}

.quote-text.red {
    border-left: 6px solid #C45C54;
}

    .quote-image-container {
        padding-left: 50px;
        padding-right: 0;
    }

    .quote-image-container img {
        border-radius: 50%;
    }
    
     @media only screen and (max-width: 767px) {
		 
		

		 
		 .footer-previous-article-text {
			 font-size: 0;
		 }
      

.footer-previous-article-text img,
.footer-next-article-text img {
width: 34px;

}


    }


    @media only screen and (max-width: 576px) {

        .quote-image-container {
            padding-left: 15px;
        }




    }

.rounded-image {
    border-radius: 30px;
}
 
    
    
    
  

.author-footer {
    margin: 80px 0;
    text-transform: uppercase;
	font-weight: 500;
	font-size: 16px;
	
	letter-spacing: 0.08em;
}


.large-punctiation  {
		color: var(--accentcolor);
		font-size: 80px;
		line-height: .8;
	}
	
	.row .author-acq .author {
		font-weight: 500;
	}
	
	 .author-acq .name.article-color {
		color: var(--accentcolor);
	}
	
	 .author-acq .name {
		font-size: 20px;
	}
	
	 .author-acq.first {
		border-right: 1px solid #474c50;
	}
    

 /********** start -- Hero header styling ***********/
 
 /***  vol 3  ***/
 
 .unbound-vol-3 .hero-overlay-logo {
     background: rgba(0,0,0, .80);
     height: 50px;
     min-width: 100%;
     width: 100%;
     text-align: center;
     position: absolute;
     top: 0;
     padding: 10px 0;
     z-index: 9;
 }

.unbound-vol-3 .hero-overlay-logo  img {
     height: 30px;
     width: 151px;
     margin: 0 auto;
 }

 .unbound-vol-3   .section-hero {
    background: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-3/articles/background-article-desktop.jpg'),   linear-gradient(to bottom, #121b1f 600px, #704578 600px 720px, #ffffff 720px );
    background-repeat: no-repeat;
    background-position: top center, center center;
    background-size: 100% 600px, cover;
    position: relative;
    z-index: 1;
    overflow: hidden !important;
    margin-bottom: 60px;
        height: 900px;
}

 .unbound-vol-3   .hero-row-text {
        height: 270px;
        text-align: center;
    }
    
 .unbound-vol-3   .hero-text-col {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-content: center;
    }
  .unbound-vol-3  .hero-row-image {
        height: 630px;
        text-align: center;
        padding: 10px 80px;
    }
    
  .unbound-vol-3  .hero-row-image img {
        max-height: 600px;
        height: auto;
        width: auto;
        text-align: center;
        object-fit: contain;
    }


.unbound-vol-3 .lockup {
    margin-bottom: 30px;
    color: #ffffff;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1.28px;
}

 .unbound-vol-3   .lockup  img{
        height: 22px;
    }



.unbound-vol-3 .readTime {
    margin-top: 30px;
    color: #ffffff;
    font-family: 'Open Sans',  'Open Sans Medium';
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0.02em;
}


.unbound-vol-3 .text-right {
text-align: right;
}




  .unbound-vol-3  .hero {
        padding: 0 0 3em 1.5em;
        width: auto;
        margin-left: 0;

        display: flex;
        max-width: 1200px;
        height: 700px;
        position: relative;
        align-items: flex-end;
    }
    
    /**  end vol 3  **/






 .hero-overlay-logo {
     background: rgba(0,0,0, .80);
     height: 50px;
     min-width: 100%;
     width: 100%;
     text-align: center;
     position: absolute;
     top: 0;
     padding: 10px 0;
     z-index: 9;
 }

 .hero-overlay-logo  img {
     height: 30px;
     width: 151px;
     margin: 0 auto;
 }

.section-hero {
    position: relative;
}



section.section-hero {
	background-color: #ffffff;
	color: var(--fontcolor);
	padding-bottom: 0;
}
	
section.section-hero	.hero__content {
    padding-left: 4%;
    padding-right: 16%;
	}
	
	section.section-hero .lockup {
		color: #4B2C1D;
		border-bottom: 1px solid #4B2C1D;
	}
	
	
	
	section.section-hero h1 {
		color: #4B2C1D;
	
		font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
  font-optical-sizing: auto;
  
font-size: 48px;
font-style: normal;
font-weight: 300;
line-height: 120%; /* 57.6px */
text-transform: uppercase;
		
	}
 
section.section-hero .hero__content.section--font-white  h1,
section.section-hero .hero__content.section--font-white .lockup,
.hero__content.section--font-white .readTime,
.hero__content.section--font-white .puTag {
	color: #ffffff;
	border-color: #ffffff;
}

.lockup {
    margin-bottom: 32px;
    margin-top: 80px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 16px;
    letter-spacing: 1.28px;
	color: #4B2C1D;
		border-bottom: 1px solid #4B2C1D;
}

    .lockup  img{
        height: 22px;
    }



.readTime {
    margin-top: 24px;
    margin-bottom: 80px;
	text-transform: uppercase;
	font-size: 14px;
		font-weight: 500;
		letter-spacing: 1.12px;
}



.hero {
    min-height: 600px;
    
    overflow: hidden;
    position: relative;
    z-index: 3;
}

    .section-hero  h1 {
        color: #4B2C1D;
	
		font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
  font-optical-sizing: auto;
  
font-size: 48px;
font-style: normal;
font-weight: 300;
line-height: 120%; /* 57.6px */
text-transform: uppercase;
    }

.hero__content {
    padding-left: 4%;
    padding-right: 16%;
    z-index: 9;
	
    
}


    .hero__letter {
        position: absolute;
        z-index: 2;
        width: 641px;
        height: 680px;
        left: -50px;
        top: 0;
    }

    .hero__eyebrow {
        font-family: "Roboto", 'Open Sans', 'Open Sans Medium', Amplitude, sans-serif;
        font-size: 1em;
        border: none;
        margin-bottom: .5em;
        padding: 0.25em 0.65em;
        text-transform: uppercase;
        cursor: pointer;
    }

.hero-archive-container .hero-text-link a {
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 2.25px;
	text-transform: uppercase;
}

.breadcrumbs {
    padding-left: 4%;
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 400;
	color: var(--fontcolor);
		
}

.breadcrumbs a {
   
    
    font-size: 14px;
    
    margin-right: 20px;
	
	
	color: var(--fontcolor);
		font-weight: 600;
		text-decoration: none;
    
}

.breadcrumbs a:hover {
    text-decoration: underline;
}

.breadcrumbs a::after {
    content: "\f054";
    font-family: "Font Awesome 6 Pro";
    color: var(--fontcolor);
    font-weight: 400;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 14px;
    font-size: 8px;
    width: 2rem;
    margin-right: -2.5rem;
    margin-left: 0.5rem;
}

 .section-hero-right {

      

        background:url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-4/magazine/articles/5/article5-banner.jpg');
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        min-height: 660px;
     height: 100%;
        
        position: relative;

        overflow: hidden !important;
    }


    @media only screen and (max-width:991px) {
		
		
		.col.d-flex.justify-content-center.flex-column .text-center.small {
			display: none;
			
		}
		
		.related-content .related-text {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 20px;
			margin-bottom: 40px;
}
		
		
		.margin-80 {
    margin: 30px 0;
}
		
    
    /** vol 3  **/
    
     .unbound-vol-3    .hero {
            margin-right: 0;
            margin-left: 0;

            /*margin-left: calc(50vw - 375px);*/

        }
        
   .unbound-vol-3     .section-hero {
    background: url('/content/dam/jpm/cib/complex/content/treasury-services/payments-unbound/volume-3/articles/background-article-desktop.jpg'),   linear-gradient(to bottom, #121b1f 420px, #704578 420px 540px, #ffffff 540px );
    background-repeat: no-repeat;
    background-position: top center, center center;
    background-size: 100% 420px, cover;
    position: relative;
    z-index: 1;
    overflow: hidden !important;
    margin-bottom: 60px;
        height: 760px;
}
        
     .unbound-vol-3   .hero-row-image {
        height: auto;
        text-align: center;
        padding: 20px;
    }
        
   .unbound-vol-3     .sticky-image {
        opacity: 1;
            filter: brightness(100%);
    }
        
    .unbound-vol-3    .sticky-sidebar-spacer {
            display: none;
        }


/**  end vol 3 **/
    
    .hero {
    min-height: unset;
    }
    
     .section-hero-right {

        min-height: 440px;
        
        }
        
        .author-footer {
    margin: 40px 0;
        }

        
        .hero {
            margin-right: 0;
            margin-left: 0;

            /*margin-left: calc(50vw - 375px);*/

        }
        
        .quote-text {
        
        font-size: 32px;
        }
        
        section.section {
    padding: 40px 20px;
}
        
        .section-hero  h1 {
        
        font-size: 44px;
        }
        
   .hero__content {
    
    padding:50px 25px;
}
        
        .sticky-image {
        opacity: 1;
            filter: brightness(100%);
    }
        
        .sticky-sidebar-spacer {
            display: none;
        }  
    
    
    }

@media only screen and (max-width:575px) {
       
        
        .section-hero  h1 {
        
        font-size: 32px;
        }
        
   .hero__content {
    
    padding:50px 25px;
}
    
}

.greenX {
		color: #22AF8B;
	}