/*
* Eric Meyer's Reset CSS v2.0 - http://cssreset.com 
*/
html,body,div,span,applet,object,iframe,blockquote,pre,h1,h2,h3,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,u,i,center,dl,dt,dd,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

html, body {
    background-color: #EBEBEB;
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
}

img {
    vertical-align: middle;
}

a {
    color: #428bca;
    text-decoration: none;
}

a:hover {
    color: #428bca;
    text-decoration: none;
}

table td tr {
    display: inline;
}


/**
* Navigation
*/

.navigation-bar {
    background: #1E232A;
    width: 100%;
    min-height: 75px;
}

.twickets-logo {
    float: left;
    margin-top: 20px;
    margin-right: 5px;
    margin-left: 20px;
}
.twickets-logo-text {
    float: left;
    margin-top: 25px;
}

.link {
    color: white;
    letter-spacing: 2px;
    font-family: "alternate-gothic-no-3-d";
    float: left;
    margin-top: 30px;
    margin-right: 25px;
    text-transform: uppercase;
    font-size: 18px;
    text-decoration: none;
}

.link:hover {
    color: grey;
}

    @media only screen and (max-width: 480px) {
        .link  {
            margin-right: 10px;
            font-size: 14px;
            margin-top: 33px;
        }
    }


/**
* Hero
*/

.header-faq {
    background: #1E232A;
    padding: 40px;
    text-align: center;
}
.header-faq h1 {
    font-family: "alternate-gothic-no-3-d";
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 80px;
    color: white;
}

    @media (max-width: 980px) {
        .header-faq h1 {
            font-size: 60px;
        }
    }
    @media (max-width: 500px) {
        .header-faq h1 {
            font-size: 35px;
        }
    }
    
.article-content h2 {
    font-family: "alternate-gothic-no-3-d";
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 22px;
    color: white;
}
.article-content ul > li{
    font-size: 25px;
    margin-bottom: 10px;
    font-family: "alternate-gothic-no-3-d";
    text-transform: uppercase;
}

.article-content ul > li > a{
    color: #5F208C;
}

.article-content ul > li > a:hover{
    color: #FF6666;
    transition: color 1s;
}


.hero-container-image {
    height: 450px;
    background-color:rgb(38, 38, 38);
    
}

    @media (max-width: 1400px) {
        .hero-container-image {
            height: 400px;
        }
    }
    @media (max-width: 980px) {
        .hero-container-image {
            height: 350px;
        }
    }
    @media (max-width: 700px) {
        .hero-container-image {
            height: 250px;
        }
    }
    @media (max-width: 400px) {
        .hero-container-image {
            height: 200px;
        }
    }   
.hero-content {
    min-width: 100%;
    min-height: 100%;
    width:100%;
    height: 100%;
    top: 75px;
    display: block;
    background-repeat:no-repeat;
    background-size: cover;
    background-position: 100%;
}
    
    @media only screen and (max-width: 1500px){
        .hero-content {
            background-position: 100%;
        }
    }
    @media only screen and (max-width: 1200px){
        .hero-content {
            background-position: 50%;
        }
    }
    @media only screen and (max-width: 1050px){
        .hero-content {
            background-position: 50%;
        }
    }
    
    /* Green Man Images */
    
    @media only screen and (min-width: 960px) { 
        .hero-content-image {
            background-image: url("../images/image_1920.png");
        }
    }
    @media only screen and (max-width: 960px) {
        .hero-content-image {
            background-image: url("../images/image_960.png");
        }
        .hero-content {
            background-position: 50%;
        }
    }
    @media only screen and (max-width: 480px) {
        .hero-content-image{
            background-image: url("../images/image_480.png");
        }
    }
/**
* Buttons
*/

.button{
    padding: 10px 11px 8px 14px;
    border: 2px solid #F9EC10;
    background-color: #F9EC10;
    border-radius: 100px;
    line-height: 100%;
    text-transform: uppercase;
    letter-spacing: 3px;
    display: inline-block;
    text-align: center;
    font-family: "alternate-gothic-no-3-d";
    color: #00000;
}
.button:hover {
    background-color: #000000;
    border: 2px solid #000000;
    color: white;
    text-decoration: none;
}

/**
* Tables
*/
.col-2-table td {
    padding: 20px;
    vertical-align: middle;
}

.col-2-table a{
    text-decoration: none;
    color: black;
}
.col-2-table a:hover{
    color: white;
}

.ticket-row {
    background: #555 ;
    color: white;
}

.event-name {
    font-size: 17px;
}

.col-spacer {
    margin-right: 40px;
}


/**
* Structure
*/

.main-section-container {
    background: white;
    padding: 0 20px 20px 20px;
    min-height: 100%;
}

.figure-container {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 20px 0 0 0;
}

.figure-container img {
    margin-left: 20px;
}


/**
* Article
*/

.article-container {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}
.article-container-faq {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}

