/* Cisco UI Color Palette */
:root {
	--color-primary: 		#00bceb;
	--color-secondary: 		#1e4471;
	--color-tertiary: 		#0d274d;
	--color-success: 		#6abf4b;
	--color-danger: 		#e2231a;
	--color-warning: 		#fbab18;
	--color-warning-alt: 	#eed202;
	--color-dark: 			#495057;
	--color-light: 			#ced4da;

	--color-white:          #ffffff; 
	--color-black:          #061326;
	--color-darkgray: 		#333333;

	--color-text-inactive: 	#788184;
	--color-text-active: 	#414344;
	--color-text-onhover: 	#0051af;
	
	--color-gray-100: 		#f8f8f8;
	--color-gray-200: 		#f2f2f2;
	--color-gray-300: 		#dee2e6;
	--color-gray-400: 		#ced4da;
	--color-gray-500: 		#adb5bd;
	--color-gray-600: 		#6c757d;
	--color-gray-700: 		#495057;
	--color-gray-800: 		#343a40;
	--color-gray-900: 		#212529;

	--status-color-success:    	var(--color-success);
	--status-color-info:    	#64bbe3;
	--status-color-warning:    	var(--color-warning);
	--status-color-warning-alt:	var(--color-warning-alt);

	--misc-color-link: 			#0175a2;
  }

/* reset everything to the default box model */
body {
	color: #58585b;
    font-family: CiscoSans,Arial,sans-serif;
    font-style: normal;
    font-size: 1.6rem;
    line-height: 1.375em;
    font-weight: 300;
    min-width: 320px;
    position: relative;
	font-family:CiscoSans, Helvetica, Arial, sans-serif;
}
@media screen {
	div#preloader {
		position: absolute;
		left: -9999px;
		top:  -9999px;
	}
	div#preloader img {
		display: block;
	}
}
@media print {
	div#preloader, 
	div#preloader img {
		visibility: hidden;
		display: none;
	}
}

#hybrid-work {
	font-family: CiscoSans, Helvetica, Arial, sans-serif
}
#hybrid-work.container {
	color: var(--color-white);
}
#hybrid-work.container {
	margin: 0;
    padding: 0;
    max-width: 100%;
}
#hybrid-work .with-bg {
	background-color: var(--color-white);
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/background-top-index.png);
    background-size: 1600px 1000px;
    background-position: bottom;
    background-repeat: no-repeat;
    position: relative;
	padding-top:48px;
}

#hybrid-work h1 {
	/* font-size: 6.8rem; */
	font-size: 6.2rem;
	font-weight: 100;
}

#hybrid-work .with-bg-blue [data-id="more"] h4 {
	/* padding:40px; */
	text-align:left;
}
#hybrid-work #introduction-modal[data-id="introduction-modal-content"] {
	color: var(--color-darkgray);
}

#hybrid-work .with-bg-blue [data-id="more"] {
	padding: 10px 40px 10px 40px;
	text-align: left;
}

#hybrid-work .with-bg-blue [data-id="more"] > div {
	padding-top: 36px;
	-ms-flex-preferred-size: 83.33333333%;
	flex-basis: 83.33333333%;
	max-width: 83.33333333%;
}

#hybrid-work .with-bg-blue [data-id="more"] h4,
#hybrid-work .with-bg-blue [data-id="more"] ul {
	margin-bottom: 35px;
}

#hybrid-work .with-bg-blue [data-id="more"] .bullet-list li {
	color: var(--color-white);
	font-size: 2rem;
	font-weight: 300;
    line-height: 1.25em;
}

#hybrid-work .swiper-slide > div {
	height: 100%;
	/* height: 75%; */
}
#hybrid-work p,
#hybrid-work h1,
#hybrid-work h2,
#hybrid-work h3,
#hybrid-work .swiper-slide h5,
#hybrid-work .swiper-slide p {
	white-space: normal;
	word-wrap: normal;
	color: var(--color-white);
}

#hybrid-work .scroller h2 {
margin-bottom:0;
}

#hybrid-work .scroller .swiper-slide .content { margin: 0; }

.swiper-pagination-bullet.swiper-pagination-bullet-active-prev,
.swiper-pagination-bullet.swiper-pagination-bullet-active-prev-prev,
.swiper-pagination-bullet.swiper-pagination-bullet-active-next,
.swiper-pagination-bullet.swiper-pagination-bullet-active-next-next {
	background-color: #007aff;
	opacity: 0.5;
	height: 20px !important;
	width: 20px !important;
	border: 2px solid rgba(0, 188, 235, 1);
}

#hybrid-work .scroller {
	background-color: rgba(0,0,0,0.5);
    border-radius: 16px;
    /* padding: 20px 24px; */
    padding: 20px 40px;
    color: var(--color-white);
	border:none;
	/*height: 300px;*/
}

#hybrid-work .scroller .swiper {
	background:transparent;
	border:none !important;
	/*height:260px;*/
}

#hybrid-work .noborder {
	border:none !important;
}


#hybrid-work .scroller .swiper-slide {
	z-index:50;
	border-top: 1px solid rgba(0,0,0,0.5);
}

#hybrid-work .scroller .swiper-slide .graphic img {
	border-radius: 16px;
	border: 1px solid var(--color-secondary); 
	min-height: 170px;
	max-height: 180px;
	width: 100%;
	object-fit: cover;
}
#hybrid-work .scroller .swiper-slide .content h4 {
	font-size:2.2rem;
}

a.hw_menu-button {
	display: block;
	/*width: 100%;*/
	padding: 116px 16px 14px;
	font-size: 1.8rem;
	line-height: 1.4em;
	text-align: center;
	/* background-color: #eee; */
	background-size: 100px 100px;
	background-position: center 8px;
	background-repeat: no-repeat;
	border-radius: 12px;
	/*margin-right:10px;*/
}
a.hw_menu-button,
a.hw_menu-button:hover,
a.hw_menu-button:focus,
a.hw_menu-button:visited {
	color: var(--color-text-active);	
}
a.hw_menu-button:active {
	color: var(--color-tertiary);	
}
.hw_col-md-2:last-child a.hw_menu-button {
	margin-right:0;
}
a.hw_menu-button:hover,
a.hw_menu-button:active {
	/* background-color: var(--color-white); */
	text-decoration: none;
}

