/* Feature CSS */

#recent-feature-container
{
	padding: 32px 0;
}


@media( min-width: 992px )
{
	#recent-feature-container .workspace
	{
		grid-row: 1;
		z-index: 2;
	}
}

.background-bar
{
	display: none;
}

@media( min-width: 992px )
{
	.background-bar
	{
		display: grid;
		grid-row: 1;
		grid-column: 1 / span 3;
		width: 100%;
		height: 80%;
		background-color: #102962;
		align-self: center;
		z-index: 1;
	}
}

/* - */

.recent-feature
{
	display: grid;
	justify-self: center;
}

.recent-feature img
{
	width: 100%;
	grid-row: 1;
	grid-column: 1;
}

.feature-txt
{
	grid-row: 1;
	grid-column: 1;
	justify-self: center;
	align-self: end;
	background-color: #fff;
	padding: 32px;
}

.feature-txt h3
{
	font-weight: 100;
	color: #01a7e5;
}

.feature-txt a
{
	text-decoration: none;
	color: #9d9fb7;
}

/* -  */




/* - */

.call-to-action
{
	background-color: #01a7e5;
}

.call-to-action .workspace
{
	justify-content: center;
	grid-gap: 32px;
	padding: 16px 0;
}

.call-to-action img
{
	width: 64px;
	grid-row: 1;
	align-self: center;
}

.call-to-action h2, .call-to-action a
{
	grid-row: 1;
	justify-self: start;
	align-self: center;
	color: #fff;
	font-weight: 100;
	font-size: 32px;

	text-decoration: none;
}

/* - */



/* - */

#main-txt
{
	margin: 64px 0;
}

#main-txt picture
{
	display: grid;
}

@media( min-width: 768px )
{
	#main-txt picture
	{
		grid-row: 1;
		grid-column: 1;
		z-index: 1;
	}
}

/* - */

#main-txt picture img
{
	width: 100%;
}

@media( min-width: 768px )
{
	#main-txt picture img
	{
		width: auto;
	}
}

/* - */

#main-txt .txt
{
	display: grid;
	justify-self: center;
	align-self: center;
	background-color: #fff;
	width: 80%;
	padding: 32px;

	grid-gap: 32px;
}

@media( min-width: 768px )
{
	#main-txt .txt
	{
		grid-row: 1;
		grid-column: 1;
		justify-self: end;
		align-self: center;
		background-color: #fff;
		z-index: 2;
		width: 600px;
		padding: 64px;
	}
}

#main-txt .txt h2
{
	font-weight: 100;
	color: #01a7e5;
}

/* - */



/* - */

.contact-item
{
	display: grid;
	justify-content: start;
	align-content: center;
	grid-gap: 32px;
}

.contact-item img
{
	grid-row: 1;
	width: 64px;
	align-self: center;
}

.contact-item .element
{
	grid-row: 1;
	align-self: center;
}

.contact-item a
{
	color: #000;
	text-decoration: none;
}