/*

                                                   
                                                   
               AAA               333333333333333   
              A:::A             3:::::::::::::::33 
             A:::::A            3::::::33333::::::3
            A:::::::A           3333333     3:::::3
           A:::::::::A                      3:::::3
          A:::::A:::::A                     3:::::3
         A:::::A A:::::A            33333333:::::3 
        A:::::A   A:::::A           3:::::::::::3  
       A:::::A     A:::::A          33333333:::::3 
      A:::::AAAAAAAAA:::::A                 3:::::3
     A:::::::::::::::::::::A                3:::::3
    A:::::AAAAAAAAAAAAA:::::A               3:::::3
   A:::::A             A:::::A  3333333     3:::::3
  A:::::A               A:::::A 3::::::33333::::::3
 A:::::A                 A:::::A3:::::::::::::::33 
AAAAAAA                   AAAAAAA333333333333333   
                                                   
                                                   
                Charles Chaneco
                Alicia Ramirez
                April 15, 2019

Features used (spread across all pages):
        1. Navbar
        2. img-fluid
        3. d-flex
        4. w-100
        5. h-100
        6. Additive border on images (border-light)
        7. rounded images
        8. text-center
        9. align-self-center
        10. text-white
        11. center-block
        12. justify-content-center
        13. img-thumbnail
*/

html {
    overflow-x: hidden;
}

body {
    background-color: #000000;
    background-image: url("images/snow.png");
    /* Source: transparenttextures.com */
    color: white;
    padding: 0;
    margin: 0;
}

img {
    max-width: 100%;
}

.logo-container {
    padding: 40px 0;
}

.menu {
    text-decoration: none;
    color: white;
    margin: 20px 0;
    font-family: 'Cinzel';
    font-size: 1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 2;
    text-align: center;
}

.menu:hover {
    color: dodgerblue;
    text-shadow: 0 0 10px white;
    font-weight: bold;
    text-decoration: none;
}

.navbar-menu {
    background-color: black;
    font-family: 'Cinzel';
    border-top: solid thin gray;
    border-bottom: solid thin gray;
    text-align: center;
}

.small-h1 {
    font-size: 2.5em;
    letter-spacing: 4px;
    margin: 0;
}

.big-h1 {
    font-size: 4.25em;
    letter-spacing: 5px;
    margin: 0;
    padding: 25px 0;
}

/*
  _    _                      
 | |  | |                     
 | |__| | ___  _ __ ___   ___ 
 |  __  |/ _ \| '_ ` _ \ / _ \
 | |  | | (_) | | | | | |  __/
 |_|  |_|\___/|_| |_| |_|\___|
*/

.banner {
    height: 100%;
}

.banner-date {
    text-align: center;
    padding: 70px 0 120px;
}

.banner-date h1 {
    font-family: 'Cinzel', sans-serif;
    text-align: center;
    color: #42d0ff;
    font-weight: 100;
    margin: 20px 0;
    text-shadow: 0px 0px 10px;
    font-size: 2.5em;
    letter-spacing: 4px;
    margin: 0;
}

.banner-date h2 {
    font-family: 'Cinzel', sans-serif;
    font-weight: 100;
    text-align: center;
    color: #e9fcff;
    font-size: 4.25em;
    text-shadow: 0px 0px 10px aliceblue;
    letter-spacing: 5px;
    margin: 15px 0;
}

.banner-date h3 {
    color: #e9fcff;
    font-family: 'Cinzel', sans-serif;
    font-size: 2em;
    font-weight: 100;
    letter-spacing: 3px;
    margin: 15px 0;
    text-align: center;
    text-shadow: 0px 0px 10px aliceblue;
}

.banner-date img {
    display: block;
    margin: auto;
}

.watch-it-now {
    color: white;
    font-family: 'Cinzel', sans-serif;
    text-align: center;
    letter-spacing: 1px;
    margin-top: 20px;
}

.hbo-logo {
    padding-bottom: 50px;
}