a.hw_menu-button[data-id="people"] {
	/* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people.svg); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-active.svg);
	color: var(--color-text-active);
}
a.hw_menu-button.active:hover[data-id="people"],
a.hw_menu-button:hover[data-id="people"] {
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-onhover.svg);
	color: var(--color-text-onhover) !important;
}
a.hw_menu-button.active[data-id="people"] {
	/* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button[data-id="collaboration"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration.svg); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-active.svg);
	color: var(--color-text-active);
}
a.hw_menu-button.active:hover[data-id="collaboration"],
a.hw_menu-button:hover[data-id="collaboration"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button.active[data-id="collaboration"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button[data-id="networking"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking.svg); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-active.svg);
	color: var(--color-text-active);
}
a.hw_menu-button.active:hover[data-id="networking"],
a.hw_menu-button:hover[data-id="networking"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button.active[data-id="networking"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button[data-id="security"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security.svg); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-active.svg);
	color: var(--color-text-active);
}
a.hw_menu-button.active:hover[data-id="security"],
a.hw_menu-button:hover[data-id="security"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-onhover.svg);
	color: var(--color-text-onhover);
}
a.hw_menu-button.active[data-id="security"] {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-onhover.svg);
	color: var(--color-text-onhover);
}

.hw_security-icon {
	margin-left: 20px;
	max-width: 50px;
	height: auto;
}

.hw_arrow-right {
    right: 12px;
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/arrow-button-right.svg);
}
.hw_button-arrow {
    display: none;
    position: absolute;
    top: 0;
    width: 18px;
    height: 100%;
    background-size: 18px 18px;
    background-position: 50%;
    background-repeat: no-repeat;
}

#hybrid-work [data-id="explore"] {
	margin-right: 0 !important;
    margin-left: 0 !important;
	background-color: var(--color-white);
	padding: 20px;
}

#hybrid-work.subpage [data-id="explore"] {
	padding: 0;
}

#hybrid-work [data-id="explore"] h2 {
	color: var(--color-black);
	/* padding-top: 30px; */
	padding-bottom:0;
	margin-bottom:0;
}

#hybrid-work [data-id="explore"] [data-id="explore-links"] {
	margin-left: 130px;
	margin-right: 130px;
	/* padding: 40px; */
	padding: 20px 20px 20px 20px;
}

#hybrid-work [data-id="explore"] [data-id="explore-links"] > div {
	display:flex;
	text-align: center;
}

#hybrid-work [data-id="explore"] [data-id="explore-links"] > div a {
	flex:1;
}

#hybrid-work [data-id="tophero"] {
	margin-bottom:64px;
}

#hybrid-work .with-bg-blue {
	background-color: var(--color-secondary);
}

#hybrid-work .with-bg-white {
	background-color: var(--color-white);
}
[data-id="spotlight-nav"] {
	padding: 0 0 20px;
}
a.hw_button {
	display: inline-block;
    min-width: 140px;
    padding: 11px 24px 12px;
    text-align: center;
    text-decoration: none;
    line-height: 1em;
    vertical-align: top;
    border-radius: 999px;
	background-color: var(--color-primary);
    color: var(--color-tertiary);
}
a.hw_button[data-id="methodology"] {
	background-color: var(--color-secondary);
    color:  var(--color-white);
}
a.hw_button:hover {
	background-color: #4dcff0;
    border-color: #4dcff0;
	text-decoration: none;
}
a.hw_button[data-id="methodology"]:hover {
	background-color: #385e8b;
    color: var(--color-white);
	text-decoration: none;
	border: none;
}
a.hw_button.hw_button-secondary {
	background-color: var(--color-white);
    color: var(--misc-color-link);
    border: 1px solid var(--misc-color-link);
}
a.hw_button.hw_button-secondary:hover {
	background-color: var(--color-tertiary);
    color: var(--color-white);
    border-color: var(--color-tertiary);
}

#fwt-banner.fwt-banner-ribbon {
	justify-content: center !important;
	border-bottom: none;
    height: 50px;
    background-color: #4d4c4c;
}
#fwt-banner.fwt-banner-ribbon p {
	color: var(--color-white);
	font-size: 2rem !important;
	margin-bottom: 0 !important;
}

#fwt-banner {
	justify-content: center !important;
}
#fwt-banner #fwt-cornerstone,
#fwt-banner #fwt-utilities, 
.reimagine #fwt-masthead #fwt-rei-utilities, 
.reimagine #fwt-masthead:not(.nav) #fwt-rei-utilities, 
:host #fwt-masthead #fwt-rei-utilities, 
:host #fwt-masthead:not(.nav) #fwt-rei-utilities {
	display:none !important;
}

#fwt-banner #fwt-logo {
	margin:0;
}

/* --------------------------------- */
#hybrid-work .swiper-button-prev, 
#hybrid-work .swiper-button-next {
	/* color: var(--color-primary) !important; */
	font-weight: 600;
	top: auto;
	bottom:0;
}

.swiper-button-prev:after,
.swiper-button-next:after {
  font-family: swiper-icons;
  font-size: 30px !important;
  text-transform: none !important;
  letter-spacing: 0;
  text-transform: none;
  font-variant: initial;
  line-height: 1;
}

#hybrid-work .swiper-pagination-bullet {
	width: 20px;
	height: 20px;
	vertical-align: middle;
}

#hybrid-work .swiper-pagination-fraction, .swiper-pagination-custom, .swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
	bottom: 10px;
	/* bottom: 2px; */
}
/* --------------------------------- */

[data-id="spotlight"] {
	justify-content: center;
}

.hw_spotlight  {
	margin:0 auto;
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: left;
	/* padding: 40px; */
	padding: 40px 40px 20px 40px;
}

.hw_methodology  {
	/* padding: 20px;
	display: flex;
	flex-direction: row;
	justify-content: center; */
	padding: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 20px;
}

.hw_methodology a {
	margin-left: 1.6rem;
}

#hybrid-work .hw_spotlight h2, 
#hybrid-work .hw_spotlight p {
	/* color: var(--color-white); */
	color: var(--color-darkgray);
}

#hybrid-work .hw_spotlight p {
	margin-left: 3rem; 
	margin-right: 3rem;
}

.newsroom-blockquote .quote-text {
	color: var(--color-white) !important;
	font-size: 27px;
	font-weight: 200;
	font-style: oblique;
	line-height: 1.29em;
	margin-left: 15px;
	margin-bottom: 15px;
	padding-top: 33px;
}

.quote-text {
	font-size: 27px;
	font-weight: 200;
	font-style: oblique;
	line-height: 1.29em;
	margin-left: 15px;
	margin-bottom: 15px;
	padding-top: 33px;
}

.quote-author {
	margin-left: 15px;
}

.newsroom-blockquote .quote-author {
	color: var(--color-white);
	font-size: 18px;
	line-height: 1.44em;
	font-weight: 300;
	font-style: oblique;
	margin-left: 15px;
	margin-bottom: 0;
}

.hw_spotlight [data-id="spotlight-image"] img {
	margin: 0;
    padding: 0;
    border: 0;
    vertical-align: bottom;
	width: auto;
	height: 520px;
	border-radius: 16px 0 0 16px;
	/* position: absolute; */
	position: relative;
	top:0%;
	right: 0;
	object-fit: fill;
}
.hw_spotlight [data-id="spotlight-text"] {
	display: flex;
    flex-direction: column;
    flex: 1;
    height: 520px;
    background-color: var(--color-primary);
    border-radius: 0 16px 16px 0;
    overflow: hidden;
    align-items: center;
}
.hw_spotlight [data-id="spotlight-text"] .spotlight-text {
	padding: 20px 40px 0px 40px;
	margin: auto;
}

