.o-bg--light-grey {
	background: #f1f1f1;
}
/* Header */
.header--shallow {
	height: auto;
	min-height: 410px;
	background-image: none;
}
.header-content {
	display: flex;
	padding-bottom:30px;
}
.header--shallow .header__text {max-width:55%;}
.header__image img {
	margin:-20px 0 0 20px;
}
.header__cta {text-align: right; font-size:0}

/* Navigation text links */
ul.c-copy-section__nav-links li {
	list-style: none;
	margin-left:0;
	margin-bottom: 20px;
}
ul.c-copy-section__nav-links h3 {
	display:block;
	font-size: 13px;
	color:#777;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 0;
}

h3 {color:#0c626b}
h3.c-accordian-copy-section__title {
	color: #000;
}

/* Highlight */
.c-highlight {
	padding:8px 16px;
	border:1px solid #ddd;
	display: inline-block;
}

/* Table styling */
table td,
table 
th {
  border: 1px solid #ddd!important;
  padding: 8px 16px;
}
table 
th {
  background: #ededed;
}

/* Single media component */
.c-single-media-content {
	padding: 0;
	margin-top: 0;
}
.c-single-media-content__text {
	width: 70%;
	padding-top: 0px;
	min-height: 0;
}
.c-single-media-content__title {
	max-width:none;
}
.c-single-media-content__img-col {
	width: 30%;
}
.c-single-media-content__img {
	top: 0;
}

/* Third width card section */
.c-card__image {
	height:240px;
	background: #e2e2e2;
	padding:30px;
	display: flex;
	justify-content: center;
}
.c-card__image img {
	margin:auto;
	max-width:100%;
	max-height:100%;
	height: auto;
	width: auto;
}
.c-card--offset-left.c-card--has-image .c-card__inner-text {
	margin-top: 0;
}

.o-theme--grey .c-card .c-card__text {
	background-color: #fff!important;
}
.o-theme--white .c-card .c-card__text {
	background-color: #f2f2f2!important;
}
.c-card .c-card__text {
	padding-right: 15px!important;
	padding-left: 30px!important;
}



/* Key Principles */
.c-card--key-principles {
	margin: 0-10px;
	text-align: center;
}
.c-card--key-principles .c-card__image {
	height: 260px;
	background: #8881ab;
	padding: 0;
	border-radius: 50%;
	width: 260px;
	margin: auto;
}
.c-card--key-principles .c-card__image img {
	height: 100%;
	width: 100%;
	border-radius: 50%;
}
.c-card--key-principles .c-card__text {
	padding-bottom: 20px;
}
.c-card--key-principles h3 {
	color:#0c626b;
}

/* Media block */
.media-block__desktop-view {
	margin-top:40px;
	position: relative;
}
.media-block__mobile-view {
	margin-top:40px;
	position: relative;
	display:none;
}
.c-btn--media-block {
	position: absolute;
	top:-22px;
	right:0;
}
.media-block__image {
	background: #e2e2e2;
	padding:50px;
	display: flex;
	justify-content: center;
}
ol.media-block__list {
  	list-style: none;
  	counter-reset: media-block-counter;
	padding-left: 36px;
}
ol.media-block__list li {
  	counter-increment: media-block-counter;
	position: relative;
}
ol.media-block__list li::before {
	content: counter(media-block-counter);
	color:#fff;
  	font-weight: bold;
	font-size:15px;
	background: #000;
  	border-radius: 50%;
  	text-align: center;
	position: absolute;
	--size: 26px;
	left: calc(-1 * var(--size) - 10px);
	line-height: var(--size);
	width: var(--size);
	height: var(--size);
	top: -2px;
}

/* Dos and don'ts */
.c-dos-donts {
	display: flex;
	justify-content: space-between;
	height: 100%;
}
.c-dos-donts__col {
	width: 50%;
	display: flex;
	flex-flow: column nowrap;
	padding: 30px 0;
}
.c-dos {
	padding-right:30px;
}
.c-dos img {
	border-bottom:4px solid #5fa368;
	margin-top:20px;
}
.c-dos h4 {
	padding:0 0 8px 36px;
	background: url(/assets/img/style-guide/do.png) no-repeat left top;
	margin-bottom: 0;
}
.c-donts {
	padding-left:30px;
}
.c-donts img {
	border-bottom:4px solid #e30713;
	margin-top:20px;
}
.c-donts h4 {
	padding:0 0 8px 36px;
	background: url(/assets/img/style-guide//dont.png) no-repeat left top;
	margin-bottom: 0;
}

/* Tabbed images */
ul.c-tabbed-images {
    list-style: none;
    padding: 0;
    margin: 0;
	display: flex;
    justify-content: space-between;
	position: relative;
	background: #e2e2e2;
}
ul.c-tabbed-images li {
	width: 100%;
	display:block;
	margin:0;
}
ul.c-tabbed-images li.selected {
	height:480px;
}

ul.c-tabbed-images .c-tabbed-images--btn {
    font-family: Open Sans,Arial,sans-serif;
	line-height: 1.5;
	background: #f3f3f3;
	border-top: 3px solid #f3f3f3;
	width: 100%;
	text-align: center;
	padding: 9px 16px 12px;
	display:block;
	margin:0;
	position: relative;
	cursor: pointer;
	z-index: 1;
}
ul.c-tabbed-images li.selected .c-tabbed-images--btn {
    background: #e2e2e2;
	border-top: 3px solid #000;
	font-weight:700;
}
ul.c-tabbed-images div {
    display: none;
}
ul.c-tabbed-images li.selected div {
	position: absolute;
	left:0;
	background: #e2e2e2;
	width: 100%;
	padding:50px;
	display: flex;
	justify-content: center;
	top: 50%;
  	transform: translateY(-43%);
}
ul.c-tabbed-images img {
    max-height: 320px;
}

/* Accordions */
.c-accordian-show-hide-all {
	font-weight: 700;
	font-size: 13px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Cpath d='M5.75 4.25H10v1.5H5.75V10h-1.5V5.75H0v-1.5h4.25V0h1.5z'/%3E%3C/svg%3E");
	background-position: 10px;
	background-size: constrain;
	background-repeat: no-repeat;
	background-origin: padding-box;
	background-color: #ededed;
	padding: 8px 16px 8px 30px;
	margin: 20px 0;
	cursor: pointer;
}

/* Footer */
.c-footer-row-2 {
    border-top: 0;
    padding: 0;
}

/* Responsive behavior */
@media screen and (max-width: 959px) {
	.header__image img {margin:0 0 0 20px;}
}
@media screen and (max-width: 864px) {
	.header--shallow .header__text  {max-width: 60%;}
}
@media screen and (max-width: 768px) {
	.c-single-media-content {padding: 80px 20px 20px;}
	.c-single-media-content__text {width: 100%;}
	.c-single-media-content__img-col {width: 100%;}
	.c-single-media-content__img {position: static;}
	.c-dos-donts {flex-direction: column;}
	.c-dos-donts__col {width: 100%; flex-flow: column wrap;}
	.c-dos, .c-donts {padding:20px 0;}
}
@media screen and (max-width: 560px) and (min-width: 0) {
	.header--shallow .header__text {max-width: none;}
	.header__image {display:none}
	ul.c-tabbed-images {flex-direction: column}
	ul.c-tabbed-images li.selected {height:200px}
	ul.c-tabbed-images li.selected div {padding:0 20px 20px; position: relative; top:auto; transform: none; height:154px}
	ul.c-tabbed-images img {max-height: 120px;}
}