body{
	background:white;
}
#CE{
		font-family:Avenir Next;
		position:absolute;
		top:400px;
		font-size:2em;
		left:80px;
}

.hairline{
		position:absolute;
		top:480px;
		width:500px;
		left:0px;
	}
#tickets{
		font-family:Avenir Next;
		position:absolute;
		top:470px;
		font-size:1.5em;
		left:75px;
		color:grey;
}

#tsales{
		font-family:Avenir Next;
		position:absolute;
		top:520px;
		font-size:.8em;
}

.hairline2{
		position:absolute;
		top:590px;
		width:500px;
		left:0px;
}

#famlogo{
position:absolute;
left:175px;
top:0px;
width:75px;
height:75px;


}
#fam4{
	position:absolute;
	top:155px;
	left:10px;
}

#text{
	font-family:Avenir Next;
}
/*-----1---------*/
#Exhibition1{
	color:grey;
	font-size:.8em;
	position:relative;
	top:820px;
	left:20px;

}
#artist1{
font-size:1.5em;
position:absolute;
top:630px;
font-weight:500px;
left:20px;

}

#title1{
font-size:1em;
position:absolute;
top:670px;
font-weight:500px;
left:20px;

}
#time1{
color:grey;
	font-size:.8em;
	position:absolute;
	top:700px;
	left:20px;

}

#ex1{
	position:absolute;
	top:625px;
	left:300px;
	width:100px;
	height:100px;

}

/*-------2-------*/
#ex2{
	position:absolute;
	top:790px;
	left:300px;
	width:100px;
	height:100px;
}

#Exhibition2{
	color:grey;
	font-size:.8em;
	position:absolute;
	top:760px;
	left:20px;

}
#artist2{
font-size:1.2em;
position:absolute;
top:780px;
font-weight:500px;
left:20px;
right:200px;

}

#title2{
font-size:1em;
position:absolute;
top:860px;
font-weight:500px;
left:20px;


}
#time2{
color:grey;
	font-size:.8em;
	position:absolute;
	top:890px;
	left:20px;

}
/*-------3--------*/
#ex3{
position:absolute;
	top:960px;
	left:300px;
	width:100px;
	height:80px;

}
#Exhibition3{
	color:grey;
	font-size:.8em;
	position:absolute;
	top:940px;
	left:20px;
}
#artist3{
font-size:1.3em;
position:absolute;
top:950px;
font-weight:500px;
left:20px;
right:200px;

}

#title3{
font-size:1em;
position:absolute;
top:980px;
font-weight:500px;
left:20px;
right:200px;


}
#time3{
color:grey;
	font-size:.8em;
	position:absolute;
	top:1030px;
	left:20px;

}
/*-------4---------*/
#ex4{
	position:absolute;
	top:1100px;
	left:300px;
	width:100px;
	height:100px;
}

#Exhibition4{
	color:grey;
	font-size:.8em;
	position:absolute;
	top:1080px;
	left:20px;

}
#artist4{
font-size:1.3em;
position:absolute;
top:1100px;
font-weight:500px;
left:20px;
right:200px;

}

#title4{
font-size:1em;
position:absolute;
top:1130px;
font-weight:500px;
left:20px;
right:200px;


}
#time4{
color:grey;
	font-size:.8em;
	position:absolute;
	top:1160px;
	left:20px;

}

a:link{
	text-decoration:none;
	
}

a:hover{
	text-decoration:none;
	color:black;
}

a:visited{
text-decoration:none;
color:black;

}
ul{
	list-style-type:none;
	padding-top:20px;
	padding bottom:20px;
	position:relative;
	top:70px;

}

li{
	display:inline-block;
	width:100px;
	font-family:Avenir Next;
	font-size:1.5em;


}











/*query*/
@media screen and (min-width:550px){

body{
	background:#ccc;
}


#CE{
		font-family:Avenir Next;
		position:relative;
		top:700px;
		font-size:2em;
		left:40%

}

.hairline{
		position:relative;
		top:700px;
		width:100%;
		left:0px;
	}
#tickets{
		font-family:Avenir Next;
		position:relative;
		top:710px;
		font-size:1.8em;
		left:40%;
		right:20%;
		color:grey;
}

#tsales{
		font-family:Avenir Next;
		position:relative;
		top:710px;
		font-size:1em;
		left:20%;
		right:20%;
}

.hairline2{
		position:relative;
		top:730px;
		width:100%;
		left:0px;
}

#famlogo{
position:relative;
left:45%;
right:45%;
top:-70px;
width:8%;
height:8%;


}
#fam4{
  display:relative;
  left:15%;
  right:15%;
  	width:70%;
	height:50%;
	top:30%;
}

#text{
	font-family:Avenir Next;
}
/*-----1---------*/
#Exhibition1{
	color:grey;
	font-size:1.8em;
	position:relative;
	top:820px;
	left:30%;

}
#artist1{
font-size:1.5em;
position:relative;
top:790px;
font-weight:500px;
left:30%;

}

#title1{
font-size:1.5em;
position:relative;
top:800px;
font-weight:500px;
left:30%;

}
#time1{
color:grey;
	font-size:1em;
	position:relative;
	top:800px;
	left:30%;

}

#ex1{
	position:relative;
	top:550px;
	left:60%;
	width:20%;
	height:20%;

}


/*-------2-------*/
#ex2{
	position:relative;
	top:650px;
	left:60%;
	width:25%;
	height:30%;

}

#Exhibition2{
	color:grey;
	font-size:1.8em;
	position:relative;
	top:870px;
	
left:30%
}
#artist2{
font-size:1.5em;
position:relative;
top:870px;
left:30%;
right:90%;

}

#title2{
font-size:1.5em;
position:relative;
top:870px;
font-weight:500px;
left:30%;


}
#time2{
color:grey;
	font-size:1em;
	position:relative;
	top:890px;
	left:30%;

}
/*-------3--------*/
#ex3{
position:relative;
	top:700px;
	left:60%;
	width:25%;
	height:25%;


}
#Exhibition3{
	color:grey;
	font-size:1.8em;
	position:relative;
	top:900px;
	left:30%;

}
#artist3{
font-size:1.3em;
position:relative;
top:900px;
font-weight:500px;
left:30%;


}

#title3{
font-size:1em;
position:relative;
top:900px;
font-weight:500px;
left:30%;



}
#time3{
color:grey;
	font-size:1em;
	position:relative;
	top:900px;
	left:30%;

}
/*-------4---------*/
#ex4{
	position:relative;
	top:850px;
	left:300px;
	width:25%;
	height:25%;
	left:60%;
}

#Exhibition4{
	color:grey;
	font-size:1.8em;
	position:relative;
	top:1100px;
	left:30%;

}
#artist4{
font-size:1.5em;
position:relative;
top:1100px;
font-weight:500px;
left:30%;

}

#title4{
font-size:1em;
position:relative;
top:1100px;
font-weight:500px;
left:30%;



}
#time4{
color:grey;
	font-size:1em;
	position:relative;
	top:1100px;
	left:30%;

}

a:link{
	text-decoration:none;
	
}

a:hover{
	text-decoration:none;
	color:black;
}

a:visited{
text-decoration:none;
color:black;

}
ul{
	list-style-type:none;
	padding-top:20px;
	padding bottom:20px;
	position:relative;
	top:160px;
	left:32%;
	right:30%;

}

li{
display:inline-block;
	width:100px;
	font-family:Avenir Next;
	font-size:1.5em;
	font-weight: bold;


}