/*

--01 TYPOGRAPY SYSTEM



 -FONT SIZE SYSTEM (px)
 10 / 12 / 14 / 16 / 18 / 20 / 24 / 30 / 36 / 44 / 52 / 62 / 74 / 86 / 98

-Font Weights: 
Default: 400
Medium: 500
Semi-bold:600
Bold: 700

-Line Height:
Default: 1

-Letter spacing
Default: 1
Small: 1.2
Paragraph default: 1.6 

---02 Colors
Primary: 
-Tints: 
-Accents:
-Greys:
#888
#767676(lightest grey allowed on #fff)
#6f6f6f(lightest grey allowed on #fdf2e9)
#555
#333


--- 05 SHADOWS
box-shadow: 2.4rem 4.8rem rgba(0, 0, 0, 0.075)
---06 Border Radius
Default: 9px
11px
---07 Whitespace
 -SPACING SYSTEM (px)
 2 / 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 80 / 96 / 128


*/
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
html {
  font-size: 16px;
  font-family: "Open Sans", sans-serif;
}
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 9.6rem;
  padding: 0 4.8rem;
  background-color: #3d5a6c;
}

.main-nav-list {
  list-style: none;
  display: flex;
  text-decoration: none;
  align-items: center;
  gap: 3.2rem;
}
.main-nav-link:link,
.main-nav-link:visited {
  display: inline-block;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
  font-size: 1.8rem;
  transition: all 0.3s;
}
.main-nav-link:hover,
.main-nav-link:active {
  color: #cf711f;
}
.header-egy {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 4.4rem;
  color: #fff;
}
.front-szov {
  font-family: "Montserrat";
  font-size: 2.4rem;
  color: #fff;
}
.section-front {
  background-color: hsl(203, 28%, 33%);
  padding: 4.8rem 0 9.6rem 0;
}
.home {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  max-width: 130rem;
  margin: 0 auto;
  padding: 0 3.2rem;
  align-items: center;
  justify-content: center;
}
.img-me {
  height: 750px;
  width: 750px;
  border-radius: 9999px;
}
.section-about-me {
  background-color: #778c98;
}
.social-links {
  display: flex;
  gap: 1.2rem;
  list-style: none;
}