/*

	Query CSS
	Copyright (C) 2020 OwlTree Web Solutions.

*/

@media only screen and (min-width: 480px) and (max-width: 640px)
	{
		
		.logo-container img
		{
			/*width: 200px;*/
		}
		
		/*p.count
		{
			
			left: 19%;	
			margin: 10% 0 0 0%;
		}*/
		
		.team
		{
			width: 48%;
		}
		
		.team:nth-child(2)
		{
			text-align: inherit;
		}
				
	}




@media only screen and (min-width: 640px) and (max-width: 1024px)
	{
		

		.phone-number-header, .logo-container, .nav
		{
			display: block;
			/*width: 31%;*/
		}
		
		h2
		{
			font-size: 2em;
		}
		
		p.count
		{
			margin: -1em 0 -1em 0;
		}
		
		.col
		{
			width: 48%;
		}
		
		.service-link h3
		{
			font-size: 2em;
		}
		
		.cta-col h3
		{
			font-size: 2em;
		}
		
		.cta-col p
		{
			font-size: 1.7em;
		}
		
		.team
		{
			width: 48%;
		}
		
		.team:nth-child(2)
		{
			text-align: inherit;
		}
		
		.project-hover div
		{
			top: 15%;
		}
		
		.news-grid
		{
			width: 46%;
		}
		
		.news-grid h2, .news-grid h3
		{
			font-size: 2em;
		}
		
		.logo-grid
		{
			width: 31%;
		}
		
		
	}




@media only screen and (min-width: 1024px) and (max-width: 1280px)
	{
		
		.logo-container img
		{
			/*width: 40%;*/
		}
		
		.nav-horizontal
		{
			display: block;
		}
		
		.nav
		{
			display: none;
		}
		
		h1, h1.banner-h1, h2.section-strip-heading
		{
			font-size: 5em;
		}
		
		h2
		{
			font-size: 3em;
		}
		
		.banner-caption, .brands-protected
		{
			transform: translate(0, 6em);	
		}
		
		.banner-caption p
		{
			/*transform: translateY(4em);*/
			font-size: 4em;
		}
		
		p.count
		{
			margin: -1em 0 -1em 0;
		}
		
		.col
		{
			width: 48%;
		}
		
		.service-link
		{
			width: 47%;
		}
		
		.service-link h3
		{
			font-size: 2em;
		}
		
		.cta-col h3
		{
			font-size: 2em;
		}
		
		.cta-col p
		{
			font-size: 1.7em;
		}
		
		.team
		{
			width: 48%;
		}
		
		.team:nth-child(2)
		{
			text-align: inherit;
		}
		
		.news-grid
		{
			width: 46%;
	
		}
		
		.news-grid h2, .news-grid h3
		{
			font-size: 2.5em;
		}
		
		h3.newsletter-button
		{
			font-size: 4em;
		}
		
		.logo-grid
		{
			width: 23%;
		}
		
		footer
		{
			text-align: left;
		}
		
		.footer-left
		{
			width: 33%;
		}
		
		.footer-centre
		{
			width: 33%
		}
		
		.footer-right
		{
			width: 33%;
			text-align: right;
		}
		
	}




@media only screen and (min-width: 1280px)
	{
		
		.nav-horizontal
		{
			display: block;
		}
		
		.nav
		{
			display: none;
		}
		
		.sidenav a
		{
			font-size: 5em;
		}
		
		.logo-container img
		{
			/*width: 40%;*/
		}
		
		.banner-section
		{
			/*margin-top: 170px;*/
		}
		
		h1, h1.banner-h1, h2.section-strip-heading
		{
			font-size: 5em;
		}
		
		h2
		{
			font-size: 3em;
			line-height: 1.2em;
		}
		
		.banner-caption, .brands-protected
		{
			transform: translate(0, 8em);	
		}
		
		.banner-caption p
		{
			/*transform: translateY(4em);*/
			font-size: 4em;
		}
		
		p.count
		{
			font-size: 15em;
			margin: -1em 0 -1em 0;
		}
		
		p.protected
		{
			font-size: 3.5em;
			transform: translate(123%,385%);
		}
		
		.col
		{
			width: 48%;
		}
		
		.service-link
		{
			width: 47%;
		}
		
		.service-link h3
		{
			font-size: 2em;
		}
		
		.cta-col h3
		{
			font-size: 2em;
		}
		
		.cta-col p
		{
			font-size: 3em;
		}
		
		.team
		{
			width: 48%;
		}
		
		.team:nth-child(2)
		{
			text-align: inherit;
		}
		
		/*.timeline p
		{
			display: block;
			float: left;
			width: 50%;
			margin: 1em 0%;
		}
		
		.timeline:nth-child(even) p
		{
			float: right;
			width: 50%;
			margin: 1em 0%;
		}*/
		
		.news-grid
		{
			width: 46%;
		}
		
		.news-grid h2, .news-grid h3
		{
			font-size: 3em;
		}
		
		h3.newsletter-button
		{
			font-size: 4em;
		}
		
		.logo-grid
		{
			width: 23%;
		}
				
		footer
		{
			text-align: left;
		}
		
		.footer-left
		{
			width: 33%;
		}
		
		.footer-centre
		{
			width: 33%
		}
		
		.footer-right
		{
			width: 33%;
			text-align: right;
		}
		
		
		
}