/* HEAD BANNER */
	#divProjectHeadBanner
	{
		width:100%;
		max-height:200px;
		margin-bottom:40px;	
		background-color:#353535;
	}
	
		#divImagesWrapper IMG,
		#divVideosWrapper IMG
		{
			width:100%;
			display:block;
		}
		
		#imgProjectHeader
		{
			max-width:100%;	
			position:relative;
		}
		
		#divImagesWrapper IMG:hover,
		#divVideosWrapper IMG:hover
		{
			box-shadow:0 0 5px 3px #3366FF;
			
		}
		
		#divImagesWrapper A.fancybox,
		#divVideosWrapper A.fancybox
		{
			position:relative;
			display:block;
		}
		
		
		
		#divImagesWrapper A.fancybox:after,
		#divVideosWrapper A.fancybox:after
		{
			content:"";
			position:absolute;
			top:0; left:0;
			width:100%;
			height:100%;
			z-index:2;
			transition:opacity .2s ease-out;
			opacity:0.5;
		}
		
		#divImagesWrapper A.fancybox:after
		{
			background:rgba(0,0,0,0.5) url(/art/css-icons/image-gallery-icon.png) no-repeat center;
		}
		
		#divVideosWrapper A.fancybox:after
		{
			background:rgba(0,0,0,0.5) url(/art/css-icons/video-play-icon.png) no-repeat center;
		}
		
		#divImagesWrapper A.fancybox:hover:after,
		#divVideosWrapper A.fancybox:hover:after
		{
			opacity:1;
			box-shadow:0 0 5px 3px #3366FF;
		}
		

	
	/* PROJECTS */	
	#divProjectsWrapper
	{
		margin-bottom:30px;
		float:left;
		width:100%;
	}
	
		.divProject
		{		
			box-sizing:border-box;
			transition:all .2s ease-out;
			margin:1.5% 3% 1.5% 0;
			width:31.3%;
			display:inline-block;
			vertical-align:top;
			position:relative;
		}
		
		.divProject:nth-child(3n)
		{		
			margin-right:0;
		}
		
		.divProject:hover
		{
			cursor:pointer;
			background-color:#FFF;
			box-shadow:0 0 5px 2px #3366FF;
			transition:all .2s ease-out;
		}
		
		@media screen and (max-width:960px)
		{
			.divProject
			{
				width:48%;
				margin:5% 1%;
			}
		}
		
		@media screen and (max-width:600px)
		{
			.divProject
			{
				width:100%;
				margin:5% 0;
				height:auto;
			}
		}
		
		.divProject #btnMoreProjects
		{
			position:absolute;
			top:0; left:0;
			width:100%; height:100%;
			min-height:340px;
			border:2px solid #DDD;	
		}
		
		.divProject .divProjectImage
		{
			width:100%;
			height:150px;
			background-repeat:no-repeat;
			background-position:center;
			background-size:cover;
			position:relative;
			background-color:#DDD;
		}
		
		.divProject .divProjectImage:after
		{
			content:"";
			position:absolute;
			top:0; left:0;
			width:100%; height:100%;
			opacity:.6;
			background:#EEE;
			transition:all .2s ease-out;
		}
		
		.divProject:hover .divProjectImage:after
		{
			opacity:0;
		}
		
		.divProject .divProjectImage:before
		{
			content:"";
			position:absolute;
			bottom:10px; right:10px;
			width:100%; height:50px;
			z-index:998;
		}
		
		/*.divProject .divProjectImage.MovingTransitForward:before
		{
			background: url(/projects/moving-niagara-forward/images/moving-transit-forward-icon.png) no-repeat right bottom;
			background-size:50px;
		}
		
		.divProject .divProjectImage.MovingRoadsForward:before
		{
			background: url(/projects/moving-niagara-forward/images/moving-roads-forward-icon.png) no-repeat right bottom;
			background-size:50px;
		}
		
		.divProject .divProjectImage.MovingWaterForward:before
		{
			background: url(/projects/moving-niagara-forward/images/moving-water-forward-icon.png) no-repeat right bottom;
			background-size:50px;
		}
		
		
		
		/*.divProject .divProjectImage.MovingTransitForward:after
		{
			background-color:#00a59e;
		}
		
		.divProject .divProjectImage.MovingRoadsForward:after
		{
			background-color:#f78e1f;
		}
		
		.divProject .divProjectImage.MovingWaterForward:after
		{
			background-color:#03bbfb;
		}
		
		.divProject .divProjectImage.MovingTransitForward.MovingRoadsForward:after
		{
			background-image: linear-gradient(to right, #00a59e, #f78e1f);
		}
		
		.divProject .divProjectImage.MovingTransitForward.MovingWaterForward:after
		{
			background-image: linear-gradient(to right, #00a59e, #03bbfb);
		}
		
		.divProject .divProjectImage.MovingWaterForward.MovingRoadsForward:after
		{
			background-image: linear-gradient(to right, #03bbfb, #f78e1f);
		}
		
		.divProject .divProjectImage.MovingTransitForward.MovingWaterForward.MovingRoadsForward:after
		{
			background-image: linear-gradient(to right, #00a59e, #f78e1f, #03bbfb);
		}
		*/
		
		
		.divProject .divProjectDesc
		{
			padding:5px 20px;	
			border-left:2px solid #E5E5E5;
			border-bottom:2px solid #E5E5E5;
			border-right:2px solid #E5E5E5;	
		}
		
		.pCity
		{
			font-weight:bold;
			text-transform:uppercase;	
			font-size:.9em;
		}
		
		.divProject .fontUp
		{
			font-size:1.1em!Important;
		}
		
		
	/* FILTERS */
	#divFiltersWrapper
	{
		margin:0 0 10px 0;
		float:left;
		width:100%;
	}
	
		.searchWrapper
		{
			width:50%!Important;
			float:left!Important;
			clear:none!Important;
			box-sizing:border-box!important;
			background:none!important;
		}
		
		.searchWrapper #ddLocations,
		.searchWrapper #ddProjectTypes
		{
			background:#FFF url(/art/css-icons/blue-arrow-down.gif) no-repeat 97% center!important;
			box-sizing:border-box;
			width:48%;
			margin-left:2%;
			float:left;
		}
		
		.searchWrapper SELECT, searchWrapper INPUT
		{
			box-sizing:border-box!important;	
		}
		
		@media screen and (max-width:800px)
		{
			.searchWrapper,
			.searchWrapper SELECT
			{
				width:100%!Important;	
				float:none!Important;
				margin:0!Important;
			}
		}


	/* TIMELINE */
	.divTimeline
	{
		//padding:0 5%;
	}
	
	.divTimeline,
	.divMilestone
	{
		float:left;
		width:100%;
		position:relative;
		box-sizing:border-box;
	}
	
	.divMilestone
	{
		position:relative;
		padding-left:60px;
		padding-bottom:20px;
		padding-top:20px;	
	}
	
	.divMilestone:after
	{
		content:"";
		position:absolute;
		top:0; left:12px;
		width:3px;
		height:100%;
		border-left:3px solid #EEE;
	}
	
	.divTimeline > .divMilestone:first-child:after
	{
		top:20px;
	}
	
	.divTimeline > .divMilestone:last-child:after
	{
		height:50%;
	}
		
		.timeNode
		{
			border-radius:100%;
			width:20px; height:20px;
			background:#FFF;
			position:absolute;
			left:0; top:50%;
			transform:translateY(-50%);
			border:4px solid #005A55;
			z-index:2;
		}
		
		.completed .timeNode
		{
			background:#9fce67 url(/art/css-icons/correct-checkmark-white.png) no-repeat center 60%;
			border-color:transparent;
		}
		
		.milestoneContent
		{
			padding:20px;
			border-radius:2px;
			//border:2px solid #DDD;	
			position:relative;
			background:#F5F5F5;
			border-radius:5px;
		}
		
		.milestoneContent:after
		{
			content:"";
			position:absolute;
			right:100%; top:50%;
			transform:translateY(-50%);
			border-right:20px solid #F5F5F5;
			border-bottom:12px solid transparent;
			border-top:12px solid transparent;		
		}
		
			.pTitleCon
			{
				margin:0!important;	
			}
			
			.spanTimelineTime
			{
				color:#005A55;
				text-transform:uppercase;	
				font-weight:bold;
				font-size:.9em;
			}
			
			.completed .spanTimelineTime
			{
				color:#218042;
			}
			
	
	#global_bottom_nav
	{
		margin-top:0!important;	
	}
	
	
	/* PROJECT TYPE FOOTER */
	#divProjectTypesWrapper
	{
		background:#EEE;
		padding-bottom:50px;
		float:left;
		width:100%;
	}
	
		.divProjectTypeLogo
		{
			float:left;
		}
		
		@media screen and (min-width:961px)
		{
			.divProjectTypeLogo
			{
				width:30%;	
				margin:2% 5% 2% 0;
				min-width:250px;
			}
			
			.divProjectTypeLogo:last-child
			{
				margin-right:0;
			}
		}
		
		@media screen and (max-width:960px)
		{
			.divProjectTypeLogo
			{
				width:47.5%;	
				margin:2% 5% 2% 0;
			}
			
			.divProjectTypeLogo:last-child
			{
				margin-right:0;
			}
		}
		
		@media screen and (max-width:700px)
		{
			.divProjectTypeLogo
			{
				width:100%;	
				margin:0 5% 0 0 ;
				min-width:250px;
			}
		}
		
		.divProjectTypeLogo IMG
		{
			width:100%;
			border:0;
		}
		
		.divProjectTypeLogo IMG:hover
		{
			box-shadow:0 0 5px 3px #3366FF;
			transition:all .2s ease-out;
		}
	
	
-->