﻿.nav-icon	{display:none}

/* 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) {  

}


@media (max-width: 1265px) {

	/* PEOPLE GRID */
	.panel-person.right-person .panel-person-text-hidden	{right:-11px}
	.case-studies-page .contacts {width: 100%}
}
	
@media (max-width: 1150px) 
{
    /* HERO GRID */
	.hero-panel-text p.find-out-more		{font-size:16px; line-height: 1em;}
	.hero-panel-text p.find-out-more span	{font-size:28px; transform: translateY(3px);}
	
	/* PANEL GRID */
	.panel-listing-section .video-panel .panel-text:before	{width:60px; height: 60px; margin-left: -30px; margin-top: -170px;}
	.panel-listing-section .panel-text	{padding:20px;}
	.panel-listing-section .panel h2	{font-size:20px;}
	.panel-listing-section .panel .panel-icon	{top:17px;}
}

@media (max-width: 1070px) {

	.case-studies-page .cs-nav .cs-nav-item {width:calc(33.33% - 10px); margin-bottom:20px;}
	.case-studies-page .cs-case-study { margin-top:0;}
	.case-studies-page .cs-nav .cs-nav-item:nth-child(3n) { margin-right: 0; }
	.case-studies-page .cs-nav { flex-wrap: wrap; }
}

	

@media (max-width: 1050px) 
{
	/* PEOPLE GRID */
	.panel-person-text-hidden	{padding-left:230px; width:480px;}
	.panel-person.right-person .panel-person-text-hidden	{padding-right:230px;}

	.case-studies-page .cs-accordion-inner .cs-question {width:100%;}

	.pro-bono-questionnaire .q-question {padding-right:50px; width:250px}
	.pro-bono-questionnaire .q-inputs {width: calc(100% - 250px);}
}

@media (max-width: 1024px) 
{
	/* HEADER */
	.strapline img	{/*width:100px;*/}
	.logo			{margin-right:25px;}

	/* RELATED CAROUSEL */
	.related-carousel .col-4 .panel-image {width:100%;}
	
}

@media (max-width: 960px) 
{
	
	/* HEADER */
	.logo	{width:75px; height: auto}
	
    /* NAV */
	nav			{margin-top:31px;}
	nav ul li	{margin-right:10px; padding-right: 10px; font-size: 16px;}
	
	/* HERO LISTING */
	.hero-panel-image .text h2	{font-size:20px}
	
	/* LISTING INTRO */
	.listing-actions ul.types,
	.listing-actions ul	{float:none; display:block}
	
	.listing-actions ul.types		{margin-top:20px;}
	.listing-actions ul.types li	{margin-left:0; margin-right: 15px;}
	
	/* PANEL GRID */
	.panel-listing-section .col-4	{width:33.333%;}

	.case-studies-page .cs-case-study .cs-case-study-inner {padding-right:30px}
	.case-studies-page .key-contact-panel {width:100%}
}

