html{
			overflow-y: scroll; 
		}
		body {
		    background-color: rgba(200,226,245,0.25);
		    background: transparent url('../images/swirl.png') ;	
		}
		table{
			margin:auto;
		/*	font-size: 120%;*/
		}
		p {
			display: block;
			margin-top: 1em;
			margin-bottom: 1em;
			margin-left: 0;
			margin-right: 0;
		}
		em {
			/*color: #328DAD;*/
			font-weight: bold;
			font-style: normal;
		}
		.clearboth{
			clear: both;
		}
		.clearleft{
			clear: left;
		}
		.center{
			text-align: center;
		}
		#outercontainer{
		}
		#innercontainer{
		}
		#container {
		    margin: auto;
		    margin-top: 10px;
		    width: 95%;
/*		    max-width: 800px;*/
		    border: 4px solid #fff ;
		    border-radius: 2px;
		    -webkit-box-shadow: 2px -2px 15px 9px rgba(221,221,221,0.42);
		    -moz-box-shadow: 2px -2px 15px 9px rgba(221,221,221,0.42);
		    box-shadow: 2px -2px 15px 9px rgba(221,221,221,0.42);
		    background: rgba(255,255,255,0.4);
		    box-sizing: border-box;
		    padding: 2em;
		}
		h1,h2,h3,h4,h5,h6,p {
			line-height: 1.45;
			font-weight: normal;
		}
		h1 { /*font-size: 4em; 
			-webkit-margin-before:0em;
			-webkit-margin-after: 0em;*/
		}

		header {
			width: 60%;
			margin:0px auto;
		}
		footer p {
			float: right;
		}
		h1 {
			text-align: center;
			display: block;
		}
		h2 { /*font-size: 3em; */text-align: center;}
		h1,h2, h3{
		    font-family: 'Josefin Sans Std Light', 'Josefin Sans', "Hoefler Text", Garamond, "Times New Roman", serif;
		}
		.cursive{
		    font-family: 'Pinyon Script', "Bickham Script", cursive;
		    font-variant: normal;
		    font-weight: normal;
		}
		.right{
			float: right;
		}
		.left{
			float: left;
		}
		
		img.right{
			padding: 10px 0px 10px 10px ;
		}
		.left img{
			padding: 10px 20px 10px 0px ;
		}

		#content{
		    margin-top: 5px;
		    margin-bottom: 20px;
		}
	.address{
		text-align: center;	
	}
	ul {
	    list-style-type: none;
	}
	tr td {
		padding:8px 20px;
	}
		h1,h4 {

		    font-family: 'Josefin Sans Std Light', 'Josefin Sans', Didot, "Didot LT STD", "Hoefler Text", Garamond, "Times New Roman", serif;
		    font-variant: small-caps;
			font-weight: normal;

		}
		#fittext1{
			font-size: 4.5em;	
		    font-family: 'Pinyon Script', "Bickham Script", cursive;
		    font-variant: normal;
		    font-weight: normal;
		}
		#fittext2{
			line-height: 1em;
		}
	.holstlogo{
		background: #fcfcfc url('../images/holstlogo-75.jpg') no-repeat bottom right !important;
	}
	.tcclogo{
		background: #fcfcfc url('../images/tcc-temp-logo-75.png') no-repeat bottom right !important;
	}

/*Menu*/
	#navmenu a {
		font-family: 'Josefin Sans Std Light', 'Josefin Sans',serif;
		font-size: 160%;
		text-decoration: none;
	
	}
.title{
	margin-top: 1em;
	}
/*Page specific*/
	#homepage>img:first-child {
		width: 50%;
		max-width: 700px;
		float: right;
	}
	#homepage ul {
		list-style-type:circle;
		margin-left: 60px;
	}
	#homepage ul.photo-grid#recordingportfoliopic.left {
		list-style-type: none;
		margin-left: 0px;
		margin-right: 20px;
	}
	#homepage ul.photo-grid#recordingportfoliopic.right {
		list-style-type: none;
		margin-left: 20px;
		margin-right: 0px;
	}
	#flickimages a{
		margin-top: 1em;
		margin-right: 1em;
		width: 200px;
		height: 220px;
	}
	#choirimgs{
		width: 100%;
	}
	#recordings .recording {
		float: left;
	}
	#recordings .recording img {
		height: 75px;
	}

/*Repertoire*/
	#tagcloud {
		border: 2px solid blue;
		padding: 10px;
		text-align: justify;
		float: right;
		width: 30%;	
		max-height: 300px;
		overflow: hidden;
		border-radius: 15px;
		line-height: 2em;
	}
	#tagcloud a.composer{
		margin-right: 0.6em;
	}
	#works{
		width: 65%;
		float: left;
	}
	#alphabetnav{
		margin-bottom: 20px;
	}
	.scroll{
		height: 300px;
		overflow: hidden;
	}
/*Reviews*/
	#reviews img{/*
		width: 50%;
		max-width: 500px;
		float: right;
		padding-left: 1em;
		padding-bottom: 1em;
	*/}

.focuspoint {
	height: 200px;
	margin-bottom: 20px;
}
.focuspoint .label {
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	padding: 5px;
	background: rgba(0,0,0,0.5);
	color: #fff;
}


#twitter{
	min-width: 450px;
	max-width: 800px;
	width: 80%;
	margin:auto;
	text-align: center;
	border: 4px solid #55acee;
	padding: 2px;
	float: right;
}


@media screen and (max-width: 399px) {
	#twitter{
		width: 95%;
		max-width: auto;
		min-width: auto;
		margin-right: 2%;
		margin:auto;
	}
}
@media screen and (min-width: 400px) and (max-width: 579px) {  
	#twitter{
		width: 88%;
		max-width: auto;
		min-width: auto;
		margin-right: 6%;
		margin:auto;
	}
}
@media screen and (min-width: 580px) and (max-width: 2000px) {
	#twitter{
		min-width: 450px;
		max-width: 800px;
		width: 80%;
		clear: both;
		float: none;
		margin:auto;
	}
}
@media screen and (min-width: 2001px) {
	#twitter{
		min-width: 450px;
		max-width: 1600px;
		width: 80%;
		margin-right: 10%;
	}
}