@font-face {
    font-family: impactFont;
    src: url('../leaguegothic-regular-webfont.eot');
    src: url('../leaguegothic-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../leaguegothic-regular-webfont.woff') format('woff'),
         url('../leaguegothic-regular-webfont.ttf') format('truetype'),
         url('../leaguegothic-regular-webfont.svg#league_gothicregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


#main{
	margin-top: 40px;
	margin-bottom:20px;	
}

#overview {
	margin:0 auto;
	width:640px;
	height:263px;
	position:relative;
	font-family: Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#fff;
	text-align: center;
}
#header{
	font-family:impactFont;
	margin-top: 20px;
	margin-bottom:20px;
}


body{
	font-family:Arial, Helvetica, sans-serif;
	color:#FFF;
	
	
}
/** 
 * Slideshow style rules.
 */
#slideshow {
	margin:0 auto;
	width:640px;
	height:263px;
	position:relative;
}


/** 
 * Slideshow controls style rules.
 */
.control {
  display:block;
  width:39px;
  height:263px;
  text-indent:-10000px;
  position:absolute;
  cursor: pointer;
}
#leftControl {
  top:0;
  left:0;
  background:transparent url(../images/control_left.jpg) no-repeat 0 0;
}
#rightControl {
  top:0;
  right:0;
  background:transparent url(../images/control_right.jpg) no-repeat 0 0;
}

/** 
 * Style rules for Demo page
 */

 

a {
  color: #fff;
  font-weight:bold;
  text-decoration:none;
}
a:hover {
  text-decoration:underline;
}

#links a{
	text-decoration:underline;
	font-size: 0.9em;
	font-family:Arial, Helvetica, sans-serif;
}
body {
	background-color: #666666;  
}
#pageContainer {
  margin:0 auto;
}

.slide{
	font-family: Arial, Helvetica, sans-serif;
	font-size:0.8em;
	color:#fff;
}
.slide h2, .slide p {
  margin:15px;
  
}
.slide h2 {
  font: 1.2em Arial, Helvetica, sans-serif;
  color:#fff;
  font-weight:bold;
   text-decoration:underline;
  
}
.slide img {
  float:right;
  margin:0 15px;
  padding:2px;
  border:2px solid #aaa;
  background-color:#666;
}

.instruct{
	float:right;
	clear:both;
	margin-top:20px;

}

#footer {
  height:100px;
}
#footer p {
  margin:30px auto 0 auto;
  display:block;
  width:560px;
  height:40px;
}

.shadow {
   -moz-box-shadow:    10px 10px 4px 2px #222;
  -webkit-box-shadow: 10px 10px 4px 2px #222;
  box-shadow:         10px 10px 4px 2px #222;
}

hr{
	height: 2px;
	color: #ffffff;
	background-color: #fff;
	noshade;
}



ul {
  	margin: 0;
  	padding: 0;
  	list-style-type: none;
}



#title{
	margin-top:10px;
	
	
}

h1{
	text-align: center;
	font-size: 1.2em;
	color:#ffffff;
	font-family:Arial, Helvetica, sans-serif;
	
}


ul.expertise{
	list-style-type: square;
}
	
.expertise{
	border-bottom: none; 
	margin-left:10px;
	text-decoration:
		
}



@media only screen and (min-width: 1050px) {
    /* desktop */
	
	#header{
		width:300px;
		height:65px;
	}
	.impact{
		font-family: impactFont;
		font-size: 2.3em;
		padding:20px 0px 5px 0px;
		line-height: .1em;
		color:#ffffff;
		text-align: left;
	}
	
	h2{
		font-family: impactFont;
		font-size: 1.5em;
		color:#ffffff;
		padding:0px 0px 0px 0px;
		line-height: .1em;
		letter-spacing:1px;
		text-align: left;
		
	}
	
	#main{
		background-image:url(../images/main.jpg);
		height:387px;
		width:960px;
		margin-bottom:35px;
	}
	
	#pageContainer {
  		width:960px;
	}
	menu {
		height: 20px;
		width: 950px;
		margin-left:0px;
		padding-top: 7px;
		padding-bottom: 7px;
	}
	
	menu a{
		font-weight:400;
		font-size: 1em;
		font-weight: bold;
		font-family:Arial, Helvetica, sans-serif;
		 
	}
	
	li {
		
		margin-right:50px;
		float:left;
	}
	
	#slideshow #slidesContainer {
	  margin:0 auto;
	  width:560px;
	  height:263px;
	  overflow:auto; /* allow scrollbar */
	  position:relative;
	}
	#slideshow #slidesContainer .slide {
	  margin:0 auto;
	  width:540px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
	  height:263px;
	}
	
	#comment{
		width: 850px;
		margin-left: 100px;
		margin-top:50px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	
	#links{
		width:850px;
		margin-left: 100px;
		margin-top:80px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	
	#copy{
		position:relative;
		width:920px;	
		margin-left:20px;
	}
	

}