.blockquote-wrapper {
	flex-basis: 75% !important; 
	max-width: 75% !important;
}
.hw_spotlight [data-id="spotlight-text"] .spotlight-text h2 {
	font-size: 3rem;
}

.hw_spotlight [data-id="spotlight-text"] .spotlight-text p {
	margin-left: auto !important; margin-right: auto !important;
}
.pb-2 {
	padding-bottom:2em;
}
.pt-2 {
	padding-top:2em;
}
.pb-4 {
	padding-bottom:4em;
}

@media (max-width: 93.5em) { 
	.hw_spotlight [data-id="spotlight-image"] img,
	.hw_spotlight [data-id="spotlight-text"] {
		height: 620px;
	}
}

@media (max-width: 1200px) {
	.blockquote-wrapper {
		flex-basis: 100% !important;
		max-width: 100% !important;
	}

	.hw_methodology {
		padding: 0;
		margin: 0;
	}
}

/* @media (max-width: 89.8em) { 
	.hw_spotlight [data-id="spotlight-image"] img,
	.hw_spotlight [data-id="spotlight-text"] {
		height: 710px;
	}
} */

@media (max-width:1350px) {
	#hybrid-work [data-id="explore"] [data-id="explore-links"] {
		margin: 0 auto;
		padding: 20px;
	}

	#hybrid-work .with-bg-blue [data-id="more"] h4 {
		padding:0;
	}

	[data-id="spotlight-text"] .spotlight-text  h2 {
		font-size: 2.8rem !important;
	}
	[data-id="spotlight-text"] .spotlight-text {
		/* padding: 20px !important; */
	}
}

.hw_button-arrow.hw_arrow-right {
    right: 12px;
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/arrow-button-right.svg);
}

@media (max-width: 767px) {
	.hw_spotlight [data-id="spotlight-image"] img {
		position: relative;
	}
	#hybrid-work [data-id="explore"] [data-id="explore-links"] {
		margin: 0 auto;
		padding: 16px;
	}
	#hybrid-work [data-id="explore"] [data-id="explore-links"] .hw_button-arrow {
		display:block;
	}
	#hybrid-work [data-id="explore"] [data-id="explore-links"] > div a {
		border: 1px solid var(--color-gray-600);
		margin: 0 0 8px;
		padding: 16px 52px;
		text-align: left;
		background-size: 36px 36px;
		background-position: 8px;
		border-radius: 8px;
		position: relative;
	}
	#hybrid-work [data-id="tophero"] {
		margin-bottom: 0 !important;
	}
	
	#hybrid-work [data-id="explore"] [data-id="explore-links"] > div a:hover {
		border: 1px solid var(--color-text-onhover);
	}
	.blockquote-text {
		margin: 0;
		padding: 40px 20px 20px 20px !important;
	}

	.hw_methodology a {
		margin-top: 1.6rem;
		max-width: 288px;
		margin-left: 0;
	}
}

@media (max-width: 1200px) {
	#hybrid-work .with-bg-blue [data-id="more"] > div {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%;
	}
}

@media (max-width: 1023px) {
	#hybrid-work .with-bg {
		padding: 36px 36px 0 36px;
		background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/background-top-index.png);
    	background-size: 1100px 650px;
    	background-position: 0 0;
	}
	
	#hybrid-work [data-id="tophero"] h1 {
		font-size: 4.8rem;
		margin-bottom: 0;
	}
	#hybrid-work [data-id="tophero"] p {
		font-size: 1.8rem;
		margin-bottom: 0;
	}
	#hybrid-work .with-bg-blue {
		padding:36px;
	}
	#hybrid-work .with-bg [data-id="pagetitle"] {
		padding: 28px 28px 28px;			
	}

	#fwt-banner.fwt-banner-ribbon {
		padding: 10px;
		height: 37px;
	}
	#fwt-banner.fwt-banner-ribbon p {
		font-size: 1.6rem !important;
	}

	.hw_spotlight [data-id="spotlight-image"] img,
	.hw_spotlight [data-id="spotlight-text"] {
		height: 700px;
	}


	#hybrid-work .hw_spotlight {
		flex-direction: column;
	}
	#hybrid-work .hw_spotlight [data-id="spotlight-image"],
	#hybrid-work .hw_spotlight [data-id="spotlight-image"] img {
		border-radius: 12px 12px 0 0;		
	}

	#hybrid-work .hw_spotlight [data-id="spotlight-text"] {
		border-radius: 0 0 12px 12px;
	}

	#hybrid-work .hw_spotlight [data-id="spotlight-nav"] {
		padding: 20px 0 20px;
	}
	#hybrid-work .hw_spotlight {
		padding: 0;
	}

	#hybrid-work .hw_spotlight [data-id="spotlight-image"] img {
		width:100%;
		height: auto;
	}

	#hybrid-work .scroller .swiper-slide .content {
		margin: 0; 
	}
}
@media (max-width: 767px) {
	#hybrid-work .with-bg {
		padding:0;
		background:none;
	}
	#hybrid-work .with-bg [data-id="pagetitle"] {
		padding:36px;
		width: 100%;
		/* padding: 28px 28px 92px;			 */
		padding: 28px 28px 28px;			
		background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/background-top-index.png);
		background-size: 800px 500px;
		background-position: 0 100%;
		background-repeat: no-repeat;
	}
	#hybrid-work .with-bg [data-id="pageslide"] {
		padding:0px;
		background-color: rgb(30,68,113);
	}
	#hybrid-work .scroller {
		background-color: transparent;
	}	
	#hybrid-work .scroller h2 {
		text-align: center;
		padding-bottom: 20px;
		margin-bottom: 0 !important;
	}
	#hybrid-work .scroller .swiper-slide {
		border-top: none;
	}
	#hybrid-work .scroller .swiper-slide .graphic {
		height: 180px;
		text-align: center;
	}	
	#hybrid-work .scroller .swiper-slide .graphic img {
		width: auto;
		height: 100%;
	}
	#hybrid-work [data-id="tophero"] {
		margin-bottom:0;
	}
	#hybrid-work [data-id="explore"] {
		background-color: var(--color-white);
		padding:16px;
	}
	#hybrid-work [data-id="explore"] h2 {
		font-size: 2.6rem;
		line-height: 2.6rem;
		margin:16px;
		text-align: center;
	}
}

#hybrid-work [data-id="tophero-subpage"] {
	width:100%;
}
#hybrid-work [data-id="tophero-subpage"] .backarrow {
    position: absolute;
    left: 20px;
    flex-basis: 48px;
    flex-shrink: 0;
}
#hybrid-work [data-id="tophero-subpage"] a {
	display: inline-block;
    width: 48px;
    height: 48px;
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/arrow-left.svg);
    background-size: 48px 48px;
    background-position: 50%;
    background-repeat: no-repeat;
}
#hybrid-work [data-id="tophero-subpage"] [data-id="pagetitle"] {
	text-align: center;
}
#hybrid-work [data-id="tophero-subpage"] [data-id="pagetitle"] h1 {
	font-weight:100;
	margin: 0;
    font-size: 4.6rem;
    line-height: 1.3em;
    color: var(--color-white);
}

