/*

	Query CSS
	Copyright (C) 2017 OwlTree Web Solutions.

*/

@media only screen and (min-width: 480px) and (max-width: 640px)
	{
		
		.logo-container
		{
			/*display: block;
			width: 50%;
			text-align: left;*/
		}
		
		.header-contact
		{
			/*display: block;
			width: 50%;
			text-align: right;*/
		}
		
		.logo-container img
		{
			/*width: 50%;*/
		}
		
		ul#topnav2
		{
			display: none;
		}
		
		ul#topnav2 li
		{
			display: inline;
		}
			
		/*#topnav li ul.submenu
		{
			display: none;
		}*/
		
		/*#topnav li:hover > ul.submenu, #topnav li:focus > ul.submenu a
		{
			display: block;	
		}*/
		
		p.header-phone-number-top
		{
			display: none;
		}
		
		h2.banner-caption
		{
			width: 70%;
			font-size: 1.3em;
			margin: 8em auto 0 auto;
			padding: 0.6em 0.5em 0.4em 0.5em;
		}
		
		.service
		{
			width: 46%;
		}
		
		.service:nth-child(4)
		{
			clear: none;
		}
		
		.latest-news-item
		{
			width: 48%;
			margin: 0 1%;
		}
		
		.video-col
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 1% 0 0;
		}
		
		.video-col:nth-child(2)
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 0 0 1%;
		}

}




@media only screen and (min-width: 640px) and (max-width: 1024px)
	{
		
		.logo-container
		{
			/*display: block;
			width: 50%;
			text-align: left;*/
		}
		
		.header-contact
		{
			/*display: block;
			width: 50%;
			text-align: right;*/
		}
		
		.logo-container img
		{
			/*width: 40%;*/
		}
		
		ul#topnav2
		{
			display: none;
		}
		
		ul#topnav2 li
		{
			display: inline;
		}
			
		/*#topnav li ul.submenu
		{
			display: none;
		}
		
		#topnav li:hover > ul.submenu, #topnav li:focus > ul.submenu a
		{
			display: block;
		}*/
		
		.left
		{
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 0 0 1%;
		}
		
		.right
		{
			clear: none;
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 1% 0 0;
		}
		
		.left h3, .right h3
		{
			font-size: 1.5em;
		}
		
		.banner-strip
		{
			margin: 700px 0 0 0;
		}
		
		.banner-strip-short
		{
			margin: 250px 0 0 0;
		}
		
		h2.banner-caption
		{
			width: 55%;
			font-size: 1.5em;
			margin: 6em auto 0 auto;
			padding: 0.6em 0.5em 0.4em 0.5em;
		}
		
		h3.banner-caption
		{
			margin: 1em 1% 0 1%;
		}
		
		h3.banner-button
		{
			margin: 6em 0 0 41%;
			width: 18%;
		}
		
		.service
		{
			width: 21%;
		}
		
		.service:nth-child(4)
		{
			clear: none;
		}
		
		.latest-news-item
		{
			width: 48%;
			margin: 0 1%;
		}
		
		.news-link-section
		{
			width: 46%;
		}
		
		.column1, .column2
		{
			float: left;
			width: 46%;
		}
		
		.projects
		{
			width: 44%;
		}
		
		.projects:nth-child(3)
		{
			clear: both;
		}
		
		.clients-logos
		{
			width: 31%;
		}
		
		.clients-page
		{
			width: 48%;
		}
		
		.video-col
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 1% 0 0;
		}
		
		.video-col:nth-child(2)
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 0 0 1%;
		}
		
		.news-page
		{
			width: 48%;
		}
		.news-column
		{
			width: 29%;
		}
		
	}




