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

/* google fonts import  */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Zilla+Slab:wght@400;500;600;700&display=swap");

:root {
  /* fonts  */
  --primary-font: "Zilla Slab", serif;
  --secondary-font: "Inter", sans-serif;
  /* colors  */
  --green: #77bc48;
  --dark-green: #253628;
  --black: #232633;
  --white: #ffffff;
  --blue: #4968e8;
}

/* fonts styles  */
h1,
h2,
h3,
h4,
h5 {
  font-family: var(--primary-font);
}

h1 {
  font-size: 57px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: normal; /* 119.298% */
  letter-spacing: 1px;
}

h2 {
  font-size: 45px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: normal;
}

h3 {
  font-size: 28px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: 36px;
}

h4 {
  font-size: 24px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: normal;
}

h5 {
  font-size: 22px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: normal;
}

a,
.a {
  font-size: 18px !important;
  font-style: normal;
  font-weight: 500 !important;
  line-height: 29.124px;
  font-family: var(--secondary-font);
}

p,
input,
select {
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  font-family: var(--secondary-font);
}

button {
  font-size: 16px !important;
  font-style: normal;
  font-weight: 600 !important;
  line-height: 24px;
  font-family: var(--secondary-font);
}

/* common styles  */

body {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

section {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 30px;
  justify-content: center;
}

.content {
  display: flex;
  flex-wrap: wrap;
  max-width: 1440px;
  width: 100%;
}

.flex {
  flex-wrap: wrap;
}