#hybrid-work.subpage .with-bg {
	text-align: center;
    background-color: var(--color-tertiary);
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/background-top-subpage.png);
    background-size: 1600px 327px;
    background-position: bottom;
    background-repeat: no-repeat;
	padding-top:16px;
	
}
#hybrid-work.subpage .with-bg [data-id="tophero-subpage"] {
	padding-bottom:16px;
}

#hybrid-work.subpage [data-id="explore"] {
	/* background-color: rgba(0,188,235,.25); */
	background-color: var(--color-white);
	border-bottom: 1px solid var(--color-gray-500);
}

#hybrid-work.subpage a.hw_menu-button.active {
	/* background-color: var(--color-primary); */
	color: var(--color-text-active);
	/* color: var(--color-text-onhover); */
	
}
#hybrid-work.subpage a.hw_menu-button.active:hover {
	color: var(--color-text-onhover);
}
#hybrid-work.subpage [data-id="explore"] {
	margin:0;
}
#hybrid-work.subpage [data-id="subpage-content"] {
	color: var(--color-darkgray);
	margin-left: 85px;
    margin-right: 120px;
    padding: 40px 0 40px 40px;
	text-align: left;
}
@media (max-width:1024px){
	#hybrid-work.subpage [data-id="subpage-content"] {
		margin-left:0;
		margin-right:0;
	}

}
#hybrid-work.subpage [data-id="subpage-content"] h2,
#hybrid-work.subpage [data-id="subpage-content"] h3,
#hybrid-work.subpage [data-id="subpage-content"] h4,
#hybrid-work.subpage [data-id="subpage-content"] p{
	color: var(--color-darkgray);
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button {
	color: var(--color-tertiary);
	display: block;
    margin-bottom: 10px;
    padding: 18px 18px 18px 56px;
    font-size: 1.8rem;
    border-radius: 8px;
    /* background-color: #eee;     */
	background-size: 40px 40px;
    background-position: 8px;
    background-repeat: no-repeat;
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button:hover {
	text-decoration: none;
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button.bg1 {	
	/* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-overview.svg);
	color: var(--color-text-inactive); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-overview-active.svg);
	color: var(--color-text-active);
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button.bg1:hover {	
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-overview-onhover.svg);
	color: var(--color-text-onhover);
}
#hybrid-work.subpage [data-id="subpage-content"] a.bg1.hw_sidebar-button-selected {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-overview-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-overview-onhover.svg);
	color: var(--color-text-onhover);
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button.bg2 {	
	/* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-data.svg); */
	/* color: var(--color-text-inactive); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-data-active.svg);
	color: var(--color-text-active);
}
#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button.bg2:hover {	
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-data-onhover.svg);
	color: var(--color-text-onhover);
}

#hybrid-work.subpage [data-id="subpage-content"] a.bg2.hw_sidebar-button-selected {
    /* background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-data-active.svg);
	color: var(--color-text-active); */
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/icon-sidebar-data-onhover.svg);
	color: var(--color-text-onhover);
}
#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] {
	padding: 0 0 16px 16px;
}
#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] .featured {
	border-radius: 16px 16px 0 0;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] .artgraphic {
	width:100%;
	height:auto;
	border-radius: inherit;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] .featured-text {
	background-color: #f2fcfe;
    margin-bottom: 40px;
    padding: 32px;
    font-size: 1.8rem;
    line-height: 1.6em;
    color: var(--color-darkgray);
    border-radius: 0 0 16px 16px;
    overflow: hidden;
    margin-top: -6px;
}

ul.bullet-list {
    /* list-style-type: disc;
    margin: 1.4rem 0 2rem 1.8rem; */
	list-style-type: disc;
	margin: 1.4rem 0 0 1.8rem;
}

ul.bullet-list.mb-14 {
    /* list-style-type: disc;
    margin: 1.4rem 0 2rem 1.8rem; */
	list-style-type: disc;
	margin: 1.4rem 0 14px 1.8rem;
}

ul.bullet-list li {
	color: var(--color-darkgray);
	font-size: 1.6rem;
    font-weight: 300;
    line-height: 1.6em;
	margin: 0;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"] {
	margin-top: 16px;
	margin-bottom: 16px;
	height:400px;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"][data-subid="workforce"] {
	height:376px;
}
@media (max-width: 64em) { 
	#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"][data-subid="workforce"] {
		height:400px;
	}
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"][data-subid="meeting"] {
	height:450px;
}

@media (max-width: 571px) { 
	#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"][data-subid="meeting"] {
		height:470px;
	}
}
@media (max-width: 337px) { 
	#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"][data-subid="meeting"] {
		height:495px;
	}
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"].auto-height {
	height: auto;
	margin-bottom:32px;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] {
	text-align: left;
	background-color: #f2fcfe;
	margin: 32px 0 16px 0;
	padding: 24px;
	align-items: center;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .hw_stat-label {
    font-size: 2.4rem;
    font-weight: 100;
    line-height: 1.4em;
    color: var(--color-darkgray);
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .hw_stat-graphic {
    margin-right: 20px;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow.theme-green {
    background: var(--color-success);
}
#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow {
    position: relative;
    width: 120px;
    height: 120px;
    border-radius: 999px;
    background: var(--color-primary);
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow .counter-value {
    position: absolute;
    color: var(--color-secondary);
    text-align: center;
    left: 5%;
    width: 90%;
    top: 35px;
    font-size: 38px;
    font-weight: 100;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow .counter-arrow {
    position: absolute;
    width: 6px;
    height: 30px;
    border-radius: 3px;
    background: var(--color-secondary);
    left: 50%;
    margin-left: -3px;
    bottom: 18px;;
}

#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow .counter-arrow:after, 
#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow .counter-arrow:before {
    content: "";
    position: absolute;
    width: 6px;
    height: 22px;
    border-radius: 3px;
    background: var(--color-secondary);
    transform: rotate(45deg);
    transform-origin: 50% 0;
    left: 2px;
    top: 0;
}
#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="highlight"] .counter-with-arrow .counter-arrow:after {
    transform: rotate(-45deg);
    left: -2px;
}

/* PAGES */
/* COLLABORATION */
[data-page="collaboration"] [data-id="infographic"] {
	/*width: 60%;*/
	margin: 0 auto;
	margin-top:40px;
	color: #2a3351;
	font-size: 2rem;
	padding: 24px 16px 16px 16px;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
}

[data-page="collaboration"] [data-id="infographic"] .infographic-circle {
	border: 2px solid var(--color-primary);
    border-radius: 50%;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
	margin:0 auto;
}

[data-page="collaboration"] [data-id="infographic"] .infographic-circle.circle-green {
	border: 2px solid var(--color-success);
}
[data-page="collaboration"] [data-id="infographic"] .infographic-circle.circle-orange {
	border: 2px solid var(--color-warning);
}

[data-page="collaboration"] [data-id="infographic"] .infographic-text,
[data-page="collaboration"] [data-id="infographic"] .infographic-copyright {
	text-align: left;
}
[data-page="collaboration"] [data-id="infographic"] .infographic-source {
	text-align: right;
}

[data-page="collaboration"] [data-id="infographic"] .hw_row {
	margin-bottom: 16px;
}

[data-page="collaboration"] [data-id="infographic"] .hw_row:last-child {
	margin-bottom: 0;
}

[data-page="collaboration"] [data-id="infographic"] .infographic-copyright {
	font-size: 1.2rem;
	color: #5f5f60;
}
[data-page="collaboration"] [data-id="infographic"] .infographic-source {
	font-size: 1.4rem;
	color: #5f5f60;
}

#hybrid-work.subpage[data-page="collaboration"] h3.chart-title {
	color: var(--color-darkgray);
	/* color: var(--color-primary); */
}
#hybrid-work.subpage[data-page="collaboration"] p.chart-title-legend {
	color: var(--color-darkgray);
	/* color: var(--color-secondary); */
	margin-top: -13px;
	font-style: italic;
}
#hybrid-work.subpage[data-page="collaboration"] h4.chart-subtitle {
	color: var(--color-primary);
	/* margin-bottom:32px; */
}
#hybrid-work.subpage[data-page="collaboration"] h4.chart-subtitle.chart-subtitle {
	color: var(--color-primary);
	margin-bottom: 15px;
}
/* #hybrid-work.subpage[data-page="collaboration"] .chart-headnote,
#hybrid-work.subpage[data-page="collaboration"] .chart-footnote { */
#hybrid-work.subpage .chart-headnote,
#hybrid-work.subpage .chart-footnote {
	color: var(--color-white);
	background: #6ebe4a;
	text-align: center;
	padding: 16px;
	/* font-size: 1.6rem; */
	font-size: 1.8rem;
	border-radius: 24px;
	margin-bottom: 20px;
}

