:root {
  font-size: 16px;
  line-height: 24px;
  font-weight: 400;

  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-text-size-adjust: 100%;
}

@font-face {
  font-family: "DosisBold";
  src: local("DosisBold"), url("../fonts/Dosis-Bold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisExtraBold";
  src: local("DosisExtraBold"), url("../fonts/Dosis-ExtraBold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisExtraLight";
  src: local("DosisExtraLight"), url("../fonts/Dosis-ExtraLight.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisLight";
  src: local("DosisLight"), url("../fonts/Dosis-Light.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisMedium";
  src: local("DosisMedium"), url("../fonts/Dosis-Medium.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisRegular";
  src: local("DosisRegular"), url("../fonts/Dosis-Regular.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DosisSemiBold";
  src: local("DosisSemiBold"), url("../fonts/Dosis-SemiBold.ttf") format("truetype");
  font-display: swap;
}

@font-face {
  font-family: "DancingScript";
  src: local("DancingScript"), url("../fonts/DancingScript-Regular.ttf") format("truetype");
  font-display: swap;
}

.font-face-dancing {
  font-family: "DancingScript";
}

.font-face-db {
  font-family: "DosisBold";
}

.font-face-deb {
  font-family: "DosisExtraBold";
}

.font-face-del {
  font-family: "DosisExtraLight";
}

.font-face-dl {
  font-family: "DosisLight";
}

.font-face-dm {
  font-family: "DosisMedium";
}

.font-face-dr {
  font-family: "DosisRegular";
}

.font-face-dsb {
  font-family: "DosisSemiBold";
}

body {
  font-family: "DosisRegular";
}

.green {
  color: #99c133;
}

.blue {
  color: #3bc4ed;
}

.magenta {
  color: #ec008c;
}

.purple {
  color: #724c95;
}

.dark-green {
  color: #016462;
}

/* Oculta las imagenes en dispositivos móviles */
.mobile-hide {
  display: block;
}

@media (max-width: 640px) {
  .mobile-hide {
    display: none;
  }

  #contact {
    display: none;
  }
}
/* Oculta las imagenes en dispositivos móviles */

html {
  scroll-behavior: smooth;
}

.uppercase {
  text-transform: uppercase;
}

/**/

#whatsapp {
  position: fixed;
  bottom: 20px;
  right: 20px;
}

svg {
  width: 80px;
  filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.4));
}

circle {
  fill: #25d366;
}
path {
  fill: #fff;
}

/* Imágen de contacto */
#contact {
  position: fixed;
  cursor: grab;
  left: 80%;
  top: 85%;
}