body{
    margin:0;
    padding:0;
    box-sizing:border-box;
    color:var(--white);
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
}

:root{
    --white:rgb(245, 239, 239);
    --black:rgb(56,51,51); 
}
header{
    position: fixed;
    top:-15px;
    background-color:var(--black);
    padding:15px;
    width:100%;
    z-index:1;
}

header img{
    position: relative;
    left:42%;
}

.mylogo{
    width:200px;
    height:100px;
}
.container{
    display:flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    grid-gap:50px;
    margin:120px;
   
}
.element{
    background-color:var(--black); 
    width:300px;
    height:200px;
    text-align: center;
}
 a button{
width:100px;
height:30px;
margin-right:40px;
background-color:rgb(245, 29, 29);
border-style:none;
outline-style: none;
color:var(--white);
font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-weight: 700;

}
p{
    text-align-last: left;
    position: relative;
    left:80px;
}
div img{
width:50px;
height:50px;
position: relative;
right:100px;
}
footer{
background-color:var(--black); 
display: flex;
justify-content: center;
align-items: center;
height:50px;
margin-top:80px;
font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; 
width:100%;
padding-top:30px;
padding-bottom:30px;
}

@media screen and (max-width:480px){

    header img{
        left:20%;
    }
          .element{
          padding:80px;
          height:50px;
          
          }
          a button{
          position:relative;
          bottom:90px;
          right:50px;
          }
          p{
          position:relative;
          bottom:80px;
          left:10px;
          width:160px;
          }
          div img{
          bottom:80px;
          }
}