/*
strppd.css by Iain MacDonald(http://iainspad.com/strppd-css/)

Based on the Meyer Reset by MeyerWeb (http://meyerweb.com/eric/tools/css/reset/)
This is a modified version with additional resetting such as setting certain elements to certain properties, as they should.
This also carries some resets for HTML5 elements i.e. the ':required' pseudo-selector, as well as resetting for mobile browsers.
Also included is some typographical styling, just to set them to their respective type styles.
Finally, there's also form and interactive element styling so forms and navigation elements look clickable.

Be sure to contribute any improvements and changes to this reset as you see fit. Have fun!

v. 1.0
License: Public Domain

*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, 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 {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font-weight: inherit;
    font-style: inherit;
    font-family: inherit;
    vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {display: block;}

/*---Universal Selector to add additional resets, such as text-size adjust and tap highlighting---*/

* {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
}

a {text-decoration: none;}

body {line-height: 1; background-color:#000;}

ol, ul {list-style-type: none;}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

caption, th, td {
    text-align: left;
    font-weight: normal;
}

/*---Removes Webkit form styling on Mobiles---*/

input, textarea {
    -webkit-appearance: none;
    -moz-appearance: none; 
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}

/*---Additional Form resets---*/

button, input[type="button"] {background: none;}

:required {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    -ms-box-shadow: none;
    box-shadow: none;
}

/*---Typographic Styling---*/

em, i {font-style: italic;}
strong, b {font-weight: bold;}
u {text-decoration: underline;}

blockquote, q {quotes: "" "";}
blockquote:before, blockquote:after, q:before,  q:after, {content: "";}

/*---Interactive Element Settings---*/

a, input[type="submit"], input[type="button"], button, label[for] {cursor: pointer;}

/*---Misc. Element Styling---*/

img {-ms-interpolation-mode: bicubic;}

/* End strppd.css */


/* Proper box model */
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
a { color:#FFF; }
a:hover{ color:#ef008b; }
a:active{ color:#ef008b; }
a:visited{ color:#FFF; }

b, strong{ font-weight:bold; }
body {  height:100%; font-size:15px; font-family: 'Open Sans', sans-serif;}
button{ cursor: pointer; }
caption, th, td{ vertical-align: middle; }
h1{  }
h2{ font-size:41px; font-weight:700; padding-bottom:30px; line-height:50px;}
h3 { color: #9C9C9C; font-size: 25px; font-weight: 400; line-height: 40px; padding-bottom: 35px;}
h4{ color: #FFF; font-size: 25px; font-weight: 700; line-height: 40px; padding-bottom: 15px; }
h5 { color:#FFF; padding-bottom:10px; line-height: 20px;}
p { color:#9C9C9C; line-height:22px; padding-bottom:40px; text-align:justify;}
table{ border: 0; border-spacing:0; empty-cells:show; }
textarea{ resize: none; }

/* Custom styles */
aside, div, dl, fieldset, footer, form, header, iframe, nav, ul, ol, section, table{ clear: both; float: left; width: 100%; }

.wrap{
    float: none;
    margin: 0 auto;
    position: relative;
    width: 90%; 
	max-width:1200px;
}
header {
	position:relative;
}

/* LOGO */
#logo {
	background:transparent url(../img/background-transparent.png) 0 0 repeat;
	position:absolute;
	top:135px;
	left:0;
	height:235px;
	width:290px;
	z-index:20;
}
#logo img {
	float:right;
	padding:18px 15px 0 0;
}

/* NAVIGATION */
nav {
	background:transparent url(../img/background-transparent.png) 0 0 repeat;
	margin-top:15px;
}
nav select {
  display: none;
  width:90%;
  margin-left:5%;
}
nav ul { text-align:center; }

nav ul  li {
	display:inline-block;
	/*float:left; */
	font-size:20px;
	padding:30px 75px 25px 0;
}
nav ul  li a {

	font-weight:bold;
}
nav ul  li a:active , nav ul  li a:visited {
	color:#FFF;
}
nav ul  li a:hover {
	border-bottom:2px solid #ef008b;
	color:#ef008b;
	}
select {
    padding:3px;
    margin: 0;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    border-radius:4px;
    -webkit-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    -moz-box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    box-shadow: 0 3px 0 #ccc, 0 -1px #fff inset;
    background: #f8f8f8;
    color:#888;
    border:none;
    outline:none;
    display: inline-block;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    cursor:pointer;
}

#bottom_bar {
background:transparent url(../img/content-bg.png) 0 0 repeat;
	position:absolute;
	top:60%;
	z-index:5;
}
#bottom_bar #line {
	background:transparent url(../img/background-transparent-white.png) 0 0 repeat;
	position:absolute;
	top:-70px;
	
	font-size:35px;
	font-weight:bold;
	text-align:right;
}
#bottom_bar a.ticketbuy {
    background: url("../img/arrow-buy-tickets.png") no-repeat scroll right 14px transparent;
    color: #383838;
    display: inline-block;
    font-weight: 800;
    padding: 20px 60px 15px 0;
}

/* CONTENT */
#content {
    color: #FFFFFF;
    padding: 50px 0 50px 10%;
    text-align: center;
    width: 90%;
}
#content section article {
    float: left;
    margin-right: 5%;
    width: 30%;

}
#content section article:last-child {
	margin-right:0;
}
#content section article img {
	width:100%;
	padding-bottom:15px;
}
#content section article p {
	text-align:justify;
		line-height:20px;
		padding-bottom:15px;
}
section article h4 { 
    line-height: 30px;
    
    padding-bottom: 5px;
}
.buyTicketsDetails li {
	position:relative;
	border-bottom:1px solid;
	padding: 15px 0;
}
.buyTicketsDetails, .buyTicketsDetails p {
	text-align:left;
	padding:0;
}
.buyTicketsDetails .buyaticket, .buyTicketsDetails .ticketsoon {
    position: absolute;
    top: 30px;
    right: 0;
}