.article-container-faq h2 {
    font-family: "alternate-gothic-no-3-d";
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 44px;
    color: black;
}

.article-header {
    color: black;
    text-decoration: underline;
    background: white;
    padding: 10px;
    text-align: center;
}
.article-header h1{
    font-family: "alternate-gothic-no-3-d";
    letter-spacing: 1px;
    text-transform: uppercase;
    font-size: 30px;
}

.article-content {
    background: white;
    color: black;
    padding: 60px 80px 60px 80px;
}
.article-content a:hover {
    text-decoration: none;
}

.article-content p{
    font-size: 16px;
    margin-bottom: 20px;
}

    @media (max-width: 1200px) {
        .article-container {
            width: 90%;
        }
        .article-content {
            background: white;
            color: black;
            padding: 40px 60px 40px 60px;
        }
    }
    @media (max-width: 1000px) {
        .article-container-faq {
            width: 70%;
        }
    }
    @media (max-width: 950px) {
        .article-container {
            width: 90%;
        }
        .article-header h1{
            font-size: 23px;
        }  
        
        .article-content p{
            font-size: 16px;
        }
    }
    @media (max-width: 860px) {
        .article-container-faq {
            width: 90%;
        }
    }
    @media (max-width: 600px) {
        .article-container {
            width: 97%;
        }  
        .article-container-faq {
            width: 97%;
        }
        .article-container-faq h2 {
            font-size: 30px;
        }
        .main-section-container {
            padding: 5px 0 0 0;
        }
        .article-header h1{
            font-size: 20px;
        }
        .article-content {
            padding: 20px;
        }
        .article-content p{
            font-size: 16px;
        }
    }

.band-logo {
    width: 400px;
    margin-top:30px;
}

    @media (max-width: 1400px) {
        .band-logo {
            width: 350px;
        }
    }
    @media (max-width: 980px) {
        .band-logo {
            width: 275px;
        }
    }
    @media (max-width: 700px) {
        .band-logo {
            width: 250px;
        }
    }
    @media (max-width: 400px) {
        .band-logo {
            width: 200px;
        }
    }
    

/**
* <<< Customise these based on event >>>
*/


/**
* Button
*/

.button{
    padding: 10px 11px 8px 14px;
    border: 2px solid #cb0863;
    background-color: #cb0863;
    border-radius: 100px;
    line-height: 100%;
    text-transform: uppercase;
    letter-spacing: 3px;
    display: inline-block;
    text-align: center;
    font-family: "alternate-gothic-no-3-d";
    color: white;
}

.button:hover {
    background-color: white;
    border: 2px solid white;
    color: white;
    text-decoration: none;
}


/**
* Buy/Sell Links / Linkloader
*/
.col-2-table td {
    padding: 20px;
    vertical-align: middle;
}

.col-2-table a{
    text-decoration: none;
    color: white;
}
.col-2-table a:hover{
    color: #cb0863;
}

.col-2-table a:visited {
    color: white;
}

.col-2-table a:visited:hover {
    color: #cb0863;
}

.ticket-row {
    background: black;
    color: white;
}

.twickets-link-loader a
{
    text-decoration: none;
    color: white;
}
.twickets-link-loader a:hover
{
    color: white;
}
.twickets-link-loader tr
{
    border-bottom: 2px white solid;
}
.twickets-link-loader span
{
    font-size: 17px;
}
.twickets-link-loader td
{
    background: black;
    color: white;
    padding: 20px;
    vertical-align: middle;
}
.twickets-link-loader a
{
    padding: 10px 11px 8px 14px;
    border: 2px solid #cb0863;
    background-color: #cb0863;
    border-radius: 100px;
    line-height: 100%;
    text-transform: uppercase;
    letter-spacing: 3px;
    display: inline-block;
    text-align: center;
    font-family: "alternate-gothic-no-3-d";
    color: white;
}
.twickets-link-loader a:hover
{
    background-color: white;
    border: 2px solid white;
    color: #cb0863;
    text-decoration: none;
}

.twickets-link-loader a:visited {
    color:black;
    
}

.twickets-link-loader a:visited:hover {
    color: #cb0863;

}
/*
* Structure
*/

.main-section-container {
    background: black;
    padding: 0 20px 20px 20px;
    min-height: 100%;
}


/*
* Article section
*/

.article-header {
    color: white;
    background: black;
    padding: 10px;
    text-align: center;

}


.article-header h1{
    /*font-family: "Optima";*/
}

.article-content {
    background: black;
    color: white;
}

.article-content h2 {
    /*font-family: "Optima";
    font-weight:bold;*/
}
/*
* Images
*/
    

p a {
    color: #cb0863;
    text-decoration: none;
}

p a:hover {
    color: #b8075a;
    text-decoration: none;
}


/*
* Fonts
*/

@font-face {
	font-family: 'alternate-gothic-no-3-d';
	src:url('../fonts/AlternateGotNo3DOT.otf');
	font-weight: normal;
	font-style: normal;
}