/* -------------------- Fonts -----------------------*/
p,
a {
  font-family: "Montserrat", Helvetica, sans-serif;
}

@font-face {
  font-family: "Khmer NM";
  src: url("fonts-seja/KhmerMN-01.ttf") format("truetype"),
    /* Safari, Android, iOS */ url("fonts-seja/KhmerMN-Bold-02.ttf")
      format("truetype"); /* BOLD Safari, Android, iOS */
}

h1,
h2,
h3 {
  /* font: inherit; */
  font-family: Khmer NM, Helvetica, sans-serif;
}

/* ______________________    Navigation styling   _____________________*/

.web_menu {
  display: none;
}
.topnav a {
  color: black;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 31px;
  display: block;
}
.topnav a.icon {
  position: absolute;
  right: 2.5%;
  top: 2.5%;
  font-size: 70px;
  color: #707070;
}
.topnav a:hover,
.brand:hover {
  color: black;
}
#search input {
  border-radius: 5px;
  border: 2px solid gray;
  width: 140px;
  margin-left: 14px;
  color: #707070;
  background-color: white;
  padding: 7px;
}
header,
footer {
  background-color: #e8e9e6;
}
body {
  margin: 0;
}
nav {
  display: flex;
  height: 120px;
  width: 100%;
}
#logo {
  height: 100px;
  width: 100px;
  margin-left: 2.5%;
  margin-top: 2.5%;
  filter: brightness(85%);
}
#linav {
  display: flex;
  align-items: center;
}
li {
  margin-right: 8%;
  font-family: Montserrat;
  font-size: 17px;
  color: black;
  list-style: none;
  text-decoration: none;
}
.action-wrapper {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}
.action-wrapper input {
  border-radius: 5px;
  border: 2px solid gray;
  width: 140px;
  margin-left: 10px;
  color: #707070;
  background-color: white;
  padding: 7px;
}
#icon1 img,
#icon2 img {
  height: 25px;
  width: 25px;
}
}
/* __________________________ Footer styling ___________________ */

html {
  block-size: 100%;
  padding: 0px;
}

.container {
  width: 100%;
  margin-left: 30px;
}

.contact-info {
  display: grid;
  grid-template-rows: auto auto;
  grid-column-gap: 10px;
  align-items: center;
}

.email {
  display: flex;
  align-items: center;
}

.phone {
  display: flex;
  align-items: center;
  padding-bottom: 30px;
}

.email img,
.phone img {
  /* max-width: 40%; */
  width: 20px;
  height: 20px;
  object-fit: contain;
  padding-right: 10px;
}

.phone {
  grid-row: 2;
}

footer h1 {
  margin: 0;
  padding-top: 30px;
  padding-bottom: 5px;
  font-size: 20px;
  color: black;
}

footer p {
  margin: 0;
  font-size: 15px;
  color: black;
}

footer {
  margin-top: 15%;
}

@media (min-width: 800px) {
  /* ______________________    Navigation styling   _____________________*/
  .topnav {
    display: none;
  }
  .web_menu {
    display: block;
  }
  #logo {
    margin-left: 20%;
    margin-top: 10%;
  }
  a:link,
  a:visited,
  a:hover,
  a:active {
    color: black;
    text-decoration: none;
  }
  li:hover {
    color: black;
    text-decoration: underline;
  }
  .action-wrapper {
    justify-content: space-around;
    margin-left: auto;
    padding: 2.5rem;
  }
}