:root {
	
	--bodyCopy: #000000;
	--darkBrown: #646258;
	--lightBrown: #B88B6E;
	
}

/* COMMENT BACK IN BEFORE LIVE 
.pc__disclaimer,
.o-cookie-message--active	{display: none !important}
*/

body:not(.js-focus-visible) :focus, html:not(.js-focus-visible) :focus {
    outline:none;
}

/** FT CSS OVERRIDES **/
.disclaimer__sponsor				{font-weight:bold !important;}
.disclaimer .o-tooltip-content p	{font-size:16px !important;}
.o-tooltip--arrow-left.o-tooltip-arrow--align-top:after, .o-tooltip--arrow-left.o-tooltip-arrow--align-top:before	{top:50% !important;}
.o-header__drawer, .o-header    	{position: relative; z-index: 10;}
.o-footer							{margin-top:0 !important; position: relative; z-index: 5;}
.o-tooltip							{z-index:50 !important;}
.disclaimer__sponsor				{color:#333333 !important; font-weight: 600 !important;}
.safari-fix			{position: absolute; background-color: #ffffff; left: 0; top: -350px; width: 100%; height: 350px; z-index: 0;}
.o-cookie-message__heading h1 {color: #000;}

.pc__client-title a    {color: #939598;}

/* 2020 OVERRIDES */
.pc 			{padding-top: 11px; padding-bottom: 10px; z-index: 30}
.o-footer *,
.pc__share-content,
.pc__client .pc__client-title,
.pc__title-content 		{font-family: MetricWeb, sans-serif !important;}
.pc__disclaimer-content {font-family: MetricWeb, sans-serif !important; font-size: 16px; line-height: 1.5em; color: #333333;}

[class*=col-]:not(.slick-slide) 	{float:none !important}

.o-header__drawer * {font-family: MetricWeb,sans-serif !important;}

#content .right {float: none; }

#form1 	{background-color:#ffffff;}
* 		{margin:0; padding:0; outline:none; border:none; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; }
body 	{background-color: #ffffff !important; height: auto !important; color: #333333; font-family: "stevie-sans", sans-serif;}
ul 		{margin:0;}

#tvn-content h1,
#tvn-content h2,
#tvn-content h3,
#tvn-content h4,
#tvn-content h5,
#tvn-content h6	    {font-family: "mencken-std-head-narrow", sans-serif; font-weight: 700; letter-spacing: 2px; margin-bottom: 0.5em; color: var(--darkBrown)}
#tvn-content p,
#tvn-content ul,
#tvn-content ol, 
#tvn-content cite {font-family: "Open Sans", sans-serif; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: var(--bodyCopy)}

a.cover {position: absolute; left: 0; top:0; width:100%; height: 100%; z-index: 6; display: none}

strong	{font-weight: 700}	

.inner 	{width:1330px; max-width: 100%; padding-left: 15px; padding-right: 15px; margin:0 auto;}

.relative			{position: relative;}
.overflow-hidden	{overflow: hidden;}

#tvn-content h2 {font-size: 46px; color: var(--darkBrown); letter-spacing: 0}

/* ARTICLE HERO */
.article-hero       {height: calc(100vh - 107px); width: 100%; position: relative; max-height: 800px; min-height: 768px; display: flex; align-items: flex-end;  padding-left: 100px; overflow: hidden}
.article-hero-image {width: 100%; height: 100%; background-size: auto 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-position: right top}

.article-hero-text                      {position: relative; z-index: 20; padding-bottom: 80px;}
#tvn-content .article-hero-text h1      {font-size: 95px; line-height: 101px; margin-bottom: 0.75em}
.article-hero-text h1 span              {background-color: #ffffff; display: inline-block; padding-left: 10px; padding-right: 10px;}
.article-hero-text h1 span:nth-child(3) {color:var(--lightBrown)}
.article-hero-text p                    {font-size: 28px; width: 456px; max-width: 100%; line-height: 1.5em}

.intro-text-container           {padding-left: 80px; position: relative;}
.intro-text-container .dots     {width: 500px; position: absolute; height: 100%; right: calc(100% - 70px); top: 10px;}
.top-shape                      {position: absolute; left: 0; top: 0;}

.dots   {background-image: url(/_uploads/_assets/dot.png); background-size: 31px 30px; background-position: right top;}

/* ARTICLE TEXT */
article		{padding: 70px 0 0}
.article-inner					{width: 760px; max-width: 100%; padding: 0 20px; margin: auto;}
#tvn-content .article-inner p	{font-size: 18px; line-height: 1.76em; margin-bottom: 2em}

/* STANDFIRST SECTION */
.standfirst-container	{background-color: var(--navy); padding: 80px 0 25px; position: relative; top: -1px; bottom: -1px;}
.standfirst-container p	{color: #ffffff !important}
.first-character 		{float: left; margin:0 15px -30px 0; display: inline-block; font-size: 114px; line-height: 100px; font-family: "mencken-std-head-narrow", sans-serif; color: var(--lightBrown)}

/* SECTION ONE */
.section-one    {position: relative;}
.chopsticks     {position: absolute; left: -150px; bottom: 0px; z-index: 6}

/* SECTION TWO */
.section-two    {position: relative; overflow: hidden;}
#lottie1        {width: 670px; margin-left: -140px; z-index: 5; position: relative;}
#lottie2        {position: absolute; bottom: 0; width: 960px; height: auto; right: 0; z-index: 4}

.convenience-store-text                 {position: absolute; right: 50%; top: 100px; margin-right: -450px;}
.convenience-store-text p               {font-size: 21px; font-weight: 700;}
.convenience-store-text p.serif         {font-family: "mencken-std-head-narrow", sans-serif !important; font-weight: 700; font-size: 54px; color: var(--darkBrown) !important}
.convenience-store-text p:nth-child(2)  {margin-left: 30px;}
.convenience-store-text p:nth-child(3)  {margin-left: 60px;}
.convenience-store-text p:nth-child(4)  {margin-left: 90px;}

.path   {background: rgb(255,255,255); background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(234,230,225,1) 100%); height: 80px; width: 100%; display: block; position: absolute; bottom: 0; left: 0; z-index: 3}

/* SECTION THREE */
.section-three  {padding: 70px 0 20px 0}

/* SECTION FOUR */
#lottie4    {width: 95px; height: auto; position: absolute; right: 50%; margin-right: -500px;}
#lottie5    {width: 135px; height: auto; position: absolute; right: 50%; margin-right: -600px; top: 200px;}

/* SECTION FIVE */
.section-five       {margin: 70px auto; height: 100vh; overflow: hidden; min-height: 800px; max-width: 1500px;}
.section-five img   {width: 125%; height: 125%; object-fit: cover; object-position: center;}

.blockquote-container       {position: relative; margin:130px 0 70px 0}
.blockquote-container .dots {position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 0; opacity: 0.5}
blockquote                  {background-color: #ffffff; width: 700px; max-width: 100%; margin: auto; position: relative; z-index: 1}
blockquote p                {width: 506px; max-width: calc(100% - 40px); margin: auto; font-family: "mencken-std-head-narrow", sans-serif !important; font-size: 36px; letter-spacing: 1px; line-height: 1.3em}
.quotemark                  {width: 64px; height: 54px; background-image: url(/_uploads/_assets/quotemark.svg); background-repeat: no-repeat; top: -65px; left: 95px; position: absolute; z-index: 10;}

/* SECTION SEVEN */
.section-seven      {padding-top: 50px;}
.graph-container    {width: 1210px; max-width: calc(100% - 40px); margin: 70px auto}

/* CTA CONTAINER */
.cta-container							{display: flex; justify-content: center; padding:100px 0; position: relative; display: flex; justify-content: center; align-items: center; margin-top: 70px;}
.btn-text-text							{overflow: hidden;  position: relative; z-index: 10; width: 440px; max-width: 100%; border-radius: 4px; transition: 0.75s cubic-bezier(0.5, 0, 0, 1); background-color: var(--darkBrown); text-transform: uppercase; text-decoration: none; display: inline-flex; padding:0 30px; height: 77px; flex-direction: column;}
.btn-text-text span						{color:#ffffff; font-family: "mencken-std-head-narrow", sans-serif; letter-spacing: 1px; font-size:43px; transition: 0.75s cubic-bezier(0.5, 0, 0, 1); height: 82px; width: 100%; text-align: center; justify-content: center; flex-shrink: 0; display: flex; align-items: center}
.btn-text-text:hover span:nth-child(1)	{transform: translateY(-100%);}
.btn-text-text:hover span:nth-child(2)	{transform: translateY(-100%); color:var(--navy)}
.btn-text-text:hover					{background-color: #ffffff; box-shadow: 0 0 5px rgba(0,0,0,0.2); border-color:#000000}

.cta-container .dots    {position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0.2}

.top-shape   {animation:shapein 1s ease-out forwards 0.5s; transform: scale(0); transform-origin: top left}

@keyframes shapein {
    
    to  {transform: scale(1);}
    
}

.article-hero-image {animation: imagefade 1.5s ease-out forwards 0.5s;  opacity: 0}

@keyframes imagefade {
    
    to  {opacity: 1;}
    
}

.article-hero-text h1 span               {animation:textin 1s ease-in-out 0.5s forwards; transform: translateY(-30px); opacity: 0}
.article-hero-text h1 span:nth-child(3)  {animation:textin 1s ease-in-out 0.7s forwards;}
.article-hero-text h1 span:nth-child(5)  {animation:textin 1s ease-in-out 0.9s forwards;}
.intro-text-inner                        {animation:textin 1s ease-in-out 1.1s forwards; transform: translateY(-30px); opacity: 0}


@keyframes textin {
    
    to  {opacity: 1; transform: translateY(0)}
    
}

/*
.home-icon			{position: absolute; font-size: 20px; text-transform: uppercase; border-bottom:1px solid #222222; color: #222222; font-family: mencken-std-head-narrow, sans-serif; font-weight: 700; top:160px; left: 50%; margin-left: -616px;}
.home-icon:hover	{opacity: 0.8}
.home-icon svg		{width: 24px; height: auto; fill:#333333;}

.related-articles					{padding: 35px 0 0 0}
#tvn-content .related-articles h3	{font-size: 48px; margin-bottom: 0.75em; color: #333333; font-weight: 400; display: block; text-align: center}

.listing-card						{position: relative; display: block}
.listing-card-image-container		{position: relative; padding-top: 50%; overflow: hidden;}
.listing-card-image-container:after	{height: 50%; content: ''; width: 100%; display: block; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); position: absolute; left: 0; bottom: 0; z-index: 4; mix-blend-mode: multiply}
.listing-card-image					{position: absolute; left: 0; top: 0; inset:0; background-position: center; background-size: cover; transition: 1s ease;}

.slick-track	{width: 100%;}

.listing-card:hover .listing-card-image	{transform: scale(1.1)}

.listing-card-text		{position: absolute; bottom: 20px; left: 20px; right:20px; z-index: 5; color:#ffffff}
.listing-card-text h2	{font-size: 25px; font-weight: 400; line-height: 1.3em; margin-bottom: 0.25em}
.listing-card-text p	{font-weight: 600}

.related-carousel			{display: flex}
.related-carousel .column	{width: 50%;}
*/



#pmLink     {visibility: hidden}