#hybrid-work.subpage[data-page="collaboration"] .chart-headnote {
	margin-top: 30px;
	font-size: 2rem;;
}

#hybrid-work.subpage[data-page="collaboration"] .chart-footnote {
	margin-bottom: 30px;
}

#hybrid-work.subpage[data-page="collaboration"] [data-id="chart2"] .mobile-access-numbers, 
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .enhancing-numbers {
	width: 96%;
	padding: 8px;
	
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart2"] .mobile-access-numbers .mobile-access-counter {
	font-size: 8rem;
	color: var(--color-primary);
	margin-bottom: 25px;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .enhancing-numbers .enhancing-counter {
	font-size: 4rem;
	color: #6EBE4A;
	margin-bottom:16px;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-coltitle {
	font-size:3rem;
	line-height:3.4rem;
	color: var(--color-secondary);
	margin-bottom:32px;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart2"] .mobile-access-numbers .mobile-access-text,
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .enhancing-numbers .enhancing-text {
	font-size:1.6rem;
	color: var(--color-secondary);
	padding-bottom:16px;
}

#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-numbers .cloud-counter {
	font-size: 4rem;
	color: #6EBE4A;
	margin-bottom:8px;
}

#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-numbers .cloud-counter.orange {
	color: var(--color-warning);
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-numbers .cloud-counter.red {
	color: #E3241B;

}

#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-numbers .cloud-text {
	font-size:2rem;
	color: var(--color-secondary);
	padding-bottom: 16px;
}

/* SECURITY subpages */
#hybrid-work.subpage[data-page="security"] h3.chart-title {
	/* color: var(--color-secondary); */
	color: var(--color-dark);
}
#hybrid-work.subpage[data-page="security"] h4.chart-subtitle {
	/* color: var(--color-primary); */
	color: var(--color-dark);
	margin-bottom:32px;
}
#hybrid-work.subpage[data-page="collaboration"] h4.chart-subtitle-black 
#hybrid-work.subpage[data-page="security"] h4.chart-subtitle-black {
	color: var(--color-black);
}
#hybrid-work.subpage[data-page="security"] h4.chart-subtitle-smaller {
	font-size:16px;
}
#hybrid-work.subpage[data-page="security"] h4.chart-subtitle-smallest {
	color: var(--color-dark);
	font-size: italic;
	font-size:14px;
}
#hybrid-work.subpage[data-page="security"] p.chart-title-legend {
	color: var(--color-dark);
	font-style: italic;
}
#hybrid-work.subpage[data-page="security"] .text-green {
	color: #6EBE4A;
}
#hybrid-work.subpage[data-page="security"] .text-blue {
	color: var(--color-primary);
}
#hybrid-work.subpage[data-page="security"] .text-left {
	text-align:left;
}
#hybrid-work.subpage[data-page="security"] .text-center {
	text-align:center;
}

#hybrid-work.subpage[data-page="people-culture"] .chart-footnote-simple,
#hybrid-work.subpage[data-page="collaboration"] .chart-footnote-simple,
#hybrid-work.subpage[data-page="security"] .chart-footnote-simple,
#hybrid-work.subpage[data-page="networking"] .chart-footnote-simple {
	padding: 4px 0 16px 0;
	margin-bottom: 8px;
	font-size: 14px;
	font-style: italic;
}
@media (min-width: 64em) {
	#hybrid-work.subpage[data-page="security"] [data-show="desktop"] {
			display:block;		
	}
	#hybrid-work.subpage[data-page="security"] [data-show="mobile"] {
		display:none;
	}
}

#hybrid-work.subpage[data-page="security"] [data-show="desktop"] .chart-subtitle,
#hybrid-work.subpage[data-page="security"] [data-show="mobile"] .chart-subtitle {
	margin-bottom:0;
}

@media (max-width: 64em) {
	#hybrid-work.subpage[data-page="security"] [data-show="desktop"] {
		display:none;
	}
	#hybrid-work.subpage[data-page="security"] [data-show="mobile"] {
		display:block;
	}
}

#hybrid-work.subpage[data-page="security"] [data-id="vectors-counter"] .security-numbers {
	width: 170px;
	height: 170px;
	padding: 16px;
    border: 6px solid var(--color-primary);
	background: #11284B;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-radius: 50%;
	margin: 0 auto;
    align-content: center;
    justify-content: center;	
}

#hybrid-work.subpage[data-page="security"] [data-id="vectors-counter"] .security-numbers .hw_security-icon {
	margin:0 auto;

}

#hybrid-work.subpage[data-page="security"] [data-id="vectors-counter"] .security-numbers .security-counter {
	font-size: 5.5rem;
	color: var(--color-primary);
	margin-bottom:16px;
}

#hybrid-work.subpage[data-page="security"] [data-id="vectors-counter"] .security-numbers .security-text {
	font-size:2rem;
	color: var(--color-secondary);
}

#hybrid-work.subpage[data-page="security"] [data-id="vectors-counter"] .security-numbers .security-text .text-small {
	font-size: 14px;
}

