/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

/* Main style file. Override general styles here. Specific module or page type
styles, often have their on css files, which are called only if necessary. */

/*
* =============================
* === Base ===
* =============================
*/

/* 
CSS variables supported by modern browsers. except IE because it sucks.
https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties
*/
:root {
  --canary-yellow: #FBC93C;
  --electric-blue: #22B5B0;
  --lime-green: #A4CE60;
  --bright-red: #EA5547;
  --dark-text: #454A48;
}

/*
=============================
2021 Branding Guidelines Start
=============================
Canary Yellow - #FBC93C
Electric Blue - #22B5B0
Lime Green - #A4CE60
Bright Red - #EA5547
Dark Text - #454A48

Primary Font -Inter (body + links)
Secondary Font - Proxima Nova (headers)
=============================
2021 Branding Guidelines End
=============================
*/

.green {
  background: rgba(164, 206, 96, 1);
}
.yellow {
  background: rgba(251, 201, 60, 1);
}
.red {
  background: rgba(234, 85, 71, 1);
}
.teal {
  background: rgba(34, 181, 176, 1);
}


/* Font sizes and spacing */

html {
  position: relative;
  min-height: 100%;
  font-size: 62.5%;   /* Setting font size to 62.5% makes it 10px and allows REMS to work, eg.  1.6rem = 16px */
}

body {
  margin: 0;
  font-family: "Inter", sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color: #454A48;
  font-size: 1.6rem;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: proxima-nova, sans-serif;
  font-weight: 400;
  margin-bottom: 1rem;
  color: #454a48;
}

.black {
  color: black;
}

h1,
.h1 {
  font-size: 4.0rem;
  line-height: 1;
  margin-bottom: 0.5rem;
  font-weight: 400;
}

h2,
.h2 {
  font-size: 3.3rem;
  line-height: 1.15;
  margin-bottom: 1.5rem;
  font-weight: 400;
}

h3,
.h3 {
  font-size: 2.8rem;
  color: black;
}

h4,
.h4 {
  font-size: 2.3rem;
  margin: 0.8rem 0;
}

h5,
.h5 {
  font-size: 2.0rem;
  margin: 0.8rem 0;
}

h6,
.h6 {
  font-size: 1.8rem;
  margin: 0.8rem 0;
}

p {
  margin: 0 0 1.5rem;
}

p.lg {
  font-size: 1.8rem;
}


@media (min-width:768px) {
  body {
    font-size: 1.6rem;
  }

  h1,
  .h1 {
    font-size: 6.7rem;
    line-height: 1.1;
  }
  
  h2,
  .h2 {
    font-size: 5.1rem;
    line-height: 1.1;
    margin-bottom: 4rem;
  }
  
  h3,
  .h3 {
    font-size: 3.8rem;
    line-height: 1.05;
  }
  
  h4,
  .h4 {
    font-size: 2.8rem;
    line-height: 1.15;
    margin-bottom: 2rem;
  }
  
  h5,
  .h5 {
    font-size: 2.1rem;
  }
  
  h6,
  .h6 {
    font-size: 1.8rem;
  }
  
  p {
    font-size: 1.8rem;
  }
  
  p.lg {
    font-size: 2.4rem;
  }
}

a {
  color: black;
}

em {
  font-weight: inherit;
}

code {
  background: rgba(0, 0, 0, 0.05);
}

hr {
  border-top: 4px solid #fac410;
}

.edit-controls {
  position: relative;
  /*margin-top: -25px;*/
  right:0;
  margin-bottom: -46px;
}

#edit-buttons {
  margin-bottom: 46px;
}

@media(min-width:768px) {
  .edit-controls {
    /*margin-top: -45.5px;*/
  }
}

.btn {
  font-size:2.0rem;
}


.tooltip {
  line-height: 1.4;
  font-weight: 400;
  font-size: 16px;
  font-size: calc(1.6rem + (1.6 - 1.6) * ((100vw - 32rem) / 88));
}

.text-primary {
  color: #1595d3;
}

.form-control {
  padding: 0.6rem 1.2rem;
  font-size: 1.6rem;
  height: calc(1.5em + 1.2rem + 2px);
}

.form-control-lg {
  padding: 0.8rem 1.6rem;
  font-size: 2rem;
  height: calc(1.5em + 1.6rem + 2px);
}

/* .dropdown-toggle:focus,
a:focus {
  outline-style: dashed;
  outline-color: #fac410;
  outline-offset: 1px;
  outline-width: 4px;
} */

a[target="_blank"]:after {
  content: '\f35d';
  font-weight: 900;
  font-family: "Font Awesome 5 Free";
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  padding-left: 5px;
}

a:not(.btn) {
  text-decoration: underline;
  color: #9B1776;
}

a:hover {
  color: #294757;
}

a {
  -webkit-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
  -o-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}


/* Grow Effect */
.grow {
  transition: 0.3s;
}
.grow:hover {
  transform: scale(1.2);
}


/* wysiwyg override styles for the editor */

.wysiwyg table {
  width: 100%;
  margin-bottom: 1.6rem;
  background-color: transparent;
}

.wysiwyg table td,
.wysiwyg table th {
  padding: 1.2rem;
  vertical-align: top;
  border-top: 1px solid #dee2e6;
}