@media only screen and (min-width: 1024px) and (max-width: 1280px)
	{
		
		.logo-container
		{
			/*display: block;
			width: 25%;
			margin: 2em 0 1em 1%;
			text-align: left;*/
		}
		
		.logo-container img
		{
			/*width: 100%;*/
		}	
		
		ul#topnav
		{
			/*float: right;
			width: 74%;
			margin: 2.5em 0 0 0;
			text-align: right;*/
		}
		
		ul#topnav2
		{
			display: block;
		}
		
		ul#topnav2 li
		{
			display: inline;
		}
		
			
		#topnav li ul.submenu
		{
			display: none;
		}
		
		#topnav li:hover > ul.submenu
		{
			display: none;	
		}
		
		span.menu, span.hide-menu, img.menu-symbol
		{
			display: none;
		}
		
		p.header-phone-number-top
		{
			display: none;
		}
		
		p.header-phone-number
		{
			float: right;
			padding-top: 1em;
			margin-top: -3em;
			text-align: right;
		}
		
		.banner-strip, .banner-strip-short
		{
			margin: 190px 0 0 0;
		}
		
		h2.banner-caption
		{
			width: 50%;
			font-size: 2em;
			margin: 4em auto 0 auto;
			padding: 0.6em 0.5em 0.4em 0.5em;
		}
		
		h3.banner-caption
		{
			margin: 1em 1% 0 1%;
		}
		
		h3.banner-button
		{
			margin: 6em 0 0 42.5%;
			width: 15%;
		}
		
		.service
		{
			width: 21%;
		}
		
		.service:nth-child(4)
		{
			clear: none;
		}
	
		.column1, .column2
		{
			float: left;
			width: 46%;
		}
		
		.projects
		{
			width: 29.3%;
		}
		
		.clients-logos
		{
			width: 23%;
		}
		
		.clients-page
		{
			width: 31%;
		}
		
		.video-col
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 1% 0 0;
		}
		
		.video-col:nth-child(2)
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 0 0 1%;
		}
		
		.news-page
		{
			width: 31%;
		}
		
		.left
		{
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 0 0 1%;
		}
		
		.right
		{
			clear: none;
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 1% 0 0;
		}
		
		.left h3
		{
			text-align: left;
			font-size: 1.5em;
		}
		
		.right h3
		{
			text-align: right;
			font-size: 1.5em;
		}
		
		h3.learn-more
		{
			width: 50%;
		}
		
		.latest-news-item
		{
			width: 48%;
			margin: 0 1%;
		}
		
		.news-column
		{
			width: 29%;
		}
		
		h2.phone-email
		{
			font-size: 2.4em;
		}
		
	}




@media only screen and (min-width: 1280px) and (max-width: 2560px)
	{
			
		.logo-container
		{
			/*display: block;
			width: 25%;
			margin: 2em 0 1em 1%;
			text-align: left;*/
		}
		
		.logo-container img
		{
			/*width: 100%;*/
		}	
		
		ul#topnav
		{
			/*float: right;*/
			/*width: 100%;*/
		}
		
		ul#topnav2
		{
			display: block;
		}
		
		ul#topnav2 li
		{
			display: inline;
		}
		
			
		#topnav li ul.submenu
		{
			display: none;
		}
		
		#topnav li:hover > ul.submenu
		{
			display: none;	
		}
		
		span.menu, span.hide-menu, img.menu-symbol
		{
			display: none;
		}
		
		p.header-phone-number-top
		{
			display: none;
		}
		
		.banner-strip, .banner-strip-short
		{
			margin: 190px 0 0 0;
		}
		
		h2.banner-caption
		{
			width: 50%;
			max-width: 700px;
			font-size: 2em;
			margin: 5em auto 0 auto;
			padding: 0.6em 0.5em 0.4em 0.5em;
		}
		
		h3.banner-caption
		{
			margin: 1em 1% 0 1%;
		}
		
		h3.banner-button
		{
			margin: 6em 0 0 42.5%;
			width: 15%;
		}
		
		.service
		{
			width: 21%;
		}
		
		.service:nth-child(4)
		{
			clear: none;
		}
		
		.clients-logos
		{
			width: 23%;
		}
		
		.clients-page
		{
			width: 31%;
		}
		
		.video-col
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 1% 0 0;
		}
		
		.video-col:nth-child(2)
		{
			float: left;
			width: 49%;
			padding: 0;
			margin: 0 0 0 1%;
		}
		
		.news-page
		{
			width: 31%;
		}
		
		.vehicle-details, .vehicle-photo
		{
			width: 49%;
		}
		
		.column1, .column2
		{
			float: left;
			width: 46%;
		}
		
		.projects
		{
			width: 29.3%;
		}
		
		.left
		{
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 0 0 1%;
		}
		
		.right
		{
			clear: none;
			float: left;
			width: 49%;
			margin: 0 0;
			padding: 0 1% 0 0;
		}
		
		.left h3
		{
			text-align: left;
			font-size: 1.5em;
		}
		
		.right h3
		{
			text-align: right;
			font-size: 1.5em;
		}
		
		h3.learn-more
		{
			width: 50%;
		}
		
		.latest-news-item
		{
			width: 48%;
			margin: 0 1%;
		}
		
		.news-link-section
		{
			width: 46%;
		}
		
		#prev-next li
		{
			width: auto;
		}
		
		.col1, .col2, .col3
		{
			float: left;
			width: 33%;
		}
		
		.news-column
		{
			width: 29%;
		}
		
		h2.phone-email
		{
			font-size: 2.4em;
		}
		
		.footer-container
		{
			max-width: 1280px;
		}
		
}