#hybrid-work.subpage[data-page="security"] [data-id="subpage-content-text"] .text-small {
	font-size:14px;
}

/* NETWORKING */
[data-page="networking"] [data-id="infographic"] .text-small {
	font-size:14px;

}
[data-page="networking"] .text-smallest {
	font-size:12px;
}
[data-page="networking"] [data-id="infographic"] {
	/*width: 60%;*/
	margin: 40px auto 20px auto;
	color: #2a3351;
	font-size: 2rem;
	padding: 24px 16px 16px 16px;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
}

[data-page="networking"] [data-id="infographic"] .infographic-circle {
	border: 2px solid var(--color-primary);
    border-radius: 50%;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
	margin:0 auto;
}

[data-page="networking"] [data-id="infographic"] .infographic-circle.circle-green {
	border: 2px solid var(--color-success);
}
[data-page="networking"] [data-id="infographic"] .infographic-circle.circle-orange {
	border: 2px solid var(--color-warning);
}

[data-page="networking"] [data-id="infographic"] .infographic-text,
[data-page="networking"] [data-id="infographic"] .infographic-copyright {
	text-align: left;
}
[data-page="networking"] [data-id="infographic"] .infographic-source {
	text-align: right;
}

[data-page="networking"] [data-id="infographic"] .hw_row {
	margin-bottom: 16px;
}

[data-page="networking"] [data-id="infographic"] .hw_row:last-child {
	margin-bottom: 0;
}

[data-page="networking"] [data-id="infographic"] .infographic-copyright {
	font-size: 1.2rem;
	color: #5f5f60;
}
[data-page="networking"] [data-id="infographic"] .infographic-source {
	font-size: 1.4rem;
	color: #5f5f60;
}
[data-page="networking"] .image-full {
	position: relative;
}
[data-page="networking"] .image-full img {
	width:100%;
	height:auto;
}

#hybrid-work.subpage[data-page="networking"] .chart-footnote {
	color: var(--color-white);
	background: #6ebe4a;
	text-align: center;
	padding: 16px;
	margin-bottom: 32px;
	font-size: 1.6rem;
	border-radius: 24px;
}
#hybrid-work.subpage[data-page="networking"] .chart-footnote.chart-footnote-blue {
	background: var(--color-primary);
}

#hybrid-work.subpage[data-page="networking"] h3.chart-title {
	color: var(--color-darkgray);
}
#hybrid-work.subpage[data-page="networking"] p.chart-title-legend {
	color: var(--color-darkgray);
	margin-top: -13px;
	font-style: italic;
}
#hybrid-work.subpage[data-page="networking"] h4.chart-subtitle {
	color: var(--color-primary);
	margin-bottom:32px;
}
#hybrid-work.subpage[data-page="networking"] h4.chart-subtitle.m0 {
	margin-bottom:0;
}

/* PEOPLE AND CULTURE */
[data-id="worklocation-chart"] .text-left {
	text-align: left;
}
[data-id="worklocation-chart"] .text-right {
	text-align: right;
}

[data-page="people-culture"] [data-id="infographic"] .text-small {
	font-size:14px;

}
[data-page="people-culture"] .text-smallest {
	font-size:12px;
}
[data-page="people-culture"] [data-id="infographic"] {
	/*width: 60%;*/
	margin: 40px auto 20px auto;
	color: #2a3351;
	font-size: 2rem;
	padding: 24px 16px 16px 16px;
	background: rgb(255,255,255);
	background: -moz-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,224,227,1) 100%);
}

[data-page="people-culture"] [data-id="infographic"] .infographic-circle {
	border: 2px solid var(--color-primary);
    border-radius: 50%;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
	margin:0 auto;
}

[data-page="people-culture"] [data-id="infographic"] .infographic-circle.circle-green {
	border: 2px solid var(--color-success);
}
[data-page="people-culture"] [data-id="infographic"] .infographic-circle.circle-orange {
	border: 2px solid var(--color-warning);
}
[data-page="people-culture"] [data-id="infographic"] .infographic-circle.circle-red {
	border: 2px solid #ff0000;
}

[data-page="people-culture"] [data-id="infographic"] .infographic-text,
[data-page="people-culture"] [data-id="infographic"] .infographic-copyright {
	text-align: left;
}
[data-page="people-culture"] [data-id="infographic"] .infographic-source {
	text-align: right;
}

[data-page="people-culture"] [data-id="infographic"] .hw_row {
	margin-bottom: 16px;
}

[data-page="people-culture"] [data-id="infographic"] .hw_row:last-child {
	margin-bottom: 0;
}

[data-page="people-culture"] [data-id="infographic"] .infographic-copyright {
	font-size: 1.2rem;
	color: #5f5f60;
}
[data-page="people-culture"] [data-id="infographic"] .infographic-source {
	font-size: 1.4rem;
	color: #5f5f60;
}


#hybrid-work.subpage[data-page="people-culture"] .chart-footnote {
	color: var(--color-white);
	background: #6ebe4a;
	text-align: center;
	padding: 16px;
	margin-bottom: 32px;
	font-size: 1.6rem;
	border-radius: 24px;
}
#hybrid-work.subpage[data-page="people-culture"] .chart-footnote.chart-footnote-blue {
	background: var(--color-primary);
}

#hybrid-work.subpage[data-page="people-culture"] h3.chart-title {
	color: var(--color-dark);
	/* color: var(--color-secondary); */
}

#hybrid-work.subpage[data-page="people-culture"] h4.chart-subtitle {
	color: var(--color-dark);
	/* color: var(--color-primary); */
	margin-bottom:32px;
}
#hybrid-work.subpage[data-page="people-culture"] h4.chart-subtitle.m0 {
	margin-bottom:0;
}

