@font-face {
    font-family: "Verdana";
    src: url("../fonts/Verdana.ttf");
}

body, html {
    font-family: "Verdana";
    height: 100%;
    margin: 0;
}

.inner-pre {
    font-family: "Verdana";
}

.bg {
    height: 100%;
    background: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.2)), url("../images/background.jpeg");
    background-position: center;
    background-repeat:   no-repeat;
    background-size:     cover;
}

.main-content {
    text-align: center;
    background-color: rgba(0,0,0,.65);
    border-radius: 5px;
    font-size: 20px;
}

.bottom-line {
    padding: 0px;
    bottom:  0px;
    position: absolute;
    min-width: 100%;
    /* 92,164,224 */
    background: linear-gradient(to right, rgba(0,0,0,.9), rgba(255,255,255,0.01));
}

.side-panel {
    height: 100%;
}

.row-1-3 {
    min-height: 33.3%;
    height: 33.3%;
}
.col-1-3 {
    min-width: 33.3%;
    width: 33.3%;
}

/* do some positioning */

.pos-hor-1-3 {
    bottom: 66%;
    transform: translate(0%,66%);
    position: absolute;
}
.pos-hor-1-2 {
    bottom: 50%;
    transform: translate(0%,50%);
    position: absolute;
}

/* center element vertically and horizontally */
.pos-1-2 {
    bottom: 50%;
    right: 50%;
    transform: translate(50%,50%);
    position: absolute;
}

/* define some margin classes */
.mar-0 {
    margin: 0px;
}
.mar-15 {
    margin: 15px;
}
