/* Myriad */

@font-face {
  font-family: "Myriad Pro Regular";
  font-style: 20;
  font-weight: 20;
  src: local("Myriad Pro Regular"),
    url("../../../../../landing-pages/agvitta/fonts/MYRIADPRO-REGULAR.woff") format("woff");
}

@font-face {
  font-family: "Myriad Pro Light";
  font-style: 20;
  font-weight: 20;
  src: local("Myriad Pro Light"),
    url("../../../../../landing-pages/agvitta/fonts/MyriadPro-Light.woff") format("woff");
}

@font-face {
  font-family: "Myriad Pro Bold";
  font-style: 20;
  font-weight: 20;
  src: local("Myriad Pro Bold"),
    url("../../../../../landing-pages/agvitta/fonts/MYRIADPRO-BOLD.woff") format("woff");
}

/* End Myriad */

@font-face {
  font-family: "Nunito";
  src: url("../../../../../landing-pages/agvitta/fonts/MYRIADPRO-BOLD.ptf") format("truetype");
  font-display: swap;
}

/* Circe */

@font-face {
  font-family: "Circe";
  font-style: 20;
  font-weight: 20;
  src: local("Circe"), url("../../../../../landing-pages/agvitta/fonts/CRC55.woff") format("woff");
}

@font-face {
  font-family: "Circe Extra Light";
  font-style: 20;
  font-weight: 20;
  src: local("Circe Extra Light"), url("../../../../../landing-pages/agvitta/fonts/CRC25.woff") format("woff");
}

@font-face {
  font-family: "Circe Light";
  font-style: 20;
  font-weight: 20;
  src: local("Circe Light"), url("../../../../../landing-pages/agvitta/fonts/CRC35.woff") format("woff");
}

@font-face {
  font-family: "Circe Bold";
  font-style: 20;
  font-weight: 20;
  src: local("Circe Bold"), url("../../../../../landing-pages/agvitta/fonts/CRC65.woff") format("woff");
}

@font-face {
  font-family: "CirceRounded ExtraBold";
  font-style: 20;
  font-weight: 20;
  src: local("Circe Bold"),
    url("../../../../../landing-pages/agvitta/fonts/CirceRounded-ExtraBold.otf") format("truetype");
}

@font-face {
  font-family: "CirceRounded ExtraBold";
  font-style: 20;
  font-weight: 20;
  src: local("Circe Bold"),
    url("../../../../../landing-pages/agvitta/fonts/CirceRounded-ExtraBold.otf") format("truetype");
}

/* End Circe */

.width-img {
  width: 100%;
}

.width-img-small {
  width: 100px;
}

.width-img-medium {
  width: 250px;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

/* Font family*/
.font-20 {
  font-family: "Circe", "sans serif";
}

.font-20-bold {
  font-family: "Circe Bold", sans-serif;
}

.font-bold {
  font-family: "CirceRounded ExtraBold", sans-serif;
}

/* Font size */
.size-1 {
  font-size: 10px;
}

.size-2 {
  font-size: 20px;
}

.size-3 {
  font-size: 30px;
}

.size-4 {
  font-size: 40px;
}

.size-5 {
  font-size: 50px;
}

.size-6 {
  font-size: 60px;
}

.size-7 {
  font-size: 70px;
}

.size-8 {
  font-size: 80px;
}


/* Image responsive */
.img-medium {
  width: clamp(130px, 24vw, 26vw);

}

.img-small {
  /* width: clamp(34px, 9vw, 9vw); */
  width: clamp(6px, 5vw, 9vw);
}

/* Font responsive */
.font-bn {
  font-size: clamp(8px, 3.17vw, 4.17vw);
}

.font-medium {
  font-size: clamp(19px, 3.17vw, 4.17vw);
}

.font-small {
  font-size: clamp(9px, 1.17vw, 3.17vw);
}

.font-size-20 {
  font-size: clamp(11px, 3vw, 3.17vw);
}

.size-text-h2 {
  font-size: clamp(19px, 3.0vw, 4.17vw);
}

/* Ali */
.text-center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

.pd-10 {
  padding: 10px
}

.pd-20 {
  padding: 20px
}

/* Font color */
.lite-color {
  color: var(--color-label);
}

.liter-color-orange {
  color: var(--color-label-orange);
}

.liter-color-blue {
  color: var(--bg-color-blue);
}

.liter-color-bluebt {
  color: var(--bg-color-blue-lt);
}

.liter-color-blue-lite {
  color: var(--bg-color-blue-c2);
}

.liter-color-grey {
  color: var(--bg-color-grey);
}

.color-card-red {
  color: var(--color-red-card);
}

.color-grey-card {
  color: var(--color-grey-card);
}

.blue-bold2 {
  color: var(--color-blue-bold2);
}

.grey-bold {
  color: var(--bg-color-grey-bold)
}

/* background color */

.bg-blue-bold {
  background-color: var(--bg-color-blue-bold);
}

.bg-blue {
  background-color: var(--bg-color-blue);
}

.bg-blue-lt {
  background-color: var(--bg-color-blue-lt);
}

.bg-grey {
  background-color: var(--bg-color-grey);
}

.bg-green {
  background-color: var(--bg-color-green);
}

.bg-green-bold {
  background-color: var(--bg-color-green-bold);
}

.bg-white {
  background-color: var(--bg-color-white);
}

.bg-color-bg-banner {
  background-color: var(--color-bg-banner);
}

.container-card {
  width: clamp(82px, 69vw, 70vw);
  margin: 0 auto;
}

.text-green {
  color: #008155;
}