#hybrid-work.subpage[data-page="people-culture"] .text-green {
	color:#6EBE4A !important;
}
#hybrid-work.subpage[data-page="people-culture"] .text-blue {
	color:var(--color-primary) !important;
}
#hybrid-work.subpage[data-page="people-culture"] .text-darkblue {
	color:var(--color-secondary) !important;
}
#hybrid-work.subpage[data-page="people-culture"] .text-orange {
	color:var(--color-warning) !important;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] [data-id="worklocation-chart-legend"] {
	display: flex;
	margin-top:20px;
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] [data-id="worklocation-chart-legend"] .icon-square {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 7px;
}
.color-primary {
	background: var(--color-primary) !important;
}
.color-tertiary {
	background: var(--color-tertiary) !important;
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .chart-info h3 {
	margin-bottom:0;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .chart-gauge h3 {
	color: var(--color-secondary);
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container,
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container {
	width: 120px;
	height: 120px;
	display: block;
	padding: 10px;
	background-color: var(--color-white);
	margin: 0 auto;
	border-radius: 3px;
	position: relative;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .worklocation-circle .gauge-container {
	width: 160px;
	height: 160px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="in-teams-attendees-chart"] .gauge-container {
	width: 60px;
	height: 60px;
	display: block;
	padding: 10px;
	background-color: var(--color-white);
	margin: 0 auto;
	border-radius: 3px;
	position: relative;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="collaboration-insights-chart"] .gauge-container {
	width: 30%;
	height: 30%;
	display: block;
	padding: 10px;
	background-color: var(--color-white);
	margin: 0 auto;
	border-radius: 3px;
	position: relative;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="collaboration-insights-chart"] .gauge-container > .label,
#hybrid-work.subpage[data-page="people-culture"] [data-id="in-teams-attendees-chart"] .gauge-container > .label,
#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container > .label
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container > .label {
	position: absolute;
	right: 0;
	top: 0;
	display: inline-block;
	background: transparent;
	font-family: monospace;
	font-size: 0.8em;
	padding: 5px 10px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="in-teams-attendees-chart"] .gauge-container > .gauge .dial,
#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container > .gauge .dial {
	stroke: var(--color-gray-400);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container > .gauge .dial {
	stroke: var(--color-primary);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .worklocation-circle {
	position: relative;
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .worklocation-circle .el-counter-text {
	position: absolute;
    bottom: calc(50% - 16px - 22px);
    left: calc(50% - 20px);
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container.light > .gauge .dial{
	stroke: var(--color-light);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container.requested > .gauge .value {
	stroke: var(--color-success);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container.given > .gauge .value {
	stroke: var(--color-primary);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="in-teams-attendees-chart"] .gauge-container > .gauge .value,
#hybrid-work.subpage[data-page="collaboration"] [data-id="collaboration-insights-chart"] .gauge-container > .gauge .value,
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container > .gauge .value {
	stroke: var(--color-secondary);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container > .gauge .value-text {
	fill: var(--color-darkgray);
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1em;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="in-teams-attendees-chart"] .gauge-container  > .gauge .value-text {
	fill: var(--color-darkgray);
	font-family: sans-serif;
	font-weight: bold;
	font-size: 2em;
}
#hybrid-work.subpage[data-page="collaboration"] [data-id="collaboration-insights-chart"] .gauge-container > .gauge .value-text {
	fill: var(--color-primary);
	font-family: sans-serif;
	font-size: 1.7em;
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .show-mobile {
	display:none;
}

@media only screen and (max-width: 300px) {
	#hybrid-work.subpage[data-page="people-culture"] [data-id="leaders-chart"] .gauge-container,
	#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .gauge-container {
		width: 100px;
		height: 100px;
	}
}

[data-id="overview-image"] {
	max-height: 400px;
	margin-bottom: 30px;
	border-radius: 16px;
	overflow: hidden;
}

[data-id="overview-image"],
[data-id="map"] {
	position:relative;
}

[data-id="overview-image"] img,
[data-id="map"] img {
	width:100%;
	height:auto;
}

[data-id="map"] .map-circle {
	width: 100px;
    height: 100px;
    background: #11284B;
    position: absolute;
    border-radius: 50%;
    color: var(--color-white);
    border: 6px solid var(--color-primary);
	display: flex;
    align-items: center;
    justify-content: center;
	flex-direction: column;
}
[data-id="map"] .map-circle.map-circle-green {
	border: 6px solid #6EBE4A;
}
[data-id="map"] .map-circle.map-circle-orange {
	border: 6px solid var(--color-warning);
}
[data-id="map"] [data-id="map-circle1"] {
	top: 40%;
    left: 15%;
}
[data-id="map"] [data-id="map-circle2"] {
	top: 30%;
    left: 45%;
}
[data-id="map"] [data-id="map-circle3"] {
	top: 40%;
    right: 15%;
}

#hybrid-work .hw_row[data-id="page"] {
	margin-right: 10px;
	margin-left: 10px
}

.swiper-slide [data-id="page"] .content {
	margin: auto 20px;
}

@media only screen and (max-width: 48em) {
	#hybrid-work .scroller h2 {
		font-size: 2.9rem;
	}

	#hybrid-work.subpage[data-page="people-culture"] [data-id="worklocation-chart"] .show-mobile {
		display: inline; 
	}
	[data-id="map"] .map-circle {
		width: 80px;
		height: 80px;
	}
	#hybrid-work.subpage[data-page="collaboration"] .chart-headnote {
		font-size: 1.7rem;
	}

	.swiper-slide [data-id="page"] {
		display: flex;
		justify-content: center;
	}

	#hybrid-work .scroller .swiper-slide .content,
	#hybrid-work .scroller .swiper-slide .graphic {
		margin-bottom: 20px;
	}


	#hybrid-work .scroller .swiper-slide .graphic img {
		width: 50% !important;
		border: 1px solid var(--color-primary);
	}
}
@media only screen and (max-width: 550px) {
	[data-id="map"] .map-circle {
		width: 60px;
		height: 60px;
		font-size:14px;
	}
}
@media only screen and (max-width: 440px) {
	[data-id="map"] .map-circle {
		width: 40px;
		height: 40px;
		font-size:12px;
		line-height: 12px;
	}

	#hybrid-work .scroller .swiper-slide .graphic img {
		width: 99% !important;
	}
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="investing-chart"] {
	margin-bottom:32px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="investing-chart"] .map-big-text {
	font-weight: bold;
	font-size:20px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="investing-chart"] .map-small-text {
	line-height: 1.2em;
	font-size:14px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="investing-chart"] .map-icon {
	width:64px;
	height:auto;
}
#hybrid-work.subpage [data-id="subpage-content"] ul {
	list-style: disc;
	list-style-position: outside;
}

#hybrid-work.subpage[data-page="people-culture"] [data-id="creating-chart"] .gauge-container {
	width: 150px;
	height: 150px;
	display: block;
	padding: 10px;
	background-color: var(--color-white);
	margin: 0 auto;
	border-radius: 3px;
	position: relative;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="creating-chart"] .gauge-container > .label {
	position: absolute;
	right: 0;
	top: 0;
	display: inline-block;
	background: transparent;
	font-family: monospace;
	font-size: 0.8em;
	padding: 5px 10px;
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="creating-chart"] .gauge-container > .gauge .dial {
	stroke: #D9D9D9;
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="creating-chart"] .gauge-container > .gauge .value {
	stroke: var(--color-primary);
	stroke-width: 4;
	fill: rgba(0,0,0,0);
}
#hybrid-work.subpage[data-page="people-culture"] [data-id="creating-chart"] .gauge-container > .gauge .value-text {
	fill: var(--color-primary);
	font-family: sans-serif;
	font-weight: bold;
	font-size: 1em;
}

/* mobile fixes  */
#hybrid-work.subpage .with-bg-blue [data-id="more"] h4 {
	padding:40px;
	text-align:left;
}
#hybrid-work.subpage .with-bg-blue [data-id="more"] > div {
	-ms-flex-preferred-size: 83.33333333%;
	flex-basis: 83.33333333%;
	max-width: 83.33333333%;
}

#hybrid-work.subpage[data-page="collaboration"] [data-id="chart"] .cloud-numbers {
	margin-bottom:16px;

}

