﻿@media (min-width: 800px) {
	.desktop-800 { display: block; }
	.mobile-800 { display: none !important; }
}

@media (max-width: 800px) {
	.desktop-800 { position: absolute; visibility: hidden; opacity: 0; }
	.mobile-800 { display: block; }
}



@media (max-width:1366px) {
	
	.repositioning-section .inner-off-right:after	{z-index: -1}
	
	/* putting-tech-risk-in-check */
	.putting-tech-risk-in-check	{overflow: hidden}
	.risk-text-two-columns-flush-right .blockquote-container	{width: calc(100% + 40px);}
}

@media (max-width:1270px) {
	
	
	/* HERO HEADER */
	.logo					{left: 40px; margin-left: 0}
	.risk-header-right		{margin-right: 0; right: 40px;}
	.blockquote-container	{padding-right: 45px;}
	
	/* two-col-vertical-carousel */
	.two-col-vertical-carousel .col-vertical-carousel	{width: 50%;}
	
}

@media (max-width:1250px) {
	
	/* overall-riskonomy-rating */
	.col-4-graphs {width: 50%;}
	
	/* boxes */
	.boxes	{justify-content: flex-start; gap: 10px;}
	
	/* Testimonial carousel */
	.testimonial-container .slick-prev	{left: -40px}
	.testimonial-container .slick-next	{right: -40px}
	
	/* ov-two-col */
	.ov-two-col .cols	{gap:40px;}
	.ov-two-col .col	{width: calc(50% - 20px);}
	.ov-two-col .col:nth-child(1) div:not(.apexcharts-tooltip) { width: 100% !important }
	
	/* .supply-network-riskonomy-radar */
	.supply-network-riskonomy-radar .cols	{gap: 40px;}
	/*.supply-network-riskonomy-radar .cols .col:nth-child(1) { width: 50%; flex-shrink: 0 }*/
	.supply-network-riskonomy-radar .cols .col:nth-child(1) div:not(.apexcharts-tooltip) { width: 100% !important }

}

@media (max-width: 1200px) {
	
	/* everything-to-play-for */
	.everything-to-play-for .col:last-child		{width: 60%; flex-shrink: 0}

	.everything-to-play-for .col:last-child div:not(.apexcharts-tooltip):not(.apexcharts-yaxistooltip) { width: 100% !important; }
	
}

@media (max-width: 1100px) {
	
	.line-text p {font-size: 20px;}
	
	/* rrr-three-cols */	
	.stat-box				{padding: 40px; width: 300px;}
	.stat-box p				{font-size: 18px;}
	.stat-box p.number		{font-size: 95px;}
	.stat-box p.number span	{font-size: 71px;}
	
	/* two-squares-with-text */
	.two-squares-with-text .cols	{gap: 25px;}
	
	/* hover-boxes-section */
	.hover-box-up h2				{font-size: 42px;}
	.hover-box-text p				{font-size: 18px;}
	.hover-box:hover .hover-box-up 	{height: 80%;}
	
	/* BOXES */
	.boxes .box					{width: 114px; height: 114px;}
	.boxes .box p				{font-size: 14px;}
	.boxes .box p.number		{font-size: 30px;}
	.boxes .box p.number span	{font-size:20px;}
	
	/* .the-tech-gambit .cols */
	.the-tech-gambit .cols { gap: 40px; }
	.the-tech-gambit .cols .col { width: 100%; }
	.the-tech-gambit .cols .col div:not(.radialbar-tooltip):not(.line) { width: 100% !important }
	
	/* putting-tech-risk-in-check */
	.putting-tech-risk-in-check .cols		{gap:60px;}
	.putting-tech-risk-in-check .col		{width: calc(50% - 30px);}
	.putting-tech-risk-in-check .col-flush	{width: calc(50% - 30px); margin-right: 0;}
	
	/* three-graphs-section */	
	.three-graphs-section .cols {gap: 20px;}
	
	/* full-half-image-section */
	.full-half-image-section .col	{width: 50%; padding-right: 30px;}
	.full-half-image				{width: 50%;}
	
	/* .the-digital-defence */
	.the-digital-defence .cols	{gap: 40px;}
	.the-digital-defence .col	{width: calc(50% - 20px);}
	
}

