@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local("Open Sans Light"), local("OpenSans-Light"), url("fonts/OpenSans-Light.eot") format("embedded-opentype"), url("fonts/OpenSans-Light.ttf") format("truetype"), url("fonts/OpenSans-Light.svg") format("svg"); }
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local("Open Sans"), local("OpenSans"), url("fonts/OpenSans-Regular.eot") format("embedded-opentype"), url("fonts/OpenSans-Regular.ttf") format("truetype"), url("fonts/OpenSans-Regular.svg") format("svg"); }
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local("Open Sans Semibold"), local("OpenSans-Semibold"), url("fonts/OpenSans-Semibold.eot") format("embedded-opentype"), url("fonts/OpenSans-Semibold.ttf") format("truetype"), url("fonts/OpenSans-Semibold.svg") format("svg"); }
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local("Open Sans Bold"), local("OpenSans-Bold"), url("fonts/OpenSans-Bold.eot") format("embedded-opentype"), url("fonts/OpenSans-Bold.ttf") format("truetype"), url("fonts/OpenSans-Bold.svg") format("svg"); }
/**
 * Global Configs
 *
 **/
* {
  box-sizing: border-box;
  transition: all 300ms ease-in-out; }

body {
  margin: 0;
  /* font */
  font-family: "Open Sans", "Helvetica", sans-serif;
  color: #000000; }

a {
  color: #007eb9; }

a:hover {
  color: #007eb9; }

h1 {
  font-size: 30px;
  font-weight: 600; }
  @media (max-width: 692px) {
    h1 {
      font-size: 20px; } }

/**
 * Helpers
 *
 **/
.link--pdf:before {
  font-family: "FontAwesome";
  content: '\f1c1';
  padding-right: 10px; }

.link--external:before {
  font-family: "FontAwesome";
  content: '\f0c1';
  padding-right: 10px; }

/**
 * Utilities
 *
 **/
.text-center {
  text-align: center; }

.small {
  font-size: 14px;
  color: #007eb9; }

/**
 * Layout
 *
 **/
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px; }
  @media (max-width: 692px) {
    .container {
      padding: 0; } }

/**
 * Logo
 *
 **/
.logo {
  display: block;
  margin-top: 50px;
  margin-top: 10vh;
  margin-bottom: 50px;
  margin-bottom: 10vh;
  margin-left: auto;
  margin-right: auto; }
  @media (max-width: 692px) {
    .logo {
      margin-top: 90px;
      margin-bottom: 80px;
      width: auto;
      height: 70px; } }

.intro {
  text-align: center;
  margin: 2em 0 3em;
  font-style: italic; }

.call-out {
  padding: 50px 40px;
  padding: 8vh 40px;
  background: #F8F8F8;
  text-align: center; }
  @media (max-width: 692px) {
    .call-out {
      background: #F8F8F8;
      padding-left: 20px;
      padding-right: 20px; } }

.call-out h1 {
  font-size: 30px;
  font-weight: 400; }
  @media (max-width: 692px) {
    .call-out h1 {
      font-size: 20px; } }

.sub-header {
  font-size: 20px; }
  @media (max-width: 744px) {
    .sub-header {
      font-size: 18px; } }
  @media (max-width: 692px) {
    .sub-header {
      font-size: 16px; } }

.subscribe {
  width: 700px;
  margin: 50px auto;
  margin: 10vh auto;
  clear: both; }
  @media (max-width: 692px) {
    .subscribe {
      margin: 90px auto;
      padding: 0 20px;
      width: 100%; } }
  .subscribe h2 {
    font-size: 25px;
    font-weight: 600;
    color: #000000; }
    @media (max-width: 692px) {
      .subscribe h2 {
        font-size: 22px; } }

.bottom-navigation {
  text-align: center;
  margin-bottom: 60px; }
  .bottom-navigation ul {
    padding-left: 0; }
    .bottom-navigation ul li {
      display: inline;
      padding: 0 50px;
      font-weight: 300; }
      @media (max-width: 692px) {
        .bottom-navigation ul li {
          display: block;
          padding-bottom: 20px; } }
      .bottom-navigation ul li a {
        font-size: 20px;
        color: #007eb9;
        text-decoration: none; }
        @media (max-width: 744px) {
          .bottom-navigation ul li a {
            font-size: 18px; } }
        .bottom-navigation ul li a:hover {
          color: #007eb9; }

.legal {
  text-align: center;
  padding: 0;
  font-size: 14px; }
  .legal li {
    display: inline-block;
    list-style-type: none;
    padding-right: 10px; }
    .legal li:last-child {
      padding-right: 0; }
    .legal li:before {
      content: "|";
      padding-right: 10px; }
    .legal li:first-child:before {
      content: ""; }
    .legal li a {
      color: #007eb9;
      text-decoration: none; }
      .legal li a:hover {
        color: #007eb9; }

#lean_overlay {
  position: fixed;
  z-index: 100;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background: black;
  display: none; }

.modal {
  padding-top: 90px;
  padding-bottom: 90px;
  border-radius: 4px;
  width: 960px;
  display: none;
  background: #303842; }
  @media (max-width: 970px) {
    .modal {
      width: 100%;
      left: 0 !important;
      margin-left: 0 !important; } }

/**
 * ID for Privacy Policies Modal
 * This forces privacy modal to same height as Abuse Contact modal.
 **/
#privacyPolicies {
  height: 560px;
  padding-top: 200px; }
  @media (max-width: 970px) {
    #privacyPolicies {
      height: auto;
      padding-top: 90px; } }

.modal__wrapper {
  width: 65%;
  margin: 0 auto;
  text-align: center;
  color: #fff;
  font-size: 25px;
  font-weight: 300; }
  .modal__wrapper a {
    color: #ff9900;
    text-decoration: none; }
    .modal__wrapper a:hover {
      color: #fff; }
  .modal__wrapper .highlight-color {
    color: #ff9900; }
  @media (max-width: 894px) {
    .modal__wrapper {
      font-size: 18px; } }

.modal_close {
  position: absolute;
  top: 20px;
  right: 20px;
  background: url(images/modal-close.png);
  width: 29px;
  height: 24px;
  cursor: pointer; }

ul.privacy-policy-list li {
  list-style-type: none;
  text-align: left;
  padding-bottom: 40px; }
  ul.privacy-policy-list li:last-child {
    padding-bottom: 0; }

.links-container {
  position: absolute;
  top: 13px;
  right: 13px;
  margin: 0;
  padding: 0; }

.link:first-child {
  border-right: none; }

.link > a {
  color: #000000; }

.link {
  float: left;
  list-style-type: none;
  border: 1px solid #000000;
  padding: 10px 25px; }

.registrars {
  width: 700px;
  margin: 50px auto; }
  @media (max-width: 692px) {
    .registrars {
      margin: 90px auto;
      padding: 0 20px;
      width: 100%; } }

.registrars a {
  color: #007eb9; }

.registrar {
  list-style-type: none;
  float: left;
  padding: 0 5px 20px 14px;
  width: 25%;
  text-align: center; }

.contact-section {
  color: #000000;
  clear: both;
  width: 100%; }

.contact-section p {
  padding-top: 5px; }
