body{
	background:white;
}

#FAM{
	font-family:Avenir Next;
	position:absolute;
	left:125px;
	top:60px;
	font-size:1.2em;
	font-weight:Demibold;
}
#famlogo{
position:absolute;
left:175px;
top:0px;
}


#fam1{
	position:absolute;
	top:140px;
	left:10px;
	height:300px;
	width:500px;
}

#mencook{
	position:absolute;
	top:450px;
}

#mwc{
	position:absolute;
	top:480px;
	left:220px;
	right:95px;
	font-family:Avenir Next;
	font-size:20px;
}
#events{
	position:absolute;
	top:450px;
	left:220px;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:20px;
	color:grey;

}

#radw{
	position:absolute;
	top:650px;
}

#radfsw{
position:absolute;
	top:700px;
	left:220px;
	right:95px;
	font-family:Avenir Next;
	font-size:20px;
}

#exhibits{
	position:absolute;
	top:660px;
	left:220px;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:20px;
	color:grey;
}

#sfmoma{
		position:absolute;
	top:900px;
}

#excursion{
	position:absolute;
	top:950px;
	left:220px;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:20px;
	color:grey;
}

#visit{
	position:absolute;
	top:980px;
	left:220px;
	right:95px;
	font-family:Avenir Next;
	font-size:20px;
}

#artworlds{
		position:absolute;
	top:1200px;
}

#current{
	position:absolute;
	top:1230px;
	left:220px;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:20px;
	color:grey;
}

#artworlds2{
position:absolute;
	top:1260px;
	left:220px;
	right:95px;
	font-family:Avenir Next;
	font-size: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;


}

@media screen and (min-width:550px)
{
body{
	background:#ccc;
}

#fam1{
  display:relative;
  left:15%;
  right:15%;
  	width:70%;
	height:50%;
	top:30%;
}
#FAM{
	font-family:Avenir Next;
	position:relative;
	left:40%;
	right:40%;
	font-size:2em;
	font-weight:Demibold;
	top:-100px;
}
#famlogo{
position:relative;
left:45%;
right:45%;
top:-70px;

}
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;
} 

#mencook{
	position:relative;
	top:600px;
	left:20%;
	right:40%;
	width:20%;
	height:20%;
}

#mwc{
	position:relative;
	top:430px;
	left:45%;
	right:40%;
	font-family:Avenir Next;
	font-size:1.8em;
}
#events{
	position:relative;
	top:450px;
	left:45%;
	right:40%;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:2em;
	color:white;

}

#radw{
	position:relative;
	top:720px;
	left:45%;
	right:40%;
	width:18%;
	height:18%;
}

#radfsw{
position:relative;
	top:480px;
	left:68%;
	right:30%;
	font-family:Avenir Next;
	font-size:2em;
}

#exhibits{
	position:relative;
	top:500px;
	left:68%;
	right:30%;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:1.8em;
	color:white;
}

#sfmoma{
		position:relative;
	top:780px;
	left:15%;
	right:50%;
	width:25%;
	height:30%;
}

#excursion{
	position:relative;
	top:530px;
	left:45%;
	right:50%;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:2em;
	color:white;
}

#visit{
	position:relative;
	top:500px;
	left:45%;
	right:50%;
	font-family:Avenir Next;
	font-size:1.8em;
}

#artworlds{
		position:relative;
	top:800px;
	left:40%;
	right:50%;
	width:25%;
	height:20%;
}

#current{
	position:relative;
	top:600px;
	left:70%;
	font-family:Avenir Next;
	font-weight:bold;
	font-size:2em;
	color:white;
}

#artworlds2{
position:relative;
	top:580px;
	left:70%;
	right:30%;
	font-family:Avenir Next;
	font-size:1.8em;
	
	}