﻿.logo-mb,
.hamburger,
nav li.mb-nav,
.mobile-offices,
.mobile-footer-nav,
.mobile-third-level-actions	{display: none}

/* MOBILE STYLES */
@media (max-width: 1150px) 
{
    /* HERO NAV */
	.hero-nav ul li		{font-size: 13px; height: 90px;}
	.hero-nav ul li a	{padding-left: 20px; padding-right: 20px; height: 100%;}
	.hero-nav ul li img	{margin-right: 15px; height: 40px;}
	
	/* CASE STUDY CAROUSEL */
	.case-study-carousel-section		{padding-bottom: 100px;}
	.slick-arrow.slick-prev				{left: 30px;  top:auto; margin-top: 0; bottom: -50px;}
	.slick-arrow.slick-next				{right: 30px; top:auto; margin-top: 0; bottom: -50px;}
	.case-study-carousel .col-image		{width: 500px; margin-right: 0}
	
}

@media (max-width: 1050px) 
{
    /* HEADER */
	nav ul				{font-size: 12px;}
	.logo .logo-dk 		{width:200px;}
	
}

@media (max-width: 940px) 
{
	/* HEADER */
    .logo .logo-dk 		{display: none}
    .logo .logo-mb 		{display: block; width:58px;}

    /* HERO NAV */
	.hero-nav ul li		{font-size: 12px; height: 90px;}
	.hero-nav ul li a	{padding-left: 15px; padding-right: 15px;}
	.hero-nav ul li img	{height: 40px; margin-right: 10px;}
	
	/* TILE SECTION */
	.tile	{width:200px; height: 200px;}
	
	/* FOOTER */
	.col-contact .cols	{flex-direction: column;}
	footer .inner		{justify-content: space-between;}
	
	footer .col-contact,
	footer .col-quicklinks,
	footer .col-follow		{flex: 1; width:auto; margin: 0}
	.search-box				{width:auto;}
	
}

@media (max-width: 860px) 
{
	/* TILE SECTION */
	.tile	{width:200px; height: 200px;}
	
	/* FLOATER EXPANDERS */
	.floater-expander .col-text	{width:100%; margin-bottom: 30px; padding-right: 0}
	.floater-expander .cols		{display: block; width:650px; max-width: 100%; margin: auto}
	.tiles-text .col-tiles		{width:100%;}
	.text-image .col-text		{padding-top: 0}

	
	/* CASE STUDY CAROUSEL */
	.case-study-carousel-section		{width:700px; max-width: 100%; margin-left: auto; margin-right: auto}
	.case-study-carousel-section .cols	{flex-direction: column-reverse;}
	.case-study-carousel .col-image		{width:100%;}
	.case-study-carousel .col-text		{width:100%; margin-top: 40px;}
	
	/* TESTIMONIALS */
	.testimonials			{text-align: center}
	.testimonials .inner	{width:700px;}
	.testimonial-carousel	{width:414px; margin: auto}
	
	/* GREY PANEL SECTION */
	.grey-panel-section .inner-narrow	{width:700px;}	
	.grey-panel-section .cols			{justify-content: center;}
	.grey-panel-section .col			{width:100%;}
	
	/* GET A QUOTE */
	.form-bg-image .form-panel		{margin: auto}
	
	/* TWO COL FLOW TEXT */
	.two-text-flow-col					{padding-bottom: 20px;}
	.two-text-flow-col .inner-narrow	{width:700px;}

	/* TEX TWO COL */
	.two-col-text				{padding-bottom: 20px;}
	.two-col-text .inner-narrow	{width:700px;}
	
	/* SUPPORT CENTRE */
	.video-listing					{padding-top: 30px;}
	.video-listing .inner-narrow	{width:700px;}

	/* TEXT PAGE WITH CONTENT */
	.two-col-contents .cols	{flex-direction: column-reverse;}
	.two-col-contents .col	{width:100%;}
	.big-pullout			{margin-bottom: 2.5em;}
	
	.text-one-col				{padding-top: 20px;}
	.text-one-col .inner-narrow	{width:700px;}
	
}

