/* !core */
body { image-rendering: -webkit-optimize-contrast; background-color: #fff; color: #089BAB; font-family: 'Nunito', Helvetica, Arial, sans-serif; font-size: 16px; overscroll-behavior-x: none; height: 100%; }
h1 { font-family: 'Raleway', Helvetica, Arial, sans-serif; font-size: 48px;  }
h2 { font-family: 'Raleway', Helvetica, Arial, sans-serif; font-size: 36px; color: #fff; }
strong { font-family: 'NunitoExtraBold'; color: #62BCC7; }
code { color: #fff; }

/* !header */
#main-header { background-color: #fff; background-image: url("/source/b67a471afa4f21d5c065218398596e4d/pattern-blue-circuitry.svg"); background-position: top center; background-repeat: repeat; background-size: 561px 538px; padding: 12px 20px; position: relative; }
#main-header .col-xs-12 { padding-left: 0; text-align: center; }
#birdbrain-logo { max-width: 200px; width: 80%; }

/* section header */
#section-header { background-color: rgba(8, 155, 171, 0.08); }
#section-header img { max-width: 200px; width: 100%; }
#section-header h2 { color: #881199 }
.success { background-image: url("/source/73dd6e084648b8ab147c81175374eea0/Confetti!.gif"); background-position: top center; background-repeat: repeat; background-size: 864px 432px; padding: 12px 20px; position: relative; }

/* main content */
#main-content { background-color: #881199; color: #fff; font-size: 24px; }
#main-content img { width: 80%; }
#main-content a { color: #ff9922; }
#main-content p { font-size: 20px; text-align: left; }

/* footer */
#bottom-buttons { color: #fff }

/* !buttons */
.btn-orange { border-radius: 5px; background-color: #ff9922; color: #fff; }
.btn-teal { border-radius: 5px; background-color: #089BAB; color: #fff; }
.btn-product { width: 75%; height: 100%; font-size: 28px; }
.btn-menu { width: 250px; font-size: 28px; }

/* //BBT Style guide colors
Colors.easternBlue = "#089BAB"; //bbt blue
Colors.neonCarrot = "#FF9922";
Colors.fountainBlue = "#62BCC7"; //lighter blue
Colors.seance = "#881199"; //dark purple
Colors.bbtDarkGray = "#535353";
Colors.iron = "#CACACA";
*/

/* tooltip */
.hoverable .hovertext {
  visibility: hidden;
  width: 250px;
  background-color: #62BCC7;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;
  margin-left: -20px;
  margin-top: 40px;
  opacity: 0.8;
  font-size: 20px;

  /* Position the tooltip */
  position: absolute; 
  z-index: 1;
}
.hoverable:hover .hovertext {
  visibility: visible;
}