body {
   background-image: url("img/achtergrond.jpg");
   background-repeat: no-repeat;
   background-size: cover;
   margin: 0px;
   padding: 0px;
   height: 100%;
   width: auto;
}

 
.headbar{
   background-color: rgb(0, 0, 0);
   font-size:  15px ;
   display: flex;
   align-items: center;
   justify-content: flex-end;

   padding: 15px;
}
.headbar ul{
   list-style: none;
   display: flex;
   flex-direction: row;
   padding:0;

}

.headbar ul li a{
   padding:7px;
   border-radius: 25px;
}
.headbar ul li a:hover,.headbar ul li a:active,
.loca a:hover,.loca a:active {
   background-color: rgb(255, 255, 255);
   color:black;
}

.headbar a:visited, .headbar a, .headbar a:active  {
   color: rgb(255, 255, 255)
}




.headbar a  {
   text-align: center;
   text-decoration: none;

}





.container >p  {
   width: 300px;
   margin-top: 4vh;
   color: rgb(255, 255, 255);
   font-family:monospace;
   font-size: larger;
   margin-left: 20px;


}

.container {
   display: flex;
    padding-left: 25px;
    color: white;
    flex-direction: column;
    align-items: center;
}

.container > h1 {
font-family:serif ;
margin-left: 15px;
margin-bottom: 10PX;
}

.selfCntr{
    width: 50%;
    padding: 5px;
    margin-bottom:3%;
}



h1 {
   color: white;
   margin-top: 0px;
}

.skills {
 text-align: center;
 margin-top: 10px;
 display: flex;
justify-content: center;
}

#imgRow1{
   display: flex;
   justify-content: space-around;
}

#imgRow1 img{
   height:70px;
   width: 70px;
}

.skills img{
   width: 200px;
   height: auto;
   
}

img{
       height: 50%;
    width: 100%;
}

.imgAndLogo{
   display: flex;
   flex-direction: column;
   float: left;
   margin-right: 30px;
}

.topImgText{
   display:flex;
   justify-content: center;
   color:white;
   font-weight:bold;
   padding:10px 0px 10px 0px
}
.topImgText {
   font-size: 24px;
}

.figmaImg{
    height: 40px !important;
    width: 40px !important;
    margin-top: 10px;
}

.skills img{
width: auto;
height: 200px;
}

.zelffoto {
   width: 200px;
   max-width: 100%;
   height: auto;
   
   padding: 8px;
   box-shadow: 0 4px 8px rgba(0,0,0,0.15);
   display:block;
   float: right;
   
   
   
}

.footer img{
width: 100px;
height:auto;

}

.prikker{
width: 50px;
height: auto;
position:absolute  ;
right: 65%;


}
.info{
color: antiquewhite;

font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;

}
.info h1{
   font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.test {
   margin-right: 3vw;
}
.test img {
  width: 400px;
  height: 400px;
  border: 2px solid black;
  border-radius: 15px;
}

.flexbox {
   display:flex;  
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
}

.info {
   margin-left:3vw;
}
.myfocus {
  text-align: center;
  margin-bottom: 30px;
  
}
.focus{
   display: flex;
justify-content: space-between;
   flex-direction: row;
   width: 40vw;
}
.skill{
   background-color: rgb(122, 85, 161);
   width: 30%;
   height: auto;
   
   
}
.skill p{
   font-size: 24px;
}
.container p{
font-size: 20px;
}
.projects h1{
   text-align: center;
   font-family:inherit


}