body {
    margin: 0;
    text-align: center;
}
h1 {
    font-size: 7.5vw;
    color: #fff;
    text-shadow: 0 0 10px #000;
}
h1 span {
    font-size: 3.5vw;
}
#mainBox {
    height: 100%;
    width: 100%;
    max-width: 100%;
    background: url(../images/binary-715792_1920.jpg) center 100% no-repeat;
    /*background: url(../images/construction-machine.jpg) center 100% no-repeat;*/
    background-size: cover;
}

#mainBox.temp {
    background: url(../images/binary-715792_1920.jpg) 15% repeat;
    background-size: cover;
    /*background: none;*/
}
/*#mainBox.temp .text_bg {*/
/* position: absolute;*/
/* left: 0;*/
/* top: 0;*/
/* width: 100%;*/
/* height: 100%;*/
/* z-index: -1;*/
/*}*/

#mainBox.tapped {
    background: url(../images/moon.jpg) 50% 0 no-repeat;
}

#mainBox.tapOrder {
    background: url(../images/business-card.png) 10%;
}

.pageTitle {
    position: absolute;
    top: 15%;
    width: 100%;
    text-align: center;
}

.messageBox {
    position: absolute;
    top: 40%;
    width: 100%;
    color: #fff;
    text-align: center;
    font-size: 6vw;
    text-shadow: 0 0 10px #000;
}

.clear {
    opacity: 1;
    /*background-color: red;*/
    width: 10%;
    height: 10%;

}

.tapper {
    position: fixed;
    z-index: 99;
}

.topMe {
    top: 0;
}

.bottomMe {
    bottom: 0;
}

.goLeft {
    left: 0;
}

.goRight {
    Right: 0;
}

.flexMeSpaceBetween {
    display: flex;
    justify-content: space-between;
}

.flexMeSpaceAround {
    display: flex;
    justify-content: space-around;
}

.flexMeSpaceEvenly {
    display: flex;
    justify-content: space-evenly;
}

 footer {
     position: absolute;
     bottom: 15px;
     left: 0;
     right: 0;
 }

 footer a {
     color: #d8d9e9;
     background: #0043d1;
     box-shadow: 0 0 8px 8px #0043d1;
     padding: 0 6px;
     border-radius: 20px;
     opacity: 0.75;
     transition: 0.5s ease-in-out;
     text-decoration: none;
 }

 footer a:hover {
     color: #0043d1;
     background: #d8d9e9;
     box-shadow: 0 0 8px 8px #d8d9e9;
     opacity: 0.9;
 }