html {font-size: 125%;} 
/* TRICK: when combined with body font-size: 50% (below), makes 1em=10pt, .9em=9pt, 1.2em=12pt, etc. */
  
body {
  font-size: 50%;
  font-family: arial, san-serif;
  color: white;
  font-weight: normal;
  text-align: center;
  line-height: 130%;
  background: black;
  }

* {margin: 0; padding: 0;} 

html, body {height: 100%;}

table, td {width: 100%; height: 100%; padding: 0; border: none;}

img {border-style:}
  	
/*Vertical Centering Tables*/  
table {width: 100%; vertical-align: center; padding: 0;}



.spacertop {float: left; width: 100px; height: 5px;}
.spacerbottom {float: left; width: 100px; height: 90px;}

#container {
	display: block;
	min-height: 100%;
	top: 0; left: 0; 
	width: 100%; height: 100%;
    position: fixed;	
    text-align: center; 
	vertical-align: middle;
	margin: 0px 0 0px 0;
 	overflow: auto;	
 	}
	
#content {
	display: block;
	height: 202px;
	width: 1010px;
	margin-left: auto;
	margin-right: auto;
	}


/* screenwriter */ 
#screenwriter {
	float: left; 
	width: 272px;
	height: 32px;
  	text-align: center;
  	margin-left: 369px;
	margin-right: 369px;
	}


/* CHRIS RAFFERTY */ 
#chrisrafferty_2015 {
	float: left; 
	width: 1010px;
	height: 114px;
  	text-align: center;
  	margin-top: 6px;
	margin-bottom: 10px;
	}


#bottombar {float: left; width: 1010px; height: 38px;}

#iconcontainer {
	height: 38px; 
	margin-left: 360px;
	}

#divider {float: left; width: 16px; height: 38px;}


/* WORKSHOP icon */  
#workshop {display: inline; width: 119px; height: 38px;}	
#workshop a {
	float: left;
	width: 119px; 
	height: 38px; 
	background: url(home-images/workshop.jpg) no-repeat;
	}
#workshop a:hover {background-position: 0px -40px;}

/* CAA icon */  
#caa {display: inline; width: 70px; height: 38px;}	
#caa a {
	float: left;
	width: 70px; 
	height: 38px; 
	background: url(home-images/caa.jpg) no-repeat;
	}
#caa a:hover {background-position: 0px -40px;}

/* IMDB icon */  
#imdb {display: inline; width: 58px; height: 38px;}	
#imdb a {
	float: left;
	width: 58px; 
	height: 38px; 
	background: url(home-images/imdb.jpg) no-repeat;
	}
#imdb a:hover {background-position: 0px -40px;}

/* TWITTER icon */  
#twitter {display: inline; width: 27px; height: 38px;}	
#twitter a {
	float: left;
	width: 33px; 
	height: 38px; 
	background: url(home-images/twitter.jpg) no-repeat;
	}
#twitter a:hover {background-position: 0px -40px;}

/* INSTAGRAM icon */  
#instagram {display: inline; width: 27px; height: 38px;}	
#instagram a {
	float: left;
	width: 33px; 
	height: 38px; 
	background: url(home-images/instagram.jpg) no-repeat;
	}
#instagram a:hover {background-position: 0px -40px;}

/* EMAIL icon */  
#email {display: inline; width: 30px; height: 38px;}	
#email a {
	float: left;
	width: 36px; 
	height: 38px; 
	background: url(home-images/email.jpg) no-repeat;
	}
#email a:hover {background-position: 0px -40px;}







/* non-hack way of clearing floats */
.clearthefloats {clear: both;}  
  	
/* Alsett Clearing Method */
.clearfix:after {
  content: " "; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
  font-size: 0;
  }
  
/* Holly Hack for IE6 Windows bug */
* html .clearfix {height: 1%;}
.clearfix {display: block;}

/* fix for IE Mac */
.clearfix {display: inline-block;}