@media (max-width: 810px) 
{
	/* NAV */
	/*nav			{float: none; opacity: 0; visibility: hidden; position: relative; transition: 0.2s ease-in-out; transform: translateY(-10px); margin-top: 0;}
	nav.open	{opacity: 1; visibility: visible; margin-top: 35px}*/

    nav {position: fixed; width: 100vW; height: 100vH; bottom: 100vh; background-color: #000000; display: table; margin: 0; float: none; overflow: scroll; transition: 0.2s ease-out; z-index: 999; margin-left: -10px; display:none; }
    nav.open {visibility: visible; opacity: 1; bottom: 0; position:fixed; display:block;}
    nav ul { top: 15%; position: absolute; margin-left: 27px; }
    nav ul li { display: block; border: none; font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; font-size:25px; margin-bottom: 30px;}
    nav ul > li > ul { left: 0; padding: 0; position: relative; margin-left: 0; margin-bottom: -10px; }
    nav ul > li > ul > li { font-weight: 500; font-family: 'Roobert', Arial, Helvetica, "sans-serif"; font-size: 20px; padding-left: 0;  background-color:transparent; line-height: 30px;}
    nav ul > li > ul > li > a { color: #848484; }

    .logo-container.open { position: fixed !important; }
    .open .strapline {display:none;}
    .display-mobile {display:block !important;}

    .logo-container { z-index: 1000;}   
    .nav-icon { width: 40px; height: 30px; z-index: 99; position: absolute; right: 20px; top: 24px; cursor: pointer; display: block; z-index: 1000; }
    .nav-icon span { width: 100%; display: block; height: 4px; background-color: #bed600; position: absolute; top: 0; left: 0; border-radius: 1px; transition: 0.2s cubic-bezier(0, 0, 0.21, 1); }
    .nav-icon span:nth-child(1) { }
    .nav-icon span:nth-child(2) { top: 13px; }
    .nav-icon span:nth-child(3) { top: 26px; }

    .nav-icon.open {position:fixed;}
    .nav-icon.open span:nth-child(1) { top: 13px; transform: rotate(45deg) }
    .nav-icon.open span:nth-child(2) { opacity: 0; transform: scale(0) }
    .nav-icon.open span:nth-child(3) { top: 13px; transform: rotate(-45deg) }
	
	/* PEOPLE LISTING */
	.panel-listing-section .col-5	{width:50%;}
	
	.panel-person-text-hidden,
	.panel-person.right-person .panel-person-text-hidden	{position:absolute; top: auto; right: auto; bottom: auto; left: auto; padding: 20px; width:100%;}
	.panel-person-image	{padding:20px; padding-bottom: 0; width: 215px; max-width: 100%; height: auto}
	.panel-person-text	{padding-left:20px;}
	
	.panel-person.active	{background-color: #064C43;}
	.panel-person.active .panel-person-text-hidden,
	.panel-person.active .panel-person.right-person .panel-person-text-hidden	{position:relative;}

	.pro-bono-questionnaire .copy-container {padding-right:0}
}


@media (max-width: 768px) 
{
	.inner		{padding: 0 10px;}
	.wrapper	{padding: 0 10px;}
	
	/* HERO LISTING */
	.col-container.hero-grid .col-4	{width: 50%;}
	.hero-panel-image img			{width:100%;}
	.hero-panel.top					{display:block; flex-direction: unset;}
	.hero-panel-text				{margin-top:0}
	
	.carousel-text 					{padding-left: 60px; padding-right: 60px;}
	.carousel-text h2 {margin-top: 20px; margin-bottom: 20px; }
	
	/* PAGE HEADER */
	.page-header h1	{font-size:47px;}
	
	/* PANEL GRID */
	.panel-listing-section .col-4	{width:50%;}
	.panel-listing-section .panel-image	{width:100%;}
	
	/* TEXT PAGE */
	.article-inner.inner	{padding-top:35px; padding-bottom: 35px;}
	article .left-image,
	article .right-image	{float:none; margin: 1em 0; width: 100%;}
	
	/* Article 2 PAGE */
	.article-inner .left-col,
	.article-inner .right-col {width: 100%; padding: 0px;}

	.cs-case-study-inner {flex-direction:column}
	.case-studies-page .cs-case-study .cs-left-col {margin-bottom:20px; margin-right:0}
	.case-studies-page .cs-case-study .cs-left-col img,
	.case-studies-page .cs-case-study .cs-left-col ul { display: inline-block; vertical-align: top; margin-right: 20px; margin-top: 0 }
	.case-studies-page .cs-case-study .cs-left-col li:first-child {margin-top: 10px;}
	.case-studies-page .cs-case-study .subtitle {margin-bottom:20px;}

	.case-studies-page .cs-text-inner {padding-right:0}

	.pro-bono-questionnaire .q-row {flex-direction:column}
	.pro-bono-questionnaire .multi-row .q-row:last-child { padding-top:0 }
	.pro-bono-questionnaire .q-question { padding-right: 0; width: 100% }
	.pro-bono-questionnaire .q-inputs { width: 100%; margin-top: 20px }
}

@media (max-width: 720px) {
	.case-studies-page .cs-expanded-text-container .cs-text-col { width:100%; padding-right:0 !important;}
	.case-studies-page .cs-expanded-text-container { flex-direction:column;}
}

@media (max-width: 600px) {
	/* HEADER */
	.logo { margin-right: 15px; }
	.strapline img { padding-right: 10px; /*width: 75px;*/ }
	.strapline p { font-size: 16px; margin-left: 10px; }

	/* LISTING PAGE */
	.listing-actions ul.filters li a { font-size: 14px; padding: 8px; }
	article .image-left img { float: none; margin-bottom: 20px; }
}

@media (max-width: 565px) {
	.case-studies-page .cs-case-study .cs-left-col img {width:175px; height:175px}
	.case-studies-page .cs-case-study .cs-left-col {margin-bottom:0}
	.case-studies-page .cs-nav .cs-nav-item { width: calc(50% - 10px); }
	.case-studies-page .cs-nav .cs-nav-item:nth-child(3n) { margin-right: 15px; }
	.case-studies-page .cs-nav .cs-nav-item:nth-child(2n) { margin-right: 0; }
	.pro-bono-questionnaire .q-radio-container .rbLabel { padding-right:20px;}
}

@media (max-width: 505px) {
	.case-studies-page .cs-case-study .cs-left-col ul {display:block; margin-top: 30px; margin-bottom:0}
	.case-studies-page .cs-left-col li.cs-li-icon:after {width:40px; height:40px; top:-7px}
	.case-studies-page .cs-left-col li.cs-li-icon {margin-bottom:25px}
	.case-studies-page .cs-accordion-inner p { font-size:16px;}
	.case-studies-page .key-contact-panel-info p { font-size:16px }

	.pro-bono-questionnaire .q-submit-container {flex-direction:column;}
	.pro-bono-questionnaire .btn {margin-top: 20px;}
	.pro-bono-questionnaire .captcha .q-error-text {text-align:center}
}

@media (max-width: 500px) {
	.wrapper { padding: 0 }
	.inner { padding-left: 27px; padding-right: 27px; }
	.nav-icon { right: 27px; }

	/* HEADER */
	header { padding-bottom: 35px; }
	.logo { display: block; width: 80px; margin-right: 15px; margin-bottom: 40px; }
	.strapline img { display: block; /*width: 127px; */border: none; margin-bottom: 10px; }
	.strapline p { display: block; margin-left: 0; font-size: 19px; }


	/* HERO CAROUSEL */
	.hero-carousel-container { margin-top: 0; margin-bottom: 30px; }
	.hero-carousel .slide { height: 419px; padding-top: 0px; }
	.carousel-text { padding: 27px; vertical-align: top; }
	.carousel-text h1 { font-size: 56px; }
	.carousel-text p { margin-bottom: 8px; font-size: 28px; }
	.hero-carousel .slick-arrow { top: auto; bottom: 27px; }
	.carousel-text h2 { font-size: 20px; margin-bottom: 70px; }

	/* HERO LISTING */
	.col-container.hero-grid { width: 100%; margin: 0 }
	.col-container.hero-grid .col-3,
	.col-container.hero-grid .col-4 { padding: 0; width: 100%; }
	.hero-panel-text { margin-top: 0; padding: 27px; }
	.hero-panel-text p { width: 90%; }
	.hero-panel.top .hero-panel-text { margin-bottom: 0 }
	.hero-panel-text p.find-out-more { font-size: 20px; }
	.hero-panel-text p.find-out-more span { font-size: 34px; }
	.hero-panel-image .text h2 { font-size: 28px }

	/* FOOTER */
	footer .wrapper { padding-left: 27px; }
	footer ul li { margin-right: 10px; }
	footer ul li a { font-size: 12px; }

	/* LISTING PAGE */
	.listing-actions ul.filters li { display: block; margin-bottom: 10px; }
	.listing-actions ul.filters li a { display: inline-block; font-size: 16px; padding: 12px 10px; }

	/* PANEL GRID */
	.panel-listing-section .col-container { text-align: center; }
	.panel-listing-section .col-4 { width: 375px; max-width: 100%; text-align: left }
	.panel-listing-section .col-5 { text-align: left; margin-bottom: 0 }

	/* CAROUSEL NAV */
	.carousel-actions h2 { display: block }
	.carousel-actions .carousel-nav { float: none; display: inline-block }

	/* PEOPLE LISTING */
	.panel-listing-section .col-5 { width: 100%; }
	.panel-person-image { width: 250px; }

	nav { margin-left: -27px; display: none; }
}

@media (max-width: 470px) {
	.case-studies-page .key-contact-panel-content {display:block}
	.case-studies-page .key-contact-panel-image {margin-bottom: 10px;}

	.pro-bono-questionnaire .q-radio-container .rbLabel {width:fit-content;}
	.pro-bono-questionnaire .radiobtn {top:4px;}
}

@media (max-width: 414px) {
	.case-studies-page .cs-case-study .cs-case-study-inner {padding:15px;}
	.case-studies-page .cs-nav .cs-nav-item {width:100%; margin-right:0 !important}
	.pro-bono-questionnaire .q-radio-container {flex-direction:column}
}

@media (max-width: 375px) {
	/* IPHONE 6 */
	.case-studies-page .cs-accordion-inner { padding: 20px 35px 20px 60px; }
}
@media (max-width: 360px) {
	/* HEADER */
	.strapline p { font-size: 16px; }

	/* NAV */
	nav ul li { padding-right: 8px; margin-right: 8px; }

	.case-studies-page .key-contact-panel-info p {font-size:14px;}
}

@media (max-width: 320px) {
	/* IPHONE 5 */
}