body{
font-family: 'PT Sans', sans-serif;
height:100%;
width:100%;
}

p {
text-align:center;
}

h1, h2, h3{
text-align:center;
}

a:link { color: #0099FF; text-decoration:none;}
a:visited { color: #0099FF;  text-decoration:none;}
a:hover { color: #FF00FF;  text-decoration:none;}

#exhibition_button a, #events_button a, #timeswitch_div a { color: #FFFFFF; text-decoration:none;}


#header{
	position:absolute; 
	top:0px; 
	left:0px; 
	height:100px; 
	right:0px;
	overflow:hidden;
border-bottom:1px solid #CCCCCC;
}

#content{
	position:absolute; 
	top:100px; 
	bottom:0px; 
	left:0px; 
	right:0px; 
	overflow:auto;
	padding-bottom:50px;
}
.bg1{
background-image: url("/images/bg1.jpg");
background-size: 100%;
background-repeat: no-repeat;
color:#FFFFFF;
}
.bg2{
background-image: url("/images/bg2.jpg");
background-size: 100%;
background-repeat: no-repeat;
color:#FFFFFF;
}
.bg3{
background-image: url("/images/bg3.jpg");
background-size: 100%;
background-repeat: no-repeat;
color:#FFFFFF;
}
.bg4{
background-image: url("/images/bg4.jpg");
background-size: 100%;
background-repeat: no-repeat;
color:#FFFFFF;
}
.bg1 h1, .bg2 h1, .bg3 h1, .bg4 h1{
color:#FFFFFF;
}
.content_inner{
width: 1000px ;
margin-left: auto ;
margin-right: auto ;
}
.content_inner_3split1{
width:303px;
padding:10px;
float:left;
margin:10px 10px 0px 0px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color:#0099FF;
color:#FFF;
}
.content_inner_3split2{
width:303px;
padding:10px;
float:left;
margin:10px 10px 0px 0px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color:#FF00FF;
color:#FFF;
}
.content_inner_3split3{
width:303px;
padding:10px;
float:left;
margin:10px 0px 0px 0px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color:#222222;
color:#FFF;
}

#footer{
	position:absolute; 
	bottom:0px; 
	height:60px; 
	left:0px; 
	right:0px; 
	overflow:hidden;
	background-color:#CCCCCC;
	text-align:center;
	line-height:60px;
	color:#FFFFFF;
	font-size:10px;
	padding-top:0px;
}

#frontpage_content_box { 
	position: relative; 
	width: 100%; 
	margin: 50px auto; 
	padding: 0px;
	text-align:center;
}

.contact_text{ 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    border: 1px solid #DDDDDD; 
    outline:0; 
    height:35px; 
    width: 475px;
	padding:5px;
}
.contact_message{ 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    border: 1px solid #DDDDDD; 
    outline:0; 
    height:200px;
    width: 475px;
}


#menu{
width:100%;
}
#logo{
width:300px;
padding:20px 0px 0px 0px;
float:left;
}
#navcontainer{
padding:40px 10px 0px 0px;
}
.nav ul {
  list-style: none;
  background-color: #FFFFFF;
  text-align: center;
  padding: 0;
  margin: 0;
}
.nav li {
  font-family: 'Fjalla One', sans-serif;
  line-height: 40px;
  height: 40px;
}
 
.nav a {
  text-decoration: none;
  color: #0099FF;
  display: block;
  transition: background-color 0.2s ease;
}
 
.nav a:hover {
  color: #FF00FF;
}
 
.nav a.active {
  color: #FF00FF;
  cursor: default;
}
 
@media screen and (min-width: 600px) {
  .nav li {
    padding: 0px 0px 0px 20px;
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    font-size: 14px;
	font-weight: bold;
  }
 
  /* Option 1 - Display Inline */
  .nav li {
    display: inline-block;
    margin-right: -4px;
  }
 

}

/* FRONT PAGE STYLES */

#info_div{
display:none;
}

img.bg {
	
	/* Set rules to fill background */
	min-height: 100%;
	min-width: 1024px;
			
	/* Set up proportionate scaling */
	width: 100%;
	height: auto;
			
	/* Set up positioning */
	position: fixed;
	top: 0;
	left: 0;

}
		
