.contnet {
    align-self: center;
    text-align: left;
    padding-right: 40px;
}
nav#hjm {
    bottom: auto;
    z-index: 10;
    position: fixed;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 100px;
    top: 40%;
}
#hjm ul{
	list-style: none;
	padding: 0;
}
#hjm li{
	padding: 10px 0;
}
#hjm span{
	display: inline-block;
	position:relative;
}
nav#hjm a{
	display: inline-block;
	color: #272727;
	text-decoration: none;
	font-size: 1em;
}

nav#hjm a:hover, nav#hjm .active-section{
	color: #9b59b6;
}
nav#hjm a:hover span, nav#hjm .active-section span{
	background-color: #9b59b6;
}
nav#hjm .active-section .rect{
	width: 40px;
}
.content-section {
    position: relative;
    width: 100%;
    height: 80vh;
    left: 0%;
    background-color: #fff;
    text-align: center;
    display: flex;
    max-width: 100%;
    margin: auto;
    margin-left: 0!important;
    /* margin-top: 75px; */
    gap: 200px;
    padding: 0px 0 60px;
}
	/* -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%); */

.content-section h1{
	position: relative;
	top: 50%;
	left: 50%;
	-webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
	color:#9b59b6;
	font-size: 3em;
}

/*CREDITS*/
.about{
	position: fixed;
	bottom:0; 
	left: 1%;
}
.about a{
	text-decoration: none;
	font-size: 1.5em;
}
.about a:visited, .about a:active, .about a:link{
	color:#000;
}
.about a:hover{
	color: red;
}
.img-gh img {
    width: 600px;
    height: 100%;
}main#dfx {
    position: relative;
    z-index: -1;
}