:root {
  --red: #ff003d;
  --black: #000000;
  --grafito: #191919;
  --white: #ffffff;
  --grey: #535353;
  --light_grey: #898989;
  --soft_grey: #ededed;

  /*fonts*/
  --primary-font: "clarendon-urw", Georgia, serif;
  --secondary-font: "Helvetica Neue", Helvetica, Arial, sans-serif;

  --form-max-width: 100%;
  --input-padding: 8px 0;
  --input-margin-bottom: 20px;
  --input-border-bottom: 1px solid var(--grey);
  --button-background-color: var(--red);
  --button-hover-background-color: #ff3f5b;
  --select-background-image: url("img/iconos/arrow_down.svg");
  --font-size-default: 24px;
  --font-weight-light: 100;
  --font-weight-normal: 400;
  --font-weight-medium: 300;
}

* {
  box-sizing: border-box;
  margin: 0;
  /* border: 1px dotted blue; */
  transition: all 0.4s ease-in-out;
}

html,
body {
  font-family: var(--primary-font);
  padding: 0;
  margin: 0;
  height: 100vh;
  box-sizing: border-box;
  scroll-behavior: smooth;
  display: flex;
  flex-direction: column;
}

body {
  background: url('../img/backs/backdesktophome.svg') top right no-repeat;
  background-size: cover;
}