:root {
  --orange: rgb(238,114,3);
  --blue: rgb(42,95,131);
  --light-blue: rgb(91,123,155);
  --very-light-blue: rgb(175,192,201);
  --grey: #bdbdc7;
  --light-grey: rgba(255, 255, 255, .5);
  --very-light-grey: rgba(255,255,255, .35);
  --dark-grey: #444;
  --almost-black: rgba(0,0,0, .55);
  --light-green: rgba(0,246,255,.5);
  --dark-blue: #0a5378;
  --red: #FF595E;
  --green: #8AC926;
  --purple: #6A4C93;
}

@font-face { 
  font-family: 'BrandingSB'; src: url('Branding-Semibold.otf');
  font-family: 'Branding'; src: url('Branding-Medium.otf');
 } 

 @media (max-width: 480px) {
  html {
      font-size: 16px;
  }
}

@media (min-width: 480px) {
  html {
      font-size: 16px;
  }
}

@media (min-width: 768px) {
  html {
      font-size: 16px;
  }
}

@media (min-width: 992px) {
  html {
      font-size: 16px;
  }
}

@media (min-width: 1200px) {
  html {
      font-size: 16px;
  }
}


html, 
body {
    height: 100%;
}

body {
  /* font-size: 16px; */
  margin: 0 20px 0 20px;
  padding: 0em;
  font-family: 'Branding', 'Helvetica Neue', Helvetica;
}


.gradient {
  background: var(--blue);
  background-image: linear-gradient(var(--light-blue), var(--blue));
}

.title {
  position: relative;
	font-family: 'BrandingSB', 'Helvetica Neue', Helvetica;
  font-weight:bold;
  font-size: 2em;
  text-shadow: 0 0.1em 0.1em var(--light-grey);
  color: var(--dark-grey);
  text-align: center;
}

.form {
  background: none;
}