*{
margin: 0px;
padding: 0px;
box-sizing: border-box;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.wrapper{
width: 100%;
height: 100vh;
display: flex;
justify-content: left;
align-items: left;


}
.image{
width:125px ;
position: relative;



}

img{
width: 100%;
display: block;
margin:auto



}

.content {
    width:125.5px;
height: 90px;
top: 0;
left: 0;
position: static;
margin-left: 29.9px;
margin-top: -90px;
background-color: rgba(41, 41, 40, 0.658);
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
opacity: 0;
transition: 0.6s;
transition-duration: 5s;
}

.content:hover{
opacity: 1;

}

.content h1{
font-size: 15px;
color: #ffe100;
margin-bottom: 1px;
}

.content p{
font-size:8px ;
color: #fff;


}
.content > *{
transform: translateY(25px);
transition: transform 0.6s;

}

.content:hover > *{
transform: translateY(10px);

}

.list1 {
margin-left: 10px;

}



@font-face {
    font-family:"romantic" ;
    src: url(fonts/ROMANTIC.TTF);
}


.navbar {
margin-left: 10px;
margin-top: -10%;
}



@font-face {
    font-family:"code" ;
    src: url(fonts/ConnectCode39.ttf);
}

.isurrender {
margin-top: -5px;
margin-left: 30px;

}

.maintenance {
margin-left: 12px;
margin-top: 20px;


}


@font-face {
    font-family:"typewriter" ;
    src: url(fonts/JMH\ Typewriter-Thin.ttf);
}

.pic2 {
margin-top: 42.9px;
margin-right: 100px;
margin-left: 165px;
position: absolute;
height: 90px; width:125px ;
position: auto;
 display: block;

 

}