.hamburger  {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: 2100px)
{
	.content-hero-container-section {background-size: auto 100%}
}


/* MOBILE STYLES */
@media (max-width: 1260px) 
{
   /* HOME HERO CONTAINER */
   .home .content-hero-image                 {width: 66.5%}
   .home .content-hero-container-section h1   {font-size: 12vw} 
   
}

@media (max-width: 1000px) 
{
	/* MOBILE NAV */
	.hamburger 						   {width: 34px; height: 25px; flex-shrink: 0; z-index: 50; margin: 0; cursor: pointer; position: relative; display: block}
	.hamburger span 				   {width: 100%; display: block; height: 3px; background-color: var(--midBlue); position: absolute; top: 0; left: 0; transition: 0.2s ease-out; }
	.hamburger span:nth-child(1) 	{}
	.hamburger span:nth-child(2) 	{top: 11px;}
	.hamburger span:nth-child(3) 	{top:auto; bottom: 0;}

	.hamburger.open 	 				      {}
	.hamburger.open span:nth-child(1) 	{top: 9px; transform: rotate(45deg) scaleX(-1);}
	.hamburger.open span:nth-child(2) 	{opacity: 0; transform: scale(0)}
	.hamburger.open span:nth-child(3) 	{top: 9px; transform: rotate(-45deg) scaleX(-1);}
   
   nav      {position: fixed; visibility: hidden; opacity: 0; display: flex; flex-direction: column; padding: 120px 30px 30px; background-color: #ffffff; width: 100%; height: 100%; left: 0; top: 0; background-color: #ffffff;}
   nav.open {opacity: 1; visibility: visible; transition: 0.3s ease-out}
      
   nav ul               {flex-direction: column; font-size: 22px; justify-content: flex-start; align-items: flex-start; overflow-y: auto;}
   nav ul li:after      {display: none}
   nav ul li a          {color: var(--blue)}
   nav ul li ul         {left: auto; top: auto; position: relative; font-weight: 400; font-size: 18px; padding: 0 0 0 16px; margin: 18px 0 0} 
   nav ul li ul:before  {border-left: 1px solid var(--blue); content: ''; left: 0; top: 0; bottom: 0; display: block; position: absolute}
   nav ul li ul li a    {color: #434257;}
   
   nav ul li.nav-apply-now          {margin-left: 0}
   nav > ul > li.nav-apply-now > a  {font-size: 22px; font-weight: 400; padding: 0; background: transparent}
   nav ul li.nav-apply-now ul li a  {font-weight: 400}
   
   nav ul li.nav-apply-now:hover ul {top: auto}
   
   nav ul li ul {border-radius: 0 !important}
   
   /* OUR PROCESS */
   .process {width: 20%}
   
   /* PROJECT LISTING */
   .grid {grid-template-columns: repeat(3, 1fr);}
   
}

@media (max-width: 980px) 
{
   
   /* CONTENT HERO HEADER */
   .content-hero-text   {padding-left: 0}
   
   /* GRADIENT TEXT SECTION */
   .gradient-text-section .col-gradient   {padding-left: 0; padding-right: 30px;}
   .gradient-text-section .col-text       {padding-left: 40px}
   
   /* PROJECT PAGE */
   .content-hero-container-alt-section          {background-image: none !important; flex-direction: column; padding: 0; gap: 25px;}
   .content-hero-container-section.content-hero-container-alt-section .inner   {padding:0}
   .content-hero-container-alt-section ul.breadcrumbs    {display: none}
   
   .content-hero-container-alt-section picture img {position: relative;}
   .content-hero-container-alt-section .content-hero-text   {width: 100%;}
      
   /* FOOTER */
   .footer-sign-up      {margin-bottom: 40px}
   .footer-top .cols    {flex-direction: column}
   .col-sign-up         {width: 100%}
   .col-footer-sub-nav  {padding-left: 0}
   
}

@media (max-width: 900px) 
{
   /* TWO COL CAROUSEL */
   
   .two-column-carousel-section  {padding-top: 50px; padding-bottom: 70px;}
   
   .two-col-carousel-container   {padding-top: 30px;}
   
   .two-col-carousel-container .slick-dots   {margin-top: 50px;}
   
   .tcc .cols        {flex-direction: column; gap: 30px;}
   .tcc-col-left     {width: 100%; text-align: center; padding: 0;}
   .tcc-col-left h3  {padding:10px 80px 20px 80px;}
   .tcc-col-right    {width: 100%;}
   
   .two-col-carousel   {max-width: 100%;}
   
   .two-col-carousel-container .slick-arrow  {top: 40px; transform: translateY(0)}

}

@media (max-width: 860px) 
{
   /* HOME HERO CONTAINER */
   .home .content-hero-container-section h1  {font-size: 107px;}
   .home .content-hero-container-section p   {font-size: 38px;}
   
   /* OUR PROCESS */
   .process-timeline                   {margin: 50px 0; padding-bottom: 50px;}
   .process-timeline ul.slick-dots     {position: absolute; left: 0; bottom: 0; display: flex; width: 100%; justify-content: center; font-size: 0; list-style: none; gap: 12px;}
   .process-timeline ul.slick-dots li  {width: 58px; height: 6px; background-color: var(--midBlue); border-radius: 10px; opacity: 0.5}
   .process-timeline ul.slick-dots li.slick-active {opacity: 1;}
   
   .process-timeline p  {width: 100%;}
   
   /* LISTING CARD SECTION */
   .listing-card-section .cols   {flex-direction: column}
   
   /* PROJECT LISTING INTRO */
   .project-listing-intro .btn-back   {display: none}
   
}

@media (max-width: 767px) 
{
   /* HOME HERO CONTAINER */
   .home .content-hero-container-section                             {min-height: unset; padding-top: 0; background-image: url(/_uploads/header-images/FULL_SIZE-COLOUR-OVERLAY-mb.webp)}
   .home .content-hero-container-section .inner                      {flex-direction: column}
   .home .content-hero-container-section p                           {margin-bottom: 20px}
   .home .content-hero-image                                         {position: relative; bottom: auto; right: auto; width: 100%; max-width: 500px;}
   .home .content-hero-container-section .content-hero-text          {text-align: center; padding: 0}
   .home .content-hero-container-section .content-hero-text .buttons {margin-top: 0px; margin-bottom: 30px; justify-content: center;}
   
   /* CONTENT HER CONTAINER */
   .content-hero-container-section        {background-image: url(/_uploads/header-images/FULL_SIZE-COLOUR-OVERLAY-mb.webp)}
   .content-hero-container-section .inner {flex-direction: column; align-items: flex-start; padding-top: 120px;}
   .content-hero-text   {padding-left: 0; height: auto; transform: translateY(0); width: 100%;}
   .content-hero-image  {margin: auto; max-width: 500px; width: 100%;}
   .content-hero-text p {max-width: 100%;}
   
   /* INTRO TEXT */
   .masonry-grid-section,
   .intro-text-section,
   .our-process-section,
   .card-slider-section,
   .listing-card-section,
   .apply-form-section     {padding: 50px 0}
   
   /* MASONRY */
   .masonry-grid-section .button {margin-top: 30px;}
   
   /* GRADIENT TEXT SECTION */
   .gradient-text-section .cols  {flex-direction: column}
   .gradient-text-section .col-gradient   {padding-right: 0; padding-top: 30px; padding-bottom: 40px; width: 100%;}
   .gradient-text-section .col-gradient:before  {right: -30px;}
   .gradient-text-section .col-text       {padding-left: 0; padding-top: 30px;}
   
   /* PROJECT LISTING */
   .grid {grid-template-columns: repeat(2, 1fr);}
   
   /* APPLY NOW */
   .inner-form                {width: 100%}
   .apply-form-section        {background: linear-gradient(-145deg, rgba(145, 184, 228, 1) 0%, rgba(255, 255, 255, 1) 100%);}
   .apply-form-section .cols  {flex-direction: column; gap: 10px}
   .apply-form-section .col:nth-child(1)  {width: 100%}
}

@media (max-width: 650px) 
{
   /* FOOTER */
   .col-footer-sub-nav        {display: none}
   .footer-middle             {margin-top: 0;}
   .footer-middle ul li:after {width: 35px;}
   .footer-sign-up p          {font-size: 15px;}
   .footer-logos img          {height: 40px;}
}

@media (max-width: 600px) 
{
   /* PROCESS TIMELINE */
   .full-process-timeline  {padding-left: 20px; padding-right: 20px;}
   .timeline-item {width: 100%; text-align: left !important; padding-left: 35px !important; padding-right: 0 !important;}
   .timeline-item:before {left: -16px !important}
   .timeline-item:after {left: -1px !important}
   
   .arrow-controls-outer   {justify-content: center; margin-top: 30px;}
   .arrow-controls         {gap: 30px;}
}

@media (max-width: 500px) 
{
   
   /* CONTENT HERO CONTAINER */
   .content-hero-text h1   {font-size: 70px;}
   
   /* PROJECT LISTING */
   .grid {grid-template-columns: repeat(1, 1fr);}
   
   /* FOOTER */
   .sign-up-input             {flex-direction: column; align-items: flex-start}
   .footer-sign-up            {padding-left: 30px; padding-right: 30px;}
   .sign-up-input .form-cell  {width: 100%}
   
   /* APPLY NOW */
   .form-row   {flex-direction: column}
   .form-cell  {width: 100%;}
}

@media (max-width: 375px) 
{
    /* IPHONE 6 */
}

@media (max-width: 360px) 
{
    /* SAMSUNG GALAXY S5 */
}

@media (max-width: 320px) 
{
    /* IPHONE 5 */
}