@media only screen and (min-width: 700px) and (max-width: 1050px) {
    /* tablets */
	#header{
		width:300px;
		height:65px;
	}
	.impact{
		font-family: impactFont;
		font-size: 2.0em;
		padding:20px 0px 5px 0px;
		line-height: .1em;
		color:#ffffff;
		text-align: left;
	}
	
	h2{
		font-family: impactFont;
		font-size: 1.2em;
		color:#ffffff;
		padding:0px 0px 0px 0px;
		line-height: .1em;
		letter-spacing:1px;
		text-align: left;
		
	}
	#main{
		background-image:url(../images/main2.jpg);
		height:282px;
		width:700px;
		margin-bottom:35px;
	}
	
	
	
	#pageContainer {
  		width:700px;
	}
	menu {
		height: 20px;
		width: 700px;
		margin-left:0px;
		padding-top: 7px;
		padding-bottom: 7px;
	}
	
	menu a{
		font-size: .8em;
		font-weight: bold;
		font-family:Arial, Helvetica, sans-serif;
		 
	}
	
	li {
		margin-right:30px;
		float:left;
	}
	
	#slideshow #slidesContainer {
	  margin:0 auto;
	  width:560px;
	  height:263px;
	  overflow:auto; /* allow scrollbar */
	  position:relative;
	}
	#slideshow #slidesContainer .slide {
	  margin:0 auto;
	  width:540px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
	  height:263px;
	}
	
	#comment{
		width: 640px;
		margin-left: 80px;
		margin-top:50px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	#links{
		width:640px;
		margin-left: 80px;
		margin-top:80px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	
	#copy{
		position:relative;
		width:680px;
		
		margin-left:20px;
	}


}

@media only screen and (max-width: 700px) {
    /* phones */
	
	#header{
		width:300px;
		height:45px;
	}
	.impact{
		font-family: impactFont;
		font-size: 1.5em;
		padding:20px 0px 5px 0px;
		line-height: .1em;
		color:#ffffff;
		text-align: left;
	}
	
	h2{
		font-family: impactFont;
		font-size: 1.0em;
		color:#ffffff;
		padding:0px 0px 0px 0px;
		line-height: .1em;
		letter-spacing:1px;
		text-align: left;
		
	}
	
	#main{
		position:relative;
		background-image:url(../images/main3.jpg);
		height:150px;
		width:300px;
		top:-25px;
	
	}
	
	#title{
		position:relative;
		top:120px;
		
	}
	
	
	#otherLine{
		width:300px;
		float:left;
		position:relative;
		top:112px;
		
	}
	
	#pageContainer {
  		width:300px;
	}
	
	menu {
		position:relative;
		top: 150px;
		width:200px;
		margin-left:0px;
		margin-right:120px;
		margin-bottom: 30px;
		float:left;
		clear:both;
	}
	
	
	
	#bottomLine{
		position:relative;
		top: -122px;
		margin-top:5px;
		width:300px;
		float:left;
		clear:both;
		
	}
	
	menu a{
		font-size: 0.8em;
		font-weight: bold;
		font-family:Arial, Helvetica, sans-serif;
	}
	
	li {
		
		margin-top: 20px;
		margin-left:0px;
		border-bottom: 1px solid white; 
		
	}
	

		
		
		
		
	
	#slideshow {
		width:0px;
		height:0px;
		display:none;
		
	}
	
	#comment{
		width: 260px;
		margin-left: 0px;
		margin-top:50px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	
	#links{
		width: 260px;
		margin-left: 0px;
		margin-top:50px;
		font-size: 0.9em;
		font-family:Arial, Helvetica, sans-serif;
		color:#ffffff;
		
	}
	#copy{
		position:relative;
		width:270px;
		top:120px;
		margin-left:20px;
	}
		
	.moveUpMenu{
		position:relative;
		top: 0px;
		z-index:100;
	}
	
	#title.moveUpTitle{
		position:relative;
		top: 20px;
	}
	
	#title.moveUpTitle h1{
		font-size: 1em;
	}
		
		
	
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
    /* portrait phones */
}

