body{
    background-color: #111;
 font:12px 'calibri light';
 text-transform:uppercase;
 letter-spacing:1px;
 color:#fafafa;
}

a{
 color:#fafafa;
 text-decoration: none;
}
a:hover{
 color:red;
 letter-spacing: 3px;
}

p{
 line-height: 100%;
}

::selection{
 color: white;
 background:red;
}

#header{
 position: absolute;
 top: 45%;
 left: 50%;
 margin-right: -50%;
 transform: translate(-50%, -50%);
}

#header:hover #bruno{
 color:red;
 transition: ease-in-out 0.2s;
 -webkit-text-stroke:red 0.5px;
}
#header:hover #img{
 background-color:transparent;
 transition: ease-in-out 0.2s;
}
#header:hover #img img{
 background-color:transparent;
 opacity:1;
 transition: ease-in-out 0.2s;
}

#id{
 width:525px;
 height:300px;
 margin-left:4px;
 overflow:hidden;
 vertical-align: middle;
 display:inline-block;
}

#bruno{
 font:80px 'Ruda';
 color: transparent;
 -webkit-text-stroke: #fafafa 0.5px;
 margin-left:5px;
 line-height:80px;
 transition: ease-in-out 0.2s;
}

#text{
 height:200px;
 padding: 15px 10px;
}

#img{
 width:300px;
 height:300px;
 border: 0.5px solid #fafafa;
 overflow:hidden;
 vertical-align: middle;
 display:inline-block;
 background-color: red;
 transition: ease-in-out 0.2s;
}
#img img{
 width:300px;
 opacity:.5;
}

#link{
 text-align: center;
 padding: 15px;
 width:210px;
 border:0.5px solid #fafafa;
 transition: ease-in-out 0.1s;
}
#link:hover{
 background-color: #fafafa;
 transition: ease-in-out 0.1s;
}
#link a {
 color:red !important;
}

#aaa{
display:flex;
justify-content: space-around;
margin-left:-10px;
margin-top:29px;
}