@media (max-width: 960px) {
	
	.inner	{padding-left: 30px; padding-right: 30px;}
	
	.logo					{left: 30px;}
	.risk-header-right		{right: 30px;}
	
	/**********************************/
	/******* FONT SIZES IPAD **********/
	/**********************************/
	
	h2,
	.slide-text-box h1,
	.risk-text-two-columns-flush-right h2	{font-size: 46px;}
	
	.full-width-flush .col-flush h3	{font-size: 40px;}
	
	a.nc-text h3	{font-size: 24px;}
	
	.tgs-text h4,
	.blockquote-container p	{font-size: 22px;}
	
	p.medium	{font-size: 21px !important}
	
	.line-text p,
	.testimonial-section p,
	.full-width-flush .cf-text p	{font-size: 20px;}
	
	p,
	.hl-insight .line-text p,
	.blockquote-container cite,
	.three-stats-left-flush .line-text p	{font-size: 18px;}
	
	.testimonial-section cite	{font-size: 14px;}
	
	/* risk-text-two-columns-flush-right */
	.blockquote-container:before	{width: 80px; height: 82px;}
	.risk-text-two-columns-flush-right .blockquote-container	{width: calc(100% + 30px);}

	/* full-width-flush */
	.full-width-flush .col-flush	{width: 50%;}
	
	/* two-squares-with-text */
	.two-squares-with-text .cols	{flex-direction: column-reverse}
	
	/* text-image-contained text-image-contained-v2 */
	.text-image-contained.text-image-contained-v2 .cols	{gap: 40px;}
	
	/* hover-boxes-section */
	.hover-boxes-section .cols	{flex-wrap: wrap}
	.hover-boxes-section .col	{width: calc(50% - 13px);}
	
	/* testimonials */
	.testimonial-container				{padding: 0 30px;}
	.testimonial-container .slick-arrow	{width: 28px; height: 28px; background-size: cover}
	
	/* two-col-vertical-carousel */
	.vertical-carousel-container .slick-dots,
	.vertical-two-col-carousel-container .slick-dots	{left: -40px; top:-30px;}
	.vertical-carousel h3,
	.vertical-carousel p		{font-size: 21px;}
	.vertical-carousel-inner	{padding: 30px 20px;}

	/* vertical-two-col-carousel */
	.vertical-two-col-carousel-container .slick-dots 		{left: -21px; top: 0px;}

	/* the-digital-defence */
	.the-digital-defence .cols	{flex-direction: column}
	.the-digital-defence .col	{width: 100%;}
	
	/* putting-tech-risk-in-check */
	.full-width-flush.spotlight .cf-text	{padding-left: 10px}
	
	.full-width-intro h3	{font-size: 30px;}
}


@media (max-width: 870px) {
	
	/* BOXES */
	.boxes .box					{width: 94px; height: 94px;}
	.boxes .box p				{font-size: 12px;}

	.radialbar-tooltip p.value { font-size: 20px!important; }
	.radialbar-tooltip p.label { font-size: 11px!important; }
}

@media (max-width: 820px) {
	.tech-risk-chart .bar-graph .content { flex-direction: column; }
	.tech-risk-chart .bar-graph .bar-text { font-size: 20px; min-height: 120px }
}

/* MAIN ONE COL STARTS HERE */

