div.header-projects
{
	background: url('/img_files/items/bg-projects.jpg') no-repeat center;
	background-size: cover;
}

	span.projects-desc
	{
		display: block;
		width: 500px;
		margin-top: 20px;
		font-size: 20px;
		color: #fff;
	}

div.projects-list
{
	display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    row-gap: 100px;
}

	div.project
	{
		position: relative;
		display: flex;
		width: 100%;
		background: #fff;
	}

	div.project:hover div.settings_menu
	{
		display: block;
	}

		div.project-block
		{
			flex: 1;
		}
		
		div.project-block.col-info
		{
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-left: 60px;
		}
		
		img.project-img
		{
			display: block;
			width: 100%;
			height: 700px;
			object-fit: cover;
		}
		
		div.project-imgs
		{
			display: grid;
			grid-template-columns: 1fr 1fr 1fr 1fr;
			row-gap: 10px;
			column-gap: 10px;
			width: 100%;
			margin-top: 10px;
		}
		
			span.project-img-small
			{
				position: relative;
				display: block;
				padding-top: 100%;
				background-size: cover;
				background-position: center;
				background-repeat: no-repeat;
				cursor: pointer;
			}
			
				span.project-img-small:after
				{
					position: absolute;
					content: '';
					width: 100%;
					height: 100%;
					top: 0px;
					left: 0px;
					background: rgba(0, 0, 0, 0.5);
					visibility: visible;
					opacity: 1;
					transition: 0.2s;
					-o-transition: 0.2s;
					-webkit-transition: 0.2s;
				}
				
				span.project-img-small:hover:after,
				span.project-img-small.active:after
				{
					visibility: hidden;
					opacity: 0;
				}
		
		span.project-name
		{
			font-size: 50px;
			font-weight: 600;
			text-transform: uppercase;
			color: #11679e;
		}
		
		span.project-desc
		{
			display: block;
			margin: 50px 0px;
			font-size: 16px;
			line-height: 24px;
		}
		
		span.project-contact
		{
			height: 70px;
			font-size: 18px;
			text-transform: uppercase;
		}
		
			span.project-contact i
			{
				margin-left: 10px;
			}