
/* - Footer CSS - */

#footer
{
	position: relative;
	/* background-color: #222; */
}

#footer .element
{
	width: 100%;
}

#footer h2
{
	border-bottom: solid 2px;
	padding-bottom: 4px;
	width: 100%;
    text-align: center;
    color: #fff;
    text-transform: uppercase;

}


#footer .item
{
	display: grid;
	/* grid-template-columns: max-content auto; */
	align-content: start;
	grid-gap: 12px;

	width: 100%;
}

#footer p
{
	color: #fff;
	text-align: center;
    justify-self: center;
}

#footer a
{
    color: #fff;
	text-decoration: none;
	text-align: center;
    justify-self: center;
}









/* - */

#footer .workspace {
    padding: 42px 0 64px;
    grid-gap: 42px;
    overflow-x: visible;

}

@media (min-width: 992px) {
    #footer .workspace {
        width: 90%;
    }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#footer .item
{
	/*grid-row: 1;*/
	justify-content: center;
	/*grid-gap: 24px;*/
}

#footer .item-inner
{
	display: grid;
	border: solid 2px #F41EFB;
	justify-self: center;
	border-radius: 64px;
}

#footer .item i
{
	color: #222;
	background-color: #F41EFB;
	padding: 16px;
	border-radius: 64px;
	justify-self: center;
	font-size: 24px;
	border: solid 4px #222;
}

.footer-social-container
{
	display: grid;
	justify-content : center;
	grid-gap : 16px;
}

.footer-social 
{
	grid-row: 1;
}


.footer-border-item
{
	border-bottom: solid 1px;
	padding-bottom: 8px;
}

#footer .item a
{
	display: grid;
	align-self: center;
}

#footer .item p
{
	align-self: center;
}

/* - */

#footer .contact-details
{
	justify-content: center;
	
	width: 90%;
	justify-self: center;

	grid-row: 1;
	grid-column: 1;

	z-index: 2;
}

@media ( min-width: 992px )
{
	#footer .contact-details
	{
		grid-template-columns: repeat( 3, 1fr );
	}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */



/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.dashed-line
{
	display: none;
	grid-row: 1;
	grid-column: 1;
	width: 61%;
	height: 0px;
	align-self: start;
	justify-self: center;
	margin-top: 33px;
	border-bottom: dashed 1px #F41EFB;
	opacity: 0.8;
}

@media ( min-width: 992px )
{
	.dashed-line
	{
		display: grid;
	}
}










.footer-nav
{
	align-content: center;
	justify-content: center;
	grid-gap: 8px;
}


@media ( min-width: 992px )
{
	.footer-nav
	{
		grid-gap: 16px;
	}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.footer-nav a
{
	grid-row: 1;
	border-right: solid #848484 1px;
	padding-right: 8px;
	color: #f4f4f4;
}

@media ( min-width: 992px )
{
	.footer-nav a
	{
		padding-right: 16px;
	}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.footer-nav a:last-of-type
{
	border: none;
	padding: 0;
}


#footer .socials
{
	justify-content: center;
	align-content: start;
	grid-column: 1 / span 3;
	background-color: #171717;
	padding: 16px 0;
}

#footer .socials a
{
	grid-row: 1;
}

#footer .socials i
{
	color: #222;
	background-color: #f9f9f9;
	border-radius: 64px;
	justify-self: center;
	font-size: 22px;
	width: 42px;
	height: 42px;
	display: grid;
	align-content: center;
	justify-content: center;
}

#footer .socials i
{
	justify-self: center;
	align-self: center;
}

/*  */







#bottom-bar
{
	display: grid;
	grid-row: 3;
	grid-column: 1/span 3;
	background-color: #111;

	padding: 16px 0;

	justify-content: center;
}

#bottom-bar p
{
	font-size: 14px;
	margin: 0;
	padding: 0;
	border: none;
}

#bottom-bar a
{				
	text-decoration: none;
	color: #F41EFB;
}

@media ( max-width: 768px )
{
	#footer::after
	{
		background: #F41EFB;
	}
    #footer {
        background-color: #F41EFB;
    }
}

