﻿html, body {
    width: 100%;
    height: 100%;
    text-align: center;
    background-size: cover;
    background-color:black;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;

}


.bg0 {background: url('/ErrorPicture/0.jpg') no-repeat center center fixed;}
.bg1 {background: url('/ErrorPicture/1.jpg') no-repeat center center fixed;}
.bg2 {background: url('/ErrorPicture/2.jpg') no-repeat center center fixed;}
.bg3 {background: url('/ErrorPicture/3.jpg') no-repeat center center fixed;}
.bg4 {background: url('/ErrorPicture/4.jpg') no-repeat center center fixed;}
.bg5 {background: url('/ErrorPicture/5.jpg') no-repeat center center fixed;}
.bg6 {background: url('/ErrorPicture/6.jpg') no-repeat center center fixed;}
.bg7 {background: url('/ErrorPicture/7.jpg') no-repeat center center fixed;}
.bg8 {background: url('/ErrorPicture/8.jpg') no-repeat center center fixed;}
.bg9 {background: url('/ErrorPicture/9.jpg') no-repeat center center fixed;}

.bg10 {background: url('/ErrorPicture/10.jpg') no-repeat center center fixed;}
.bg11 {background: url('/ErrorPicture/11.jpg') no-repeat center center fixed;}
.bg12 {background: url('/ErrorPicture/12.jpg') no-repeat center center fixed;}
.bg13 {background: url('/ErrorPicture/13.jpg') no-repeat center center fixed;}
.bg14 {background: url('/ErrorPicture/14.jpg') no-repeat center center fixed;}
.bg15 {background: url('/ErrorPicture/15.jpg') no-repeat center center fixed;}
.bg16 {background: url('/ErrorPicture/16.jpg') no-repeat center center fixed;}
.bg17 {background: url('/ErrorPicture/17.jpg') no-repeat center center fixed;}
.bg18 {background: url('/ErrorPicture/18.jpg') no-repeat center center fixed;}
.bg19 {background: url('/ErrorPicture/19.jpg') no-repeat center center fixed;}

.bg20 {background: url('/ErrorPicture/20.jpg') no-repeat center center fixed;}
.bg21 {background: url('/ErrorPicture/21.jpg') no-repeat center center fixed;}
.bg22 {background: url('/ErrorPicture/22.jpg') no-repeat center center fixed;}
.bg23 {background: url('/ErrorPicture/23.jpg') no-repeat center center fixed;}
.bg24 {background: url('/ErrorPicture/24.jpg') no-repeat center center fixed;}
.bg25 {background: url('/ErrorPicture/25.jpg') no-repeat center center fixed;}
.bg26 {background: url('/ErrorPicture/26.jpg') no-repeat center center fixed;}
.bg27 {background: url('/ErrorPicture/27.jpg') no-repeat center center fixed;}
.bg28 {background: url('/ErrorPicture/28.jpg') no-repeat center center fixed;}
.bg29 {background: url('/ErrorPicture/29.jpg') no-repeat center center fixed;}

.bg30 {background: url('/ErrorPicture/30.jpg') no-repeat center center fixed;}
.bg31 {background: url('/ErrorPicture/31.jpg') no-repeat center center fixed;}
.bg32 {background: url('/ErrorPicture/32.jpg') no-repeat center center fixed;}
.bg33 {background: url('/ErrorPicture/33.jpg') no-repeat center center fixed;}
.bg34 {background: url('/ErrorPicture/34.jpg') no-repeat center center fixed;}
.bg35 {background: url('/ErrorPicture/35.jpg') no-repeat center center fixed;}
.bg36 {background: url('/ErrorPicture/36.jpg') no-repeat center center fixed;}
.bg37 {background: url('/ErrorPicture/37.jpg') no-repeat center center fixed;}
.bg38 {background: url('/ErrorPicture/38.jpg') no-repeat center center fixed;}
.bg39 {background: url('/ErrorPicture/39.jpg') no-repeat center center fixed;}

.bg40 {background: url('/ErrorPicture/40.jpg') no-repeat center center fixed;}
.bg41 {background: url('/ErrorPicture/41.jpg') no-repeat center center fixed;}
.bg42 {background: url('/ErrorPicture/42.jpg') no-repeat center center fixed;}
.bg43 {background: url('/ErrorPicture/43.jpg') no-repeat center center fixed;}
.bg44 {background: url('/ErrorPicture/44.jpg') no-repeat center center fixed;}
.bg45 {background: url('/ErrorPicture/45.jpg') no-repeat center center fixed;}
.bg46 {background: url('/ErrorPicture/46.jpg') no-repeat center center fixed;}
.bg47 {background: url('/ErrorPicture/47.jpg') no-repeat center center fixed;}
.bg48 {background: url('/ErrorPicture/48.jpg') no-repeat center center fixed;}
.bg49 {background: url('/ErrorPicture/49.jpg') no-repeat center center fixed;}

