/* Typography */

@import url('https://fonts.googleapis.com/css?family=Lato');
body { font-family: 'Lato', sans-serif; }
p { line-height: 1.7; }

/* Custom Font */

@font-face {
	font-family: "Blankblizzkrieg";
	src: url('font/Blankblizzkrieg/Blankblizzkrieg.eot');
	src: url('font/Blankblizzkrieg/Blankblizzkrieg.eot?#iefix') format('embedded-opentype'),
		url('font/Blankblizzkrieg/Blankblizzkrieg.woff') format('woff'),
		url('font/Blankblizzkrieg/Blankblizzkrieg.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}

.Blankblizzkrieg {
    font-family: "Blankblizzkrieg", 'Helvetica', Arial, sans-serif!important;
    font-size: 3.1rem!important;
    line-height: normal;
}

    .Blankblizzkrieg.large {
        font-size: 6rem!important;
    }

        @media screen and (max-width: 800px) {
            
            .Blankblizzkrieg.large {
                font-size: 2.5rem!important;
                letter-spacing: -1px;
            }
            
            .Blankblizzkrieg.long-text {
                font-size: 2.5rem!important;
                letter-spacing: -1px;
            }
            
        }

@font-face {
    font-family: 'CaptureIt';
    src: url('font/Capture_It/capture_it-webfont.eot');
    src: url('font/Capture_It/capture_it-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/Capture_It/capture_it-webfont.woff2') format('woff2'),
         url('font/Capture_It/capture_it-webfont.woff') format('woff'),
         url('font/Capture_It/capture_it-webfont.ttf') format('truetype'),
         url('font/Capture_It/capture_it-webfont.svg#capture_itregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

.text-center { text-align: center; }

/* Theme Styles */

.white-text { color: white; }

/* Homepage Banner */

span.the, span.home, span.of, span.metal { position: relative; z-index: 2; }
span.the:before, span.home:before, span.of:before, span.metal:before { content: ''; position: absolute; background-color: white; z-index: -1; }

span.the:before {
    top: 18px;
    right: 6px;
    bottom: 19px;
    left: 2px;
}
span.home:before {
    top: 18px;
    right: 8px;
    bottom: 19px;
    left: 2px;
}
span.of:before {
    top: 18px;
    right: 7px;
    bottom: 19px;
    left: 2px;
}
span.metal:before {
    top: 18px;
    right: 6px;
    bottom: 19px;
    left: 2px;
}

@media screen and (max-width: 800px) {
    span.the:before {
        top: 8px;
        right: 3px;
        bottom: 8px;
        left: 2px;
    }
    span.home:before {
        top: 8px;
        right: 3px;
        bottom: 8px;
        left: 2px;
    }
    span.of:before {
        top: 8px;
        right: 1px;
        bottom: 9px;
        left: 2px;
    }
    span.metal:before {
        top: 8px;
        right: 2px;
        bottom: 8px;
        left: 2px;
    }
}


.link span {
    color: white;
    font-size: 2rem;
}

.sub-title {
    color: #be0000;
    text-align: center;
}

img {
	width: 100%;
	display: block;
}

.container {
	width: 100%;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 2%;
	position: relative;
}

.container.narrow {
    max-width: 1280px;
}

div.breadcrumbContainer .breadcrumb {
	list-style: none;
	overflow: hidden;
	font-size: 1rem;
	padding: 0;
}

@media screen and (max-width: 500px) {
	div.breadcrumbContainer .breadcrumb {
		font-size: 0.55rem;
	}
}

div.breadcrumbContainer .breadcrumb li {
	float: left;
}

div.breadcrumbContainer .breadcrumb li a {
	color: white;
	text-decoration: none;
	padding: 10px 0 10px 50px;
	background: #be1622;
	position: relative;
	display: block;
	float: left;
}

@media screen and (max-width: 500px) {
	div.breadcrumbContainer .breadcrumb li a {
		padding: 8px 0 8px 40px;
	}
}

div.breadcrumbContainer .breadcrumb li a span {
	position: relative;
	z-index: 3;
}

div.breadcrumbContainer .breadcrumb li a:after {
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	/* Go big on the size, and let overflow hide */
	border-bottom: 50px solid transparent;
	border-left: 30px solid #be1622;
	position: absolute;
	top: 50%;
	margin-top: -50px;
	left: 100%;
	z-index: 2;
}

@media screen and (max-width: 500px) {
	div.breadcrumbContainer .breadcrumb li a:after {
		left: 80%;
	}
}

div.breadcrumbContainer .breadcrumb li a:before {
	content: " ";
	display: block;
	width: 0;
	height: 0;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	border-left: 30px solid white;
	position: absolute;
	top: 50%;
	left: 100%;
	margin-top: -50px;
	margin-left: 1px;
	z-index: 1;
}

@media screen and (max-width: 500px) {
	div.breadcrumbContainer .breadcrumb li a:before {
		left: 80%;
	}
}

div.breadcrumbContainer .breadcrumb li:first-child a {
	padding-left: 10px;
}

div.breadcrumbContainer .breadcrumb li.breadcrumb-selected a {
	background: transparent !important;
	pointer-events: none;
	cursor: default;
}

@media screen and (max-width: 500px) {
	div.breadcrumbContainer .breadcrumb li.breadcrumb-selected a {
		padding: 8px 0 8px 25px;
	}
}

div.breadcrumbContainer .breadcrumb li.breadcrumb-selected a:after,
div.breadcrumbContainer .breadcrumb li.breadcrumb-selected a:before {
	display: none;
}

div.breadcrumbContainer .breadcrumb li a:hover {
	background: #fff;
	color: #be1622;
}

div.breadcrumbContainer .breadcrumb li a:hover:after {
	border-left-color: #fff !important;
}

* {
	box-sizing: border-box;
}

* a {
	color: inherit;
	text-decoration: none;
	font: inherit;
}

* figure {
	margin: 0;
	padding: 0;
}

html,
body {
	font-size: 16px;
	margin: 0;
	padding: 0;
}

body {
	height: 100%;
}

header.intro {
	display: table;
	color: white;
	width: 100%;
    
    /* For use with Intro WITHOUT carousel */
    height: 45vh;
    min-height: 500px;
    background: url("images/torn-metal-top.png"), url("images/ripped-brick-at-top.png"), url("images/kks-intro.gif");
    background-size: 70rem, 70rem, contain;
	background-position: top, bottom, center;
    background-repeat: repeat-x, repeat-x, no-repeat;
    
    /* background: url("images/torn-metal-top.png"), url("images/torn-brick-bottom.png");
    background-size: auto, auto;
	background-position: top, bottom;
    background-repeat: repeat-x, repeat-x;
	background-size: 80rem, 80rem, contain; */
    
    background-color: black;
    
	position: relative;
}

@media screen and (min-width: 992px) {
    
	header.intro {
        /* For use with Intro WITHOUT carousel */
        height: 45vh;
        background-size: 70rem, 70rem, 50vw;
    }
    
}

header.intro .container {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

header.intro .container img {
	width: 40%;
	margin: 0 auto;
	padding: 0 30px;
}

@media screen and (max-width: 992px) {
	header.intro .container img {
		width: 70%;
	}
}

@media screen and (max-width: 500px) {
	header.intro .container img {
		width: 100%;
	}
}

header.intro ul#countdown li.seperator {
	font-size: 3rem;
	line-height: 1.5rem;
}

header.intro ul#countdown li span {
	font-size: 3rem;
}

header.intro ul#countdown li p {
	text-transform: uppercase;
	font-size: 0.85rem !important;
}

header.intro p.event-text {
	display: block;
	text-align: center;
	font-size: 1.8rem;
	font-style: italic;
	margin: 0 0 1rem 0;
}

header.intro p.scroll-down {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -50px;
	margin: 0;
	animation: bounce 2s infinite;
	-webkit-animation: bounce 2s infinite;
	-moz-animation: bounce 2s infinite;
	-o-animation: bounce 2s infinite;
}

header.intro p.scroll-down a {
	font-size: 2rem;
	cursor: pointer;
}

/* --------------------- Homepage Banner --------------------- */

.banner {
	display: table;
	width: 100%;
	background: url("images/header-background-colour.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	padding: 10rem 3rem;
}

.banner * {
    font-family: "Blankblizzkrieg";
}

@media screen and (max-width: 800px) {
    .banner { background-attachment: scroll; }
}

.banner h1 {
	text-transform: uppercase;
	color: white;
	font-size: 2.8rem;
	margin: 1rem 0;
}

@media screen and (max-width: 992px) {
	.banner h1 {
		font-size: 2.7rem;
	}
}

@media screen and (max-width: 538px) {
	.banner h1 {
		font-size: 1.7rem;
	}
}

.banner h1 { text-align: center; }
.banner h1 span { display: block; }

.banner figure {
	width: 100%;
	background: rgba(255, 255, 0, 0.5);
	padding: 0;
	margin: 0;
}

/* --------------------- Homepage Banner END --------------------- */

.dark-brick-background {
	display: table;
	width: 100%;
	height: auto;
    padding: 10rem 3rem;
	background: url(images/black-brick-repeat.jpg) repeat;
	background-attachment: scroll;
}

.dark-brick-background .tc {
	display: table-cell;
	vertical-align: middle;
}

.dark-brick-background .container {
	display: block;
}

.dark-brick-background .container h1 {
	text-transform: uppercase;
	color: white;
	font-size: 2.8rem;
	
	margin: 1rem 0;
}

.dark-brick-background .container h1 span {
}

@media screen and (max-width: 992px) {
	.dark-brick-background .container h1 {
		font-size: 2.7rem;
	}
}

@media screen and (max-width: 538px) {
	.dark-brick-background .container h1 {
		font-size: 1.7rem;
	}
}

.dark-brick-background .container p {
	color: white;
	font-size: 1rem;
	margin: 1rem 0;
}

.dark-brick-background .container p span {
	font-size: 1.2rem;
	font-weight: 700;
}

@media screen and (max-width: 500px) {
	.dark-brick-background .container p span {
		font-size: 1.2rem;
	}
}

.dark-brick-background .container .row {
	width: 100%;
}

.dark-brick-background .container .row:after {
	content: "";
	display: table;
	clear: both;
}

.dark-brick-background .container .row .col-6 {
	display: table-cell;
	width: 50%;
	float: left;
}

.dark-brick-background .container .row .col-6:first-child {
	padding-right: 1%;
}

.dark-brick-background .container .row .col-6:last-child {
	padding-left: 1%;
}

@media screen and (max-width: 992px) {
	.dark-brick-background .container .row .col-6 {
		width: 100%;
		padding: 0 !important;
	}
}

.dark-brick-background .container figure {
	width: 100%;
	padding: 20px 0;
	margin: 0;
}

.dark-brick-background .container figure:after {
	content: "";
	display: table;
	clear: both;
}

.dark-brick-background .container figure img {
	float: left;
	padding: 0;
	width: 32%;
	margin: 0 2% 0 0;
    box-shadow: 0 15px 30px;
}

    .no-shadow {
        box-shadow: 0px 0px 0px!Important;
    }

.dark-brick-background .container figure img:last-child {
	margin-right: 0;
}

@media screen and (max-width: 500px) {
	.dark-brick-background .container figure img {
		width: 100%;
		float: none;
		display: block;
		margin: 0;
		margin-bottom: 10px;
	}
}

.starworks-now {
	display: table;
	width: 100%;
	height: auto;
    padding: 10rem 3rem;
	background: url("images/background-02.jpg") no-repeat;
	background-size: cover;
	background-position: left;
}

.starworks-now .tc {
	display: table-cell;
	vertical-align: middle;
}

.starworks-now .container {
	display: block;
}

.starworks-now .container h1 {
	text-transform: uppercase;
	color: white;
	font-size: 2.8rem;
	
	margin: 1rem 0;
}

.starworks-now .container h1 span {
}

@media screen and (max-width: 992px) {
	.starworks-now .container h1 {
		font-size: 2.7rem;
	}
}

@media screen and (max-width: 538px) {
	.starworks-now .container h1 {
		font-size: 1.7rem;
	}
}

.starworks-now .container p {
	color: white;
	font-size: 1rem;
	margin: 1rem 0;
}

.starworks-now .container p span {
	font-size: 1.2rem;
	font-weight: 700;
}

@media screen and (max-width: 500px) {
	.starworks-now .container p span {
		font-size: 1.2rem;
	}
}

.starworks-now .container .row {
	width: 100%;
}

.starworks-now .container .row:after {
	content: "";
	display: table;
	clear: both;
}

    .row .col-4 {
        display: table-cell;
        width: 33%;
        float: left;
    }

        @media screen and (max-width: 700px) {
            .row .col-4 {
                display: table-cell;
                width: 100%;
                float: left;
            }
        }

.starworks-now .container .row .col-6 {
	display: table-cell;
	width: 50%;
	float: left;
}

.starworks-now .container .row .col-6:first-child {
	padding-right: 1%;
}

.starworks-now .container .row .col-6:last-child {
	padding-left: 1%;
}

@media screen and (max-width: 992px) {
	.starworks-now .container .row .col-6 {
		width: 100%;
		padding: 0 !important;
	}
}

.starworks-now .container figure {
	width: 100%;
	padding: 20px 0;
	margin: 0;
}

.starworks-now .container figure:after {
	content: "";
	display: table;
	clear: both;
}

.starworks-now .container figure img {
	float: left;
	padding: 0;
	width: 32%;
	margin: 0 2% 0 0;
	box-shadow: 0 15px 30px;
}

.starworks-now .container figure img:last-child {
	margin-right: 0;
}

@media screen and (max-width: 500px) {
	.starworks-now .container figure img {
		width: 100%;
		float: none;
		display: block;
		margin: 0;
		margin-bottom: 10px;
	}
}

.kk-block {
	display: block;
    position: relative;
	width: 100%;
	height: auto;
	padding: 5rem 3rem;
    /* background: url("images/KK-left.jpg"), url("images/KK-right.jpg"); */
	background-size: contain, contain;
	background-position: right, left; 
    background-color: black;
    background-repeat: no-repeat;
    /* TEMP */
    min-height: 700px;
     min-height: 500px;
}

@media screen and (max-width: 810px) {
    .kk-block {
        /*
        background: url("images/KK-left.jpg");
        background-size: cover;
        background-position: top right;
        background-repeat: no-repeat;
        background-color: black;
        */
    }
}
    
.kk-block:before {
    content:"";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: black;
    opacity: 0.5;
    z-index: 2;
}

.kk-block article#nextevent h1 {
	margin: 2.2rem 0 1.2rem;
}

.kk-block .container {
	display: block;
}

.kk-block .container p {
	color: white;
	font-size: 1.3rem;
	margin: 1rem 0;
    text-shadow: 0px 0px 12px rgba(0, 0, 0, 1);
    position: relative;
    z-index: 3;
}

.kk-block .container p span {
	font-size: 1.2rem;
	font-weight: 700;
}

@media screen and (max-width: 500px) {
	.kk-block .container p span {
		font-size: 1.2rem;
	}
}

.kk-block .container .wrapper {
	height: 3rem;
}

.kk-block .container figure.banner {
	display: block;
	width: 100%;
	margin: 0 auto 2rem;
}

.kk-block .container figure.banner:after {
	content: "";
	display: table;
	clear: both;
}

.kk-block .container div.buttonContainer {
	text-align: center;
}

.kk-block .container div.buttonContainer a.redButton {
	border: 2px solid white;
	padding: 10px 20px;
	width: auto;
	text-align: center;
	color: white;
	display: inline-block;
	-webkit-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	-moz-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
}

.kk-block .container div.buttonContainer a.redButton:hover {
	background: #be1622;
}

@media screen and (max-width: 500px) {
	.kk-block .container div.buttonContainer {
		width: 50%;
		margin: 0 auto;
		display: block;
	}
	.kk-block .container div.buttonContainer a.redButton {
		width: 100%;
		display: block;
		margin: 0.5rem 0;
	}
}

.kk-block .container figure.banner {
	padding-top: 0;
}

.kk-block .container figure.banner img {
	width: 100%;
}

.kk-block .container video {
	width: 100%;
}

.kk-block .container .wrapper {
	display: block;
	width: 100%;
	position: relative;
}

.kk-block .container .wrapper:after {
	content: "";
	display: table;
	clear: both;
}

.kk-block .container .wrapper h2 {
	color: white;
	font-style: italic;
	padding: 20px 0;
	width: 80%;
	float: left;
}

@media screen and (max-width: 670px) {
	.kk-block .container .wrapper h2 {
		float: none;
		display: block;
	}
}

.subscribe {
	display: table;
	width: 100%;
	height: auto;
	padding: 10rem 3rem;
    background: url("images/header-background-colour.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

@media screen and (max-width: 800px) {
    .subscribe {
        background-attachment: scroll;
    }
}

@media screen and (min-width: 993px) {
	.subscribe {
		min-height: 50vh;
	}
}

.subscribe .tc {
	display: table-cell;
	vertical-align: middle;
}

.subscribe .container {
	display: block;
    color: white;
}

.subscribe .container h1 {
	text-transform: uppercase;
	font-size: 2.8rem;
	margin: 1rem 0;
}

.subscribe .container h1 span {
}

@media screen and (max-width: 992px) {
	.subscribe .container h1 {
		font-size: 2.7rem;
	}
}

@media screen and (max-width: 538px) {
	.subscribe .container h1 {
		font-size: 1.7rem;
	}
}

.subscribe .container p {
	font-size: 1rem;
	margin: 1rem 0;
}

.subscribe .container p span {
	font-size: 1.2rem;
	font-weight: 700;
}

@media screen and (max-width: 500px) {
	.subscribe .container p span {
		font-size: 1.2rem;
	}
}

.subscribe .container h1,
.subscribe .container p {
	text-align: center;
}

.subscribe .container h1:first-child {
	margin-bottom: 0;
}

.subscribe .container h1:nth-child(2) {
	margin-top: 0 !important;
}

.subscribe .container p {
	font-weight: 700;
	font-size: 1.3rem;
}

.subscribe .container form {
	padding: 0;
	width: 60%;
	margin: 0 auto;
}

.subscribe .container form input {
	display: block;
	margin: 0 auto;
}

.subscribe .container form input.name {
	width: 49%;
	font-size: 1.2rem;
	padding: 1rem;
	background: white;
	border: 0;
	margin: 20px auto;
	float: left;
}

.subscribe .container form input.number {
	width: 49%;
	font-size: 1.2rem;
	padding: 1rem;
	background: white;
	border: 0;
	margin: 20px auto;
	float: right;
}

.subscribe .container form input.email {
	width: 100%;
	font-size: 1.2rem;
	padding: 1rem;
	background: white;
	border: 0;
	margin: 20px auto;
}

.subscribe .container form input.submit {
	width: auto;
	padding: 1rem 1.5rem;
	font-size: 1rem;
	color: white;
	background: black;
	text-transform: uppercase;
	-webkit-transition: all 0.4s ease-out;
	transition: all 0.4s ease-out;
}

.subscribe .container form input.submit:hover {
	background: white;
	color: black;
	border: 2px solid black;
	-webkit-transition: all 0.4s ease-in;
	transition: all 0.4s ease-in;
}

@media screen and (max-width: 992px) {
	.subscribe .container form {
		width: 100%;
	}
	.subscribe .container form input.name {
		width: 100%;
		font-size: 1.2rem;
		padding: 1rem;
		background: white;
		border: 0;
		margin: 20px auto;
		float: none;
	}
	.subscribe .container form input.number {
		width: 100%;
		font-size: 1.2rem;
		padding: 1rem;
		background: white;
		border: 0;
		margin: 20px auto;
		float: none;
	}
	.subscribe .container form input.email {
		width: 100%;
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 500px) {
	.subscribe .container form input.email {
		width: 100%;
		font-size: 1.2rem;
	}
}

.black-spacer {
    width: 100%;
    height: auto;
    padding: 5rem 0rem;
    /* background-color: black; */
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
    margin-top: -10rem;
}

.brick-spacer {
    width: 100%;
    height: auto;
    padding: 1.5rem 0rem;
    background: url(images/black-brick-repeat.jpg) repeat;
    background-attachment: scroll;
}

.brick-spacer.double-height {
    padding: 4rem 0rem;
}

@media screen and (min-width: 800px) {
    .brick-spacer.double-height {
        padding: 7rem 0rem;
    }
}

.corona {
	padding: 3rem 3rem 0 3rem;
}

.corona p {
	text-align: center;
	font-weight: bold;
	font-size: 1.2rem!important;
}

.corona marquee {
	text-align: center;
	font-weight: bold;
	font-size: 2.5rem!important;
	
	color: #bb1a28;
}

footer {
	display: block;
	width: 100%;
	height: auto;
    background-color: black;
	padding: 10rem 3rem;
}

footer .container {
	display: block;
}

footer .container p {
	color: white;
	font-size: 1rem;
	margin: 1rem 0;
}

footer .container p span {
	font-size: 1.2rem;
	font-weight: 700;
}

@media screen and (max-width: 500px) {
	footer .container p span {
		font-size: 1.2rem;
	}
}

footer .container img {
	width: 100%;
    max-width: 700px;
	margin: 0 auto;
	display: block;
}

footer .container p.address {
	text-align: center;
	font-weight: bold;
}

footer .container p.contact {
	text-align: center;
	font-size: 2.3rem;
	overflow-x: hidden;
}

footer .container p.contact span {
	font-size: inherit;
}

footer .container p.contact span:first-child {
	margin-right: 20px;
}

footer .container p.contact span.contact-email {
}

@media screen and (max-width: 1200px) {
	footer .container p.contact {
		font-size: 2rem;
	}
}

@media screen and (max-width: 992px) {
	footer .container p.contact {
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 800px) {
	footer .container p.contact {
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 500px) {
	footer .container p.contact span.contact-email {
		font-size: 1.3rem;
	}
	footer .container p.contact span {
		margin: 1rem;
		display: block;
	}
}

footer .container p.slug {
	text-align: center;
	font-size: 0.9rem;
}

footer .container ul.social {
	list-style: none;
	width: 100%;
	padding: 20px 0;
	margin: 0;
	text-align: center;
	display: block;
    font-size: 2rem;
}

footer .container ul.social li {
	display: inline-block;
	margin: 0 15px;
	color: white;
}

footer .container ul.social li i {
	font-size: 1.5rem;
}

.kkdowning-net {
    width: 100%;
    max-width: 250px!Important;
    margin-top: 2rem!Important;
    margin-bottom: 4.5rem!Important;
}

.kkdowning-net-banner {
    width: 100%;
    max-width: 1000px!Important;
    margin-top: 2rem!Important;
    margin-bottom: 4.5rem!Important;
}

.events-intro {
	display: table;
	color: white;
	width: 100%;
	height: 50vh;
	min-height: 400px;
	max-height: 600px;
	background: url("images/header-background.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	padding: 50px 0;
	position: relative;
}

.events-intro .container {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.events-intro .container h1 {
	font-size: 5rem;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	.events-intro .container h1 {
		font-size: 4rem;
	}
}

@media screen and (max-width: 500px) {
	.events-intro .container h1 {
		font-size: 1.5rem;
	}
}

 .upcomingEvents h2 {
	width: 70%;
	display: block;
	margin: 0;
	text-align: left;
	text-transform: uppercase;
	padding-bottom: 10px;
	float: left;
}

.upcomingEvents p.button {
	width: 30%;
	float: right;
	padding-bottom: 10px;
	margin: 0;
	text-align: right;
}

.eventsPage .upcomingEvents p.button button {
	color: white;
	background: #be1622;
	padding: 10px 20px;
	text-transform: uppercase;
	font-size: 0.9rem;
	outline: none;
	border: 2px solid transparent;
	-webkit-transition: border 0.2s ease, color 0.2s ease, background-color 0.2s, ease;
	-moz-transition: border 0.2s ease, color 0.2s ease, background-color 0.2s, ease;
	transition: border 0.2s ease, color 0.2s ease, background-color 0.2s, ease;
}

@media screen and (max-width: 600px) {
	.eventsPage .upcomingEvents p.button button {
		padding: 10px;
	}
}

.eventsPage .upcomingEvents p.button button:hover {
	background: white;
	color: #be1622;
	border: 2px solid transparent;
}

.eventsPage .upcomingEvents hr {
	width: 100%;
	border: 0;
	border-top: 2px solid black;
	float: left;
}

.eventsPage .upcomingEvents hr:after {
	content: " ";
	display: block;
}

.eventsPage .upcomingEvents div.clearfix {
	margin-bottom: 2rem;
}

.eventsPage .upcomingEvents div.clearfix:after {
	content: "";
	display: table;
	clear: both;
}

.eventsPage .upcomingEvents .image-grid {
	display: table !important;
}

.eventsPage .upcomingEvents .image-grid:after {
	content: "";
	display: table;
	clear: both;
}

.eventsPage .upcomingEvents figure {
	padding: 0;
	margin: 0;
	display: block;
	position: relative;
}

.expired {
    position: relative;
}

.expired:after {
    content: "";
    position: absolute;
    width: 100%;
    padding-top: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    background-color: rgba(0,0,0,0.8);
    background-image: url("images/expired.png");
    background-size: 30%;
    background-position: top right;
    background-repeat: no-repeat;
    border: solid 2px black;
}

@media screen and (min-width: 993px) {
	.eventsPage .upcomingEvents figure {
		width: 31%;
		margin-right: 2%;
		margin-bottom: 2%;
		float: left;
	}
	.eventsPage .upcomingEvents figure:before {
		content: "";
		display: block;
		padding-top: 100%;
	}
}

@media screen and (min-width: 993px) {
    .event-grid {
        margin-right: -2%;
    }
}

@media screen and (max-width: 992px) {
	.eventsPage .upcomingEvents figure {
		height: 300px;
		width: 49%;
		margin-right: 2%;
		margin-bottom: 2%;
		float: left;
	}
	.eventsPage .upcomingEvents figure:nth-child(even) {
		margin-right: 0;
	}
}

@media screen and (max-width: 675px) {
	.eventsPage .upcomingEvents figure {
		height: 300px;
		width: 100%;
		float: none;
		margin: 0;
		margin-bottom: 2%;
	}
}

.eventsPage .upcomingEvents figure {
	background: #be1622;
	overflow: hidden;
    box-shadow: 0 15px 30px;
}

.eventsPage .upcomingEvents figure img.thumbnail {
	object-fit: cover;
	object-position: center;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.eventsPage .upcomingEvents figure div.content {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	display: block;
	margin: auto;
	width: 100%;
	height: 100%;
}

.eventsPage .upcomingEvents figure div.content:before {
	content: ' ';
	height: 180px;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 0;
	background-image: -webkit-linear-gradient( top, rgba(0, 0, 0, 0.8) 50%, transparent);
	background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 50%, transparent);
}

.eventsPage .upcomingEvents figure p.event-date {
	margin: 0;
	width: 100%;
	background: black;
	border-bottom: 2px solid #333333;
	color: white;
	font-size: 1.4rem;
	font-weight: bold;
	text-transform: uppercase;
	padding: 10px 0;
	display: block;
	position: relative;
	height: 45px;
	overflow: hidden;
}

.eventsPage .upcomingEvents figure p.event-date span.date {
	padding: 3%;
	border-right: 2px solid #333333;
	text-align: center;
	overflow: hidden;
}

.eventsPage .upcomingEvents figure p.event-date span.event-info {
	padding: 2%;
	border-right: 2px solid #333333;
}

.eventsPage .upcomingEvents figure p.event-date span.eventicon {
	display: inline-block;
	position: relative;
	top: -10px;
	float: right;
	height: 45px;
	width: 45px;
	border-left: 2px solid #333333;
	background: #be1622;
}

.eventsPage .upcomingEvents figure p.event-date span.eventicon:after {
	content: "";
	display: table;
	clear: both;
}

.eventsPage .upcomingEvents figure p.event-date span.eventicon .icon {
	display: block;
	width: 100%;
	height: 100%;
}

.eventsPage .upcomingEvents figure p.event-info {
	display: block;
	width: 90%;
	border-left: 4px solid white;
	padding: 0 0 0 2%;
	margin: 1.4rem auto 0;
	color: white;
	position: relative;
}

.eventsPage .upcomingEvents figure p.event-info span.mainArtist {
	font-size: 1.2rem;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
}

.eventsPage .upcomingEvents figure p.event-info span.mainText {
	margin-top: 0.5rem;
	font-size: 1rem;
	font-weight: 400;
	display: block;
}

.eventsPage .upcomingEvents figure p.viewButton {
	position: absolute;
	right: 0;
	bottom: 4%;
	left: 0;
	display: block;
	width: 90%;
	margin: 0 auto;
	text-transform: uppercase;
	color: white;
    font-family: "Blankblizzkrieg";
    font-size: 1.5rem;
}

.eventsPage .upcomingEvents figure p.viewButton a {
	display: block;
	width: 100%;
	text-align: center;
	color: inherit;
    font-size: 2rem;
	-webkit-transition: color 0.2s ease;
	-moz-transition: color 0.2s ease;
	transition: color 0.2s ease;
    text-shadow: 0px 0px 20px rgba(0, 0, 0, 1);
}

.eventsPage .upcomingEvents figure p.viewButton a:hover {
    color: #be1622;
}

.singleEventPage .events-intro {
	display: table;
	color: white;
	width: 100%;
	height: 50vh;
	min-height: 400px;
	max-height: 600px;
	background: url("images/header-background.jpg") no-repeat;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
	padding: 50px 0;
	position: relative;
}

.singleEventPage .events-intro .container {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.singleEventPage .events-intro .container img {
	width: 15%;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	.singleEventPage .events-intro .container img {
		width: 30%;
	}
}

@media screen and (max-width: 500px) {
	.singleEventPage .events-intro .container img {
		width: 50%;
	}
}

.singleEventPage .events-intro .container h1 {
	font-size: 5rem;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	.singleEventPage .events-intro .container h1 {
		font-size: 4rem;
	}
}

@media screen and (max-width: 500px) {
	.singleEventPage .events-intro .container h1 {
		font-size: 1.5rem;
	}
}

.singleEventPage section.single {
	display: table;
    width: 100%;
    height: auto;
    padding: 10rem 3rem;
    background: url(images/black-brick-repeat.jpg) repeat;
    background-attachment: scroll;
}

@media screen and (max-width: 800px) {
    .singleEventPage section.single {
        padding: 3rem 1.5rem;
    }
}

.singleEventPage section.single figure {
	display: block;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}

.singleEventPage section.single figure:after {
	content: "";
	display: table;
	clear: both;
}

.singleEventPage section.single figure img {
	display: block;
	width: 100%;
	position: relative;
}

.singleEventPage section.single figure a.buynowBtn {
	text-transform: uppercase;
	text-align: center;
	width: auto;
	display: inline-block;
	padding: 10px 20px;
	background: #be1622;
	color: white;
	position: absolute;
	border: 2px solid transparent;
	top: 15px;
	right: 4%;
	-webkit-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	-moz-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
}

@media screen and (max-width: 500px) {
	.singleEventPage section.single figure a.buynowBtn {
		top: 0;
	}
}

.singleEventPage section.single figure a.buynowBtn:hover {
	border: 2px solid transparent;
	color: #be1622;
	background: white;
}

.singleEventPage section.single figure figcaption {
	width: 100%;
	display: table;
	float: left;
	margin: 0 auto;
	background: black;
	padding: 0;
}

.singleEventPage section.single figure figcaption:after {
	content: "";
	display: table;
	clear: both;
}

.singleEventPage section.single figure figcaption div.event-icon {
	width: 100px;
	display: table-cell;
	background: #be1622;
	vertical-align: middle;
}

.singleEventPage section.single figure figcaption div.event-artist {
	width: 50%;
	display: table-cell;
	vertical-align: middle;
	padding-left: 2%;
}

.singleEventPage section.single figure figcaption div.event-artist p.mainArtist {
	font-size: 1.4rem;
	color: white;
	text-transform: uppercase;
	font-weight: bold;
	margin: 0;
}

.singleEventPage section.single figure figcaption div.event-artist p.mainText {
	font-size: 1rem;
	color: white;
	font-weight: 400;
	margin: 0.4rem 0 0 0;
}

@media screen and (max-width: 992px) {
	.singleEventPage section.single figure figcaption div.event-artist {
		width: 100%;
		padding-left: 4%;
		float: left;
	}
	.singleEventPage section.single figure figcaption div.event-artist p.mainArtist {
		margin: 1rem 0;
	}
}

.singleEventPage section.single figure figcaption div.event-info {
	color: white;
	text-align: right;
	padding-right: 2%;
	display: table-cell;
	vertical-align: middle;
}

.singleEventPage section.single figure figcaption div.event-info p.date {
	font-size: 1.4rem;
	color: white;
	font-weight: bold;
	margin: 0;
}

.singleEventPage section.single figure figcaption div.event-info p.time {
	font-size: 1rem;
	color: white;
	font-weight: 400;
	margin: 0;
}

@media screen and (max-width: 992px) {
	.singleEventPage section.single figure figcaption div.event-info {
		width: 100%;
		padding-left: 4%;
		float: left;
		text-align: left;
	}
	.singleEventPage section.single figure figcaption div.event-info p.date {
		font-size: 1.2rem;
		margin: 1rem 0 0.4rem;
	}
	.singleEventPage section.single figure figcaption div.event-info p.time {
		margin-bottom: 1rem;
	}
}

.singleEventPage section.detailedInfo {
	background: rgba(255, 255, 255, 0.6);
	width: 100%;
	display: block;
	padding: 2%;
	color: black;
	text-align: left;
}

@media screen and (max-width: 500px) {
	.singleEventPage section.detailedInfo {
		padding: 4% 4%;
	}
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper {
	width: 100%;
	display: table;
	margin: 0 auto;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket,
.singleEventPage section.detailedInfo .ticketsSocialWrapper .social {
	vertical-align: middle;
	width: 50%;
	display: table-cell;
}

@media screen and (max-width: 500px) {
	.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket,
	.singleEventPage section.detailedInfo .ticketsSocialWrapper .social {
		display: block;
		width: 100%;
		margin: 1rem auto;
		float: none;
		text-align: left !important;
	}
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket {
	text-align: left;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket a.buynowBtn {
	text-transform: uppercase;
	text-align: center;
	width: auto;
	display: inline-block;
	padding: 10px 20px;
	background: #be1622;
	color: white;
	font-size: 1rem;
	border: 2px solid transparent;
	-webkit-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	-moz-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
}

@media screen and (max-width: 500px) {
	.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket a.buynowBtn {
		width: 100%;
	}
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket a.buynowBtn:hover {
	border: 2px solid transparent;
	color: #be1622;
	background: white;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket .addCalCustomConfig {
	text-transform: uppercase;
	text-align: center;
	width: auto;
	display: inline-block;
	padding: 10px 20px;
	background: #be1622 !important;
	color: white;
	font-size: 1rem;
	border: 2px solid transparent;
	-webkit-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	-moz-transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
	transition: border 0.2s ease, color 0.2s ease, background 0.2s, ease;
}

@media screen and (max-width: 500px) {
	.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket .addCalCustomConfig {
		width: 100%;
		margin-top: 1rem;
	}
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket .addCalCustomConfig:hover {
	border: 2px solid transparent;
	color: #be1622;
	background: white !important;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket .addCalCustomConfig li.atcb-item {
	background: silver !important;
	padding: 10px 5px;
	font-size: 0.9rem;
	color: white !important;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .ticket .addCalCustomConfig li.atcb-item:hover {
	background: grey !important;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .social {
	text-align: right;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .social div.fb-view-event {
	display: inline-block;
	background-color: #415ca9;
	background-image: -webkit-linear-gradient(top, #415ca9, #4c69ba);
	background-image: linear-gradient(to bottom, #415ca9, #4c69ba);
	border-color: #385490 #ddd #374f92;
	box-shadow: inset 0 0 1px #3e58a3;
	color: white;
	text-transform: capitalize;
	height: 20px;
	border-radius: 2px;
	line-height: 20px;
	padding: 0 0 0 5px;
	text-shadow: 0 -1px 0 #354c8c;
	white-space: nowrap;
	text-align: center;
	position: relative;
	top: -1px;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .social div.fb-view-event i {
	font-size: 0.8rem;
}

.singleEventPage section.detailedInfo .ticketsSocialWrapper .social div.fb-view-event span {
	font-size: 0.65rem;
	padding: 0 5px 0 5px;
	position: relative;
	top: -1px;
}

.singleEventPage figure.event-banner {
	width: 100%;
	display: block;
	margin: 0 auto;
	border-bottom: 5px solid;
	border-bottom-color: rgba(255, 255, 255, 0.6);
}

.singleEventPage div.video-title {
	width: 100%;
	display: block;
	margin: 0 auto;
	background: rgba(255, 255, 255, 0.6);
	padding: 1.2rem 2%;
	text-align: center;
}

.singleEventPage div.video-title h2 {
	color: black;
	text-transform: uppercase;
	margin: 0 auto;
}

.singleEventPage video#event-video {
	width: 100%;
	display: block;
	margin: 0 auto;
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
    margin-bottom: 1rem;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.singleEventPage .embed-container {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	max-width: 100%;
}

.singleEventPage .embed-container iframe,
.singleEventPage .embed-container object,
.singleEventPage .embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.singleEventPage div.iframeWrapper {
	position: relative;
	height: 0;
	overflow: hidden;
}

.singleEventPage div.iframeWrapper-16x9 {
	padding-bottom: 56.25%;
}

.singleEventPage iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* --------------------- Banners --------------------- */

.page-header {
	display: table;
	color: white;
	width: 100%;
	height: 50%;
	min-height: 400px;
	max-height: 600px;
	padding: 50px 0;
	position: relative;
}
    .page-header.venue {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/venue.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

    .page-header.fanz-zone {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/fanz-zone.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

    .page-header.merch {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/merch.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

    .page-header.kks-bio {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/kks-bio.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

    .page-header.events {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/events.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

    .page-header.contact {
        background: url(images/torn-metal-top.png), url(images/torn-brick-bottom.png), url(images/contact.gif);
        background-size: 80rem, 80rem, contain;
        background-position: top, bottom, center;
        background-repeat: repeat-x, repeat-x, no-repeat;
        background-color: black;
    }

/* --------------------- Banners END --------------------- */

.bannerLogo {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 300px;
}

@media screen and (max-width: 500px) {
	.bannerLogo {
		width: 200px;
		top: 25px;
	}
}

div.aboutPage .page-header .container {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

div.aboutPage .page-header .container img {
	width: 15%;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	div.aboutPage .page-header .container img {
		width: 30%;
	}
}

@media screen and (max-width: 500px) {
	div.aboutPage .page-header .container img {
		width: 50%;
	}
}

div.aboutPage .page-header .container h1 {
	font-size: 5rem;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	div.aboutPage .page-header .container h1 {
		font-size: 4rem;
	}
}

@media screen and (max-width: 500px) {
	div.aboutPage .page-header .container h1 {
		font-size: 1.5rem;
	}
}

section.contact {
    padding: 0rem 3rem;
}

div.contactPage .contact-intro .container {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

div.contactPage .contact-intro .container img {
	width: 15%;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	div.contactPage .contact-intro .container img {
		width: 30%;
	}
}

@media screen and (max-width: 500px) {
	div.contactPage .contact-intro .container img {
		width: 50%;
	}
}

div.contactPage .contact-intro .container h1 {
	font-size: 5rem;
	margin: 0 auto;
}

@media screen and (max-width: 992px) {
	div.contactPage .contact-intro .container h1 {
		font-size: 4rem;
	}
}

@media screen and (max-width: 500px) {
	div.contactPage .contact-intro .container h1 {
		font-size: 1.5rem;
	}
}

div.contactPage .contact-details {
	background: url(images/black-brick-repeat.jpg) repeat;
	background-attachment: scroll;
	padding: 4rem 0;
}

div.contactPage .contact-details .container>h2 {
	text-transform: uppercase;
	font-weight: bold;
	margin: 0 0 2rem 0;
	padding: 1rem 0 0.5rem;
	width: 100%;
	border-bottom: 2px solid black;
	font-size: 2rem;
}

div.contactPage .contact-details .container h1 {
    color: white;
}

@media screen and (max-width: 500px) {
	div.contactPage .contact-details .container>h2 {
		text-align: center;
	}
}

div.contactPage .contact-details .contact-general {
	margin: 2rem 0;
}

@media screen and (max-width: 1030px) {
    div.contactPage .contact-details .contact-general {
        margin: 0rem;
    }
}

div.contactPage .contact-details .contact-general ul.table {
	display: table;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

div.contactPage .contact-details .contact-general ul.table p {
	margin: 0.4rem 0;
}

div.contactPage .contact-details .contact-general ul.table p strong {
	font-size: 1rem;
}

div.contactPage .contact-details .contact-general li.table-cell {
	display: block;
	float: left;
	background: rgba(255, 255, 255, 0.7);
	border-radius: 10px;
	padding: 10px 10px;
	position: relative;
	box-shadow: 0px 4px 15px -1px;
}

div.contactPage .contact-details .contact-general li.table-cell:after {
	content: "";
	display: table;
	clear: both;
}

div.contactPage .contact-details .contact-general li.table-cell span {
	width: 40px;
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 50%;
	padding: 5px;
	text-align: center;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}

div.contactPage .contact-details .contact-general li.table-cell .contact-card-wrapper {
	padding-left: 70px;
	padding-top: 0;
	padding-bottom: 0;
	position: relative;
}

div.contactPage .contact-details .contact-general li.table-cell .contact-card-wrapper div {
	border-left: 1px solid black;
	padding-left: 10px;
}

@media screen and (min-width: 1141px) {
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x1 {
		width: 32%;
		margin-right: 2%;
	}
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x2 {
		width: 66%;
	}
}

@media screen and (max-width: 1140px) {
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x1 {
		width: 49%;
		margin-right: 2%;
	}
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x2 {
		width: 49%;
	}
}

@media screen and (max-width: 1030px) {
/* @media screen and (max-width: 725px) { */
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x1,
	div.contactPage .contact-details .contact-general li.table-cell.cell-size-x2 {
		width: 100%;
		margin-right: 0;
		margin-bottom: 1.5rem;
	}
}

div.contactPage div#googleMap {
	width: 100%;
	display: block;
	height: 500px;
	margin-bottom: 6rem;
	background: transparent;
}

.map {
    width: 100%;
    height: 40rem;
    background-image: url(images/map.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

/* Custom Styles */

.centerButtons {
    text-align: center!Important;
}

.shop-button {
    width: 60%;
    max-width: 400px;
    height: auto;
    margin: 20px 0px 0px 0px;
    content: url("images/shop-now.png");
}

.link-title {
    border-bottom: solid 1px white;
    text-align: center;
}

.merch-circle-bg {
    position: relative;
    z-index: 1;
}

.merch-circle-bg img {
    position: relative;
    z-index: 3;
}

.merch-circle-bg:after {
    content: '';
    position: absolute;
    width: inherit;
    height: inherit;
    top: 10px;
    bottom: 10px;
    left: 10px;
    right: 10px;
    background-image: url(images/merch-background.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 50%;
    -webkit-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.75);
    z-index: 1;
}

.ripped-brick-at-bottom {
    height: 50px;
    margin-bottom: -50px;
    position: relative;
    z-index: 2;
    background: url(images/ripped-brick-at-bottom.png);
    background-size: 80rem;
    background-position: top;
    background-repeat: repeat-x;
}

.ripped-brick-at-top {
    height: 50px;
    margin-top: -50px;
    position: relative;
    z-index: 2;
    background: url(images/ripped-brick-at-top.png);
    background-size: 80rem;
    background-position: bottom;
    background-repeat: repeat-x;
}

.ripped-map-at-bottom {
    height: 50px;
    margin-bottom: -50px;
    position: relative;
    z-index: 2;
    background: url(images/ripped-map-at-bottom.png);
    background-size: 80rem;
    background-position: top;
    background-repeat: repeat-x;
}

.ripped-black-at-top {
    height: 50px;
    margin-top: -50px;
    position: relative;
    z-index: 2;
    background: url(images/ripped-black-at-top.png);
    background-size: 80rem;
    background-position: bottom;
    background-repeat: repeat-x;
}

.ripped-black-at-bottom {
    height: 50px;
    margin-bottom: -50px;
    position: relative;
    z-index: 2;
    background: url(images/ripped-black-at-bottom.png);
    background-size: 80rem;
    background-position: top;
    background-repeat: repeat-x;
}

.book-now-button a {
    background: #be1622;
    padding: 0.5rem;
    color: white;
    text-align: center;
    cursor: pointer;
    margin-bottom: 0px;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    width: 100%;
    display: block;
}
.book-now-button a:hover {
    background: #960a14;
    -webkit-box-shadow: 0px 2px 26px 1px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 2px 26px 1px rgba(0,0,0,0.2);
    box-shadow: 0px 2px 26px 1px rgba(0,0,0,0.2);
    transform: scale(0.99);
}

/* Mobile / Tablet Alterations */

/* Section Padding */

@media screen and (max-width: 800px) {

    .banner,
    .dark-brick-background,
    .starworks-now,
    .kk-block,
    .subscribe,
    footer {
        padding: 5rem 1.5rem;
    }
    
    section.contact { padding: 0rem 1.5rem; }

}

.highlighted-text {
    background: #be1622;
    color: white;
    padding: 0.5rem;
    text-align: center;
    font-size: 1.5rem;
    line-height: 1.7rem;
}

/* Events Table on Homepage */

table tbody tr:nth-of-type(even) { background: inherit; }
table.wdn_responsive_table tbody td:nth-of-type(even) { background: inherit; }
table tbody tr td:first-child { padding-left: 0px; padding-right: 0px; }

@media screen and (min-width: 48em) {
    table tbody td.first-row { border-top: none; }
    table tbody td:nth-child(3) { text-align: center!Important; }
}

table .date {
    width: 100%;
    min-width: 100px;
    padding: 7px;
    background: #be0000;
    text-align: center;
}
table .thumbnail {
    width: 100%;
}
table .thumbnail:after {
    content: "";
    display: block;
    padding-bottom: 80%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-color: red;
}
table .title {
    font-size: 1.8rem!Important;
    line-height: 1.9rem!Important;
    margin-bottom: 0px!Important;
    font-family: 'CaptureIt';
    letter-spacing: 1px;
}
table .desc {
    margin-top: 10px!Important;
    font-size: 1rem!Important;
    line-height: 1.3rem!Important;
}
table .get-tickets { font-size: 2rem!Important; }

@media screen and (max-width: 47.99em) {
    table tbody td {
        border-top: none;
        padding: 0;
    }
    table tbody td:first-child {
        padding-top: 30px;
    }
    table tbody td.first-row:first-child {
        padding-top: 0px;
    }
    table tbody td:nth-child(3) {
        border-bottom: solid 1px white;
        padding-bottom: 30px;
    }
    table tbody td.last-row { border-bottom: none; }
    table .date {
        max-width: 120px;
    }
    table .thumbnail {
        display: none;
        max-width: 120px;
    }
}

.sold-out {
    position: relative;
}

.sold-out::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 500px;
    max-height: 500px;
    background: url(images/sold-out.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

.eventsPage .upcomingEvents figure .sold-out {
    position: static;
}

.eventsPage .upcomingEvents figure .sold-out::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 250px;
    max-height: 250px;
    background: url(images/sold-out.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

.cancelled {
    position: relative;
}

.cancelled::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 500px;
    max-height: 500px;
    background: url(images/cancelled.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

.eventsPage .upcomingEvents figure .cancelled {
    position: static;
}

.eventsPage .upcomingEvents figure .cancelled::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 250px;
    max-height: 250px;
    background: url(images/cancelled.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

.postponed {
    position: relative;
}

.postponed::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 500px;
    max-height: 500px;
    background: url(images/postponed.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

.eventsPage .upcomingEvents figure .postponed {
    position: static;
}

.eventsPage .upcomingEvents figure .postponed::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    max-width: 250px;
    max-height: 250px;
    background: url(images/postponed.svg);
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;
    pointer-events: none;
}

/* Event Artwork */

.M2TM-thumbnail:after { background-image: url(images/events/event-bloodstock-m2tm-2019-heat-1-thumb.jpg); }
.M2TM-EVIL-SCARECROW-thumbnail:after { background-image: url(images/events/event-bloodstock-m2tm-evil-scarecrow-thumb.jpg); }
.FM-QUIREBOYS-thumbnail:after { background-image: url(images/events/event-fm-and-the-quireboys-thumb.jpg); }
.KING-KING-thumbnail:after { background-image: url(images/events/event-king-king-thumb.jpg); }
.BLACK-STAR-RIDERS-thumbnail:after { background-image: url(images/events/event-black-star-riders-thumb.jpg); }
.SACRED-REICH-thumbnail:after { background-image: url(images/events/event-sacred-reich-thumb.jpg); }
.PHILL-CAMPBELL-thumbnail:after { background-image: url(images/events/event-phill-campbell-thumb.jpg); }
.ANNIHILATOR-thumbnail:after { background-image: url(images/events/event-annihilator-thumb.jpg); }
.STIFF-LITTLE-FINGERS-thumbnail:after { background-image: url(images/events/event-stiff-little-fingers-thumb.jpg); }
.KINGS-X-thumbnail:after { background-image: url(images/events/event-kings-x-thumb.jpg); }
.UGLY-KID-JOE-thumbnail:after { background-image: url(images/events/event-ugly-kid-joe-thumb.jpg); }
.KILLING-JOKE-thumbnail:after { background-image: url(images/events/event-killing-joke-thumb.jpg); }
.DAN-REED-NETWORK-FM-GUN-thumbnail:after { background-image: url(images/events/event-dan-reed-network-gun-fm-thumb.jpg); }
.LIVEWIRE-AC-DC-SHOW-thumbnail:after { background-image: url(images/events/event-livewire-the-addc-show-vs-whitesnake-uk-thumb.jpg); }
.THE-DUALERS-thumbnail:after { background-image: url(images/events/event-the-dualers-thumb.jpg); }
.FISH-thumbnail:after { background-image: url(images/events/event-fish-thumb.jpg); }
.THE-WILDHEARTS-thumbnail:after { background-image: url(images/events/event-the-wildhearts-thumb.jpg); }
.BLAST-OFF-SUMMER-PARTY-thumbnail:after { background-image: url(images/events/event-blast-off-summer-party-thumb.png); }
.THE-CIRCUS-OF-HORRORS-thumbnail:after { background-image: url(images/events/event-the-circus-of-horrors-thumb.jpg); }
.URIAH-HEEP-thumbnail:after { background-image: url(images/events/event-uriah-heep-thumb.jpg); }
.THE-CALLING-thumbnail:after { background-image: url(images/events/event-the-calling-thumb.jpg); }
.PWEI-thumbnail:after { background-image: url(images/events/event-pwei-thumb.jpg); }
.ROCKFEST-thumbnail:after { background-image: url(images/events/event-rockfest-thumb.jpg); }
.GWAR-thumbnail:after { background-image: url(images/events/event-gwar-thumb.jpg); }
.DEAF-HAVANA-thumbnail:after { background-image: url(images/events/event-deaf-havana-thumb.jpg); }
.MARTIN-KEMP-thumbnail:after { background-image: url(images/events/event-martin-kemp-thumb.jpg); }
.THE-DAMNED-thumbnail:after { background-image: url(images/events/event-the-damned-thumb.jpg); }
.LAST-IN-LINE-thumbnail:after { background-image: url(images/events/event-last-in-line-thumb.jpg); }
.OBZIDIAN-thumbnail:after { background-image: url(images/events/event-obzidian-thumb.jpg); }
.ETERNAL-FEAR-thumbnail:after { background-image: url(images/events/event-eternal-fear-thumb.jpg); }
.SKINDRED-thumbnail:after { background-image: url(images/events/event-skindred-thumb.jpg); }
.LOVE-HATE-thumbnail:after { background-image: url(images/events/event-love-hate-thumb.jpg); }
.MORE-LIVE-WITH-DETH-thumbnail:after { background-image: url(images/events/event-more-live-with-deth-thumb.jpg); }
.MICHAEL-SCHENKER-FEST-thumbnail:after { background-image: url(images/events/event-michael-schenker-fest-thumb.jpg); }
.MYKE-GRAY-thumbnail:after { background-image: url(images/events/event-myke-gray-thumb.jpg); }
.MIDLANDS-METAL-CRUSADE-2020-thumbnail:after { background-image: url(images/events/event-midlands-metal-crusade-2020-thumb.jpg); }
.CROSSFAITH-thumbnail:after { background-image: url(images/events/event-crossfaith-thumb.jpg); }
.ELYREAN-thumbnail:after { background-image: url(images/events/event-elyrean-thumb.jpg); }
.WASP-thumbnail:after { background-image: url(images/events/event-wasp-thumb.jpg); }
.THOSE-DAMN-CROWS-thumbnail:after { background-image: url(images/events/event-those-damn-crows-thumb.jpg); }
.WESTWORLD-WEEKEND-XVIII-thumbnail:after { background-image: url(images/events/event-westworld-weekend-xviii-thumb.jpg); }
.TERRORVISION-thumbnail:after { background-image: url(images/events/event-terrorvision-thumb.jpg); }
.CHRISTMAS-PARTY-thumbnail:after { background-image: url(images/events/event-christmas-party-thumb.jpg); }
.LA-GUNS-thumbnail:after { background-image: url(images/events/event-la-guns-thumb.jpg); }
.BULLETBOYS-thumbnail:after { background-image: url(images/events/event-bulletboys-thumb.jpg); }
.KRYSTHIA-thumbnail:after { background-image: url(images/events/event-krysthia-thumb.jpg); }
.HEAT-thumbnail:after { background-image: url(images/events/event-heat-thumb.jpg); }
.WHITECHAPEL-thumbnail:after { background-image: url(images/events/event-whitechapel-thumb.jpg); }
.BAD-TOUCH-thumbnail:after { background-image: url(images/events/event-bad-touch-thumb.jpg); }
.BROKEN-WITT-REBELS-thumbnail:after { background-image: url(images/events/event-broken-witt-rebels-thumb.jpg); }
.IN-FLAMES-thumbnail:after { background-image: url(images/events/event-in-flames-thumb.jpg); }
.THE-TREATMENT-thumbnail:after { background-image: url(images/events/event-the-treatment-thumb.jpg); }
.THE-STEVE-HILLAGE-BAND-thumbnail:after { background-image: url(images/events/event-the-steve-hillage-band-thumb.jpg); }
.SUFFER-thumbnail:after { background-image: url(images/events/event-suffer-thumb.jpg); }