@media (max-width: 800px) {
	
	.npt	{padding-top: 0 !important}
	.npb	{padding-bottom: 0 !important}
	
	.mb-mt	{margin-top: 40px;}
	
	.risk-text-two-columns-flush-right .mt-50	{margin-top: 0 !important}
	.risk-text-two-columns-flush-right .cols	{gap:0}
	
	.image-hide	{display: none}
	
	/* FLEX DIRECTION COLUMN */
	.full-width-flush .cols,
	.text-image-contained .cols,
	.risk-text-two-columns-flush-right .cols				{flex-direction: column}
	
	.text-image-contained .col	{width: 100%;}
	
	.risk-text-two-columns-flush-right .col,
	.risk-text-two-columns-flush-right .col:first-child		{width: 100%;}
	
	.risk-text-two-columns-flush-right .blockquote-container	{width: calc(100% + 60px); margin-left: -30px; margin-top: 0; padding-left: 30px; padding-right: 30px;}

	/* rrr-three-cols */	
	.rrr-three-cols .cols	{flex-direction: column; gap:25px;}
	
	/* text-image-contained */
	.text-image-contained .cols				{gap:40px}	
	.text-image-contained .graph-container	{width: 100%;}
	
	/* full-width-flush */
	.full-width-flush .cols		{gap: 20px;}
	.full-width-flush .inner	{padding: 0 30px;}
	.col.col-flush				{margin-left: -30px; width: calc(100% + 60px);}
	.full-width-flush .col-text	{padding: 40px 0 0}
	.full-width-flush .col-flush	{padding: 30px;}
	
	/* two-squares-with-text */
	.col.col-two-squares .square	{width: 50%;}
	.square-stat					{padding: 30px;}
	
	.two-squares-with-text .square				{min-height: auto !important}
	.two-squares-with-text .technology-risk-cl	{height: 100% !important}
	
	/* text-image-contained text-image-contained-v2 */
	.text-image-contained.text-image-contained-v2 .cols	{flex-direction: column-reverse;}
	
	/* overall-riskonomy-rating */
	.col-4-graphs					{width: 100%;}
	/*.col-4-graphs div:not(.graph-options) { height: 400px !important }*/
	.overall-riskonomy-rating .cols	{flex-direction: column; margin-bottom: 25px;}
	
	/* the-tech-gambit */
	.the-tech-gambit .cols	{flex-direction: column}
	/*.the-tech-gambit .cols .col:first-child div:not(.radialbar-tooltip)	{height: 400px !important;} */
	
	/* everything-to-play-for */
	.everything-to-play-for .cols				{flex-direction: column}
	.everything-to-play-for .col.border-right	{border-right: none; border-bottom: 1px solid #B1A6FF; margin-right: 0; padding-right: 0; padding-bottom: 20px; margin-bottom: 40px;}
	.everything-to-play-for .col:last-child		{width:100%; /*height: 400px;*/}
	
	/* putting-tech-risk-in-check */
	.putting-tech-risk-in-check	.cols			{flex-direction: column; gap: 30px;}
	.putting-tech-risk-in-check .col			{width: 100%;}
	.putting-tech-risk-in-check .col.col-flush	{margin: auto; width: 100%;}
	
	/* full-width-flush.spotlight */
	.full-width-flush.spotlight .cols		{flex-direction: column-reverse; gap: 0}
	.full-width-flush.spotlight .col-flush	{width: calc(100% + 60px); margin-left: -30px; min-height: 375px;}
	.full-width-flush.flipped .inner		{padding: 0 30px}
	
	/* three-graphs-section */
	.three-graphs-section .cols	{flex-direction: column}
	.three-graphs-section .col	{width: 100%;}
	
	/* three-stats-left-flush */
	.three-stats-left-flush .cols	{flex-direction: column; gap:20px;}
	
	/* ov-two-col */
	.ov-two-col			{/*overflow: hidden*/}
	.ov-two-col .cols	{flex-direction: column}
	.ov-two-col .col	{width: 100%;}
	
	/* stat-bars-section */
	.stat-bars-section .row		{margin-left: 0 !important}
	.bar-graph .bar-text		{width: 170px;}
	.bar-graph .bar-text-2 p	{font-size: 16px;}
	
	/* repositioning-section */
	.repositioning-section .cols					{flex-direction: column; gap: 20px;}
	.repositioning-section .col						{width: 100%;}
	.repositioning-section .inner-off-right:after	{display: none}
	.rs-col-inner									{padding: 30px; width: calc(100% + 60px); margin-left: -30px}
	
	/* full-half-image-section */
	.full-half-image				{position: relative; width: 100%; height: 100vw;}
	.full-half-image-section .col	{width: 100%; padding-right: 0; padding-bottom: 30px;}
	
	/* two-col-vertical-carousel */
	.two-col-vertical-carousel .cols					{flex-direction: column-reverse}
	.two-col-vertical-carousel .col-vertical-carousel	{width: 100%;}
	.two-col-vertical-carousel .col { width: 100%; }

	/* supply-network-riskonomy-radar */
	.supply-network-riskonomy-radar .cols { flex-direction: column }
	.supply-network-riskonomy-radar .cols .col { width: auto; }
	
	/* two-col-border */
	.two-col-border	.cols				{flex-direction: column}
	.two-col-border .col:first-child	{width: 100%; padding-right: 0}
	.two-col-border .col:last-child		{width: 100%; padding-left: 0; border-left: none; border-top: 1px solid #B1A6FF; margin-top: 20px; padding-top: 20px;}

	.cols.no-align-centre	{align-items: flex-start !important}

	/*.switchable-graphs .grid { flex-direction: column; }*/
	.switchable-graphs p { margin-bottom: 0; }


	.switchable-graphs h3.title { font-size: 24px; }
	.experts-graphs.switchable-graphs .graph p { font-size: 14px; line-height: 1.2 }


	.three-graphs-section .tgs-text h4 { font-size: 18px; }
	.three-graphs-section .tgs-text p { font-size: 14px; line-height: 1.2em;}

	/* The page navigation buttons overlay the graph selector - so push the graph selector down a bit. */
		.three-graphs-section .switchable-graphs .navigation .options { padding-top: 50px; }
}

@media (max-width: 700px) {
	
	/* stat-bars-section */
	.bar-graph				{flex-wrap: wrap}
	.bar-graph .bar-text-2	{flex: auto; max-width: 100%;}
	.bar-graph .bar-text	{flex: 1}
	.stat-bars-section		{padding-bottom: 30px;}
	
	/* vertical-two-col-carousel */
	.vertical-two-col-carousel .col		{width: 100%;}
	.vertical-two-col-carousel-inner h3	{font-size: 24px;}
	
	/* hl-insight */
	.hl-insight						{flex-direction: column; padding-left: 25px;}
	.hl-insight .line-text .line	{display: none}
	.hl-insight .line-text			{padding: 0; padding-bottom: 0px; margin-bottom: 0px;}
	.hl-insight						{border-left: 10px solid #82C8BE; padding-top: 0; margin-bottom: 25px}
	.hl-insight-row					{margin-bottom: 35px;}
	.hli-left						{margin-bottom: 30px;}
	.hli-left.left-in				{transform: translateX(0) !important}
	.hl-insight-row:last-child		{margin-bottom: 0}
}

@media (max-width: 650px) {
	/* Override values assigned by ApexCharts to make the chart shorter */

	.experts-graphs.switchable-graphs .graph .graph1,
	.experts-graphs.switchable-graphs .graph .graph2,
	.experts-graphs.switchable-graphs .graph .graph3,
	.experts-graphs.switchable-graphs .graph .graph4 { min-height: initial !important; }

	.experts-graphs.switchable-graphs .graph svg,
	.experts-graphs.switchable-graphs .graph .apexcharts-canvas { height: 60px !important; }

	.experts-graphs.switchable-graphs .graph .apexcharts-inner { transform: translate(10px, 15px) !important; }
}

@media (max-width: 640px) {
	
	p.medium br 	{display: none}
	
	/* hover-boxes-section */
	.hover-boxes-section .col				{width: 100%;}
	.hover-boxes-section .col .hover-box	{min-height: calc(100vw - 80px);}
	.hover-box-up h2						{font-size: 41px;}
	
	/* staggered-boxes */
	.inline-box 	{flex-direction: column; background-color: transparent;}
	.inline-box .box-text	{background-color: #EEFDCA}

	.offset-bar-graph.tech-risk-chart .bar-graph,
	.offset-bar-graph.gartner-gmm-chart .bar-graph { margin-left: 0 !important; }

	.offset-bar-graph.gartner-gmm-chart .bar-graph .content { flex-wrap:wrap; }
	.offset-bar-graph.gartner-gmm-chart .bar-graph .bar-text { flex: 0; }
	.offset-bar-graph.gartner-gmm-chart .bar-graph .bar-text-2 { padding: 10px 0 0 0; }

	.offset-bar-graph { gap: 25px; }

	.switchable-graphs .grid { gap: 0 10px; grid-template-columns: 1fr; }

}

@media (max-width: 610px) {

	/* CHAPTER SELECTION */
	section.chapters .cols	{width: calc(100% + 30px); margin-left: -15px;}
	section.chapters .col	{width: 50%;}
	.chapter-card			{width: 100%; height: 42.7vw;}

	/* NAV */
	nav:not(.footer-nav) { width: 100%; padding-left: 30px; padding-right: 30px; overflow-y: auto; background: rgb(151,254,93); background: linear-gradient(170deg, rgba(151,254,93,1) 0%, rgba(193,253,7,1) 100%); }
	nav:not(.footer-nav) ul li { font-size: 20px; }
	nav:not(.footer-nav):after { display: none }
	
	/* two-squares-with-text */
	.col.col-two-squares			{flex-direction: column}
	.col.col-two-squares .square	{width: 100%;}
}

@media (max-width: 510px) {
	footer nav.footer-nav ul li { padding: 0 5px; }
	footer nav.footer-nav ul li a { font-size: 12px; }
}

@media (max-width: 500px) {

	
	/**********************************/
	/******* FONT SIZES PHONE **********/
	/**********************************/

	
	h2,
	.full-width-flush .col-flush h3,
	.risk-text-two-columns-flush-right h2	{font-size: 36px;}
	
	.line-text p,
	.inline-box .box p	{font-size: 18px;}
	
	.slide-text-box h1	{font-size: 24px; line-height: 1.1em;}
	
	p,
	.hover-box-text p,
	.testimonial-section p,
	.inline-box .box-text p,
	.hl-insight .line-text p	{font-size: 16px;}
	
	.full-width-flush .cf-text p	{font-size: 15px;}
	
	.testimonial-section h2,
	.slide-text-box p	{font-size: 14px;}
	
	.heading {align-items: flex-start}
	
	/**********************************/
	/******* PADDING REDUCE **********/
	/**********************************/
	
	section.chapters	{padding-bottom: 50px;}
	
	/* HEADER */
	.logo			{width: 64px; height: 64px; top: 20px;}
	.home-icon svg	{width: 30px; height: auto}
	
	/* HERO */
	.risk-header-right				{gap: 20px; top: 53vw}
	.risk-header-right.fixed		{top: 33px}
	.riskonomy-hero-container		{height: auto;}
	.riskonomy-hero .slide-text-box	{width: 270px; height: 270px; min-height: unset; margin-left: -30px; margin-top: 150px;}
	.slide-image					{height: 50vw; min-height: 185px;}
	.risk-hamburger					{width: 30px; height: 22px;}
	
	.risk-hamburger span:nth-child(2) {top: 10px;}
	
	.next-prev-arrow			{z-index: 20; top:102px;}
	.next-prev-arrow .chevron	{width: 25px; height: 32px;}
	.next-prev-arrow svg		{width: 7px; height: auto}
	.next-prev-arrow span		{font-size: 12px;}
	
	.person					{width: 210px; height: 210px;}
	.person-text p			{font-size: 12px;}
	.person-text p strong	{font-size: 14px;}
	
	/* CHAPTER SELECTION */
	section.chapters .col	{width: 100%;}
	section.chapters .cols	{margin-top: 30px;}
	.chapter-card			{width: 100%; height: 85vw;}
	
	/* NEXT CHAPTER */
	a.nc-text p		{font-size: 14px;}
	a.nc-text h3	{font-size: 24px;}
	
	.next-chapter-section	{height: 195px; padding: 25px 0}
	a.nc-text p.arrow-text-btn	{font-size: 15px;}
	a.nc-text p svg {margin-left: 10px; width: 30px;}
	
	a.nc-text h3	{width: 200px; max-width: 100%;}
	
	.next-chapter-section-page-6 a.nc-text h3	{width: 180px;}
	
	/* full-width-flush */
	.full-width-flush .cf-text	{padding-left: 0; padding-right: 0}
	
	
	/* hover-boxes */
	.hover-box:hover .hover-box-up 	{height: 100%; transform: scale(0.3);}
	
	.hover-box-text .line-text	{padding-left: 20px;}
	
	/* staggered-boxes */
	.inline-box .box	{width: 115px; min-height: 115px; padding-top: 0; padding-bottom: 0}
	.inline-box .box-text	{padding-left: 20px; padding-right: 20px;}

	/* Testimonials */
	.testimonial-container .inner		{padding-left: 20px; padding-right: 20px;}
	.testimonial-container .slick-prev	{left: -35px;}
	.testimonial-container .slick-next	{right: -35px;}
	.quotemark-lines					{margin-bottom: 18px;}
	.quotemark-lines:before				{width: 14px; height: 26px;background-size: 20px auto;}
	
	/* two-col-border */
	.two-col-border p.big-number		{font-size: 94px;}
	.two-col-border p.big-number span	{font-size: 71px;}
	
	/* hl-insight */
	.hli-left		{margin-bottom: 20px;}
	.hli-left h3	{font-size: 20px}
	.hli-left h4	{font-size: 44px;}
	
	.full-width-intro h3	{font-size: 28px; line-height: 1.15em; margin-bottom: 1.5em !important}
	
	.key-contacts-v3 .key-contact	{height: 280px !important;}
	
	/*******************************/
	/** MOBILE NEXT CHAPTER IMAGES */
	
	.next-chapter-section-page-1 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-executive-summary-mb.jpg) !important}
	.next-chapter-section-page-2 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-riskonomy-radar-mb.jpg) !important}
	.next-chapter-section-page-3 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-section-1-mb.jpg) !important}
	.next-chapter-section-page-4 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-organisational-vulnerabilities-mb.jpg) !important}
	.next-chapter-section-page-5 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-risk-openings-mb.jpg) !important}
	.next-chapter-section-page-6 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-macro-risk-mb.jpg) !important}
	.next-chapter-section-page-7 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-conclusions-mb.jpg) !important}
	.next-chapter-section-page-8 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-about-mb.jpg) !important}

	/*******************************/
	/*******************************/

	.digital-defence-graphs .graph .radialbar-tooltip { max-width: 120px; }
}