.bg50 {background: url('/ErrorPicture/50.jpg') no-repeat center center fixed;}
.bg51 {background: url('/ErrorPicture/51.jpg') no-repeat center center fixed;}
.bg52 {background: url('/ErrorPicture/52.jpg') no-repeat center center fixed;}
.bg53 {background: url('/ErrorPicture/53.jpg') no-repeat center center fixed;}
.bg54 {background: url('/ErrorPicture/54.jpg') no-repeat center center fixed;}
.bg55 {background: url('/ErrorPicture/55.jpg') no-repeat center center fixed;}
.bg56 {background: url('/ErrorPicture/56.jpg') no-repeat center center fixed;}
.bg57 {background: url('/ErrorPicture/57.jpg') no-repeat center center fixed;}
.bg58 {background: url('/ErrorPicture/58.jpg') no-repeat center center fixed;}
.bg59 {background: url('/ErrorPicture/59.jpg') no-repeat center center fixed;}

.bg60 {background: url('/ErrorPicture/60.jpg') no-repeat center center fixed;}
.bg61 {background: url('/ErrorPicture/61.jpg') no-repeat center center fixed;}
.bg62 {background: url('/ErrorPicture/62.jpg') no-repeat center center fixed;}
.bg63 {background: url('/ErrorPicture/63.jpg') no-repeat center center fixed;}
.bg64 {background: url('/ErrorPicture/64.jpg') no-repeat center center fixed;}
.bg65 {background: url('/ErrorPicture/65.jpg') no-repeat center center fixed;}
.bg66 {background: url('/ErrorPicture/66.jpg') no-repeat center center fixed;}
.bg67 {background: url('/ErrorPicture/67.jpg') no-repeat center center fixed;}
.bg68 {background: url('/ErrorPicture/68.jpg') no-repeat center center fixed;}
.bg69 {background: url('/ErrorPicture/69.jpg') no-repeat center center fixed;}

.bg70 {background: url('/ErrorPicture/70.jpg') no-repeat center center fixed;}
.bg71 {background: url('/ErrorPicture/71.jpg') no-repeat center center fixed;}
.bg72 {background: url('/ErrorPicture/72.jpg') no-repeat center center fixed;}
.bg73 {background: url('/ErrorPicture/73.jpg') no-repeat center center fixed;}
.bg74 {background: url('/ErrorPicture/74.jpg') no-repeat center center fixed;}
.bg75 {background: url('/ErrorPicture/75.jpg') no-repeat center center fixed;}
.bg76 {background: url('/ErrorPicture/76.jpg') no-repeat center center fixed;}
.bg77 {background: url('/ErrorPicture/77.jpg') no-repeat center center fixed;}
.bg78 {background: url('/ErrorPicture/78.jpg') no-repeat center center fixed;}
.bg79 {background: url('/ErrorPicture/79.jpg') no-repeat center center fixed;}




::-moz-selection {
    background-color: #a4224b;
    color: white;
}

::selection {
    background-color: #a4224b;
    color: white;
}

* {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}

.blur:before, .blur:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}

.blur {
    position: relative;
    overflow: hidden;
    z-index: 0;
}

    .blur:before {
        z-index: -2;
        background: transparent;
        -webkit-filter: blur(10px);
        filter: blur(10px);
    }

    .blur:after {
        z-index: -1;
        background-color: rgba(255, 255, 255, 0.7);
    }

.box, button {
    display: inline-block;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.5);
}

.box {
    padding: 40px 50px;
    border-radius: 60px;
    text-align: left;
}

    .box p {
        color: black;
    }

    .box h1 {
        color: #a4224b;
    }

@-webkit-keyframes blink {
    from, to {
        color: transparent;
    }

    50% {
        color: inherit;
    }
}

@-moz-keyframes blink {
    from, to {
        color: transparent;
    }

    50% {
        color: inherit;
    }
}

@keyframes blink {
    from, to {
        color: transparent;
    }

    50% {
        color: inherit;
    }
}

h1 {
    margin: 10px 0;
    font-size: 3rem;
    text-transform: lowercase;
}

    h1:before {
        content: '# ';
    }

    h1:after {
        content: '_';
        -webkit-animation: 1s blink step-end infinite;
        -moz-animation: 1s blink step-end infinite;
        animation: 1s blink step-end infinite;
    }

p {
    margin: 10px 0;
    line-height: 1.5rem;
    color: white;
    font-weight:bold;
}

a {
    display: inline-block;
    cursor: pointer;
    background-color: transparent;
    border: none;
    outline: none;
    margin: 0 5px;
    height: 70px;
    width: 70px;
    border-radius: 28%;
    border: 2px solid white;
}

    a i.material-icons {
        font-size: 3rem;
        color: #a4224b;
        vertical-align: middle;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        line-height: 68px;
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        -webkit-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
        -moz-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
        transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
    }

        a i.material-icons:before {
            content: '';
            background-color: #a4224b;
            height: 120%;
            width: 120%;
            position: absolute;
            top: 90%;
            left: -110%;
            z-index: -1;
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg);
            -webkit-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
            -moz-transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
            transition: all 0.35s cubic-bezier(0.31, -0.105, 0.43, 1.59);
        }

     a:hover {
        border-color: #a4224b;
    }

        a:hover i.material-icons {
            -webkit-transform: scale(1.2);
            -moz-transform: scale(1.2);
            -ms-transform: scale(1.2);
            -o-transform: scale(1.2);
            transform: scale(1.2);
            color: white;
        }

            a:hover i.material-icons:before {
                top: -10%;
                left: -10%;
            }

#hello-world {
    margin-top: 19%;
    margin-bottom: 20px;
    width: 500px;
}

#button-wrapper {
    margin-bottom: 40px;
}