@media (max-width: 1350px) {
	#hybrid-work.subpage [data-id="subpage-content"] {
		margin: 0 auto;
		padding: 40px 0 40px 0;
	}
}

@media (max-width: 75em) {
	[data-page="collaboration"] [data-id="infographic"],
	[data-page="networking"] [data-id="infographic"] {
		width: 90%;
	}
	#hybrid-work .with-bg-blue [data-id="more"] > div {
		padding-top: 15px;
	}
}
@media (max-width: 64em) {
	#hybrid-work [data-id="explore"] h2 {
		padding-top: 0;
	}

	#hybrid-work.subpage .with-bg-blue [data-id="more"] > div {
		-ms-flex-preferred-size: 100%;
		flex-basis: 100%;
		max-width: 100%;
	}
	#hybrid-work.subpage [data-id="subpage-content"] {
		margin: 0 auto;
		padding: 40px 36px 40px 36px;
	}
	[data-page="collaboration"] [data-id="infographic"],
	[data-page="networking"] [data-id="infographic"] {
		width: 90%;
	}

	[data-page="collaboration"] [data-id="infographic"] .infographic-circle,
	[data-page="networking"] [data-id="infographic"] .infographic-circle {
		margin: 0 auto;
	}
	[data-page="collaboration"] [data-id="infographic"] .infographic-text,
	[data-page="networking"] [data-id="infographic"] .infographic-text {
		margin-top: 16px;
	}
	#hybrid-work.subpage .with-bg-blue [data-id="more"] h4 {
		padding: 0;

	}
	#hybrid-work.subpage .with-bg {
		padding-top:0;
	}
	#hybrid-work [data-id="tophero-subpage"] .backarrow {
		padding-top:8px;
	}
	#hybrid-work.subpage .with-bg [data-id="tophero-subpage"] {
		padding-bottom:0;
	}
	#hybrid-work [data-id="tophero-subpage"] [data-id="pagetitle"] {
		padding-top:0;
		padding-bottom:16px;
	}
	#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"] {
		height:auto;
	}
	#hybrid-work.subpage [data-id="subpage-content"] [data-id="subpage-content-text"] [data-id="chart"] #chart {
		margin-bottom:16px;
	}
}

@media (max-width: 48em) {
	#hybrid-work.subpage [data-id="subpage-content"] {
		padding: 40px 36px 40px 36px;
	}
}
@media (max-width: 330px) {
	#hybrid-work.subpage [data-id="subpage-content"] {
		padding: 40px 8px 40px 8px;
	}
}

@media (max-width: 950px) {

	#hybrid-work [data-id="tophero"] {
	 	margin-bottom: 84px;
	}
}

[data-id="sidebar-menu"] > div {
	position: sticky;
	top: 10px;
}

@media only screen and (max-width: 64em) {
	[data-id="sidebar-menu"] {
		position: relative;
		margin-bottom: 30px;
	}
	[data-id="sidebar-menu"] > div {
		position: relative;
		top: auto;
		width: auto;
		display: block;
	}	

	#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button {
		border: 1px solid var(--color-gray-600);
		width: auto;
		height: auto;
		padding: 18px 18px 18px 56px;
	}
	#hybrid-work.subpage [data-id="subpage-content"] a.hw_sidebar-button:hover {
		border: 1px solid var(--color-text-onhover);
	}
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-right {
	text-align: right;
}

.hw_mt_20 {
	margin-top: 40px !important;
}

[data-id="spotlight-text"] .spotlight-text .newsroom-blockquote {
	background-color: var(--color-primary);
	display: block;
    position: relative;
    background: #f5f5f7;
    padding: 35px 65px 35px 70px;
    border: none;
    -webkit-border-radius: 6px 6px 6px 6px;
    border-radius: 6px 6px 6px 6px;
    margin-bottom: 20px;
}

a.hw_menu-button[data-id="people"].main {
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-active.svg);
	color: var(--color-text-active);
}
a.hw_menu-button.active.main:hover[data-id="people"],
a.hw_menu-button.main:hover[data-id="people"] {
	background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-people-onhover.svg);
	color: var(--color-text-onhover);
}

a.hw_menu-button[data-id="collaboration"].main {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-active.svg);
}
a.hw_menu-button.active.main:hover[data-id="collaboration"],
a.hw_menu-button.main:hover[data-id="collaboration"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-collaboration-onhover.svg);
	color: var(--color-text-onhover);
}

a.hw_menu-button[data-id="networking"].main {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-active.svg);
}
a.hw_menu-button.active.main:hover[data-id="networking"],
a.hw_menu-button.main:hover[data-id="networking"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-networking-onhover.svg);
	color: var(--color-text-onhover);
}

a.hw_menu-button[data-id="security"].main {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-active.svg);
}
a.hw_menu-button.active.main:hover[data-id="security"],
a.hw_menu-button.main:hover[data-id="security"] {
    background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/nav-security-onhover.svg);
	color: var(--color-text-onhover);
}

.blockquote-text {
	text-align: left;
	padding: 20px;
}

.blockquote-text blockquote {
	quotes: "\201C""\201D""\2018""\2019";
  }
  .blockquote-text blockquote:before {
	position: absolute;
	content: " ";
	background: url("https://www.cisco.com/c/dam/assets/dmr/pullquote/english-light.svg") no-repeat;
	left: 13%;
	width: 75px;
	height: 65px;
	transform: scale(1.20);
  }
  /* .blockquote-text blockquote:after {
	float: right;
	right: 0%;
	color: var(--color-white);
	content: close-quote;
	font-size: 5em;
	line-height: 0.1em;
	margin-right: -0.45em;
	vertical-align: -0.4em;
  } */

  .blockquote-text .tweet-blockquote .quote-author {
	font-style: italic;
}

.hw_spotlight [data-id="spotlight-image"] {
	flex: 1;
    border-radius: 16px 0 0 16px;
    overflow: hidden;
	text-align: end;
	position: relative;
}

@media only screen and (max-width: 60em) {
	.hw_spotlight [data-id="spotlight-text"] h2 {
		font-size: 3rem !important;
	}
}

/* @media only screen and (max-width: 1023px) {
	#hybrid-work .scroller .swiper-slide .graphic img {
		border: 3px solid blue; 
		min-height: 160px;
		max-height: 180px;
		width: 100%;
		object-fit: cover;
	}
} */

@media only screen and (max-width: 540px) {
	#hybrid-work.subpage [data-id="tophero-subpage"] {
		flex-direction: column-reverse;
		background-image: url(https://www.cisco.com/c/dam/m/en_us/solutions/hybrid-work/images/background-top-index.png);
		background-size: 800px 500px;
		background-position: 0 100%;
		background-repeat: no-repeat;
	}
	#hybrid-work.subpage [data-id="tophero-subpage"] .backarrow {
		position: relative;
		left: auto;
		background: transparent;
		margin: 0 auto;
	}
	#hybrid-work.subpage [data-id="tophero-subpage"] [data-id="pagetitle"] {
		background: none;
    	padding-bottom: 0;
	}

}