body{
    font-size: 18px;
    line-height: 1.36;
    color: #333;
}

.header-fixed {
    padding-top: 40px;
}

.btn.btn-default{
    color: #ff0079;
    border-color: #ff0079;
}

a {
    color:#ff0079;
}

a h1{
    color: #333;
    text-decoration: none;
} 

a.logo:hover h1{
    text-decoration: none;
}

a.logo h1:hover{
    text-decoration: none;
}

ul.list-group.list-touchfriendly li  {
    min-height: 44px;
    border-radius: 0;

}
/*ul.list-group.list-touchfriendly li{
    width:100%;
    min-height: 44px;
    vertical-align: middle;
}*/

ul.list-group.list-touchfriendly a li.list-group-item{
    padding:0;
    margin:0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}


ul.list-group.list-touchfriendly {
    border-bottom: 1px solid #ddd;
}



div.list-touchfriendly a {
    border-top: 1px solid #ddd;

    padding:0;
    margin:0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
    min-height: 44px;
}
div.list-touchfriendly a:last-child {
    border-bottom: 1px solid #ddd;
}


.logo{
    font-family: 'Press Start 2P', sans-serif;
    font-size: 48px;
}

.grid-logo{
    display: grid;
    grid-template-columns: 100px auto 1fr;
    grid-gap: 20px;
}

.lead{
    margin-bottom: 0;
}

@media (min-width: 768px){
    .lead {
        font-size: 24px;
        margin-bottom: 16px;
    }
}


@media (max-width: 992px){
    .grid-4.howitworks {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 480px){
    body {
        font-size: 20px;
    }
    .header-fixed {
        padding-top: 24px;
    }
    .grid-4.howitworks {
        grid-template-columns: 1fr;
    }

    .grid-logo{
        display: grid;
        grid-template-columns: 36px  1fr;
        grid-gap: 20px;
    }
    h1.logo{
        font-size: 24px;
        margin-top: 8px;
    }

    .lead{
        font-size: 20px;
    }
    .container {
        padding-left: 24px;
        padding-right: 24px;
    }

    h2 {
        font-size: 22px;
    }
    h3 {
        font-size: 20px;
    }

    hr{
        margin: 8px 0 0;
    }
}

    ul.loseList {
        padding-left: 20px
    }

.btn-primary{
    background-color: #FF0079;
    border: none;
}

.btn-primary:hover{
    background-color: #ff0;
    color:#000;
    border: none;
}

.howitworks .card{
    display: grid;
    grid-template-rows: 1fr auto;
}


.howitworks .card h3{
    margin-top: 0;
}

.noWrap{
    white-space: nowrap;
}
.loseList li{
    margin-bottom: 8px;
}


.pre-scrollable {
  max-height: 440px;
  overflow: scroll;
}




/*
Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/
*/
    pre {
        background-color: #000;
        color: #f8f8f2;
        font-size: 16px;
    }
    .hljs {
      display: block;
      overflow-x: auto;
      padding: 0.5em;
      background: #000;
    }

    .hljs,
    .hljs-tag,
    .hljs-subst {
      color: #f8f8f2;
    }

    .hljs-strong,
    .hljs-emphasis {
      color: #a8a8a2;
    }

    .hljs-bullet,
    .hljs-quote,
    .hljs-number,
    .hljs-regexp,
    .hljs-literal,
    .hljs-link {
      color: #ae81ff;
    }

    .hljs-code,
    .hljs-title,
    .hljs-section,
    .hljs-selector-class {
      color: #a6e22e;
    }

    .hljs-strong {
      font-weight: bold;
    }

    .hljs-emphasis {
      font-style: italic;
    }

    .hljs-keyword,
    .hljs-selector-tag,
    .hljs-name,
    .hljs-attr {
      color: #f92672;
    }

    .hljs-symbol,
    .hljs-attribute {
      color: #66d9ef;
    }

    .hljs-params,
    .hljs-class .hljs-title {
      color: #f8f8f2;
    }

    .hljs-string,
    .hljs-type,
    .hljs-built_in,
    .hljs-builtin-name,
    .hljs-selector-id,
    .hljs-selector-attr,
    .hljs-selector-pseudo,
    .hljs-addition,
    .hljs-variable,
    .hljs-template-variable {
      color: #e6db74;
    }

    .hljs-comment,
    .hljs-deletion {
      color: #75715e;
    }
    .hljs-meta {
      color: #fff;
    }

.alert h3{
    padding: 0;
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: bold;
}

.affordance{
    text-decoration: underline;
}

.alert-info {
    color: #333;
    background-color: #f8f6e1;
    border-color: #ff0079;
}

.goto {
    color: #00f;
}