* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
    background-color: whitesmoke;
    font-size: 1.5vw;
    font-family: Arial, Helvetica, sans-serif;
}

header{
    background-color: #1c1c1c;
    height:10vw;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;

    position: relative;
    z-index: 2;
}

header::after {
  content: ''; 
  position: absolute;
  bottom: -10vw; 
  width: 100vw;
  height: 10vw; 
  background: linear-gradient(to bottom, gray 0%,  rgba(128, 128, 128, 0.3) 60%, transparent); 
  z-index: 1;
}

footer{
    background-color: #1c1c1c;
    height: 20vw;
    
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;

    margin-top: 10vw;
}

h1{
    color: whitesmoke;
    font-size: 5vw;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

main{
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #666666;
}

.text_white{
    color: whitesmoke;
}

.header_logo{
    height: 5vw;
    cursor: pointer;
}

.header_logo:hover {
    opacity: 0.5;         
    transition: opacity 0.3s ease;  
}

.header_div{
    width:20vw;

    display: flex;
    justify-content: center;
}

.main_image{
    width: 100vw;
    border-radius: 4vw;
    position: relative;
    top: -4vw;
    z-index: 1;
}

.rectangle {
    margin-top: 10vw;
    margin-bottom: 5vw;
    width: 45vw;  
    height: 0.5vw;  
    background-color: gray;
    border-radius: 0.5ch;  
}

.main_para{
    margin: 2vw;
    text-align: center;
    width: 50vw;
}

h2{
    position: relative;
    margin-bottom: 3vw;
}

.foot-div{
    width: 30vw;
    
    display: flex;
    flex-direction: column;
    align-items: center;
}

.foot-div-asso{
    width:60vw;
    
    display: flex;
    flex-direction: row;
    justify-content: center;

    color: whitesmoke;
}

.contact-title{
    color: whitesmoke;
    font-weight: bold;

    margin-bottom: 1vw;
    font-size: 2vw;
}

.mail-contact{
    color: whitesmoke;
    font-size: 1.5vw;
}

.foot_logo{
    width: 10vw;
}

.img-asso{
    width: 6vw;
    border-radius: 50%;
}

.div-asso{
    display: flex;

    font-size: 1.4vw;

    flex-direction: column;
    align-items: center;

    margin: 2vw;
}