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

header {
  position: absolute;
  width: 100%;
  height: 80px;
  left: 0px;
  top: 0px;
  background: #182747;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
/* .logo-div{
  border: 2px solid red;
} */

#logo {
  position: relative;
  left: 8.33%;
  right: 8.33%;
  top: 8.33%;
  bottom: 12.5%;
  margin-left: 60px;
}
.label-select {
  display: flex;
  /* border: 2px solid red; */
  justify-content: flex-end;
  margin-right: 60px;
}
label {
  /* position: absolute; */
  width: 281px;
  height: 24px;
  /* left: 858px;
  top: 27px; */
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
  margin-right: 10px;

  color: #ffffff;
}

select {
  /* position: absolute; */
  width: 254px;
  height: 38px;
  left: 1145px;
  top: 21px;

  background: #d9d9d9;
  border-radius: 10px;
}

h1 {
  position: absolute;
  width: 532px;
  height: 63px;
  /* left: 460px; */
  top: 15%;
  left: 50%;
   transform: translate(-50%, -50%);
  font-family: "Judson";
  font-style: normal;
  font-weight: 400;
  font-size: 55px;
  line-height: 63px;
  color: #182747;
}

#hero {
  position: relative;
  width: 100%;
  height: 546px;
  top: 258px;
  background-image: url(/Vector/hero.png);
  background-size: 100% 100%;
  display: flex;
  justify-content: center;
}

#hero-text {
  position: absolute;
  width: 1200px;
  /* height: 50px; */
  left: 64px; 
  top: 450px;
   /* top: 50%; */
  /* left: 50%; */
   /* transform: translate(-50%, -50%); */
  font-family: "Judson";
  font-style: normal;
  font-weight: 400;
  font-size: 55px;
  line-height: 63px;
  color: #182747;
/* padding: 0 10%; */
text-align: center;
/* border: 2px solid black; */
}
.hero-text-middle{
  text-align: center;
  top: 50%; 
 margin-left: 50%;
   transform: translate(-50%, -50%);
   height: 50px;
   width: 400px;;
} 
#about {
  background: rgba(86, 43, 8, 0.74);
  position: absolute;
  width: 100%;
  height: 270px;
  left: 0px;
  right: 0px;
  top: 900px;
  font-family: "Inter";
  font-style: normal;
  text-align: justify;
  font-weight: 600;
  font-size: 2rem;
  line-height: 40px;
  padding: 70px 60px 70px 60px;
  color: #ffffff;
  /* border: 2px solid black; */
}

.section {
  position: absolute;
  width: 100%;
  height: 700px;
  left: 0px;
  padding-right: 60px;
  top: 1233px;
  background: #647e68;
  display: flex;
  /* border: 2px solid red; */
  /* margin: 5% 0 0 0; */
}
.content {
  /* border: 2px solid black; */
  background-color: #d9d9d9;
  position: relative;
  width: 33.33%;
  height: 564px;
  margin: 74px 10px 71px 60px;
  flex-direction: row;
  display: grid;
  justify-items: center;
  grid-template-rows: 100px 250px 150px;
  grid-template-columns: 1fr;
  grid-template-areas:
    "title"
    "image"
    "para";
}
.content > h2 {
  grid-area: title;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2;
  /* border: 2px solid black; */
  font-weight: 600;
  font-size: 2rem;
  line-height: 24.2px;
  position: absolute;
  width: 400px;
  margin-top: 20px;
}

.content_image {
  grid-area: image;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
  /* border: 2px solid yellow; */
  /* background: url(images.jpg); */
  width: 100%;
  height: 100%;
  position: absolute;

  /* margin: 10px 0 0 0; */
}
.content > img{
     border: 1px solid #ddd;
  border-radius: 4px;
  padding: 10px;
  /* width: 150px; */
   /* border: 2px solid black; */
    box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}

.content-summary {
  grid-area: para;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 3;
  grid-row-end: 4;
  position: absolute;
  /* width: 379px;
height: 95px; */
  font-size: 1.5rem;
  font-weight: 600;
  /* border: 2px solid orange; */
  margin-left: 21px;
  margin-right: 27px;
  margin-top: 20px;
}
footer {
  display: flex;
  position: absolute;
  width: 100%;
  height: 168px;
  left: -2px;
  top: 1991px;

  background: #182747;

  justify-content: space-between;
  align-items: center;
  padding: 0 60px;
}
#footer-title{
  display: flex;
  flex-direction: column;
  /* border: 2px solid red; */
  row-gap: 20%;

}
.footer-text {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-size: 25px;
  line-height: 30px;
  color: #ffffff;
}
.footer-img{
  /* border: 2px solid red; */
  display: flex;
  flex-direction: row;
  gap: 10%;
}