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,font,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{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

body {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 133%;
}

#container {
/*  width: 1024px; */
}

.left {
  float: left;
}

.right {
  float: right;
}

.clear {
  clear: both;
}

#video {
  width: 1024px;
  height: 575px;
  position: absolute;
  top: 0;
  left: 0;
}
#video a {
  display: block;
  margin: 300px 0 0 30px;
}
#play_button {
  position: absolute;
  top: 64px;
  left: 872px;
}

#head, #background, #teaser, #content, #foot {
  width: 960px;  
}

#main_content_wide {
  clear: both;
  width: 960px;
}

#vertical_space {
  height: 20px;
  clear: both;
}

#head, #content {
  margin-left: 32px;
}

#head {
  position: absolute;
  top: 0px;
  left: 0px;
  border-top: 10px solid #FF3300;
}
#head.hidden {
  border: 0;
  margin-top: 10px;
}

#background {
  height: 96px;
  background: white;
  opacity: 0.6;
  filter: alpha(opacity=60);
  position: absolute;
  top: 0;
  left: 0;
}

#logo {
  position: absolute;
  top: 0;
  left: 0;

}

#navi {
  position: absolute;
  top: 6px;
  left: 500px;
  z-index: 1000;
}

#navi a {
  color: #FF3300;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 16px;
  line-height: 133%;
  font-family: 'DIN Next W02 Medium', Arial, Helvetica, sans-serif;
}
#navi a:hover,
#navi a.active {
  color: #330099;
}

#navi div {
  width: 96px;
  float: left;
}

#navi #group1 {
  width: 115px;
}
#navi #group2 {
  width: 115px;
}
#navi #group3 {
  width: 115px;
}
#navi #group4 {
  width: 110px;
}

#title {
  position: absolute;
  top: 430px;
  left: -4px;
  font-size: 75px;
  color: white;
  font-family: Arial, Helvetica, sans-serif;
  line-height: 100%;
  text-transform: uppercase;
}

#teaser {
  position: absolute;
  top: 520px;
  left: 0px;
  font-family: 'DIN Next W02 Medium', Arial, Helvetica, sans-serif;
  
  box-shadow:          2px 2px 7px rgba(0, 0, 0, 0.45),
                      -2px 2px 7px rgba(0, 0, 0, 0.45);
  -webkit-box-shadow:  2px 2px 7px rgba(0, 0, 0, 0.45),
                      -2px 2px 7px rgba(0, 0, 0, 0.45);		
  -moz-box-shadow:     2px 2px 7px rgba(0, 0, 0, 0.45),
                      -2px 2px 7px rgba(0, 0, 0, 0.45);	
}

#teaser div {
  width: 240px;
  height: 96px;
  float: left;
  cursor: pointer;
  background: #FF3300;
}

#teaser h1 {
  margin: -86px 0 0 10px;
  font-size: 20px; 
  color: White;
  line-height: 20px;
  z-index: 60;
  text-transform: uppercase;
}

#teaser div.active_border {
  width: 240px;
  height: 10px;
  background: #FF3300;
  margin-top: 56px; /* -30 would be a top border */
  display: none;
  position: absolute;
  z-index: 80;
}
#teaser div:hover div.active_border,
#teaser div.active div.active_border {
  display: block;
  z-index: 100;
}

#teaser div.active img {
  visibility: hidden;
}

#teaser img {
  z-index: 50;
}

#content {
  position: absolute;
  left: 0;
  top: 630px;
}

#main_content div,
#foot div {
  float: left;
  width: 480px;
}

#content p,
#content h1,
#content h2,
#content h3,
#content h4,
#content li,
#content div,
#content td {
  color: #696969;
}

#content h1,
#content h2,
#content h3,
#content h4 {
  padding: 30px 20px 0 0;
  margin-bottom: -10px;
}

#content h1 { font-size: 20px; }
#content h2 { font-size: 18px; }
#content h3 { font-size: 16px; }
#content h4 { font-size: 16px; }

#content a {
  color: #696969;
}

#content a:hover h1 {
  color: #FF3300;
  text-decoration: underline;
}


#content p,
#content ul {
  padding: 25px 20px 0 0;
}

p.small, p span.small {
  font-size: 12px;
}

