@font-face {
  font-family: 'alrightRegular';
  src: url("../fonts/ttfah-alrightsublpwebfontuseonly-regular-webfont.eot");
  src: url("../fonts/ttfah-alrightsublpwebfontuseonly-regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/ttfah-alrightsublpwebfontuseonly-regular-webfont.woff") format("woff"), url("../fonts/ttfah-alrightsublpwebfontuseonly-regular-webfont.ttf") format("truetype"), url("../fonts/ttfah-alrightsublpwebfontuseonly-regular-webfont.svg#alrightsublpwebfontuseonly-Rg") format("svg");
  font-weight: 300;
  font-style: normal; }
@font-face {
  font-family: 'din';
  src: url("../fonts/DIN17SBOP-Regular.eot");
  src: url("../fonts/DIN17SBOP-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/DIN17SBOP-Regular.woff") format("woff"), url("../fonts/DIN17SBOP-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'alrightBold';
  src: url("../fonts/ttfah-alrightsublpwebfontuseonly-bold-webfont.eot");
  src: url("../fonts/ttfah-alrightsublpwebfontuseonly-bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/ttfah-alrightsublpwebfontuseonly-bold-webfont.woff") format("woff"), url("../fonts/ttfah-alrightsublpwebfontuseonly-bold-webfont.ttf") format("truetype"), url("../fonts/ttfah-alrightsublpwebfontuseonly-bold-webfont.svg#alrightsublpwebfontuseonly-Bd") format("svg");
  font-weight: 700;
  font-style: normal; }
* {
  box-sizing: border-box;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased; }

html, body {
  height: 100%;
  width: 100%;
  color: #333333;
  font-size: 100%;
  background: #ffffff;
  font-family: 'alrightRegular';
  font-weight: 300; }

html:not(.inlinesvg) svg, html:not(.inlinesvg) .skyline, html:not(.csstransforms) svg, html:not(.csstransforms) .skyline {
  display: none; }
html:not(.inlinesvg) .header, html:not(.csstransforms) .header {
  height: 360px;
  background: #FDFAFB; }
  html:not(.inlinesvg) .header .container, html:not(.csstransforms) .header .container {
    display: table; }
  html:not(.inlinesvg) .header .heroText, html:not(.csstransforms) .header .heroText {
    position: relative;
    display: table-cell;
    vertical-align: middle;
    top: 48px;
    height: 360px; }

.container {
  max-width: 960px;
  width: 100%;
  margin: 0 auto;
  position: relative; }

a {
  color: #169CEE;
  text-decoration: none;
  outline: 0;
  transition: color 0.15s cubic-bezier(0.4, 0, 0.2, 1), text-shadow 0s cubic-bezier(0.4, 0, 0.2, 1) 0.3s;
  position: relative; }
  a:focus {
    outline: 0; }
  a.white {
    color: #ffffff; }

/* Selection */
::-moz-selection {
  background: #169CEE;
  color: #ffffff;
  text-shadow: none; }

::selection {
  background: #169CEE;
  color: #ffffff;
  text-shadow: none; }

h1 {
  color: #66637A;
  font-size: 48px;
  font-family: 'alrightBold';
  letter-spacing: 2px;
  line-height: 1;
  font-weight: 600;
  margin-bottom: 0px; }
  @media screen and (max-width: 960px) {
    h1 {
      font-size: 48px; } }
  @media screen and (max-width: 600px) {
    h1 {
      font-size: 32px; } }
  @media screen and (max-width: 400px) {
    h1 {
      font-size: 24px; } }

h2 {
  font-size: 20px;
  font-family: 'din';
  font-weight: 300;
  letter-spacing: 0.3px;
  line-height: 24px; }
  @media screen and (max-width: 720px) {
    h2 {
      font-size: 16px; } }

h3 {
  font-size: 27px;
  line-height: 32px;
  color: #169CEE;
  font-family: 'alrightRegular';
  letter-spacing: -0.2px;
  margin: 48px 0px 10px 0px;
  text-align: center;
  font-weight: 600; }
  h3 span {
    font-family: 'din';
    color: #E0E0EA;
    width: 32px;
    margin-right: 16px;
    margin-left: -48px; }
  @media screen and (max-width: 480px) {
    h3 {
      font-size: 18px;
      margin: 32px 0px 8px 0px; } }

h4 {
  font-family: 'alrightRegular';
  font-size: 18px;
  letter-spacing: 0.6px;
  line-height: 32px;
  margin: 0px;
  white-space: nowrap;
  font-weight: 300; }

h5 {
  font-family: 'din';
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: 3px;
  color: #169CEE;
  opacity: 0.6;
  margin-bottom: 12px;
  line-height: 12px;
  font-weight: 300; }

h6 {
  font-family: 'alrightRegular';
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.2px;
  margin: 0px auto 32px auto;
  color: #66637A;
  max-width: 600px;
  text-align: center;
  font-weight: 300; }
  @media screen and (max-width: 600px) {
    h6 {
      font-size: 14px; } }
  @media screen and (max-width: 480px) {
    h6 {
      margin: 0px auto 24px auto; } }

p {
  font-size: 14px;
  line-height: 24px;
  letter-spacing: 0.2px;
  margin: 0px 0px 48px 0px;
  color: #66637A;
  max-width: 720px; }
  @media screen and (max-width: 480px) {
    p {
      font-size: 14px; } }

br {
  height: 24px; }

button, .button {
  font-family: "din";
  border-radius: 4px;
  outline: none;
  background: #169CEE;
  color: #ffffff;
  border: none;
  margin-right: 32px;
  font-size: 14px;
  padding: 0px 16px;
  height: 32px;
  line-height: 32px;
  transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  font-weight: 100; }
  button.outline, .button.outline {
    background: transparent;
    border: 1px solid #169CEE;
    color: #169CEE; }
    button.outline:hover, .button.outline:hover {
      background: #169CEE;
      color: #ffffff; }
  button.large, .button.large {
    font-family: 'alrightRegular';
    text-transform: uppercase;
    font-size: 18px;
    margin-right: 16px;
    margin-top: 16px; }

nav {
  position: absolute;
  z-index: 99;
  top: 24px;
  width: 100%;
  height: 80px; }
  nav .container a {
    display: inline-block;
    z-index: 101; }
  nav .logo {
    height: 56px;
    margin: 12px 0px; }
    @media screen and (max-width: 960px) {
      nav .logo {
        height: 48px; } }
  nav ul {
    float: right;
    margin: 0px;
    padding: 0px;
    position: relative;
    top: 2px; }
    nav ul a {
      color: #169CEE;
      text-decoration: none;
      float: left;
      margin-left: 32px; }
      nav ul a:first-of-type {
        margin-left: 0px; }
      @media screen and (max-width: 400px) {
        nav ul a:last-of-type {
          display: none; } }
    nav ul li {
      font-family: "din";
      float: left;
      line-height: 80px;
      margin: 0px;
      padding: 0px;
      list-style: none;
      color: #169CEE;
      font-size: 16px;
      cursor: pointer;
      letter-spacing: 0.3px; }
      nav ul li:last-of-type {
        margin: 0px; }
      @media screen and (max-width: 960px) {
        nav ul li {
          line-height: 72px; } }
    @media screen and (max-width: 480px) {
      nav ul .hideOnMobile {
        display: none; } }
    nav ul ul {
      padding-left: 16px; }
  @media screen and (max-width: 960px) {
    nav {
      top: 8px; } }
  @media screen and (max-width: 600px) {
    nav {
      top: 4px; }
      nav .container {
        padding: 0px 16px; }
      nav .logo {
        height: 40px; }
      nav ul li {
        line-height: 68px; }
      nav ul a {
        margin-left: 24px; } }
  @media screen and (max-width: 480px) {
    nav ul li {
      font-size: 14px;
      line-height: 64px; }
    nav .logo {
      height: 36px; } }

.header {
  position: relative;
  height: 74%;
  width: 100%;
  overflow: hidden;
  margin-bottom: 16px; }
  .header .heroText {
    font-family: 'alrightRegular';
    color: #ffffff;
    position: fixed;
    top: 100px;
    left: 5%;
    right: 5%;
    text-align: center;
    width: 90%; }
    .header .heroText h2 {
      color: #66637A; }
      .header .heroText h2 .subheadSection {
        margin: 0px 32px; }
        @media screen and (max-width: 960px) {
          .header .heroText h2 .subheadSection {
            margin: 0px 24px; } }
        @media screen and (max-width: 600px) {
          .header .heroText h2 .subheadSection {
            margin: 0px 12px; } }
      .header .heroText h2 .icon {
        padding-right: 8px;
        position: relative;
        top: 4px;
        height: 24px;
        display: inline-block; }
        @media screen and (max-width: 600px) {
          .header .heroText h2 .icon {
            height: 20px; } }
    @media screen and (max-width: 600px) {
      .header .heroText {
        position: absolute;
        top: 8%; } }
  @media screen and (max-height: 900px) {
    .header {
      height: 900px; } }
  @media screen and (max-width: 600px) {
      .header .container {
        height: 100%; }
      .header .headerIllustration .headerLeftContainer {
        width: 37.170130284vh; }
      .header .headerIllustration .headerCenterContainer {
        width: 30.337385744vh; }
      .header .headerIllustration .headerRightContainer {
        width: 41.178673739vh; } }

.headerIllustration {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  pointer-events: none; }
  .headerIllustration .skyline {
    height: 100%; }
  .headerIllustration .illustrationForeground {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
    margin: auto;
    width: 100%;
    max-width: 1200px;
    height: 100%;
    overflow: visible; }
  .headerIllustration svg, .headerIllustration img, .headerIllustration .headerLeft, .headerIllustration .headerCenter, .headerIllustration .headerRight {
    height: 100%;
    position: absolute;
    bottom: 0px;
    overflow: visible; }
  .headerIllustration .headerLeft {
    left: -4%; }
  .headerIllustration .headerLeftContainer {
    width: 50.875vh; }
    .headerIllustration .headerLeftContainer .craneLineContainer {
      position: absolute;
      right: 0px;
      bottom: 0px;
      width: 100%;
      height: 46.5625%;
      overflow: hidden; }
      .headerIllustration .headerLeftContainer .craneLineContainer .craneLine {
        position: absolute;
        left: 0px;
        bottom: 0px;
        width: 100%;
        height: 214.76510067%;
        transform: translateY(-25%); }
    .headerIllustration .headerLeftContainer .phone1ScreenContainer {
      position: absolute;
      background: #555574;
      left: 50.90909%;
      width: 20.11364%;
      height: 24.21875%;
      bottom: 3.28125%; }
      .headerIllustration .headerLeftContainer .phone1ScreenContainer .appSquare {
        position: absolute;
        width: 24.85876%;
        height: 14.19355%;
        top: 56.12903%;
        background: #DB3B61;
        border-radius: 20%;
        transform: scale(0.45);
        transform-origin: 50% 50%;
        transform: rotateZ(90deg) scale(0.45);
        opacity: 0; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appSquare.one {
          left: 6.77966%; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appSquare.two {
          left: 37.28814%; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appSquare.three {
          left: 67.79661%; }
      .headerIllustration .headerLeftContainer .phone1ScreenContainer .appRect {
        transform: scale(0.45);
        transform-origin: 50% 50%;
        transform: rotateZ(90deg) scale(0.45);
        opacity: 0;
        background: #DB3B61;
        position: absolute;
        left: 6.77966%;
        width: 85.87571%;
        height: 4.83871%; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appRect.one {
          top: 74.19355%; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appRect.two {
          top: 82.25806%; }
        .headerIllustration .headerLeftContainer .phone1ScreenContainer .appRect.three {
          top: 90.32258%; }
  .headerIllustration .headerCenter {
    left: 0px;
    right: 0px;
    margin: auto; }
    .headerIllustration .headerCenter .middleLineOne {
      transform: translateY(-100%); }
    @media screen and (max-aspect-ratio: 8 / 5) and (max-width: 1480px) {
      .headerIllustration .headerCenter {
        opacity: 0; } }
    @media screen and (max-width: 600px) {
      .headerIllustration .headerCenter {
        opacity: 0; } }
  .headerIllustration .headerCenterContainer {
    width: 41.625vh; }
    .headerIllustration .headerCenterContainer .pushOne {
      position: absolute;
      left: 6.94444%;
      bottom: 6.71875%;
      height: auto;
      width: 15.55556%;
      transform-origin: 25% 0%; }
    .headerIllustration .headerCenterContainer .middleLineOne {
      position: absolute;
      left: 0px;
      bottom: 0px;
      width: 100%;
      height: 150%; }
  .headerIllustration .headerRight {
    right: -4%; }
    .headerIllustration .headerRight .st1 {
      fill: #3A3A59; }
    .headerIllustration .headerRight .st2 {
      fill: #0E69A1; }
    .headerIllustration .headerRight .st6 {
      fill: #555574; }
    .headerIllustration .headerRight .st7 {
      fill: #4BBC6E; }
    .headerIllustration .headerRight .st8 {
      fill: #EF3F61; }
    .headerIllustration .headerRight .st9 {
      fill: none;
      stroke: #3A3A59;
      stroke-width: 16;
      stroke-linecap: round;
      stroke-miterlimit: 10; }
    .headerIllustration .headerRight .st10 {
      fill: none;
      stroke: #0E69A1;
      stroke-width: 8;
      stroke-miterlimit: 10; }
    .headerIllustration .headerRight .st11 {
      fill: #159CEE; }
    .headerIllustration .headerRight .st13 {
      fill: none;
      stroke: #169CEE;
      stroke-width: 8;
      stroke-miterlimit: 10; }
  .headerIllustration .headerRightContainer {
    width: 56.425vh; }
    .headerIllustration .headerRightContainer .svgInner {
      position: absolute;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%; }
    .headerIllustration .headerRightContainer .wheelsContainer {
      transform: translateX(100%); }
    .headerIllustration .headerRightContainer .hoist {
      transform: translateX(100%); }
    .headerIllustration .headerRightContainer .hoistParts {
      transform: translateX(100%); }
    .headerIllustration .headerRightContainer .hoistWheel {
      position: absolute;
      width: 3.79098%;
      height: 2.89063%;
      bottom: 1.25%; }
      .headerIllustration .headerRightContainer .hoistWheel:nth-of-type(1) {
        right: 1.71875%; }
      .headerIllustration .headerRightContainer .hoistWheel:nth-of-type(2) {
        right: 8.90625%; }
      .headerIllustration .headerRightContainer .hoistWheel:nth-of-type(3) {
        right: 16.09375%; }
      .headerIllustration .headerRightContainer .hoistWheel:nth-of-type(4) {
        right: 23.28125%; }
      .headerIllustration .headerRightContainer .hoistWheel:nth-of-type(5) {
        right: 30.46875%; }
    .headerIllustration .headerRightContainer .phoneCircle {
      position: absolute;
      border-radius: 50%; }
    .headerIllustration .headerRightContainer .phone2Screen {
      position: absolute;
      left: 20.28689%;
      bottom: 4.92188%;
      width: 22.95082%;
      height: 29.53125%;
      background: #555574;
      overflow: hidden; }
      .headerIllustration .headerRightContainer .phone2Screen .phoneCircle {
        left: -70%;
        right: -70%;
        width: 240%;
        padding-bottom: 50%;
        top: -25%;
        bottom: -25%;
        background: #4BBC6E;
        transform: scale(0); }
    .headerIllustration .headerRightContainer .phone3Screen {
      position: absolute;
      left: 37.90984%;
      bottom: 5.23438%;
      width: 22.13115%;
      height: 22.65625%;
      background: #3A3A59;
      overflow: hidden; }
      .headerIllustration .headerRightContainer .phone3Screen .phoneCircle {
        left: -50%;
        right: -50%;
        width: 200%;
        padding-bottom: 50%;
        top: -25%;
        bottom: -25%;
        background: #555574;
        transform: scale(0); }
  @media screen and (max-width: 960px), (min-width: 960px) and (max-aspect-ratio: 4 / 3) {
    .headerIllustration > svg, .headerIllustration > img, .headerIllustration > div {
      transform: scale(0.75);
      transform-origin: center bottom; }
    .headerIllustration > .skyline {
      transform: scale(1);
      height: 75%; }
    .headerIllustration .headerLeft {
      left: -24%; }
    .headerIllustration .headerRight {
      right: -20%; } }
  @media screen and (min-width: 1480px) {
    .headerIllustration .headerLeft {
      left: -15%; }
    .headerIllustration .headerRight {
      right: -18%; }
    .headerIllustration .headerLeft, .headerIllustration .headerRight, .headerIllustration .headerCenter {
      transform: scale(0.75);
      transform-origin: center bottom; } }
  @media screen and (max-aspect-ratio: 5 / 8) and (min-width: 720px) {
    .headerIllustration .headerLeft {
      left: -36%; }
    .headerIllustration .headerRight {
      right: -32%; }
    .headerIllustration .headerCenter {
      opacity: 0; } }

.secondaryNav {
  width: 100%;
  height: 48px;
  position: relative;
  text-align: center;
  z-index: 99;
  position: absolute;
  top: 74%;
  overflow: hidden; }
  .secondaryNav .navBackground {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border-bottom: 1px solid #E0E0EA;
    background: #ffffff;
    transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
  .secondaryNav ul {
    display: inline-block;
    margin: 0px auto;
    padding: 0px;
    pointer-events: all;
    height: 48px; }
    .secondaryNav ul a {
      color: rgba(118, 140, 151, 0.5);
      text-decoration: none;
      float: left;
      margin-left: 48px;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1), color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav ul a.active {
        color: #169CEE; }
      .secondaryNav ul a:hover {
        color: #169CEE; }
      .secondaryNav ul a:first-of-type {
        margin-left: 0px; }
      @media screen and (max-width: 960px) {
        .secondaryNav ul a {
          margin-left: 32px; } }
    .secondaryNav ul li {
      font-family: "din";
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      line-height: 48px;
      margin: 0px;
      padding: 0px;
      list-style: none;
      font-size: 16px;
      cursor: pointer;
      letter-spacing: 0.2px; }
      .secondaryNav ul li:last-of-type {
        margin: 0px; }
    .secondaryNav ul ul {
      padding-left: 16px; }
  .secondaryNav.shown {
    position: fixed;
    top: 0px;
    left: 0px; }
    .secondaryNav.shown a {
      transform: translateY(0px); }
      .secondaryNav.shown a:nth-of-type(1) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.05s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(2) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(3) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.15s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(4) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.2s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(5) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.25s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(6) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(7) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.35s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
      .secondaryNav.shown a:nth-of-type(8) {
        transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.4s, color 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
    .secondaryNav.shown .navBackground {
      transform: translateY(0px);
      transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
  @media screen and (max-height: 900px) {
    .secondaryNav {
      top: 900px; } }
  @media screen and (max-width: 600px) {
      .secondaryNav ul li {
        font-size: 14px;
        letter-spacing: 0.1; } }
  @media screen and (max-width: 480px) {
    .secondaryNav ul a {
      margin-left: 24px; }
    .secondaryNav ul li {
      font-size: 12px; } }
  @media screen and (max-width: 400px) {
    .secondaryNav ul a {
      margin-left: 14px; }
    .secondaryNav ul li {
      font-size: 10px; } }

.wrapper {
  width: 100%;
  background: #ffffff; }

section {
  padding-bottom: 16px;
  float: left;
  position: relative;
  width: 100%;
  background: #ffffff; }
  section .tableWrapper {
    border-radius: 4px;
    max-width: 650px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #E0E0EA; }
  section table {
    width: 100%;
    margin: 0 auto; }
    section table td {
      height: 72px;
      max-width: 280px; }
  section:first-of-type {
    padding-top: 32px; }
  section:last-of-type {
    padding-bottom: 80px; }

.container {
  padding: 0px 32px; }

.repoRow {
  float: left;
  width: 100%; }
  @media screen and (max-width: 600px) {
    .repoRow {
      float: none;
      width: auto; } }

.repo, .repoList {
  border: 1px solid #E0E0EA;
  background: rgba(14, 105, 161, 0.03);
  overflow: hidden; }
  .repo .repoDescription p, .repoList .repoDescription p {
    font-size: 14px;
    overflow: hidden;
    color: rgba(102, 99, 122, 0.5);
    margin: 0px; }
  .repo img.icon, .repoList img.icon {
    height: 14px;
    margin-right: 4px;
    position: relative;
    top: 1px; }

.repo {
  text-overflow: ellipsis;
  margin-bottom: 48px;
  float: left;
  min-width: 180px;
  max-width: 320px;
  border-radius: 4px;
  width: 33.333333%;
  margin-right: 0px;
  width: calc(33.333333% - 32px);
  margin-right: calc(48px); }
  .repo:nth-of-type(3n) {
    margin-right: 0px; }
  .repo h4 {
    color: #66637A;
    text-overflow: ellipsis;
    overflow: hidden; }
  .repo .SDKLogo {
    height: 30px;
    position: absolute;
    top: 0px;
    bottom: 0px;
    margin: auto 0;
    right: 16px; }
  .repo .repoTitle {
    padding: 10px 16px;
    position: relative; }
    .repo .repoTitle h4 {
      transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      white-space: normal; }
    .repo .repoTitle p {
      margin: 0px;
      opacity: 0.45;
      font-size: 14px;
      font-family: "din";
      line-height: 16px; }
      .repo .repoTitle p span {
        margin-right: 24px; }
  .repo .repoLink {
    height: 40px;
    border-top: 1px solid #E0E0EA;
    position: relative;
    cursor: pointer;
    background: #ffffff; }
    .repo .repoLink a {
      border-bottom: 1px solid #E0E0EA; }
    .repo .repoLink:first-of-type {
      margin-top: 0px; }
    .repo .repoLink p {
      line-height: 40px;
      padding: 0px 16px;
      color: #66637A;
      margin: 0px; }
    .repo .repoLink:not(.blankRepoLink):hover:after {
      opacity: 1; }
    .repo .repoLink:not(.blankRepoLink):after {
      transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      content: "";
      position: absolute;
      right: 12px;
      top: 8px;
      width: 24px;
      height: 24px;
      background: url("../img/arrowRight.svg") no-repeat center;
      background-size: 100% auto;
      opacity: 0.18; }
    .repo .repoLink.expandableRepoLink {
      min-height: 40px;
      height: auto;
      max-height: 40px;
      overflow: hidden;
      transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1); }
      .repo .repoLink.expandableRepoLink p {
        border-bottom: 1px solid #E0E0EA; }
      .repo .repoLink.expandableRepoLink ul {
        padding: 12px 0px;
        margin: 0px;
        background: rgba(224, 224, 234, 0.2); }
        .repo .repoLink.expandableRepoLink ul li {
          margin-left: 16px;
          padding-left: 12px;
          font-size: 14px;
          color: rgba(85, 85, 114, 0.6);
          line-height: 24px;
          list-style: none;
          border-left: 1px solid #E0E0EA;
          transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
          .repo .repoLink.expandableRepoLink ul li:hover {
            color: #555572;
            border-left: 1px solid #555572; }
      .repo .repoLink.expandableRepoLink.expanded {
        max-height: 240px; }
        .repo .repoLink.expandableRepoLink.expanded:not(.blankRepoLink):after {
          transform: rotate(90deg);
          opacity: 1; }
  .repo .repoDescription {
    background: #ffffff;
    border-top: 1px solid #E0E0EA;
    height: auto;
    text-overflow: ellipsis;
    line-height: 24px;
    padding: 12px 16px; }
  .repo .repoButton {
    padding: 14px 16px;
    border-top: 1px solid #E0E0EA;
    min-height: 61px; }
    .repo .repoButton button, .repo .repoButton .button {
      width: 100%; }
  @media screen and (max-width: 960px) {
    .repo {
      width: calc(33.333333333% - 24px);
      margin-right: calc(32px); } }
  @media screen and (max-width: 600px) {
    .repo {
      float: none;
      width: 100%;
      margin: 0 auto 32px auto; }
      .repo:nth-of-type(3n) {
        margin: 0 auto 32px auto; }
      .repo .blankRepoLink {
        display: none; } }

.repoList {
  width: 100%;
  max-width: 650px;
  margin: 0 auto;
  height: auto;
  background: rgba(14, 105, 161, 0.03);
  position: relative;
  border: none;
  border-bottom: 1px solid #E0E0EA; }
  .repoList .repoTitle, .repoList .repoDescription, .repoList .repoInfo {
    position: relative; }
    .repoList .repoTitle h4, .repoList .repoTitle p, .repoList .repoDescription h4, .repoList .repoDescription p, .repoList .repoInfo h4, .repoList .repoInfo p {
      text-overflow: ellipsis;
      white-space: nowrap; }
  .repoList h4 {
    margin: 16px 0px 4px 0px;
    font-size: 14px;
    line-height: 24px;
    font-family: 'alrightBold';
    color: #66637A;
    padding-left: 24px;
    padding-right: 24px;
    white-space: normal; }
    @media screen and (max-width: 600px) {
      .repoList h4 {
        padding-left: 16px;
        padding-right: 16px; } }
  .repoList .metadata {
    margin: 0px;
    opacity: 0.45;
    font-size: 14px;
    font-family: "din";
    padding-right: 8px; }
    @media screen and (max-width: 480px) {
      .repoList .metadata {
        display: none; } }
    .repoList .metadata span {
      margin-right: 12px; }
  .repoList .repoDescription {
    opacity: 0.6;
    margin: 0px;
    padding-right: 24px;
    padding-left: 24px;
    padding-bottom: 16px; }
    @media screen and (max-width: 600px) {
      .repoList .repoDescription {
        padding-left: 16px;
        padding-right: 16px; } }
  .repoList .language {
    text-align: right;
    padding-right: 16px;
    top: 2px;
    position: relative; }
    @media screen and (max-width: 540px) {
      .repoList .language {
        display: none; } }
  .repoList .repoInfo {
    height: 100%;
    right: 0px;
    padding-right: 24px; }
    .repoList .repoInfo p {
      white-space: nowrap;
      line-height: 72px;
      margin: 0px; }
    .repoList .repoInfo span {
      float: right;
      padding-left: 16px; }
    @media screen and (max-width: 600px) {
      .repoList .repoInfo {
        padding-right: 16px; }
        .repoList .repoInfo span {
          display: none; }
          .repoList .repoInfo span:nth-of-type(2) {
            display: block; } }
  .repoList a {
    display: block;
    text-decoration: none;
    float: left;
    width: 100%; }
    .repoList a:hover h4 {
      color: #169CEE; }
  .repoList:last-of-type {
    border-bottom: 0px; }

footer {
  float: left;
  height: 288px;
  width: 100%;
  background: rgba(235, 235, 242, 0.3); }
  footer .container {
    position: relative;
    height: 100%;
    display: table; }
  footer .footerImage {
    position: absolute;
    top: 0px;
    left: 32px;
    right: 32px;
    bottom: 0px;
    margin: auto;
    height: 192px; }
  footer p {
    margin-bottom: 0px;
    line-height: 32px;
    color: #169CEE;
    width: 100%; }
  footer .socialLinks, footer .needHelp {
    display: table-cell;
    vertical-align: middle; }
  footer .socialLinks {
    margin-right: 32px; }
    footer .socialLinks h5, footer .socialLinks p {
      text-align: right; }
  footer .needHelp {
    margin-left: 32px; }
    footer .needHelp h5, footer .needHelp p {
      text-align: left; }
  footer .socialIcons {
    float: right;
    margin-top: 2px;
    margin-right: -4px; }
    footer .socialIcons a {
      float: right;
      margin-left: 4px; }
    footer .socialIcons img {
      height: 32px;
      width: 32px;
      cursor: pointer;
      transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
      footer .socialIcons img:hover {
        transform: scale(1.1); }
  @media screen and (max-width: 720px) {
    footer .footerImage {
      display: none; } }
  @media screen and (max-width: 600px) {
    footer .socialLinks, footer .needHelp {
      display: block;
      margin-left: 16px; }
      footer .socialLinks h5, footer .socialLinks p, footer .needHelp h5, footer .needHelp p {
        text-align: left; }
      footer .socialLinks .socialIcons, footer .needHelp .socialIcons {
        float: left;
        margin-left: -5px;
        margin-right: 0px; }
        footer .socialLinks .socialIcons img, footer .needHelp .socialIcons img {
          margin: 0px 4px 0px 0px; }
    footer .needHelp {
      margin-top: 48px; }
    footer .socialLinks {
      margin-top: 32px; } }

/* Maintenance Notice */
.maintenance-notice {
  background: linear-gradient(135deg, #FF6B6B 0%, #FF8E8E 100%);
  border-bottom: 3px solid #E55757;
  color: white;
  padding: 12px 0;
  text-align: center;
  position: relative;
  z-index: 1000;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.maintenance-notice .maintenance-content {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}

.maintenance-notice .maintenance-icon {
  font-size: 18px;
  margin-right: 8px;
}

.maintenance-notice .maintenance-text {
  font-size: 14px;
  line-height: 1.4;
  font-weight: 400;
}

.maintenance-notice .maintenance-text strong {
  font-weight: 600;
}

@media (max-width: 600px) {
  .maintenance-notice {
    padding: 15px 20px;
  }
  
  .maintenance-notice .maintenance-content {
    flex-direction: column;
    gap: 4px;
  }
  
  .maintenance-notice .maintenance-icon {
    margin-right: 0;
  }
  
  .maintenance-notice .maintenance-text {
    font-size: 13px;
    text-align: center;
  }
}