@media (max-width: 810px) 
{
	/* HEADER */
	header				{padding: 20px 0; background-color: #f3f4f5; /*position: relative*/}
	header.fixed		{position: fixed; left: 0; top:0}
	
	header.fixed nav ul	{height: auto}
	
	.header-top			{display: none}
	.nav-container		{position: fixed; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height:100%; background-color: #eb212d; left: -110%; top:0;}
	nav					{overflow-y: auto; padding: 20px 0}
	nav li.mb-nav		{display: block}
	nav ul				{display: flex; flex-direction: column; font-size: 16px; text-align: center; height: auto}
	nav ul li			{margin: 8px 0; justify-content: center}
	nav ul li a			{color:#ffffff; justify-content: center;}
	nav ul li a:hover	{opacity: 0.5; color:#ffffff}
	
	nav ul li:hover ul		{left: -99999px}
	
	nav ul ul				{display: block; position: fixed; left: -99999px; top:0; width:100%; height:100%; text-align: left; font-size: 14px; padding-top: 66px; padding-left: 30px; letter-spacing: 0}
	nav ul ul li			{background-position: left top 6px;}
	nav ul ul li a			{color:#eb212d; padding: 10px 30px;}
	nav ul ul li a:after	{display: none}
	nav ul ul li:hover 		{background-color: #ffffff;  }
	nav ul ul li:hover a	{color:#eb212d}
	nav ul ul li:hover ul	{left: auto !important}
	
	nav ul ul ul			{position: relative; left: auto !important; font-size: 12px; background-color: #ffffff; padding: 0}
	nav ul ul ul li a		{color:rgba(0,0,0,0.7); padding: 5px 30px;}
	nav ul ul ul li:hover a	{color:rgba(0,0,0,0.7)!important}
	
	nav ul ul.second-level.active	{left: 0; overflow-y: auto;}
	
	.nav-container.open		{left:0;}
	
	.mobile-offices		{display: block;}
	.mobile-offices p	{font-size: 16px; text-transform: uppercase; color:#ffffff; margin-bottom: 0.5em;}
	.mobile-offices p a	{color:rgba(255,255,255,0.8); text-decoration: none; font-weight: 600}
	.mobile-offices hr	{display: block; margin: 35px auto 40px; width: 116px; border-color:#ffffff;}
	
	.mobile-third-level-actions				{display: flex; width: 100%; padding: 30px; justify-content: space-between; position: absolute; left: 0; top:0; z-index: 20}
	
	.close-nav	{width: 13px; height: 12px; background-image: url(/_assets/icon-close-white.svg); background-size: 13px 12px; z-index: 1; position: absolute; right:30px; top:30px;}
	
	.mobile-third-level-actions .mb-close	{width: 13px; height: 12px; background-image: url(/_assets/icon-close.svg); background-size: 13px 12px;}
	.mobile-third-level-actions .mb-back	{width: 11px; height: 14px; background-image: url(/_assets/icon-back.svg); background-size: 11px 14px;}
	
	.hero-container	{margin-top: 72px;}
	
	/* HAMBURGER */
	.hamburger							{width:36px; height: 26px; position: absolute; top:50%; margin-top: -13px; right: 25px; display: block; cursor: pointer;}
	.hamburger span						{width:36px; height: 4px; background-color: #eb212d; display: block;}
	.hamburger span:nth-child(2)		{margin: 7px 0;}
	
	/*
	.hamburger.active span:nth-child(2)	{display: none}
	.hamburger.active span:nth-child(1)	{position: absolute; left: 0; top:9px; transform: rotate(45deg);}
	.hamburger.active span:nth-child(3)	{position: absolute; left: 0; top:9px; transform: rotate(-45deg);}
	*/
	
	/* HERO CONTAINER */
	.hero-container .hero-text		{padding-bottom: 50px;}
	.hero-container .hero-text h1	{font-size: 30px;}
	
    /* HERO NAV */
	.hero-nav ul li					{font-size: 16px; height: auto; width: 100%; border-top: 1px solid #d3d5d9}
	.hero-nav ul li:first-of-type	{border-top: none}
	.hero-nav ul li:last-of-type	{border-bottom: 1px solid #d3d5d9}
	.hero-nav ul li a				{padding-left: 25px; padding-right: 25px; background-color: #ffffff;}
	.hero-nav ul li img				{height: 48px; margin-right: 15px;}
	.hero-nav ul li a:before		{display: none !important}
	.hero-nav ul li a:after			{width:100%; left: 0}
	
	/* HERO SUB NAV */
	.hero-sub-nav	{display: none}
	
	/* WWD ITEM */
	.text-bullets .inner-narrow			{width:700px;}
	.text-bullets .inner-narrow .cols	{flex-direction: column;}
	.text-bullets .col-text				{width:100%; margin-bottom: 30px;}
	.col-bullets						{width:100%; padding-left: 0;}
	
	/* CASE STUDY LISTING */
	.case-study-listing .cols	{flex-direction: column-reverse; padding-top: 0}
	.cs-col-testimonial			{width:100%; margin-bottom: 15px;}
	
	
}

@media (max-width: 660px) 
{
	h2	{font-size: 22px;}
	p	{font-size: 14px;}
	
	/* HERO NAV */
	.hero-nav ul li a		{padding-top: 20px; padding-bottom: 20px;}
	
	/* HOME EXPANDERS */
	.floater-expander		{padding-top: 30px; padding-bottom: 40px;}
	.floater-expander h2	{width:calc(100% - 100px); font-size: 23px;}
	.floater-expander .tile	{margin-bottom: 20px;}
	.tiles-text .cols		{width:414px;}
	.col-text p				{font-size: 14px;}
	
	/* CASE STUDY CAROUSEL */
	.case-study-carousel-section			{padding-top: 45px; padding-bottom: 80px;}
	.case-study-carousel-section h2			{font-size: 22px; padding-left: 30px; margin-bottom: 25px;}
	.case-study-carousel-container .inner-narrow	{padding-left: 0; padding-right: 0}
	.case-study-carousel .col-text			{}
	.slick-arrow.slick-prev					{left: 30px;}
	.slick-arrow.slick-next					{right: 30px;}
	.cs-intro								{margin-bottom: 20px;}
	
	/* TESTIMONIAL CAROUSEL */
	.testimonials			{padding-top:40px; padding-bottom: 40px;}
	.testimonials h2		{font-size: 22px;}
	.testimonial-carousel-container .carousel-nav .slick-prev	{left: 0;}
	.testimonial-carousel-container .carousel-nav .slick-next	{right: 0;}
	.testimonial-carousel	{width:calc(100% - 100px); max-width: 100%;}
	
	/* GET A QUOTE */
	.form-bg-image				{padding: 0}
	.form-bg-image .inner		{padding: 0}
	.form-bg-image .form-panel	{padding:40px 30px 20px; width:100%;}
	.form-panel h2				{font-size: 22px;}
	.form-cell label			{font-size: 14px;}
	
	/* WWD ITEM */
	.col-bullets ul	{font-size: 14px;}
	
	/* CASE STUDY LISTING */
	.cs-col-testimonial				{padding: 30px;}
	.cs-col-text p					{font-size: 14px;}
	.cs-col-testimonial blockquote	{font-size: 16px;}
	.cs-col-testimonial cite		{font-size: 14px;}
	
	/* TWO COL FLOW TEXT */
	.two-text-flow-col .col-text {column-count: 1;}	
	
	/* SORT BY */
	.sort-by ul li:first-of-type	{width:100%; margin-bottom: 20px; border-right: none}
	.sort-by ul li:nth-child(2)		{padding-left: 0}

	/* TEX TWO COL */
	.two-col-text			{padding-top: 40px;}
	.two-col-text .cols		{flex-direction: column}
	.two-col-text .col		{width:100%; margin-bottom: 20px;}

	/* SUPPORT CENTRE */
	.video-listing					{padding-bottom: 20px; padding-top: 0}
	.video-listing .cols .col		{width: 100%;}
	.two-col-resource .col .col-text	{column-count: 1}
	
	/* TEXT PAGE WITH CONTENTS */
	.big-pullout	{padding:40px 30px; margin-bottom: 0}
	.big-pullout p	{font-size: 22px}
	
	/* FOOTER */
	.footer-top,
	.footer-logos 	{display: none}
	footer			{background-color: #ffffff; padding: 0}
	footer p		{color:#000000; margin: 0}
	footer p a		{color:#eb212d !important}
	.footer-bottom	{padding: 25px 0}
	
	.mobile-footer-nav			{display: flex; background-color: #333333; list-style: none; justify-content: space-between; align-items: center; padding: 20px 30px;}
	.mobile-footer-nav li:hover	{opacity: 0.5}
    .mobile-footer-nav img {height: 32px;}
    
}

@media (max-width: 500px) 
{
	/* HERO CONTAINER */
	.hero-container .hero-text			{width:280px; max-width: 100%;}
	.hero-container .hero-text h1 br	{display: none}
	
	/* HOME EXPANDERS */
	.floater-expander .tile	{width:calc(50% - 10px); height: 41vw;}
	.tile p					{font-size: 12px;}
	.tile-image img			{height:85px;}
	.floater-expander h2	{width:calc(100% - 20px);}
	
	/* GET A QUOTE */
	.form-row				{flex-direction: column;}
	.form-row .form-cell	{width:100%;}
	
}

@media (max-width: 413px) 
{
	.floater-expander.green h2	{font-size: 22px;}
	
	/* SORT BY */
	.sort-by ul		{font-size: 14px;}
	.sort-by ul li	{padding: 0 15px;}
		
}

@media (max-width: 360px) 
{
	/* FLOATER EXPANDER */
	.floater-expander .tile		 		{height: 37vw; padding-bottom: 12px;}
	.floater-expander .tile-image img 	{height: 65px;}
}

@media (max-width: 320px) 
{
    /* IPHONE 5 */
}