html {
    overflow-x: hidden;
}

::selection {
    background-color: hotpink;
    color: white;
}

a:link {
    color: #662c8a;
}

a:visited {
    color: #662c8a;
}

a:hover {
    color: #aa57dd;
}

a:active {
    color: #ca92ed;
} 

.nowrap {
    white-space: nowrap;
}

/* Main Background */

#bg {
    position: fixed;
    left: 0;
    right: 0;
    top: -120px;
    bottom: 0;
    z-index: -9000;

    background-color: #e5e5f7;
    opacity: 0.8;
    background-image:  linear-gradient(30deg, #f1bede 12%, transparent 12.5%, transparent 87%, #f1bede 87.5%, #f1bede), linear-gradient(150deg, #f1bede 12%, transparent 12.5%, transparent 87%, #f1bede 87.5%, #f1bede), linear-gradient(30deg, #f1bede 12%, transparent 12.5%, transparent 87%, #f1bede 87.5%, #f1bede), linear-gradient(150deg, #f1bede 12%, transparent 12.5%, transparent 87%, #f1bede 87.5%, #f1bede), linear-gradient(60deg, #f1bede77 25%, transparent 25.5%, transparent 75%, #f1bede77 75%, #f1bede77), linear-gradient(60deg, #f1bede77 25%, transparent 25.5%, transparent 75%, #f1bede77 75%, #f1bede77);
    background-size: 58px 102px;
    background-position: 0 0, 0 0, 29px 51px, 29px 51px, 0 0, 29px 51px;
}

#bg2 {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -8000;
    background-image: linear-gradient(to bottom, transparent, #ffffffaa);
}

/* Title and Footer */

#title {
    font-family: 'Nunito';
    font-size: 4em;
    font-weight: 1000;
    text-align: center;
    color: #b015b0;

    margin-top: .8em;
    margin-bottom: .25em;
    line-height: 0.9em;

    -webkit-user-select: none;  /* Chrome 49+ */
    -moz-user-select: none;     /* Firefox 43+ */
    -ms-user-select: none;      /* No support yet */
    user-select: none; 
}

.titleWord {
    position: relative;
    left: -6px;
    filter: drop-shadow(4px 4px 0 #662c8a88);

    animation-name: titleTween;
    animation-duration: 1.2s;
    animation-timing-function: ease-in-out;
    animation-direction: alternate;
    animation-iteration-count: infinite;
}

.titleWord#titleA {
    color: #23e6e6;
}

.titleWord#titleB {
    color: hotpink;
    animation-delay: 0.2s
}

.titleWord#titleC {
    color: yellow;
    animation-delay: 0.4s
}

@keyframes titleTween {
    from { 
        left: -6px;
    }

    to { 
        left: 6px;
    }
}

.footer {
    font-family: 'El Messiri';
    text-align: center;
    margin-top: 4em;
}

/* Main Div */

.main-div {
    font-family: 'El Messiri';
    font-size: 1em;
    text-align: center;
    max-width: 700px;
    margin: auto;
    margin-bottom: 2em;
}