*{
  margin:0;
  padding:0;
  font-family: DM Sans;
  box-sizing:border-box;
  text-align: justify;   
  text-decoration: none;   
}
html{
  scroll-behavior:smooth;
}

body{
  background-color: #ffeef1;
  color: #fff;
}

#header{
  width:100%;
  height:100vh;
}

.header-menu{
  height: 8%;
  background-color: #f2d1d7;
  color: black;

  border-bottom: solid;
  border-bottom-color: #d01147;
  border-bottom-width: 1.5px;

  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;

  position: fixed;
  top: 0;
  left: 10px;
  right: 10px;

  z-index: 150;

}
nav ul li{
  display: inline-block;
  list-style: none;
  margin: 10px 10px;
  cursor: pointer;
  text-align: center;
}
nav ul li a{
  color: #1A1617;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  position:relative;
  justify-content: space-evenly;
}

.left-section{
  display: flex;
  flex-basis: 40%;
  justify-content: center;
}

.middle-section{
  display: flex;
  flex-basis: 20%;
  justify-content: center;
}
.logo{
  width: 80px;
}

.right-section{
  display: flex;
  flex-basis: 40%;
  justify-content: center;
}

.header-display{
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 90vh;
}
.header-picture{
  display: grid;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  z-index: 100;
}
.header-picture img{
  margin-top: 20px;
  margin-right: 100px;
  width: 720px;
}
.header-info{
  bottom: 8%;

  display: grid;
  grid-template-rows: 450px 40px 40px;
  align-items: center;
  justify-content: center;

  margin-left: 100px;
}
.header-logo, .header-text, .header-button{
  display: grid;
  justify-content: center;
  align-items: center;
}

.header-logo{
  margin-top: 170px;
  margin-bottom: 100px;
}
.header-logo img{
  width: 450px;
}
.header-text{
  display: grid;
  color: #d01147;
  text-align: center;
  margin-top: 20px;
}
.header-text h3{
  font-weight: 500;
  font-size: 35px;

  margin-top: 5px;
}
.header-text img{
  margin-top: 20px;
  height: 50px;
}

.header-text p{
  font-weight: 300;
  font-size: 18px;

  margin-top: 3px;
}
.header-button button{

  background-color: #fffdfa;
  color: #d01147;
  font-weight: 500;

  vertical-align: middle;
  border: solid;
  border-width: 2px;
  border-color:  #d01147;
  padding: 12px 18px;

  border-radius: 28px;

  cursor: pointer;
  transition: background-color 0.5s, color 0.5s, border 0.5s;

  margin-top: 170px;
}
.header-button button:hover{
  background-color:  #d01147;

  color: #FCF6EF;
  font-weight: 500;

}
.header-button button:active{
  opacity: 0.5;
}

.container{
  padding: 10px  10%;
}