:root {
  --primary-color: #ced548;
  --secondary-color: #609f0f;
  --tertiary-color: #1A2D02;
  --primary-font-style: 'Quicksand', sans-serif;
  --secondary-font-style: 'Poppins', sans-serif;
  --white: #fff;
}

body {
  margin: 0;
  font-family: var(--secondary-font-style);
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

header {
  background-color: var(--white);
  color: var(--white);
  padding: 0.5rem;
  width: 100%;
  position: fixed;
  z-index: 1;
  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.08), 0 2px 4px 0 rgba(0, 0, 0, 0.12);
}

input,
textarea,
select {
  width: 100%;
  padding: 0.5rem;
  border: 1px solid var(--secondary-color);
  box-sizing: border-box;
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
}

section {
  margin: 0.5rem 0;
}

footer {
  display: flex;
  justify-content: space-around;
  background-color: var(--secondary-color);
  color: var(--white);
  padding: 0.5rem;
  text-align: center;
}

footer a {
  text-decoration: none;
  color: white;
}

label .iti {
  display: block;
}

.iti__selected-flag {
  outline: none;
}

.mp5 {
  margin: 0.5rem;
}

.mvz-mhp5 {
  margin: 0 0.5rem;
}

.mvp5-mhz {
  margin: 0.5rem 0;
}

.word-wrap-break-word {
  word-wrap: break-word;
}

.primary-color-2px-solid-border {
  border: 2px solid var(--secondary-color);
  border-radius: 1rem;
}

.text-decoration-none {
  text-decoration: none;
}

.header-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header-company-logo {
  display: flex;
  align-items: center;
  column-gap: 0.25rem;
}

.header-logo-text {
  font-family: var(--primary-font-style);
  background: linear-gradient(to right, var(--primary-color), var(--secondary-color), var(--tertiary-color));
  -webkit-text-fill-color: transparent;
  background-clip: text;
  -webkit-background-clip: text;
}

.header-company-logo img {
  width: 54px;
  height: 44px;
}

.home-banner {
  position: relative;
  height: 26rem;
  background-size: cover;
  background-position: center;
  color: var(--secondary-color);
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-repeat: no-repeat;
  display: none;
}

.home-banner-fade {
  animation-name: fade;
  animation-duration: 2s;
}

.home-banner-text {
  font-size: 2rem;
  font-family: var(--primary-font-style);
  position: relative;
  top: 50%;
}

.content-container {
  margin: 0 0.5rem;
}

.heading {
  display: flex;
  flex-direction: row;
  align-items: center;
  column-gap: 0.5rem;
}

.heading-identifier {
  width: 0.5rem;
  height: 1.5rem;
  background-color: var(--secondary-color);
}

.product-card-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  row-gap: 2rem;
}

.product-card {
  width: 100%;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
}

.product-card img {
  width: 100%;
  height: 300px;
  border-bottom: 1px solid #ddd;
}


.product-card-content h3 {
  text-align: center;
}

.product-card-content p {
  padding: 1rem;
  text-align: justify;
}

.contact-container {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}

.contact-talk-form {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  margin: 0.5rem;
}

.contact-sales {
  display: flex;
  flex-direction: column;
}

.contact-sales-talk {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}

.sales-enquiry-option-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
}

.contact-talk-form-submit {
  background-color: var(--secondary-color);
  color: var(--white);
  padding: 0.5rem;
  border: none;
  cursor: pointer;
  width: 100%;
  outline: none;
}

.contact-registered-office-options {
  display: flex;
  flex-direction: column;
  margin: 0.5rem;
  row-gap: 0.5rem;
}

.contact-registered-office-option {
  display: flex;
  align-items: center;
  column-gap: 0.5rem;
}

.contact-talk-row {
  display: flex;
  row-gap: 0.5rem;
  flex-direction: column;
}

.contact-talk-row-item {
  flex: 1 1 100%;
}

.content-section {
  margin: 0 1rem;
}

.privacy-policy-container {
  padding-top: 5rem;
  display: flex;
  flex-direction: column;
}

.vrin_logo_container {
  display: flex;
  justify-content: center;
}

.kyp-container {
  padding-top: 7rem;
  display: flex;
  flex-direction: column;
}

.kyp-heading-container {
  text-align: center;
  margin-bottom: 0;
}

.kyp-form {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
  margin: 0.5rem;
}

.kyp-form-row {
  display: flex;
  flex-direction: column;
  row-gap: 0.5rem;
}

/* .kyp-form-row-item {

} */

.kyp-form-row-item-label {
  width: 100%;
}

.kyp-form-row-item-child {
  flex: 1 1 50%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

@media screen and (min-width: 480px) {
  .sales-enquiry-option {
    display: flex;
    column-gap: 0.5rem;
  }

  .product-card-content-ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .product-card-content-li {
    width: 48%;
  }
}

@media screen and (min-width: 768px) {
  .home-banner {
    height: 36rem;
  }

  .product-card {
    width: 49%;
  }

  .content-container {
    margin: 0 1rem;
  }

  .kyp-form-row {
    display: flex;
    flex-direction: row;
    column-gap: 0.5rem;
  }

  .kyp-form-row-item {
    flex: 1 1 33.33%;
  }
}

@media screen and (min-width: 960px) {
  .contact-sales-talk {
    flex-direction: row;
    column-gap: 0.5rem;
  }

  .contact-sales {
    flex: 0.5;
  }

  .contact-talk {
    flex: 1;
  }

  .contact-talk-row {
    display: flex;
    flex-direction: row;
    column-gap: 0.5rem;
  }

  .contact-talk-row-item {
    flex: 1 1 50%;
  }

}

@media screen and (min-width: 1320px) {
  .product-card {
    width: 24%;
  }
}

@media screen and (min-width: 1440px) {
  .content-container {
    margin: 0 2rem;
  }
}

@keyframes fade {
  from {
    opacity: 0.3;
  }

  to {
    opacity: 1;
  }
}