/*
 * csgo-buynds web-app stylesheet
 */

body {
    margin-top: 50px;
}

pre.buy-binds {
    background-color: white;
    white-space: nowrap;
}

#githubIconImg {
    display: inline-block;
    height: 16px;
    vertical-align: text-bottom;
    width: 16px;
}

.social-button {
    display: inline-block;
    vertical-align: text-top;
}
.social-button:not(:first-child) {
    margin-left: 10px;
}

div.release-notes ul {
    padding-left: 10px;
    list-style-type: square;
}

.footer {
    border-top: 1px solid lightgrey;
    font-size: small;
    margin-top: 50px;
    padding: 20px 0;
    text-align: center;
}

.generator {
    margin: 10px 0;
}

.label-counter-terrorist {
    background-color: #579bdd;
}

.label-terrorist {
    background-color: #dfab32;
}

.keypad {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 60px;
    grid-gap: 4px;
}

.keypad .key.tall-key {
    grid-row: span 2;
}

.keypad .key.wide-key {
    grid-column: span 2;
}

.keypad .key.main-mouse-button {
    grid-row: span 3;
}

.keypad .key button {
    font-size: medium;
    font-weight: bold;
    height: 100%;
    width: 100%;
    padding: 0;
}

.keypad .key button .key-alt-fn {
    font-size: small;
    font-weight: normal;
}

.keypad .key button .key-alt-fn.arrow {
    font-size: medium;
    font-weight: bold;
}

.key-button-tooltip,
.item-tooltip {
    opacity: 1 !important;
}

.key-button-tooltip .tooltip-inner,
.item-tooltip .tooltip-inner {
    max-width: 500px;
}

.key-button-tooltip .item-icon {
    display: inline-block;
    background-color: white;

}

.key-button-tooltip .item-icon.ct-item {
    background-color: #579bdd;

}

.key-button-tooltip .item-icon.t-item {
    background-color: #dfab32;
}

/* Fix for Bootstrap bug: "Navbar hides initial content when jumping to in-page anchor" */
/* https://github.com/twbs/bootstrap/issues/1768#issuecomment-46519033 */
h1[id]:before,
h2[id]:before,
h3[id]:before,
h4[id]:before,
h5[id]:before,
h6[id]:before {
    display: block;
    content: "";
    margin-top: -60px;
    height: 60px;
    visibility: hidden;;
}
div.panel-heading a {
    position: relative;
    z-index: 10;
}

/* Fix inline labels alignment issue */
.form-group .checkbox label:nth-of-type(n+2),
.form-group .radio label:nth-of-type(n+2) {
    padding-left: 0;
}

/* Allow extra checkboxes/radios to be placed within checkbox/radio containers */
.form-group .checkbox .checkbox-extra,
.form-group .checkbox-inline .checkbox-extra,
.form-group .radio .radio-extra,
.form-group .radio-inline .radio-extra {
    display: inline;
    float: none;
    margin: 0;
    /* Fix vertical alignment (http://stackoverflow.com/a/719545/346561) */
    vertical-align: middle;
    position: relative;
    bottom: 1px;
}

/* Media Queries */
@media (min-width: 992px) {

    .keypad {
        grid-auto-rows: 80px;
    }

    .keypad .key button {
        font-size: large;
        padding: 4px 8px;
    }

    .keypad .key button .key-alt-fn {
        font-size: medium;
    }

    .keypad .key button .key-alt-fn.arrow {
        font-size: large;
    }
}