/* n
@font-face {
  	font-family: "Bold";
		src:	url("my/iosevka-term-ss08-bold.ttf") format("truetype");
}

@font-face {
        font-family: "Regular";
        src:    url("my/iosevka-term-ss08-regular.ttf") format("truetype"),
}

@font-face {
        font-family: "Light";
        src:    url("my/iosevka-term-ss08-light.ttf") format("truetype"),
}
*/
@font-face { 
		font-family: 'solid';
		src: url('my/Solid-Mono.ttf') format('truetype'); }

body{

background-color: #212529;
margin: 0;
padding: 0;
font-size: 17px;
font-family: 'solid', sans-serif;
}

hr{
	margin-top: 140px;
	margin-left: 10%;
	border: 0;
	width: 80%;
	height: 1px;
	background-color: #ef233c;
}


/* TEST */

.circle {
  display: block;
  width: 200px;
  height: 200px;
  margin: 1em auto;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-border-radius: 99em;
  -moz-border-radius: 99em;
  border-radius: 99em;
  border: 8px solid #5b8e7d;
  box-shadow: 0 3px 2px rgba(0, 0, 0, 0.3);
}


#bild {
	/*position: absolute;*/
	margin-top: 50px;
	margin-left: 10%;
	margin-right: 10%;
	width: 80%;
}

.contact_data {
	margin-top: 50px;
	margin-left: 10%;
	width: 80%;
	color: #ccc;
	text-align: center;	
}

.my_data {
        margin-top: 50px;
        margin-left: 15%;
	margin-right: 15%;
        width: 70%;
        color: #ccc;
	font-size: 14px;

}

div.container
{
    font-family: 'solid', sans-serif;
    margin: auto;
    width: 80%;
    padding: 2em 0em;
    position: absolute;
    top: 0;
    left: 10%;
    text-align: center;
}

div.container a
{
    color: #cad2c5;
    text-decoration: none;
    font: 18px 'solid', sans-serif;
    margin: 0px 4px;
    padding: 10px 10px;
    position: relative;
    z-index: 0;
    cursor: pointer;
}

/*.blue
{
    background: #2196f3;
}*/

/* Circle behind */
div.circleBehind a:before, div.circleBehind a:after
{
    position: absolute;
    top: 22px;
    left: 50%;
    width: 50px;
    height: 50px;
    border: 4px solid #e63946;
    transform: translateX(-50%) translateY(-50%) scale(0.8);
    border-radius: 50%;
    background: transparent;
    content: "";
    opacity: 0;
    transition: all 0.3s;
    z-index: -1;
}

div.circleBehind a:after
{
    border-width: 2px;
    transition: all 0.4s;
}

div.circleBehind a:hover:before
{
    opacity: 1;
    transform: translateX(-50%) translateY(-50%) scale(1);
}

div.circleBehind a:hover:after
{
    opacity: 1;
    transform: translateX(-50%) translateY(-50%) scale(1.3);
}

.bild2 {
top: 0;
width: 100%;
z-index: -1;
opacity: 0.4;
}

.my_name {
	position: absolute;
	margin: auto;
	width: 80%;
	top: 26%;
	left: 10%;
	font-size: 3.0em;
	text-align: center;
	color: rgba(255, 255, 255, 0.50);
	
}



.projects {
 color: #DBD3DF;
}

.p_titel {
	font-family: 'solid', sans-serif;
	font-size: 0.5em;
	color: rgba(255, 255, 255, 0.50);

	margin-top: 10%;

	border-top: 1px;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	border-color: #ef233c;
	border-style: solid;
	/* height: 50px; */

	padding: 34px;

}

.p_home {
        font-family: 'solid', sans-serif;
        font-size: 0.5em;
        color: rgba(255, 255, 255, 0.50);

        margin-top: 10%;

        border-top: 0px;
        border-left: 0px;
        border-right: 0px;
        border-bottom: 0px;
        border-color: #ef233c;
        border-style: solid;
        /* height: 50px; */

        padding: 34px;

}