﻿body {
    padding-top: 5rem;    
}

/* See https://css-tricks.com/hash-tag-links-padding/ */
#index-page h4 {
    z-index: -100;
}

    #index-page h4::before {
        z-index: -100;
        display: block;
        content: " ";
        margin-top: -4rem;
        height: 4rem;
        visibility: hidden;
        pointer-events: none;
    }

.jumbotron {
    background: #888888;
    padding: 3em;
    color: white;
    margin: 1em auto 1.5em;
}

    .jumbotron p {
        margin-top: 1em;
        font-size: 1.45em;
    }

hr.styled {
    overflow: visible; /* For IE */
    padding: 0;
    border: none;
    border-top: medium double #333;
    color: #333;
    text-align: center;
}

    hr.styled:after {
        content: "§";
        display: inline-block;
        position: relative;
        top: -0.7em;
        font-size: 1.5em;
        padding: 0 0.25em;
        background: white;
    }


.feedback, .hidden {
    display: none;
}

span.feedback {
    margin-left: 2em;
}

form.eg {
    max-width: 30em;
}

    form.eg label {
        font-weight: 550;
    }

pre.json-display {
    background-color: ghostwhite;
    border: 1px solid silver;
    padding: 10px 20px;
}

.json-key {
    color: brown;
}

.json-value {
    color: navy;
}

.json-string {
    color: olive;
}




/* From http://tobiasahlin.com/spinkit/ */
.spinner {
    margin: 100px auto;
    width: 150px;
    height: 140px;
    text-align: center;
    font-size: 10px;
}

    .spinner > div {
        background-color: #00002D;
        height: 100%;
        width: 6px;
        display: inline-block;
        -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
        animation: sk-stretchdelay 1.2s infinite ease-in-out;
    }

    .spinner .rect2 {
        -webkit-animation-delay: -1.1s;
        animation-delay: -1.1s;
    }

    .spinner .rect3 {
        -webkit-animation-delay: -1.0s;
        animation-delay: -1.0s;
    }

    .spinner .rect4 {
        -webkit-animation-delay: -0.9s;
        animation-delay: -0.9s;
    }

    .spinner .rect5 {
        -webkit-animation-delay: -0.8s;
        animation-delay: -0.8s;
    }

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4)
    }

    20% {
        -webkit-transform: scaleY(1.0)
    }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }

    20% {
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

.hide-button-invoke {
    display: none;
}

.navbar-left img {
    max-width: 150px;
}

.navbar {
    background-color: #00002D;
    border-color: #ed1942;
}

.navbar a, .navbar a:hover, .navbar a:focus {
    color: white;
}

    .navbar li a:hover, .navbar li a:focus {
        background-color: #00002D;
    }

.btn, .feedback h3 span, .navbar {
    font-family: 'Between1-Regular', Arial, Helvetica, sans-serif;
    font-weight: 700
}

.btn-primary, .btn-primary:disabled, .btn-primary:not(:disabled):not(.disabled):active {
    background-color: #00002D;
    box-shadow: none !important;
    outline: none !important;
}
    .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:active:focus {
        background-color: #00002D;
        box-shadow: none !important;
        outline: none !important;
    }

.form-control:focus {
    border-color: #00002D;
    box-shadow: none !important;
}

/*Remove helper message from Jquery UI Autocomplete */
.ui-helper-hidden-accessible {
    display: none;
}

.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    background-color: inherit;
}
.autocomplete-results {
    background-color: white;
}

#selectedTargetEmailInput {
    width:100%;
}

.scg-hidden {
    display: none;
}

