@import "./image-gallery.css";

.alpha {
    font-size: 10px;
    position: relative;
    top: -10px;
    left: 5px;
}

body {
    font-family: "Lucida Grande", "Segoe UI", "Ubuntu", "Cantarell", "Arial", "sans-serif";
    margin: 0;
    padding: 0;
    position: relative;
}

h2 {
    margin: 0;
    font-size: 2.25rem;
    font-weight: bold;
    letter-spacing: -.025em;
    color: #fff;
}

p {
    font-size: 24px;
}

li {
    list-style: none;
}

a {
    color: white;
    opacity: .75;
    text-decoration: none;
}

a:hover {
    opacity: 1;
    text-decoration: none;
    cursor: pointer;
}

.blocklyFlyoutBackground {
    fill: #EFEFEF !important;
}

.blocklyTreeLabel {
    color: black;
}

.fill-parent {
    width: 100%;
    height: 100%;
}

.fill-viewport {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Forgive me, for I have sinned */
.fill-vertical-hack {
    height: 96%;
}

.scroll-y {
    overflow-y: scroll;
}

.text-center {
    text-align: center;
}

.center-x {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.center-y {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
}

.center-xy {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
}

.center-text {
    align-items: center;
    display: flex !important;
    justify-content: center;
}


.margin-top-30 {
    margin-top: 30px;
}

.toolbar-margin{
    margin-top: 48px;
}

.pad-top-8 {
    padding-top: 8px;
}

.margin-right-10 {
    margin-right: 10px;
}

.tooltip {
    z-index: 6000 !important;
}

input[type=email], input[type=password], input[type=search], input[type=text], select {
    margin: auto !important; /* Wing tries to update this, but I don't want it */
}

/* For testing layout stuff */
.orange {
    background-color: orange;
}
.pink {
    background-color: pink;
}
.yellow {
    background-color: yellow;
}
.blue {
    background-color: blue;
}
