:root {
  --theme-color: white;
  --primary-color: #124F88;
  --secundary-color: #F7C331;
  --text-color-inverse: white;
  --text-color: black;
  --menu-mobile-background-color: #3A4460;

  --accent-color: var(--primary-color);
  --primary-color-inverse: black; 

  --navbar-shadow:0 4px 5px var(#e5e5e5);
  --tag-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  --transition: 0.2s ease-in-out;
  color-scheme: light;
}
/*@media (prefers-color-schema: dark){*/
  :root[data-theme="dark"] {
    --theme-color: #0F172A;
    --primary-color: #243043;
    --secundary-color: #9DC8DB;
    --text-color: #F2F2F2;
    --text-color-inverse: VAR(--text-color);
    --menu-mobile-background-color: #18213E;
  
    --accent-color: var(--secundary-color); 
    --navbar-shadow:0 1px rgba(51,65,85,0.8);
    --tag-shadow: 0 0 0 1px #FFFFFF;
    color-scheme: dark;
  }
/*}*/
form{
  color-scheme: light;
}

*{
  transition: background-color var(--transition), box-shadow var(--transition);
}

svg{
  transition: color var(--transition);
}


html{
  scroll-behavior: smooth;
}

section[id]{
  scroll-margin-top: 70px;
}
body {
  font-family: 'Montserrat', sans-serif;
  background-color: var(--theme-color);
  color: var(--text-color);
  padding-top: 70px;
}

a {
  text-decoration: none;
  color: var(--text-color);
}

.horizontal-padding {
  padding-left: 25px;
  padding-right: 25px;
}
.vertical-padding {
  padding-top: 25px;
  padding-bottom: 25px;
}

@media (min-width: 950px) {
  .horizontal-padding {
    padding-left: 70px;
    padding-right: 70px;
  }
  .vertical-padding {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}