#content div.highlight {
  float: none;
  padding: 15px 25px;
  margin-top: 30px;
  width: 410px;
  background: #EEEEEE;
  box-shadow:          1px 1px 7px rgba(0, 0, 0, 0.25),
                      -1px 1px 7px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow:  1px 1px 7px rgba(0, 0, 0, 0.25),
                      -1px 1px 7px rgba(0, 0, 0, 0.25);		
  -moz-box-shadow:     1px 1px 7px rgba(0, 0, 0, 0.25),
                      -1px 1px 7px rgba(0, 0, 0, 0.25);	

}

/*.right div.highlight {
  margin-left: 20px;
}*/

#content div.highlight table {
  margin-top: 10px;
}

#content table.times td {
  padding-right: 20px;
}

#content div.highlight,
#content div.highlight table td,
#content div.highlight a {
  /*color: #00FF99;*/
  color: #696969;
  text-transform: uppercase;
  text-decoration: none;
}

#content div.highlight a:hover {
  text-decoration: underline;
}

li {
  list-style: square;
  list-style-position: inside;
}

#content p a {
  color: #FF3300;
  text-decoration: none;
  font-weight: bold;
}
#content p a:hover { text-decoration: underline; }

#foot_gradient {
  clear: both;
  height: 80px;
  background: url(/images/footer_gradient.png);
}

#foot {
  border-top: 10px solid #FF3300;
}

#foot div {
  width: 480px;
}

#foot div p {
  color: #CBCBCB;
  padding: 4px 20px 5px 20px;
  font-size: 14px;
}


#content_wide {
  width: 4000px;
}

#main_content .left img.person {
  width: 200px;
  padding: 30px 20px 20px 0;
  display: block;
  float: left;
}


/* events lists, people list */
#main_content_wide #abstract {
  width: 100%;
  margin-bottom: 30px;
}

#main_content_wide .people_list .person,
#main_content_wide .event_list .event {
  display: block;
  padding: 20px 20px;
  margin: 0 0 20px 0;
  border: 2px solid #eee;
}

#main_content_wide .event_list .event.one_col {
  float: left;
  clear: both;
  width: 916px;
}
#main_content_wide .people_list .person,
#main_content_wide .event_list .workshop {
  width: 426px;
}

#main_content_wide .people_list .person:hover,
#main_content_wide .event_list .event:hover {
  background-color: #eee;
}

#main_content_wide .people_list a.title,
#main_content_wide .people_list a h1,
#main_content_wide .event_list a.title,
#main_content_wide .event_list a h1 {
  text-decoration: none;
}

#main_content_wide .people_list a.title:hover h1,
#main_content_wide .people_list a.title:hover span,
#main_content_wide .event_list a.title:hover h1,
#main_content_wide .event_list a.title:hover span {
  color: #696969;
/*  text-decoration: underline;*/
}

#main_content_wide .people_list .person .image,
#main_content_wide .event_list .event .image {
  float: left;
  margin-right: 20px;
  margin-bottom: 10px;  
}

#main_content_wide .event_list .event.workshop .image {
  width: 200px;
  float: left;
}

#main_content_wide .event_list .event.one_col .description {
  padding-left: 340px;
}
#main_content_wide .event_list .event.workshop .description {
  width: 200px;
  display: inline;
}
#main_content_wide .people_list .person .description {
  padding-left: 180px;
}

#main_content_wide .people_list .person .abstract p,
#main_content_wide .event_list .event .abstract p {
  padding: 0 0 10px 0;
}

#main_content_wide .people_list .description .title,
#main_content_wide .event_list .description .title {
  width: 100%;
  float: left;
}
#main_content_wide .people_list .person h1,
#main_content_wide .event_list .event h1 {
  padding: 0px;
  margin-bottom: 10px;
  width: 100%;
  float: left;
}
#main_content_wide .event_list .workshop h1,
#main_content_wide .event_list .workshop h2 {
  float: none;
}
#main_content_wide .event_list .workshop .title {
  float: none;
}


#main_content_wide .people_list .person h2,
#main_content_wide .event_list .event h2 {
  display: inline;
  font-size: 100%;
  line-height: 30px;
  margin: 0;
  padding: 0;
}


#content div.ui-state-highlight,
#content div.ui-state-error {
  padding: 12px;
  margin: 10px 0;
  line-height: 133%;
}
#content div.ui-state-highlight {
  background-color: #32CD32;
}
#content div.ui-state-error {
  background-color: #FF3300;
}