@media (max-width: 480px) {
	.graph-options { grid-template-columns: repeat(2, 1fr) !important; }
	.graph-options .graph-option { height: auto!important; }
}

@media (max-width: 440px) {
	
	.three-in-four		{padding: 0 !important; height: auto !important; justify-content: space-between}
	.three-in-four img	{height: auto !important; width: calc(25% - 15px);}

}
	
@media (max-width: 390px) {
	
	.risk-header-right	{gap:10px; top: 210px;}
	.riskonomy-hero .slide-text-box		{padding-top: 22px; padding-right: 22px; width: 210px; height: 210px;}
}

@media (max-width: 375px) {
	
	/* rrr-three-cols */	
	.stat-box	{width: 100%; min-height: 84vw}
	
}

@media (max-width: 360px) {
	
	.hover-box-text p	{font-size: 14px;}
}

@media (max-width: 350px) {
	footer nav.footer-nav ul li a { font-size: 10px; }
}

@media (max-width: 320px) {

	.slide-text-box h1	{font-size: 22px;}
	.slide-text-box p 	{font-size: 12px;}
	.risk-header-right	{right: 10px}
	.riskonomy-hero .slide-text-box	{width: 190px; height: 190px;}
}


/** HEIGHT RESPONSIVE **/

@media (max-height: 730px) {

	nav:not(.footer-nav) { overflow: auto; background: rgb(151,254,93); background: linear-gradient(170deg, rgba(151,254,93,1) 0%, rgba(193,253,7,1) 100%); }
	nav:not(.footer-nav) ul li { font-size: 20px; }
	nav:not(.footer-nav):after { display: none }

}


@media (min-width: 2050px) {

	.next-chapter-section-page-5 .nc-image	{background-image: url(/_uploads/riskonomy/next-chapter-risk-openings-wide.jpg) !important; background-position: bottom right}
	
}








