body {
    font-family: 'Montserrat', sans-serif;
    color: #5a5a5a;
}

.btn-darkblue {
    background-color: hsl(236, 100%, 7%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2d3bfe", endColorstr="#000223");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#2d3bfe), to(#000223));
    background-image: -moz-linear-gradient(top, #2d3bfe, #000223);
    background-image: -ms-linear-gradient(top, #2d3bfe, #000223);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2d3bfe), color-stop(100%, #000223));
    background-image: -webkit-linear-gradient(top, #2d3bfe, #000223);
    background-image: -o-linear-gradient(top, #2d3bfe, #000223);
    background-image: linear-gradient(#2d3bfe, #000223);
    border-color: #000223 #000223 hsl(236, 100%, -6%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.85);
    -webkit-font-smoothing: antialiased;
}

.btn-purple {
    background-color: hsl(279, 100%, 8%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b732ff", endColorstr="#1a0028");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#b732ff), to(#1a0028));
    background-image: -moz-linear-gradient(top, #b732ff, #1a0028);
    background-image: -ms-linear-gradient(top, #b732ff, #1a0028);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #b732ff), color-stop(100%, #1a0028));
    background-image: -webkit-linear-gradient(top, #b732ff, #1a0028);
    background-image: -o-linear-gradient(top, #b732ff, #1a0028);
    background-image: linear-gradient(#b732ff, #1a0028);
    border-color: #1a0028 #1a0028 hsl(279, 100%, -5%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.85);
    -webkit-font-smoothing: antialiased;
}

.btn-green {
    background-color: hsl(109, 100%, 14%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#27d600", endColorstr="#0d4700");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#27d600), to(#0d4700));
    background-image: -moz-linear-gradient(top, #27d600, #0d4700);
    background-image: -ms-linear-gradient(top, #27d600, #0d4700);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #27d600), color-stop(100%, #0d4700));
    background-image: -webkit-linear-gradient(top, #27d600, #0d4700);
    background-image: -o-linear-gradient(top, #27d600, #0d4700);
    background-image: linear-gradient(#27d600, #0d4700);
    border-color: #0d4700 #0d4700 hsl(109, 100%, 7%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.46);
    -webkit-font-smoothing: antialiased;
}

.btn-pink {
    background-color: hsl(315, 100%, 29%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff05c0", endColorstr="#93006e");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#ff05c0), to(#93006e));
    background-image: -moz-linear-gradient(top, #ff05c0, #93006e);
    background-image: -ms-linear-gradient(top, #ff05c0, #93006e);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ff05c0), color-stop(100%, #93006e));
    background-image: -webkit-linear-gradient(top, #ff05c0, #93006e);
    background-image: -o-linear-gradient(top, #ff05c0, #93006e);
    background-image: linear-gradient(#ff05c0, #93006e);
    border-color: #93006e #93006e hsl(315, 100%, 23.5%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.36);
    -webkit-font-smoothing: antialiased;
}

.pageInnerContent {
    padding-left: 40px;
    padding-right: 40px;
}

.mainContent {
    margin: 0;
}

footer.pageFooter {
    margin: 0;
    padding-left: 15px;
    padding-right: 15px;
}

html, body {
    height: 100%;
}

.mainContent {
    min-height: 100%;
    /* equal to footer height */
    margin-bottom: -40px;
}

    .mainContent:after {
        content: "";
        display: block;
    }

    footer.pageFooter, .mainContent:after {
        height: 40px;
    }

.mainContent {
    padding-right: 0;
    padding-left: 0;
}

.container {
    margin: auto;
}

.applinkpad {
    padding: 10px;
}

.navbar-wrapper {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
}

.navbar-nav {
    margin-left: 0;
    margin-right: 0;
    padding-left: -20px;
    padding-right: -20px;
}

.navbar-collapse.in {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

.collapse {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

.navbar-collapse.collapsing {
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}

.navbar-wrapper .mainContent {
    padding-right: 0;
    padding-left: 0;
}

.carousel {
    height: 450px;
    margin-bottom: 30px;
}

.carousel-caption {
    z-index: 10;
}

.carousel .item {
    height: 450px;
    background-color: #111;
}

.carousel-inner > .item > img {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    height: 450px;
}

.container > .navbar-header {
    margin-right: 0;
    margin-left: 0;
}

@media (max-width: 600px) {
    .pageInnerContent {
        padding-left: 10px;
        padding-right: 10px;
    }

    footer.pageFooter {
        padding-left: 10px;
        padding-right: 10px;
    }

    .container {
        padding-left: 0;
        padding-right: 0;
    }

    .navbar-brand {
        width: 75%;
    }

    .row {
        margin-right: 0;
        margin-left: 0;
    }

    .carousel {
        height: 250px;
        margin-bottom: 20px;
    }
    /* Since positioning the image, we need to help out the caption */
    .carousel-caption {
        z-index: 10;
    }
    /* Declare heights because of positioning of img element */
    .carousel .item {
        height: 250px;
        background-color: #111;
    }

    .carousel-inner > .item > img {
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 250px;
    }
}

@media (min-width: 600px) and (max-width: 768px) {
    .container {
        padding-left: 0;
        padding-right: 0;
    }

    .carousel {
        height: 350px;
        margin-bottom: 20px;
    }
    /* Since positioning the image, we need to help out the caption */
    .carousel-caption {
        z-index: 10;
    }
    /* Declare heights because of positioning of img element */
    .carousel .item {
        height: 350px;
        background-color: #111;
    }

    .carousel-inner > .item > img {
        position: absolute;
        top: 0;
        left: 0;
        min-width: 100%;
        height: 350px;
    }
}

@media (min-width: 768px) {
    /* Remove the edge padding needed for mobile */
    /* Navbar positioning foo */
    .navbar-wrapper {
        margin-top: 20px;
    }

        .navbar-wrapper .navbar {
            padding-right: 0;
            padding-left: 0;
        }
        /* The navbar becomes detached from the top, so we round the corners */
        .navbar-wrapper .navbar {
            border-radius: 4px;
        }
    /* Bump up size of carousel content */
    .carousel-caption p {
        margin-bottom: 20px;
        font-size: 21px;
        line-height: 1.4;
    }
}

.navbar-brand {
    padding: 0px;
}

@media (min-width: 992px) {
    .featurette-heading {
        margin-top: 120px;
    }
}

@media (min-width: 900px) {
    .container {
        width: 850px;
    }

    .pageInnerContent {
        padding-left: 50px;
        padding-right: 50px;
    }

    footer.pageFooter {
        padding-left: 50px;
        padding-right: 50px;
    }
}

@media (min-width: 1000px) {
    .container {
        width: 950px;
    }

    .pageInnerContent {
        padding-left: 170px;
        padding-right: 170px;
    }

    footer.pageFooter {
        padding-left: 170px;
        padding-right: 170px;
    }
}

@media (min-width: 1300px) {
    .container {
        width: 1200px;
    }

    .pageInnerContent {
        padding-left: 200px;
        padding-right: 200px;
    }

    footer.pageFooter {
        padding-left: 200px;
        padding-right: 200px;
    }

    @media (min-width: 1600px) {
        .container {
            width: 1500px;
        }

        .pageInnerContent {
            padding-left: 250px;
            padding-right: 250px;
        }

        footer.pageFooter {
            padding-left: 250px;
            padding-right: 250px;
        }
    }

    .col-xs-5ths,
    .col-sm-5ths,
    .col-md-5ths,
    .col-lg-5ths {
        position: relative;
        min-height: 1px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .col-xs-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 750px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 950px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1100px) {
    .col-lg-5ths {
        width: 20%;
        float: left;
    }
}

.pkt_added {
    text-decoration: none !important;
}

.navbar-brand {
    padding: 0;
}
/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

.appleOSXLink {
    display: inline-block;
    overflow: hidden;
    background: url(https://linkmaker.itunes.apple.com/htmlResources/assets/en_us//images/web/linkmaker/badge_macappstore-lrg.png) no-repeat;
    width: 165px;
    height: 40px;
}

.appleiOSLink {
    display: inline-block;
    overflow: hidden;
    background: url(https://linkmaker.itunes.apple.com/htmlResources/assets/en_us//images/web/linkmaker/badge_appstore-lrg.png) no-repeat;
    width: 135px;
    height: 40px;
}

@media only screen {
    .appleOSXLink {
        background-image: url(https://linkmaker.itunes.apple.com/htmlResources/assets/en_us//images/web/linkmaker/badge_macappstore-lrg.svg);
    }
    .appleOSXLink {
        background-image: url(https://linkmaker.itunes.apple.com/htmlResources/assets/en_us//images/web/linkmaker/badge_appstore-lrg.svg);
    }
}

.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

float-left {
   float:left;
}

.gameName {
    cursor:pointer;
}
.pointer {
    cursor:pointer;
}
.ResponsiveBoxAtom { width: 320px; height: 100px; }
@media(min-width: 500px) { .ResponsiveBoxAtom { width: 468px; height: 60px; } }
@media(min-width: 800px) { .ResponsiveBoxAtom { width: 728px; height: 90px; } }