﻿* {margin:0; padding:0; outline:none; border:none; box-sizing:border-box; -moz-box-sizing:border-box;}

/* GLOBAL */
ul		{margin-left:0}
html { }
body {line-height:1; font-weight: 400; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; text-rendering: optimizeLegibility;  -webkit-font-smoothing: antialiased; color:#4D5357;}

strong	{font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}

::-webkit-input-placeholder     {color:#bdbdbd;}
::-moz-placeholder              {color:#bdbdbd; opacity:1;}
:-ms-input-placeholder          {color:#bdbdbd;}
:-moz-placeholder               {color:#bdbdbd; opacity:1;}


img     {max-width:100%; height:auto;}
a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block; z-index: 10;}

.inner		{width:1295px; max-width: 100%; margin:0 auto; padding: 0 15px;}
.wrapper	{width:1396px; max-width: 100%; margin:0 auto; padding: 0 15px;}

h1	{font-weight:normal; line-height: 1em;}
h2	{font-weight:normal; line-height: 1.4em;}
h3	{font-weight:normal; line-height: 1.4em;}
h4	{font-weight:normal; line-height: 1.4em;}
h5	{font-weight:normal; line-height: 1.4em;}
h6	{font-weight:normal; line-height: 1.4em;}

/* 404 Page */
.fourOhFour {padding: 100px 0;}
.fourOhFour h1 { text-align:center; font-size: 40px; margin-bottom: 20px}
.fourOhFour p { text-align: center; font-size: 20px }

/* HEADER */
header { background-color: #000000; padding-bottom: 15px; }
.logo-container		{position:relative; font-size: 0; display: inline-block}
.logo				{display:inline-block; vertical-align: middle; margin-right: 40px;}
.strapline,
.strapline *		{display: inline-block; vertical-align: middle; /* BUSINESS & SUSTAINABLE ENTERPRISE */}
.strapline img		{border-right: 2px solid #bed600; padding-right: 20px; width: 100%; max-width: 340px; }
.strapline p		{font-size:19px; color:#ffffff; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; text-transform: uppercase; margin-left: 20px;}

/* NAV */
nav			{display:inline-block; float: right; margin-top: 40px;}
nav	ul		{font-size: 0; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
nav	ul li	{display:inline-block; font-size: 19px;  border-right:2px solid #bed600; padding:3px 0px; padding-right: 20px; margin-right: 20px; position:relative;}
nav	ul li a	{color:#ffffff; text-decoration: none;}
nav	ul li a.active,
nav	ul li a:hover	{color:#bed600;}

nav ul li:first-child   {border: none; }
nav	ul li:last-child	{border:none; margin-right: 0; padding-right: 0}

nav ul > li:hover > ul  {left:-22px;}
nav ul > li > ul        {position:absolute; width:165px; z-index:50; padding:15px 0px 0px; left:-999999px;}
nav ul > li > ul > li   {margin-right:0;padding-right:0; background-color:#4d5357; border-right:0; color:#FFF; font-size:17px; line-height:1.3em; margin-bottom:0px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; display:block; width:100%; padding:2px 20px;}
nav ul > li > ul > li:first-child {padding-top:16px;}
nav ul > li > ul > li:last-child {margin-bottom:0; padding-bottom:16px;}

nav ul > li > ul > li:hover > ul  { left: -150px; top: -15px; }


@media (max-width: 960px) 
{
	nav ul > li:hover > ul,
	nav ul > li > ul > li:hover > ul  { left: 0px; top: 0px; }

}

.display-mobile{display:none !important;}


.inner .breadcrumb-link-1 {text-decoration: none;}

/* HERO CAROUSEL */
.hero-carousel-container 	{position: relative; margin-top: 10px; }
.hero-carousel .slide		{height:340px; background-size: cover; background-repeat: no-repeat; position: relative; display: table; padding-top: 50px; background-position: center; }
.hero-carousel .slide:after	{background-color:rgba(0,0,0,0.3); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ''; z-index: 0}
.carousel-text				{display:table-cell; vertical-align: top; height: 100%; padding-left: 115px; padding-right: 70px; color:#ffffff; position: relative; z-index: 1}
.carousel-text h1 			{font-size:56px;}
.carousel-text h2 			{font-size:22px; line-height: 1.2em; margin-top: 40px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; margin-bottom: 10px;}
.carousel-text p			{font-size:28px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}




.hero-carousel .slick-arrow				{font-size:0; width:22px; height: 42px; position: absolute; top: 30%; margin-top: -21px; background-size: cover; background-color:transparent; background-image: url(/_assets/icon-chevron-right.png); z-index: 5}
.hero-carousel .slick-arrow.slick-next	{right:22px}
.hero-carousel .slick-arrow.slick-prev	{left:22px; transform: rotate(180deg)}

/* COLS */
.col-row		{font-size:0}
.col-container	{width:calc(100% + 22px); margin-left: -11px;}
.col-1          { width: 100%; padding: 11px; display: inline-block; vertical-align: top; }
.col-3			{width:33.333%; padding: 11px; display: inline-block; vertical-align: top;}
.col-4			{width:25%; padding: 11px; display: inline-block; vertical-align: top;}
.col-5			{width:20%; padding: 11px; display: inline-block; vertical-align: top;}

/* HERO GRID */
.hero-grid-section				{margin:5px 0}
.col-container.hero-grid		{width:calc(100% + 10px); margin-left: -5px;}
.col-container.hero-grid .col-3,
.col-container.hero-grid .col-4	{padding: 5px;}

.col-container.hero-grid .col-3 .hero-panel-image img	{height: auto;}

.hero-panel			{position:relative; }
.hero-panel	a.cover	{z-index:10;}
.hero-panel:hover .hero-panel-text p.find-out-more	{color:#bed600}
.hero-panel:hover .hero-panel-image-holder { transform: scale(1.05) }

.hero-panel-image				{position:relative; overflow: hidden; }
.hero-panel-image-holder        {position: relative; overflow: hidden; height: 400px; background-size: cover; background-repeat: no-repeat; background-position: center; transition: 0.2s ease-out; }
.col-3 .hero-panel-image-holder {height: 500px;}
.hero-panel-image img			{width: 100%;}
.hero-panel-image .text			{width:300px;  height: 157px; position: absolute; display: table; bottom: 0; left: 0; background-repeat: no-repeat; background-position: right; max-width: 100%; background-size: cover; background-image: url(/_assets/shape-overlay-bottom.png);}
.hero-panel-image .text-inner	{display:table-cell; width: 100%; height: 100%; vertical-align: bottom; padding-left: 28px; padding: 0 0 28px 28px;}
.hero-panel-image .text h2		{font-size:28px; color:#ffffff; position: relative; padding:8px 0 10px 0}
.hero-panel-image .text h2:before,
.hero-panel-image .text h2:after	{width:100px; height: 2px; background-color: #bed600; content: ''; position:absolute; top: 0; left: 0;}
.hero-panel-image .text h2:after	{bottom:0; top:auto;}

.hero-panel-text						{background-color:#E8EBEA; font-size: 13px; color:#4D5357; margin-top: 10px; padding: 28px; padding-right: 10px;}
.hero-panel-text p						{line-height:1.4em; width:250px; max-width:100%; margin-bottom: 0.5em;}	
.hero-panel-text hr						{width:95px; max-width:100%; border-top:1px solid #4D5357;}
.hero-panel-text p.find-out-more		{font-size:20px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; width:100%; transition: 0.2s ease-out}
.hero-panel-text p.find-out-more span	{font-size:34px; transform: translateY(4px); display: inline-block}

.hero-panel								{display: flex; flex-direction: column}
.hero-panel.top							{display: flex; flex-direction: column-reverse}
.hero-panel.top .hero-panel-text		{margin-top: 0; margin-bottom: 10px;}
.hero-panel.top .hero-panel-image .text	{bottom:auto; top: 0; background-image: url(/_assets/shape-overlay-top.png);}

.hero-panel.top .hero-panel-image .text-inner	{vertical-align:top; padding-bottom: 0; padding-top: 28px;}

/* BIG GREEN BUTTON */
.hl-button				{display:block; padding: 28px; padding-right: 60px; color:#263A3C; background-color: #bed600; font-size: 25px; text-decoration: none; position: relative; transition: 0.2s ease-out}
.hl-button span			{position:absolute; display: inline-block; right: 28px; top: 50%; margin-top: -14px; background-image: url(/_assets/icon-big-plus.gif); background-size: cover; width:28px; height: 28px;  transition: 0.2s ease-out}
.hl-button:hover		{background-color:#E8EBEA;}
.hl-button:hover span	{transform:rotate(90deg)}

/* PAGE HEADER */
.page-header	{background-color:#000000; padding: 10px 0 30px 0}
.page-header h1	{font-size:56px; color:#ffffff; line-height: 1em; width: 85%; max-width: 100%;}
.page-header p	{font-size:28px; color:#ffffff; margin: 15px 0}
.page-header p span	{color:#bed600}
.page-header.news span	{color:#3AAC40}

/* LISTING */
.listing-top						{padding-top:45px;}

.listing-actions ul					{list-style: none; font-size: 0; display: inline-block}
.listing-actions ul.filters li				{font-size: 16px; display: inline-block; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; margin-right: 7px;}
.listing-actions ul.filters li a			{color:#ffffff; padding: 12px 10px; display: block; text-decoration: none; transition: 0.2s ease-out}
.listing-actions ul.filters li a:hover		{opacity:0.5}
.listing-actions ul.filters li.green a		{background-color:#3AAC40;}
.listing-actions ul.filters li.green-dark a	{background-color:#263A3C;}
.listing-actions ul.filters li.blue	a		{background-color:#2779AE;}

.inactive {opacity: 0.3;}

.listing-actions ul.types 			{float:right; display: inline-block;}
.listing-actions ul.types li 		{display:inline-block; vertical-align: top; margin-left: 15px;}
.listing-actions ul.types li a		{text-decoration:none;}
.listing-actions ul.types .icon		{background-color:#828282; width:42px; height: 42px; border-radius: 42px; display: table-cell; text-align: center; vertical-align: middle;}
.listing-actions ul.types li span	{color:#223335; font-size: 13px; display: table-cell; vertical-align: middle; padding-left: 6px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}

/* PANEL LISTING */
.panel-listing-section								{padding-top:30px; padding-bottom: 30px;}
.panel-listing-section .panel						{background-size:cover; position: relative; overflow: hidden}
.panel-listing-section .panel-text					{position:absolute; bottom: 0; left: 0; width: 100%; background-color: #4d5357; padding: 30px; height:155px; border-top: 4px solid #bed600;}
.panel-listing-section .panel .tag					{font-size:13px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; color:#ffffff; display: inline-block; padding-bottom: 2px;}
.panel-listing-section .panel .panel-icon			{position:absolute; right: 30px; top: 30px; opacity: 0.6}
.panel-listing-section .panel h2					{font-size:21px; font-weight: 200; font-family:'Roobert', Arial, Helvetica, "sans-serif"; color: #ffffff; margin-top: 10px;}
.panel-listing-section .panel a.cover				{z-index:20;}
.panel-listing-section .panel-image					{transition:0.2s ease-in-out;}
.panel-listing-section .panel:hover .listingImage	{transform: scale(1.05);}


.listingImage {background-size: cover; height: calc(360px - 150px); margin-bottom: 150px;  transition:0.2s ease-in-out; background-position: center; }
.listingImage:hover {transform: scale(1.05) }




/*.panel-listing-section .panel.news-panel .tag			{border-bottom:2px solid #3AAC40;}
.panel-listing-section .panel.where-panel .tag			{border-bottom:2px solid #2779AE;}
.panel-listing-section .panel.sustainable-panel .tag	{border-bottom:2px solid #064C43;}*/

/* VIDEO PANEL */
.panel-listing-section .video-panel .panel-text:before {content:''; width:80px; height: 80px; position: absolute; top: 50%; margin-top: -200px; left: 50%; margin-left: -40px; background-image: url(/_assets/video-play.svg); background-size: cover; background-repeat: no-repeat; z-index: 19}


/* ARTICLE */
.header-image	    {width:100%;}
.featureImage 		{width: 100%; height: 260px; background-size: cover; background-position: center; }


.article-inner	    {padding-top: 35px; padding-bottom: 35px;}

.article-inner .left-col {width: 65%; float: left; padding-right: 100px;}
.article-inner .right-col {width: 35%; float: right;}


.article-inner .right-col img {width: 100%; max-width: 440px; /*margin-bottom: 20px;*/}
.share-link {margin-top:10px; margin-bottom:20px; display:block; text-align:center; text-decoration:none}




article h1		    {font-size:30px; margin-bottom: 0.8em;}
article h2		    {font-size:20px; margin-bottom: 0.8em; margin-top: 1.2em; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
article h3		    {font-size:20px; margin-bottom: 0.8em; margin-top: 1.2em; font-weight: 200; font-family:'Roobert', Arial, Helvetica, "sans-serif";}
article h4		    {font-size:18px; margin-bottom: 0.8em; margin-top: 1.2em; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
article h5		    {font-size:18px; margin-bottom: 0.8em; margin-top: 1.2em; font-weight: 200; font-family:'Roobert', Arial, Helvetica, "sans-serif";}
article h6		    {font-size:16px; margin-bottom: 0.8em; margin-top: 1.2em; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
article .intro p	{font-size:27px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
article p,		
article ol,
article ul		{font-size:18px; line-height: 1.4em; margin-bottom: 0.8em}

article ol,
article ul		{margin-left: 30px; margin-top: 1.5em; margin-bottom: 1.5em}

article ol li,
article ul li	{margin-bottom:0.5em;}

article blockquote		{padding:30px; background-color: rgba(68,172,64,0.06); margin:42px 0px 30px;}
article blockquote p	{font-family:Georgia, "serif"; font-style: italic; color:#3AAC40}
article blockquote cite	{font-size:15px; font-style: normal; color:#3AAC40}

article .left-image		{float:left; margin: 20px 30px 30px 0;}
article .right-image	{float:right; margin: 20px 0 30px 30px;}

article .image-left,
article .image-right    { width: 100%; display:inline-block; margin-bottom: 20px; margin-top: 20px;}

article .image-left img         {float: left; margin-right: 20px;}
article .image-left:not(img)    { }
article .image-right img        {float: right; margin-left: 20px;}

article .image-left img,
article .image-right img {max-width: 440px; width: 100%;}



/* ARTICLE COLOURS */

/* news */
article.news .intro p,	
article.news h1,
article.news h2,
article.news h3,
article.news h4,
article.news h5,
article.news h6,
article.news p a,
article.news ul a,
article.news ol a,
article.news blockquote p {color:#3AAC40}

/* where */
article.where .intro p,	
article.where h1,
article.where h2,
article.where h3,
article.where h4,
article.where h5,
article.where h6,
article.where p a,
article.where ul a,
article.where ol a,
article.where blockquote p {color:#2779AE}

/* sustainable */
article.sustainable .intro p,	
article.sustainable h1,
article.sustainable h2,
article.sustainable h3,
article.sustainable h4,
article.sustainable h5,
article.sustainable h6,
article.sustainable p a,
article.sustainable ul a,
article.sustainable ol a,
article.sustainable blockquote p {color:#064C43}

/* RELATED CAROUSEL */
.carousel-actions		{background-color:#000000; padding: 20px 0; margin-top: 20px;}
.carousel-actions h2	{color:#bed600; font-size: 23px; display: inline-block;}	

.carousel-actions .carousel-nav								{float:right; position: relative; padding-left: 17px; padding-right: 17px; margin-top: 10px;}
.carousel-actions .carousel-nav .slick-dots					{font-size:0}
.carousel-actions .carousel-nav .slick-dots li				{width:12px; height: 12px; font-size: 0; border:1px solid #ffffff; border-radius: 12px; display: inline-block; margin: 0 2px;}
.carousel-actions .carousel-nav .slick-dots li.slick-active	{background-color:#ffffff;}
.carousel-actions .carousel-nav .slick-arrow				{font-size:0; background-color: transparent; background-image: url(/_assets/icon-chevron-small.svg); width: 10px; height: 17px; background-size: cover; position: absolute; left: 0; top: 50%; margin-top: -8px;}
.carousel-actions .carousel-nav .slick-arrow.slick-next		{left:auto; right:0; transform: rotate(180deg)}

/* OUR PEOPLE */
.panel-listing-section .col-5	{margin-bottom:20px;}

.panel-person				{position:relative;}
.panel-person-text			{padding-left:15px; z-index: 2; position: relative}
.panel-person-text h2		{font-size:20px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; margin-bottom: 0.5em; margin-top: 0.8em;}
.panel-person-text h3		{font-size:15px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; margin-bottom: 0; margin-top: 0}
.panel-person-text p		{font-size:14px;}
.panel-person-image 		{position:relative; z-index: 2}

.panel-person-text-hidden		{position: absolute; padding: 15px; padding-left: 280px; left: -20px; top: -20px; background-color: #064C43; z-index: 1; min-height:calc(100% + 40px); width:630px; opacity: 0; visibility: hidden; transition: 0.2s ease-in-out}
.panel-person-text-hidden h4	{font-size:14px; color:#ffffff; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif";}
.panel-person-text-hidden ul,
.panel-person-text-hidden p		{font-size:14px; color:#ffffff; line-height: 1.4em; margin-bottom: 0.5em;}

.panel-person-copy { max-height: 350px; overflow-y: auto; }


.panel-person.active { z-index: 20; }
.panel-person.active .panel-person-text h2,
.panel-person.active .panel-person-text h3	{color:#ffffff;}

.panel-person .plus			{width:33px; height: 33px; border:1px solid #bed600; display: block; position: relative; margin-top: 15px;}
.panel-person .plus:before	{position: absolute; width:17px; height: 1px; background-color: #4D5357; content: ''; left: 7px; top: 15px;}
.panel-person .plus:after	{position: absolute; width:17px; height: 1px; background-color: #4D5357; content: ''; left: 7px; top: 15px; transform: rotate(90deg)}

.panel-person.right-person .panel-person-text-hidden	{left:auto; right:-20px; padding-left:20px; padding-right: 280px;}

.panel-person.active .panel-person-text-hidden	{opacity: 1; visibility: visible;}
.panel-person.active .plus:before			{background-color: #ffffff;}
.panel-person.active .plus:after			{opacity:0}

/* CASE STUDY PAGE */
.case-studies-page .cs-text-inner {width:100%; padding-right: 100px; }

.case-studies-page .cs-text-section { margin-bottom: 30px; border-bottom: 1px solid #5B7FAB; padding-bottom: 30px; }
.case-studies-page .cs-text-section h2 { color: #4D5357 !important; margin-bottom: 10px; }
.case-studies-page .cs-text-section .intro-copy p {margin-bottom:20px;}

.case-studies-page .cs-names p { display: inline-block; margin-right: 20px; font-style: italic; font-size: 20px; }
.case-studies-page .cs-names span {font-size:14px;}
.case-studies-page .cs-read-more { display: block; font-weight: 600; margin-top: 10px; font-size:17px }

.case-studies-page .cs-names.hidden,
.case-studies-page .cs-expanded-text {display:none;}
.case-studies-page .cs-names,
.case-studies-page .cs-expanded-text.visible {display:block;}

.case-studies-page .cs-expanded-text-container {display:flex;}
.case-studies-page .cs-expanded-text-container .cs-text-col {width: 50%; padding-right:25px;}
.case-studies-page .cs-expanded-text-container .cs-text-col p { font-size: 20px; color: #363636; line-height:1.2em}

.case-studies-page .cs-expanded-text-container .cs-person {display:inline-block; padding-right:10px;}
.case-studies-page .cs-expanded-text-container .cs-person img {width:140px; height:140px; margin-bottom:10px; margin-top:10px;}
.case-studies-page .cs-expanded-text-container .cs-person p { margin-right: 20px; font-style: italic; font-size: 20px; }
.case-studies-page .cs-expanded-text-container .cs-person span { font-size: 14px; }

.case-studies-page .cs-nav {display:flex; justify-content:space-between;}
.case-studies-page .cs-nav .cs-nav-item {text-align:center; width: 16.66%; margin-right:15px; cursor:pointer;}
.case-studies-page .cs-nav .cs-nav-item:last-child {margin-right:0}
.case-studies-page .cs-nav .cs-nav-item-inner { padding: 10px; position:relative }
.case-studies-page .cs-nav .cs-nav-item p {color:#fff; margin-bottom:0}
.case-studies-page .cs-nav .cs-nav-item.active .cs-nav-item-inner::after { content: ''; position: absolute; width: 0; height: 0; border-style: solid; border-width: 15px 15px 0 15px; bottom: -15px; left: 50%; transform: translateX(-50%) }

.case-studies-page .cs-case-study {width:100%; background-color:#f1f6f9; margin-top: 30px; display:none;}
.case-studies-page .cs-case-study.active {display:block}
.case-studies-page .cs-case-study .cs-case-study-inner { padding: 30px 100px 50px 30px; display: flex; justify-content: space-between }

.case-studies-page .cs-case-study .cs-left-col { margin-right: 60px; min-width: 230px; }
.case-studies-page .cs-case-study .cs-left-col img { width: 230px; height: 230px; }

.case-studies-page .cs-case-study .cs-right-col {width:100%}
.case-studies-page .cs-case-study .cs-right-col h2 { margin: 0 }
.case-studies-page .cs-case-study .subtitle { font-style:italic; margin-bottom: 40px;}
.case-studies-page .cs-case-study .cs-right-col h2,
.case-studies-page .cs-case-study .subtitle,
.case-studies-page .cs-case-study .copy p { font-size: 25px; }

.case-studies-page .cs-accordion-container {margin-top: 50px;}
.case-studies-page .cs-accordion { background-color: #fff; border-top: 3px solid; margin-bottom: 15px;}
.case-studies-page .cs-accordion-inner {padding: 20px 60px; position:relative;}
.case-studies-page .cs-accordion-inner .cs-question {font-weight:bold; width:70%}
.case-studies-page .cs-accordion-inner p { font-size: 23px; }

.case-studies-page .cs-accordion-inner:after {content:'+'; position:absolute; top:5px; right:15px; font-size:34px; font-weight:bold }
.case-studies-page .active .cs-accordion-inner:after { content: '-'; }

.case-studies-page .cs-accordion {cursor:pointer;}
.case-studies-page .cs-accordion-inner p.cs-question {margin-bottom:0;}

.case-studies-page .cs-accordion-inner .cs-answer { display: none; margin-top:20px; }
.case-studies-page .cs-accordion-inner .cs-answer.active {display:block;}

.case-studies-page .cs-accordion-inner .cs-question,
.case-studies-page .cs-accordion-inner .cs-answer { position: relative; }

.case-studies-page .cs-accordion-inner .cs-question span.lbl,
.case-studies-page .cs-accordion-inner .cs-answer span.lbl { position: absolute; left: -40px; font-weight: bold; font-size: 24px; top:1px; }

.case-studies-page .cs-left-col ul {margin-left:0; margin-top:40px}
.case-studies-page .cs-left-col li.cs-li-icon { list-style-type: none; padding-left: 65px; position:relative; margin-bottom:40px; font-size:17px; }
.case-studies-page .cs-left-col li.cs-li-icon:after {content:''; width:50px; height: 50px; background-position:center; background-repeat:no-repeat; background-size:contain; position:absolute; left:0; display:block; top:-12px}
.case-studies-page .cs-left-col li.cs-li-icon.pdf:after { background-image:url(/_assets/icon-pdf-blue.png); }
.case-studies-page .cs-left-col li.cs-li-icon.website:after { background-image: url(/_assets/icon-website-blue.png); }
.case-studies-page .cs-left-col li.cs-li-icon.twitter:after { background-image: url(/_assets/icon-twitter-blue.png); }

.case-studies-page .contacts {display:flex; flex-wrap:wrap; width:90%; margin-top:50px}
.case-studies-page .key-contact-panel {width: 50%; margin-bottom: 25px }
.case-studies-page .key-contact-panel-content { display: flex; align-items:center; }
.case-studies-page .key-contact-panel-image { width: 120px; height: 120px; background-size: cover; background-position: center; background-repeat: no-repeat; margin-right:15px}
.case-studies-page .key-contact-panel-info p { font-size: inherit; margin-bottom: 3px; line-height: 1.2em; color: inherit; font-size: 20px; color: #363636; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; }
.case-studies-page .key-contact-panel-info a { text-decoration: none; color: #363636 !important; }
.case-studies-page .key-contact-panel-info a:hover {text-decoration:underline}

.case-studies-page h2 {font-size: 25px; line-height: 1.2em; color: #58595b;}
.case-studies-page .intro-copy p {font-size: 25px; line-height: 1.2em; }

/* PRO BONO QUESTIONNAIRE */

.pro-bono-questionnaire p { font-size: 16px; color: #4d5357; }
.pro-bono-questionnaire .copy-container { padding:50px 100px 20px 0; }
.pro-bono-questionnaire .question-group { border-top: 1px solid #7E7E7E }
.pro-bono-questionnaire .q-row {display:flex; justify-content:space-between; padding: 30px 0}

.pro-bono-questionnaire .text .q-row { display: block; }
.pro-bono-questionnaire .text {}
.pro-bono-questionnaire .text li { margin: 0; font-size: 15px; }
.pro-bono-questionnaire .text ul { margin-top: 0; margin-left:20px}
.pro-bono-questionnaire .text p { font-size: 15px; }
.pro-bono-questionnaire .text .examples {margin:20px 0 5px 0 }

.pro-bono-questionnaire .text .q-thanks { border-top: 1px solid #bed42a; border-bottom: 1px solid #bed42a; padding:20px 0; margin-top:20px}
.pro-bono-questionnaire .text .q-thanks p {margin:0; font-weight:bold;}

.pro-bono-questionnaire .q-question { width: 450px; padding-right: 120px; }
.pro-bono-questionnaire .q-question p { margin: 0 }
.pro-bono-questionnaire .q-question .q-question-header {font-weight:bold;}
.pro-bono-questionnaire .q-question p:not(.q-question-header) { font-size:15px; }

.pro-bono-questionnaire .q-inputs { width: calc(100% - 450px); }
.pro-bono-questionnaire .q-hidden-input {display:none;}
.pro-bono-questionnaire input[type=text] { width: 100%; border: 1px solid #bed42a; padding: 10px 20px; margin-top: 20px; }
.pro-bono-questionnaire select { width: 100%; border: 1px solid #bed42a; padding: 10px 20px; -moz-appearance: none; -webkit-appearance: none;}
.pro-bono-questionnaire select::-ms-expand { display: none; }
.pro-bono-questionnaire .q-select-container {position:relative;}
.pro-bono-questionnaire .q-select-container:after {content: ''; position:absolute; right: 20px; top:50%; transform:translateY(-50%); width: 27px; height: 14px; background-position:center; background-size:contain; background-repeat:no-repeat; background-image:url(/_assets/icon-select-down.png) }

.pro-bono-questionnaire .q-radio-container {display:flex; flex-wrap:wrap}
.pro-bono-questionnaire .q-radio-container .rbLabel {width:50%; padding-right: 50px}
.pro-bono-questionnaire .q-radio-container .rbLabel span {display:block; line-height:1.4em;}
.pro-bono-questionnaire .q-radio-container .rbLabel span.q-radio-header { font-weight: bold }
.pro-bono-questionnaire .q-radio-container .rbLabel span:not(.q-radio-header) { font-size: 14px }

.pro-bono-questionnaire .inline .q-radio-container .rbLabel { width: auto; }
.pro-bono-questionnaire .inline .q-radio-container .rbLabel .radiobtn { top: 0px; }

.pro-bono-questionnaire .q-submit-container {display:flex; justify-content:space-between; align-items: center; margin:20px 0 50px 0}
.pro-bono-questionnaire .btn { color: #000; background-color: #bed600; padding: 20px 40px; font-weight: bold; font-weight: 400; font-family: 'Roobert'; font-size: 20px }

.pro-bono-questionnaire .q-error-text { color: red; margin-top: 10px !important; }

/* CUSTOM RADIO */
.pro-bono-questionnaire .rbLabel { display: block; position: relative; padding-left: 40px; margin-bottom: 12px; cursor: pointer; font-size: 16px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-left: 0 !important; line-height: 1.6em; }
.pro-bono-questionnaire .rbLabel input { position: absolute; opacity: 0; cursor: pointer; }
.pro-bono-questionnaire .radiobtn { position: absolute; top: 7px; left: 0; height: 20px; width: 20px; background-color: #fff; border: 1px solid #bed600; }
.pro-bono-questionnaire .rbLabel:hover input ~ .radiobtn { background-color: #eee; }
.pro-bono-questionnaire .radiobtn:after { content: ""; position: absolute; display: none; background-image: url(/_assets/checked.png); background-position: center; background-size: contain; background-repeat: no-repeat; }
.pro-bono-questionnaire .rbLabel input:checked ~ .radiobtn:after { display: block; }
.pro-bono-questionnaire .rbLabel .radiobtn:after { width: 15px; height: 15px; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%)}


/* BUTTON */
.btn-back { background-color: #263A3C; display: inline-block; font-size: 17px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; color: #ffffff; padding: 10px 15px; text-decoration: none; margin-bottom: 20px; transition: 0.2s ease-in-out; }
.btn-back img	{vertical-align:middle; display: inline-block; margin-right: 6px; transform: translateY(-1px);}
.btn-back:hover	{background-color:#000000}

/* FOOTER */
footer					{background-color:#000000; padding: 35px 0;}
footer ul				{font-size:0;}
footer ul li			{display:inline-block; vertical-align: top; margin-right: 15px;}
footer ul li a			{color:#ffffff; font-size: 14px; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; text-decoration: none;}
footer ul li a:hover	{color:#bed600}

/* COOKIE BAR */
.cookieBar              { width: 100%; background: url('/_assets/bg_cookiebar.png'); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999; box-sizing:border-box; -moz-box-sizing:border-box; }
.cookieBar p			{color:#ffffff; font-size:14px; font-family:inherit; line-height:1.5em; text-align:center; display:inline-block;}
.cookieBar .acceptBtn   {border:0px; background:#000; border:1px solid #DEDEDE; font-weight:bold; display:inline-block; margin-top:6px; margin-left:5px; font-family:inherit; font-size:12px; padding:5px 10px; text-decoration:none; color:#FFF; text-transform:uppercase; }



/* EXPLORE TRIGGER - ON THE LEFT */
.explore-container { position: fixed; left: 0; bottom: 60px; z-index: 50; font-size: 0; width: 34px; }
.explore-container .explore-trigger { display: inline-block; background-color: #58A518; color: #ffffff; font-size: 14px; padding: 10px 40px 10px 16px; transform: rotate(270deg); transform-origin: top left; position: absolute; left: 0; top: 100%; text-decoration: none; cursor: pointer; white-space: nowrap; }
.explore-container .explore-trigger:after { content: ""; position: absolute; right: 15px; top: 50%; margin-top: -6px; width: 10px; height: 12px; transform: rotate(90deg); background-image: url("/_assets/icon-chevron-right.png"); background-size: cover; background-position: center; background-repeat: no-repeat; }

.explore-container ul { list-style: none; /*width: 325px;*/ font-size: 14px; font-weight: 500; font-family: 'Roobert', "sans-serif"; display: inline-block; left: -325px; position: relative; z-index: 0; transition: 0.2s ease-out; }
.explore-container ul li { margin-bottom: 3px; line-height: 1.3em; position: relative; width: 300px; }
.explore-container ul li:last-child { margin-bottom: 0; }
.explore-container ul li a { width: auto; display: block; padding: 10px 50px 10px 10px; background-color:#CBE3B7; text-decoration: none; color: #000000; font-size: 14px; white-space: nowrap; }
.explore-container ul li a:after { content: ''; width: 20px; height: 20px; position: absolute; right: 12px; top: 50%; margin-top: -10px; background-image: url("/_assets/icon-chevron-dark.png"); background-size: cover; }
.explore-container ul li a:hover { background-color: #58A517; color: #ffffff; }
.explore-container ul li a:hover:after { background-image: url("/_assets/icon-chevron.png"); }

.explore-container ul li > ul { display: block; position: absolute; bottom: 0; left: 100% !important; width: 0; overflow: hidden; -moz-transition: .2s linear; transition: .2s linear; }
.explore-container ul li.active > ul { width: 100%; border-left: 3px solid #5382ab; }
 
.explore-container.active ul { left: 34px }
.xxexplore-container.active .explore-trigger			{background-color: #5382ab;}
.explore-container.active .explore-trigger:before { width: 18px; height: 18px; background-size: cover; position: absolute; top: 50%; margin-top: -9px; right: -20px; content: ''; background-image: url(/_assets/icon-close-dark.png); }
.explore-container.active .explore-trigger:after { transform: rotate(270deg); }
.xxexplore-container .explore-trigger 				{display:inline-block; background-image: url(/_uploads/buttons/btn-explore.gif); background-size: 50px auto; background-repeat: no-repeat; background-position: bottom; vertical-align: bottom; width: 50px; z-index: 1; position: absolute; bottom: 0; height: 100%;}


/* SPINNER - loading.io */

.lds-ring { display: inline-block; position: fixed; top: 50%; left: 50%; margin-left: -32px; margin-top: -32px; width: 64px; height: 64px; z-index: 100001; }
.lds-ring div { box-sizing: border-box; display: block; position: absolute; width: 51px; height: 51px; margin: 6px; border: 6px solid #975385; border-radius: 50%; animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; border-color: #975385 transparent transparent transparent; }
.lds-ring div:nth-child(1) { animation-delay: -0.45s; }
.lds-ring div:nth-child(2) { animation-delay: -0.3s; }
.lds-ring div:nth-child(3) { animation-delay: -0.15s; }

@keyframes lds-ring {
   0% { transform: rotate(0deg); }
   100% { transform: rotate(360deg); }
}



/* IE10+ SPECIFIC STYLES GO HERE. IE10+ NO LONGER SUPPORT CONDITIONAL STATEMENTS IN THE HEAD OF A FILE */ 
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  

}


/* MOBILE STYLES */
@media (max-width: 1200px) 
{
    
}

@media (max-width: 1024px) 
{
    /* IPAD (LANDSCAPE) */
}

@media (max-width: 960px) 
{
    
}

@media (max-width: 768px) 
{
    /* IPAD (PORTRAIT) */
}

@media (max-width: 640px) 
{
  
}

@media (max-width: 414px) 
{
    /* IPHONE 6+, GOOGLE NEXUS 5X & GOOGLE NEXUS 6P */
}

@media (max-width: 375px) 
{
    /* IPHONE 6 */
}

@media (max-width: 360px) 
{
    /* SAMSUNG GALAXY S5 */
}

@media (max-width: 320px) 
{
    /* IPHONE 5 */
}