@media screen and (max-width: 1024px){
	img.bg {
		left: 50%;
		margin-left: -512px; 
		}
}

.button1{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	padding: 10px 15px;
    color: #FFF;
	font-family: 'Fjalla One', sans-serif;
	transition: background-color 0.1s ease;
	background-color:#FF0033;
}
.button2{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	padding: 10px 15px;
    color: #FFF;
	font-family: 'Fjalla One', sans-serif;
	transition: background-color 0.1s ease;
	background-color:#333333;
}
#midbutton{
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -50px;
    margin-left: -50px;
}​

a.button1:hover, a.button2:hover{
background-color:#0099FF;
}


/* LIST PAGE STYLES */

#container{

}

.fuse_project_link_span{ 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  /* edit: added z-index */
  z-index: 1;

  /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif */
  background-image: url('empty.gif');
}

.fuse_project_box{
float:left;
width: 33%;
height: 280px;
text-align: center;
vertical-align: middle;
line-height: 280px;
color: #FFFFFF;
font-family: 'Fjalla One', sans-serif;
font-size: 16px;
}


.mask_height {
    position:relative;
    height:280px;
    width:333px;
    overflow:hidden;
    float:left;
    margin:0px;
}
.mask_width {
    position:relative;
    height:280px;
    width:333px;
    overflow:hidden;
    float:left;
    margin:0px;
}
.mask_height img {
    position:absolute;
    height:280px;
    top:50%;
    left:50%;
    margin-top:-140px; /* half the height */
    margin-left:-167px; /*half the width */
}
.mask_width img {
    position:absolute;
    width:333px;
    top:50%;
    left:50%;
    margin-top:-140px; /* half the height */
    margin-left:-167px; /*half the width */
}

.caption {  
    position: absolute;  
    text-align:center;
    line-height:280px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
	font-family: 'Fjalla One', sans-serif;
	font-size: 16px;
    opacity: 1;
    -webkit-transition: all 300ms ease-out;  
    -moz-transition: all 300ms ease-out;  
    -o-transition: all 300ms ease-out;  
    -ms-transition: all 300ms ease-out;  
    transition: all 300ms ease-out;   
}  

.mask_height:hover .caption {  
    opacity: 0;  
}  
.mask_width:hover .caption {  
    opacity: 0;  
}  




.fuse_cycle_0{
background-color: #0099FF;
color: #FFFFFF;
}
.fuse_cycle_1{
background-color: #FF00FF;
color: #FFFFFF;
}
.fuse_cycle_2{
background-color: #FFFF00;
color: #0099FF;
}
.fuse_cycle_3{
background-color: #222222;
color: #FFFFFF;
}
.fuse_past_cycle_0{
background-color: #BBBBBB;
color: #FFFFFF;
}
.fuse_past_cycle_1{
background-color: #AAAAAA;
color: #FFFFFF;
}
.fuse_past_cycle_2{
background-color: #999999;
color: #FFFFFF;
}
.fuse_past_cycle_3{
background-color: #888888;
color: #FFFFFF;
}

.event_title{
color:#111111;
text-transform: uppercase;
}
.about_title{
color:#FFFFFF;
text-transform: uppercase;
}
.statement_title{
color:#333333;
text-transform: uppercase;
}
.event_infoline{
color:#333333;
text-transform: uppercase;
font-weight:bold;
}
.event_text{
color:#333333;
}
.nowtag{
color:#888888;
}
.comingtag{
color:#EEEEEE;
}

.grid_space {
height:20px;
clear:both;
}
.stat_div{
height:20px;
clear:both;
text-align:center;
}
#timeswitch_div{
height:20px;
text-align:center;
}

.timeswitch_unselected{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	padding: 10px 15px;
    color: #FFF;
	font-family: 'Fjalla One', sans-serif;
	transition: background-color 0.1s ease;
	background-color:#CCCCCC;
}
.timeswitch_selected{
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
	padding: 10px 15px;
    color: #FFF;
	font-family: 'Fjalla One', sans-serif;
	transition: background-color 0.1s ease;
	background-color:#0099FF;
}

#cvwrapper {
  background-color: green; /* for visualization purposes */
  text-align: center;
}
#cvcntr {
  background-color: red; /* for visualization purposes */
  display: inline-block;
}