.hero {
    color: rgba(223, 219, 244, 1);;
    background-color: rgba(0, 0, 0, 1);;
    text-align: center;
    padding: 5em;
}

@media only screen and (max-width: 1281px) {
    .hero {
        padding: 1em !important;
    }
    main {
        width: 90% !important;
    }
    section {
        margin: 0 0 1em 0 !important;
        padding: 0em !important;
    }
    .hotel-pic {
        width: 100% !important;
    }
}

* {
    box-sizing: border-box;
    /* TODO: find what's causing weird top belt */
    margin: 0;
    padding: 0;
}

body {
    width: 100%;
    height: 100%;
    margin: 0;
    background-color: rgba(0, 0, 0, 1);;
}

main {
    width: 60%;
    margin: 0 auto;
}

/* TODO: Maybe some fun with how text is laid */

section.starter {
    border: none !important;
    padding: 1em;
}

section.starter img {
    width: 100%
}

section {
    color: rgba(223, 219, 244, 1);;
    /* TODO: have some fun with transparency :D */
    background-color: rgba(0, 0, 0, 1);;
    padding-bottom: 5em;
    word-wrap: break-word;
    padding: 3em;
}

section:nth-child(2) {
    margin: 0em 1em 0em -2em;
}

section:nth-child(3) {
    margin: -3em -1em 3em 1em;
}

section:nth-child(4) {
    margin: -6em -3em 6em 4em;
}

section:nth-child(5) {
    margin: -9em -5em 9em 7em;
}

section:nth-child(6) {
    margin: -12em -7em 12em 10em;
}

section:nth-child(7) {
    margin: -15em -9em 15em 13em;
}

section p {
    margin: 1em;
}

section h2 {
    display: inline-block;
    margin: 1em 1em 1em 0em;
    padding: .5em;
}

section:nth-child(even) {
    border: 8px solid rgba(173, 35, 101, 1);;
}

section:nth-child(even) h2 {
    background-color: rgba(173, 35, 101, 1);;
}

section:nth-child(even) a {
    color: rgba(173, 35, 101, 1);;
}

section:nth-child(even) a:hover {
   color: rgba(61, 140, 208, 1);;
}

section:nth-child(odd) {
    border: 8px solid rgba(61, 140, 208, 1);;
}

section:nth-child(odd) h2 {
    background-color: rgba(61, 140, 208, 1);;
}

section:nth-child(odd) a {
    color: rgba(61, 140, 208, 1);;
}

section:nth-child(odd) a:hover {
    color: rgba(173, 35, 101, 1);;
}

/* testing area */
.acc0 {
    color: rgba(61, 140, 208, 1);;
}

.acc1 {
    color: rgba(232, 227, 33, 1);;
}

.acc2 {
    color: rgba(173, 35, 101, 1);;
}

.hotel-pic
{
    width: 50%;
    display: block;
    margin: .5em auto;
    width: 50%;
}