.sign-up {
    border: 1px solid white;
    font-size: 1em;
    color: white;
    padding: 12px 20px;
}

.sign-up:hover {
    color: deepskyblue;
    cursor: pointer;
    border: 1px solid deepskyblue;
}

.background {
    position: absolute;
    top: 0;
    z-index: -9999;
}

.main-heading {
    font-family: 'Cinzel', sans-serif;
    font-size: 2.4em;
    font-weight: 100;
    letter-spacing: 2px;
    margin: 20px 0 0;
}

.home-banner {
    padding: 75px 300px 35px;
    font-family: 'Cinzel', sans-serif;
    background-image: url(images/home/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%;
}

.game {
    padding: 60px 200px;
    background-image: url("images/home/game-bg.png");
    width: 100%;
    border-top: solid thin white;
    margin-top: 80px;
}

.episode-container {
    text-align: center;
    color: white;
    font-family: 'Open Sans', sans-serif;
    vertical-align: bottom;
    line-height: 20px;
    margin: 20px 0;
    z-index: 1;
}

.ep-thumb {
    margin: 30px 0;
    opacity: .85;
}

.ep-thumb:hover {
    cursor: pointer;
    opacity: 1;
}

.ep-title {
    color: #77bcff;
    font-family: 'Cinzel', sans-serif;
    font-size: 1.35em;
    font-weight: 400;
    letter-spacing: 1px;
    margin: 10px 0;
}

.ep-date {
    font-size: 1.25em;
    letter-spacing: 1px;
    margin: 15px 0;
}

.ep-desc {
    font-size: 1em;
    line-height: 26px;
    margin: 20px 0 50px;
    text-align: center;
}

.ep-row {
    margin: 50px 300px;
}

.watch {
    color: white;
    padding: 10px 16px;
    font-family: 'Cinzel', sans-serif;
    font-size: 1em;
    text-decoration: none;
    border: thin solid skyblue;
}

.watch:hover {
    background-color: darkslategrey;
    background-image: url("images/snow.png");
    /* Source: transparenttextures.com */
    color: white;
    border: 1px solid white;
    text-decoration: none;
}

.not-available {
    color: white;
    padding: 10px 16px;
    font-family: 'Cinzel', sans-serif;
    font-size: 1em;
    text-decoration: none;
    border: thin solid skyblue;
}

.not-available:hover {
    cursor: default;
    color: whitesmoke;
    text-decoration: none;
}

.episode-section {
    background-color: black;
    background-image: url("images/snow.png");
    /* Source: transparenttextures.com */
    color: white;
    font-family: 'Open Sans', sans-serif;
    border-top: 1px solid white;
    text-align: center;
}

/*
  ____  _                   
 / ___|| |_ ___  _ __ _   _ 
 \___ \| __/ _ \| '__| | | |
  ___) | || (_) | |  | |_| |
 |____/ \__\___/|_|   \__, |
                      |___/ 
*/

.about-img {
    width: 50%;
    margin: 40px 0;
}

.about-paragraph {
    font-family: 'Open Sans', sans-serif;
    font-size: 1.2em;
    line-height: 2em;
}

.walkers {
    background-image: url("images/about/walkers.png");
    border-bottom: solid thin white;
}

.rebellion {
    background-image: url("images/about/map-transparent.png");
}

.walkers,
.rebellion {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: auto;
    height: auto;
    padding: 30px 0;
}

.quote-section {
    padding: 100px 0 0;
    margin: 0 300px;
}

.quote {
    font-family: 'Cinzel', sans-serif;
    font-size: 2.25em;
    font-weight: 100;
    letter-spacing: 2px;
    padding: 0 3em;
    margin: 10px 0 0;
}

.quote-by {
    color: lightgray;
    font-family: 'Cinzel', sans-serif;
    font-size: 1.5em;
    font-weight: 100;
    letter-spacing: 2px;
    margin: 20px 0 0 55%;
}

.the-long-night {
    color: dodgerblue;
    text-shadow: 0 0 10px skyblue;
}

.blue-text {
    color: #4ba6ff;
}

.rebellion-death {
    color: orangered;
    text-shadow: 0 0 10px red;
}

.red-text {
    color: red;
}

/*
  ____                                 
 / ___|  ___  __ _ ___  ___  _ __  ___ 
 \___ \ / _ \/ _` / __|/ _ \| '_ \/ __|
  ___) |  __/ (_| \__ \ (_) | | | \__ \
 |____/ \___|\__,_|___/\___/|_| |_|___/
*/

.winter {
    color: #79bdff;
    text-shadow: 0px 0px 3px #5056ff;
    font-size: 1.25em;
}

.season-heading {
    color: skyblue;
    font-family: 'Cinzel', sans-serif;
    font-weight: 200;
    font-size: 1.8em;
    margin: 5px 0 0;
    text-align: left;
    letter-spacing: .04em;
}

.season-subheading {
    font-family: 'Cinzel', sans-serif;
    font-weight: 200;
    font-size: 1.4em;
    margin: 10px 0 0;
    color: lightgray;
    text-align: left;
}

.season-desc {
    font-family: 'Open Sans', sans-serif;
    font-size: .92em;
    line-height: 1.7;
    text-align: center;
}

.season-one,
.season-two,
.season-three,
.season-four,
.season-five,
.season-six,
.season-seven,
.season-eight {
    padding: 65px 300px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    border-bottom: thin solid gray;
}

.season-one {
    background-image: url("images/seasons/1-bg.png");
}

.season-two {
    background-image: url("images/seasons/2-bg.png");
}

.season-three {
    background-image: url("images/seasons/3-bg.png");
}

.season-four {
    background-image: url("images/seasons/4-bg.png");
}

.season-five {
    background-image: url("images/seasons/5-bg.png");
}

.season-six {
    background-image: url("images/seasons/6-bg.png");
}

.season-seven {
    background-image: url("images/seasons/7-bg.png");
}

.season-eight {
    background-image: url("images/seasons/8-bg.png");
}

/*
 __        __    _       _     
 \ \      / /_ _| |_ ___| |__  
  \ \ /\ / / _` | __/ __| '_ \ 
   \ V  V / (_| | || (__| | | |
    \_/\_/ \__,_|\__\___|_| |_|
*/

.watch-header {
    font-size: 2em;
    letter-spacing: 4px;
    margin: 14em 0 15px;
    font-family: 'Cinzel', sans-serif;
    font-weight: 200;
    color: dodgerblue;
    text-shadow: 0 0 10px cyan;
    text-align: left;
}

.watch-subheader:nth-child(2) {
    color: white;
    font-size: 1em;
    letter-spacing: 1px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    text-shadow: 0 3px 3px dodgerblue;
    text-align: left;
    margin: 10px 0 15px;
}

.watch-note {
    color: gray;
    font-size: .75em;
    letter-spacing: 1px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 200;
    text-shadow: 0px 0px 10px lightgray;
    text-align: left;
    margin: 10px 0 0;
}

.watch-logo {
    margin: 10px 25px 10px 0;
    width: 12%;
}

.watch-logo:hover {
    cursor: pointer;
    opacity: .8;
}

.trailer {
    margin-top: 40px;
    width: 1280px;
    height: 720px;
}

/* Code source (edited): https://startbootstrap.com/snippets/video-header/ */
.trailer-bg {
    position: relative;
    background-color: black;
    height: 75.6vh;
    border-bottom: solid thin white;
    min-height: 25rem;
    width: 100%;
    overflow: hidden;
}

.trailer-bg video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: 0;
    -ms-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}