.buyTicketsDetails .DateLocation { color: #FFF; }
.buyTicketsDetails h3 {
    padding: 0;
}

/* BUTTONS */

/* .center { 
    display: block;
    margin: 0 auto;
    width: 260px;
} */
a.buyaticket{
	background:#eb0090;
	background-image: -moz-linear-gradient(top,#eb0090,#c30072);
	background-image: -webkit-gradient(linear,left top, left bottom,	from(#eb0090),	to(#c30072)	);
	font-size:24px;
	color: #fff;
	padding:5px 10px 6px 10px;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius:5px;
	cursor: pointer;
}
a.ticketsoon {
	background:#d0d0d0;
	background-image: -moz-linear-gradient(top,#d0d0d0,#c4c4c4);
	background-image: -webkit-gradient(linear,left top, left bottom,	from(#d0d0d0),	to(#c4c4c4)	);
		font-size:24px;
	color: #eee;
	padding:5px 10px 6px 10px;	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius:5px;
	cursor: default;
}

a.buyaticket:hover{background:#c30072;}

/* FAQ */

#faqs {
    line-height: 20px;
    text-align: justify;
}
#faqs dt, #faqs dd { padding: 0 0 0 50px }
#faqs dt { font-size:1.5em; color: #9d9d9d; cursor: pointer; height: 37px; line-height: 37px; margin: 0 0 15px 25px}
#faqs dd { font-size: 1em; margin: 0 0 20px 25px}
#faqs dt { background: url(../img/expand-icon.png) no-repeat left}
#faqs .expanded { background: url(../img/expand-icon.png) no-repeat left}


/* FOOTER */
footer { border: 1px solid #222; font-weight: 700; font-size:12px;}
footer ul { padding: 15px 0; text-align: center; }
footer ul #notice { font-weight:400; }
footer ul li { display:inline-block; padding: 0 10px;}
footer ul li  { color: #9C9C9C; }
footer ul li a { color: #FFF; }


/* ================================================================== */
/* === Responsive styles ============================================ */
/* ================================================================== */

/* Smartphones */
@media only screen and (max-width: 469px) {
	#bottom_bar #line { display:none; }	/*#bottom_bar #line { font-size:15px; } 	#bottom_bar a.ticketbuy { background-position: right 2px;} */
	#content { width:96%; padding: 30px 2%;}
	h2 { font-size:25px; line-height:30px; padding-bottom:15px; }
	h3 { font-size:16px; line-height:25px; padding-bottom:25px;}
	#logo { height: 155px; float:none; width: 100%; top:0; position:relative; }
	#logo img { width:165px; display:block; margin: 0 auto; float:none;}
	nav ul li { padding:10px 15px; display:inline-block; }
	nav { padding:10px; }
	nav ul     { display: none; }
	nav select { display: inline-block; }
	#content section article { float:none; width:100%; }
  	section article h4 { font-size: 25px; padding-bottom:5px; min-height: 50px;}
	#faqs dt { font-size:1em; text-align:left; line-height:20px; min-height:45px;}
.buyTicketsDetails .buyaticket, .buyTicketsDetails .ticketsoon {
    position: unset;
    display: block;
    margin-top: 10px;
}
}

/* Large smartphones */
@media only screen and (min-width: 470px) and (max-width: 699px) {
	#bottom_bar #line { font-size:25px; } 	
	#bottom_bar a.ticketbuy { background-position: right 6px;}
	#content { width:96%; padding: 0 2%; padding:50px 0;}
	h2 { font-size:25px; line-height:30px; padding-bottom:15px; }
	h3 { font-size:16px; line-height:25px; padding-bottom:25px;}
	nav ul li { padding:10px 15px; display:inline-block; }
	nav { padding-left:0; }
	section article h4 { font-size: 17px; line-height: 22px; padding-bottom: 5px; }
}


/* Tablets and landscape large smartphones */
@media only screen and (min-width: 700px) and (max-width: 1000px) {
	nav { padding-left:0; }
	nav ul li { padding:10px 20px; }
	section article h4 {
		font-size: 17px;
		line-height: 22px;
		padding-bottom: 5px;
	}
}