html, body {
        margin: 0;
        padding: 0;
        background-attachment: fixed;
        background-position: 50% 50%;
        background-size: cover;
}
a {
        text-decoration: underline;
}
a:hover {
        text-decoration: none;
}
.bg-red {
        background-image: url(../img/bg-red.jpg);
}
.bg-orange {
        background-image: url(../img/bg-orange.jpg);
}
.bg-yellow {
        background-image: url(../img/bg-yellow.jpg);
}
.bg-green {
        background-image: url(../img/bg-green.jpg);
}
.bg-cyan {
        background-image: url(../img/bg-cyan.jpg);
}
.bg-blue {
        background-image: url(../img/bg-blue.jpg);
}
.bg-purple {
        background-image: url(../img/bg-purple.jpg);
}
.bg-pink {
        background-image: url(../img/bg-pink.jpg);
}
.bg-black {
        background-image: url(../img/bg-black.jpg);
}

.boddy {
        max-width: 900px;
        margin: 0 auto;
        padding: 40px;
        background: #DADADA;
        box-sizing: content-box;
        -moz-box-sizing: content-box;
}
.body-s {
        max-width: 400px;
}
.modal {
        padding: 25px 30px;
        background: 'DADADA;
        font: 13px/1.55 'Open Sans', Helvetica, Arial, sans-serif;
        color: #666;
}
.modal a {
        color: #2da5da;
}

@media screen and (max-width: 600px) {
        .body {
                padding: 20px;
        }
}