.trailer-bg .container-fluid {
    position: relative;
    z-index: 2;
}

.trailer-bg .overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: black;
    opacity: 0.5;
    z-index: 1;
}

.watch-alternative {
    margin: auto;
    display: block;
}

.br-bg,
.go-bg,
.dvd-bg {
    padding: 65px 100px;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom: thin solid gray;
}

.br-bg {
    background-image: url(images/watch/westeros.png);
}

.go-bg {
    background-image: url(images/watch/raven.png);
}

.dvd-bg {
    background-image: url(images/watch/viserion.png);
}

/*
   ____          _      ___      ____                   
  / ___|__ _ ___| |_   ( _ )    / ___|_ __ _____      __
 | |   / _` / __| __|  / _ \/\ | |   | '__/ _ \ \ /\ / /
 | |__| (_| \__ \ |_  | (_>  < | |___| | |  __/\ V  V / 
  \____\__,_|___/\__|  \___/\/  \____|_|  \___| \_/\_/  
*/

.cast-banner {
    padding: 70px 300px 10px;
    font-family: 'Cinzel', sans-serif;
    background-image: url("images/cast/cast-bg.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    border-bottom: 1px solid white;
}

.cast-header {
    text-align: center;
    padding: 130px 0 279px;
    font-weight: 100;
}

.cast-header h1 {
    font-family: 'Cinzel', sans-serif;
    text-align: center;
    font-weight: 100;
    margin: 10px 0;
}

.cast-member-container {
    text-align: center;
    color: white;
    font-family: 'Open Sans', sans-serif;
    vertical-align: bottom;
    line-height: 20px;
    margin: 20px 0;
    z-index: 1;
}

.staff-role {
    color: #77bcff;
    font-size: 1.35em;
    letter-spacing: 1px;
    margin: 10px 0;
    font-family: 'Cinzel';
}

.staff-name {
    font-size: 1em;
    letter-spacing: 1px;
    margin: 15px 0;
}

.staff-desc {
    font-size: 1em;
    line-height: 26px;
    margin: 5px 0 10px;
    text-align: center;
    color: lightgray;
}

.cast-thumb {
    margin: 30px 0;
    opacity: .85;
}

.cast-thumb:hover {
    cursor: pointer;
    opacity: 1;
}

/* Footer */

footer {
    background-color: black;
    background-image: url("images/snow.png");
    /* Source: transparenttextures.com */
    border-top: solid thin white;
    color: white;
    font-family: 'Open Sans', sans-serif;
    font-size: .8em;
    text-align: center;
    padding: 30px 0;
}

/*
  __  __          _ _          ___                  _           
 |  \/  | ___  __| (_) __ _   / _ \ _   _  ___ _ __(_) ___  ___ 
 | |\/| |/ _ \/ _` | |/ _` | | | | | | | |/ _ \ '__| |/ _ \/ __|
 | |  | |  __/ (_| | | (_| | | |_| | |_| |  __/ |  | |  __/\__ \
 |_|  |_|\___|\__,_|_|\__,_|  \__\_\\__,_|\___|_|  |_|\___||___/
*/

/* Extra small devices (smartwatches) */
@media (max-width: 575px) {
    .logo-container {
        padding: 40px 0;
    }

    .small-h1 {
        font-size: 2.5em;
        letter-spacing: 4px;
        margin: 0;
    }

    .big-h1 {
        font-size: 4.25em;
        letter-spacing: 5px;
        margin: 0;
        padding: 25px 0;
    }

    .home-banner {
        padding: 25px 10px 35px;
        background-image: url("images/home/bg-mobile.jpg");
        background-size: cover;
        width: 100%;
    }

    .watch-header {
        margin: 10em 0 15px;
    }

    .menu {
        font-size: 1.3em;
    }

    .ep-row {
        margin: 0;
    }

    .ep-title {
        font-size: 2em;
        line-height: 1.75;
    }

    .ep-date {
        font-size: 1.5em;
    }

    .ep-desc {
        font-size: 1.4em;
        line-height: 1.5;
    }

    .watch,
    .not-available {
        padding: 20px 30px;
        font-size: 1.75em;
    }

    .game {
        padding: 50px 30px 30px;
    }

    .banner-date h1 {
        font-size: 1.5em;
    }

    .banner-date h2 {
        font-size: 2.5em;
    }

    .banner-date h3 {
        font-size: 1.5em;
    }

    .sign-up {
        font-size: 1.25em;
        border: 1px solid white;
        color: white;
        padding: 12px 20px;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        padding: 65px 50px;
        background-repeat: no-repeat;
        background-size: cover;
        border-bottom: thin solid gray;
    }

    .season-heading,
    .season-subheading,
    .season-desc {
        text-align: center;
    }

    .season-heading {
        font-size: 2em;
        margin: 20px 0 0;
    }

    .season-subheading {
        font-size: 1.9em;
        margin-bottom: 10px;
    }

    .season-desc {
        font-size: 1.1em;
    }

    .about-paragraph {
        padding: 0 45px;
    }

    .about-img {
        width: 80%;
    }

    .br-bg,
    .go-bg,
    .dvd-bg {
        padding: 65px 50px;
    }

    .watch-header {
        margin: 1em 0 15px;
    }

    .watch-subheader:nth-child(2) {
        font-size: 1.25em;
    }

    .watch-note {
        font-size: 1.25em;
        line-height: 1.75;
    }

    .watch-logo {
        width: 30%;
    }

    .watch,
    .not-available {
        padding: 20px 30px;
        font-size: 1.4em;
    }

    .cast-banner {
        padding: 30px 20px;
    }

    .cast-header {
        padding: 50px 0 50px;
    }

    .cast-header h1 {
        font-size: 2em;
    }

    .main-heading {
        text-align: center;
    }

    .quote {
        font-size: 1.5em;
    }

    .quote-section {
        padding: 50px 0;
    }

    .small-h1 {
        font-size: 1.5em;
        letter-spacing: 4px;
        margin: 0;
    }


    footer {
        font-size: 1.1em;
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    .logo-container {
        padding: 40px 0;
    }

    .small-h1 {
        font-size: 2.5em;
        letter-spacing: 4px;
        margin: 0;
    }

    .big-h1 {
        font-size: 1.75em;
        letter-spacing: 5px;
        margin: 0;
        padding: 25px 0;
    }

    .home-banner {
        padding: 25px 10px 35px;
        background-image: url("images/home/bg-mobile.jpg");
        background-size: cover;
        width: 100%;
    }

    .menu {
        font-size: 1.275em;
    }

    .banner-date h1 {
        font-size: 2em;
    }

    .banner-date h2 {
        font-size: 3em;
    }

    .banner-date h3 {
        font-size: 1.75em;
    }

    .watch-it-now {
        font-size: 1.2em;
    }

    .sign-up {
        font-size: 1.4em;
    }

    .ep-row {
        margin: 50px 30px;
    }

    .ep-title {
        font-size: 1.75em;
        line-height: 1.5;
    }

    .ep-date {
        font-size: 1.5em;
    }

    .ep-desc {
        font-size: 1.3em;
        line-height: 1.5;
    }

    .watch,
    .not-available {
        padding: 10px 20px;
        font-size: 1.3em;
    }

    .game {
        padding: 50px 60px 30px;
    }

    .about-img {
        width: 100%;
    }

    .quote {
        font-size: 1.75em;
        letter-spacing: 2px;
        padding: 0 1.5em;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        text-align: center;
        padding: 65px 80px;
        background-repeat: no-repeat;
        background-size: cover;
        border-bottom: thin solid gray;
    }

    .season-heading,
    .season-subheading,
    .season-desc {
        text-align: center;
    }

    .season-heading {
        font-size: 2.25em;
        margin: 60px 0 0;
    }

    .season-subheading {
        font-size: 1.85em;
        margin-bottom: 10px;
    }

    .season-desc {
        font-size: 1.3em;
    }

    .about-paragraph {
        padding: 0 60px;
    }

    .about-img {
        width: 80%;
    }

    .season-desc {
        font-size: 1.25em;
    }

    .watch-header {
        margin: 11em 0 15px;
    }

    .watch-subheader:nth-child(2) {
        font-size: 1em;
    }

    .watch-note {
        font-size: 1.2em;
        line-height: 1.5;
    }

    .watch-logo {
        width: 14%;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        padding: 65px 70px;
    }

    .cast-banner {
        padding: 70px 80px 10px;
    }

    .small-h1 {
        font-size: 1.6em;
        letter-spacing: 4px;
        margin: 0;
    }


    footer {
        font-size: 1.05em;
    }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
    .home-banner {
        background-image: url("images/home/bg-mobile.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
    }

    .menu {
        font-size: 1.25em;
    }

    .ep-row {
        margin: 50px 42px;
    }

    .ep-title {
        font-size: 1.5em;
        line-height: 1.5;
    }

    .ep-date {
        font-size: 1.25em;
    }

    .ep-desc {
        font-size: 1.1em;
        line-height: 1.5;
    }

    .watch,
    .not-available {
        padding: 10px 20px;
        font-size: 1.1em;
    }

    .about-img {
        width: 50%;
    }

    .season-heading {
        font-size: 2em;
        margin: 20px 0 0;
    }

    .season-subheading {
        font-size: 1.6em;
        margin-bottom: 10px;
    }

    .season-desc {
        font-size: 1.1em;
    }

    .about-img {
        width: 80%;
    }

    .br-bg,
    .go-bg,
    .dvd-bg {
        padding: 65px 100px;
    }

    .watch-header {
        margin: 12em 0 15px;
    }

    .watch-subheader:nth-child(2) {
        font-size: 1em;
    }

    .watch-note {
        font-size: 1.15em;
        line-height: 1.5;
    }

    .watch-logo {
        width: 14%;
    }

    .cast-banner {
        padding: 70px 80px 10px;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        padding: 65px 150px;
    }

    .small-h1 {
        font-size: 1.75em;
        letter-spacing: 4px;
        margin: 0;
    }

    .big-h1 {
        font-size: 1.85em;
    }

    footer {
        font-size: 1em;
    }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
    .home-banner {
        /*        padding: 50px 300px 35px;*/
        font-family: 'Cinzel', sans-serif;
        background-image: url("images/home/bg-1.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
    }

    .menu {
        font-size: 1.1em;
    }

    .ep-row {
        margin: 50px 100px;
    }

    .about-img {
        width: 50%;
    }

    .ep-title {
        font-size: 1.4em;
        line-height: 1.5;
    }

    .ep-date {
        font-size: 1.15em;
    }

    .ep-desc {
        font-size: 1em;
        line-height: 2;
    }

    .watch,
    .not-available {
        padding: 10px 20px;
        font-size: 1.1em;
    }

    .ep-row {
        margin: 50px 100px;
    }

    .br-bg,
    .go-bg,
    .dvd-bg {
        padding: 65px 100px;
    }

    .about-img {
        width: 80%;
    }

    .watch-header {
        font-size: 2em;
        letter-spacing: 4px;
        margin: 12em 0 15px;
    }

    .watch-header {
        margin: 13em 0 15px;
    }

    .watch-subheader:nth-child(2) {
        font-size: 1em;
    }

    .watch-note {
        font-size: 1.1em;
        line-height: 1.5;
    }

    .watch-logo {
        width: 14%;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        padding: 65px 200px;
    }

    .small-h1 {
        font-size: 2em;
        letter-spacing: 4px;
        margin: 0;
    }

    .big-h1 {
        font-size: 2.25em;
    }


    footer {
        font-size: .9em;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
    .logo-container {
        padding: 40px 0;
    }

    .navbar-menu {
        background-color: black;
        font-family: 'Cinzel';
        border-top: solid thin gray;
        border-bottom: solid thin gray;
    }

    .menu {
        font-size: 1em;
    }

    .small-h1 {
        font-size: 2.5em;
        letter-spacing: 4px;
        margin: 0;
    }

    .big-h1 {
        font-size: 4.25em;
        letter-spacing: 5px;
        margin: 0;
        padding: 25px 0;
    }

    .banner-date {
        text-align: center;
        padding: 75px 0 120px;
    }

    .banner-date h1 {
        font-family: 'Cinzel', sans-serif;
        text-align: center;
        color: #42d0ff;
        font-weight: 100;
        margin: 20px 0;
        text-shadow: 0px 0px 10px;
        font-size: 2.5em;
        letter-spacing: 4px;
        margin: 0;
    }

    .banner-date h2 {
        font-family: 'Cinzel', sans-serif;
        font-weight: 100;
        text-align: center;
        color: #e9fcff;
        font-size: 4.25em;
        text-shadow: 0px 0px 10px aliceblue;
        letter-spacing: 5px;
        margin: 15px 0;
    }

    .banner-date h3 {
        color: #e9fcff;
        font-family: 'Cinzel', sans-serif;
        font-size: 2em;
        font-weight: 100;
        letter-spacing: 3px;
        margin: 15px 0;
        text-align: center;
        text-shadow: 0px 0px 10px aliceblue;
    }

    .banner-date img {
        display: block;
        margin: auto;
    }

    .watch-it-now {
        color: white;
        font-family: 'Cinzel', sans-serif;
        text-align: center;
        letter-spacing: 1px;
        margin-top: 20px;
    }

    .hbo-logo {
        padding-bottom: 50px;
    }

    .sign-up {
        font-size: 1.1em;
        border: 1px solid white;
        color: white;
        padding: 12px 20px;
    }

    .sign-up:hover {
        color: deepskyblue;
        cursor: pointer;
        border: 1px solid deepskyblue;
    }

    .background {
        position: absolute;
        top: 0;
        z-index: -9999;
    }

    .main-heading {
        font-family: 'Cinzel', sans-serif;
        font-size: 2.4em;
        font-weight: 100;
        letter-spacing: 2px;
        margin: 20px 0 0;
    }

    .home-banner {
        padding: 70px 300px 35px;
        font-family: 'Cinzel', sans-serif;
        background-image: url("images/home/bga.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
    }

    .game {
        padding: 60px 200px;
        background-image: url("images/home/game-bg.png");
        width: 100%;
        border-top: solid thin white;
        margin-top: 80px;
    }

    .episode-container {
        text-align: center;
        color: white;
        font-family: 'Open Sans', sans-serif;
        vertical-align: bottom;
        line-height: 20px;
        margin: 20px 0;
        z-index: 1;
    }

    .ep-thumb {
        margin: 30px 0;
        opacity: .85;
    }

    .ep-title {
        color: #77bcff;
        font-family: 'Cinzel', sans-serif;
        font-size: 1.35em;
        font-weight: 400;
        letter-spacing: 1px;
        margin: 10px 0;
    }

    .ep-date {
        font-size: 1.25em;
        letter-spacing: 1px;
        margin: 15px 0;
    }

    .ep-desc {
        font-size: 1em;
        line-height: 26px;
        margin: 20px 0 50px;
        text-align: center;
    }

    .ep-row {
        margin: 50px 300px;
    }

    .watch,
    .not-available {
        padding: 10px 20px;
        font-size: .9em;
    }

    .br-bg,
    .go-bg,
    .dvd-bg {
        padding: 65px 300px;
    }

    .season-heading,
    .season-subheading,
    .season-desc {
        text-align: left;
    }

    .about-img {
        width: 60%;
    }

    .trailer-bg {
        height: 76.8vh;
    }

    .watch-header {
        margin: 13.5em 0 15px;
    }

    .watch-subheader:nth-child(2) {
        font-size: 1em;
    }

    .watch-note {
        font-size: .8em;
        line-height: 1.5;
    }

    .watch-logo {
        width: 14%;
    }

    .season-one,
    .season-two,
    .season-three,
    .season-four,
    .season-five,
    .season-six,
    .season-seven,
    .season-eight {
        padding: 65px 300px;
    }

    .season-desc {
        font-size: 1em;
    }

    footer {
        font-size: .8em;
    }
}