#content div.ui-state-highlight,
#content div.ui-state-error,
#content div.ui-state-highlight h2,
#content div.ui-state-error h2,
#content div.ui-state-highlight p,
#content div.ui-state-error p,
#content div.ui-state-highlight li,
#content div.ui-state-error li {
  color: White;
}


#get_ticket_button {
  position: absolute;
  top: 395px;
  left: 265px;
  width: 123px;
  height: 150px;
  z-index: 5000;
	background-image: url(../images/getticket00.png);
}
#get_ticket_button:hover {
	background-position: 123px 0;
}


/* order summary (copy from ticket.css) */
table.summary th {
  font-weight: bold;
  text-align: left;
}

table.summary td.pass_name {
  padding-right: 40px
}

table.summary td.euro {
  text-align: right;
  padding-left: 40px;
}

table.summary td.sum {
  font-weight: bold;
}
/* /order summary */



/* login / signup */

input {
  width: 200px;
  border: none;
  margin: 2px 0 12px 0;
  padding: 4px 4px;
  background-color: #ccc;
  font-size: 16px;
  line-height: 133%;
  font-family: 'DIN Next W02 Medium', Arial, Helvetica, sans-serif;
  color: #6b6b6b;	
}
label {
  font-size: 16px;
  color: #6b6b6b;	
}
.button,
.button-to input {
  width: auto;
  padding: 2px 8px;  
}

/* input fields */
.ff_s { width: 200px; }
.ff_m { width: 400px; }
.ff_l { width: 600px; }


.error_state {
  background: #ff3300;
  color: White;
}



/***** archived banner *****/
/* all top-level elements get overriden here, so there's
 * space for the banner. */
#archived_banner {
  display: block;
  position: absolute;
  top: 0px;
  left: 0px;
  margin: 0px auto;
  width: 100%;
  text-align: center;
}

#archived_banner a {
  width: 868px;
  height: 190px;
}

#head, #content, #video {
  margin-top: 190px;
}


/* =THEME OVERWRITE ---- MUST APPEND TO ALL OTHER THEME STYLES ----
--------------------------------------------------------------------------------*/
.right, a.right { float: right; }
.left, a.left { float: left; }
.t_right { text-align: right; }
.t_left { text-align: left; }
.t_center { text-align: center; }
.noborder { border-style: none; }
.hidden { display: none; }

.m-top-5  { margin-top: 5px; }
.m-top-10 { margin-top: 10px; }
.m-top-15 { margin-top: 15px; }
.m-top-30 { margin-top: 30px; }
.m-top-60 { margin-top: 60px; }
.m-bottom-5  { margin-bottom: 5px; }
.m-bottom-10 { margin-bottom: 10px; }
.m-bottom-15 { margin-bottom: 15px; }
.m-bottom-30 { margin-bottom: 30px; }
.m-bottom-60 { margin-bottom: 60px; }
.m-left-5 { margin-left: 5px; }
.m-left-10 { margin-left: 10px; }
.m-left-15 { margin-left: 15px; }
.m-left-30 { margin-left: 30px; }
.m-left-60 { margin-left: 60px; }
.m-right-5 { margin-right: 5px; }
.m-right-10 { margin-right: 10px; }
.m-right-15 { margin-right: 15px; }
.m-right-30 { margin-right: 30px; }
.m-right-60 { margin-right: 60px; }
.m-all-5  { margin: 5px; }
.m-all-10 { margin: 10px; }
.m-all-15 { margin: 15px; }
.m-all-30 { margin: 30px; }
.m-all-60 { margin: 60px; }

.p-all-5  { padding: 5px; }
.p-all-10 { padding: 10px; }
.p-all-15 { padding: 15px; }
.p-left-5  { padding-left: 5px; }
.p-left-10 { padding-left: 10px; }
.p-left-15 { padding-left: 15px; }
.p-right-5  { padding-right: 5px; }
.p-right-10 { padding-right: 10px; }
.p-right-15 { padding-right: 15px; }
.p-top-5  { padding-top: 5px; }
.p-top-10 { padding-top: 10px; }
.p-top-15 { padding-top: 15px; }
.p-bottom-5  { padding-bottom: 5px; }
.p-bottom-10 { padding-bottom: 10px; }
.p-bottom-15 { padding-bottom: 15px; }
