@media screen and (max-width: 699px) 
{ 
	body
	{
		font-size: 100%;
	}
	
	h1
	{
		font-size: 250%;
		line-height: 100%;
	}
	
	h2
	{
		font-size: 110%;
		font-weight: bold;
	}
	
	.wrapper
	{
		width: auto;
		padding: 0 1em;
	}
		
	ul li, ul.experience li ul.responsibilities li 
	{
		margin: 0 0 0 0.7em;
	}
	
	ul.experience li
	{
		margin: 0;
	}


}

@media screen and (min-width: 700px) 
{ 
	body
	{
		font-size: 110%;
	}

	h1 
	{
		font-size: 80px;
		line-height: 85%;
		text-indent: -1000em;
		padding-bottom: 0em;
		background: url(header.png) no-repeat left center;
		-moz-background-size: 100%;
		background-size: 100%;	
		max-width: 800px;
	}

	
	h2
	{
		float: left;
		margin-left: -9em;    
		font-size: 100%;
		font-weight: 400;
	}
	
	.wrapper
	{
		max-width: 55em;
		padding: 0 1.5em;
	}
	
	.section
	{
		padding-left: 9em;
	}
	
	ul.minor li
	{
		margin: 0;
	}
}

body
{
	font-family: "myriad-pro","myriad-pro",MyriadPro-Light,MyriadPro-Regular,arial, sans-serif;
	font-weight: 300;
	line-height: 125%;
	color: rgb(100,100,100);
	background: white url(background.png) top center repeat-x;
	border-bottom: 1em solid black;
	margin: 0;
	padding: 22px 0 1em 0;
}

.wrapper
{
	margin: auto;
}

h1
{
	font-family: "league-gothic-1","league-gothic-2",Haettenschweiler, “Arial Narrow Bold”, sans-serif;
	font-weight: normal;
	text-transform: uppercase;
	color: rgb(50,50,50);
	margin: 18px 0;
}

span.dash
{
	display: none;
}

h1 span.claim
{
	display: block;
	font-size: 70%;
	color: rgb(120,120,120);
	margin-top: 0;
	font-weight: normal;	
	line-height: 105%;
}

h1 span.claim span
{
	color: rgb(200,200,200);
	display: inline;
}

h2
{
	font-family: "myriad-pro", "myriad-pro", MyriadPro-Semibold, MyriadPro-Bold, arial, sans-serif;
	color: rgb(50,50,50);
	margin-top: 0em;
}

h3, h3 a
{
	font-family: "myriad-pro", "myriad-pro", MyriadPro-Semibold, MyriadPro-Bold, arial, sans-serif;
	font-weight: normal;
	font-size: 100%;
	margin: 0;
	color: rgb(50,50,50);	
	font-weight: 400;
}

h4 
{
	display: inline;
	font-weight: normal;
	font-size: 100%;
}

p
{
	margin: 0 0 1em 0;
}

img
{
	border: 0;
}

a
{
	color: rgb(100,100,100);
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

ul
{
	margin: 0;
	padding: 0;
	margin-bottom: 1em;
}

#contact
{
	font-size: 90%;
	margin-bottom: 1.5em;
}

#contact span
{
	color: rgb(200,200,200);
	padding: 0 0.5em;
}
 
.section
{
	border-top: 1px solid rgb(220,220,220);
	padding-top: 1em;
	margin-bottom: 1em;	
}

ul.minor
{
	color: rgb(100,100,100);
}

ul.experience li 
{
	list-style-type: none;
	margin-bottom: 1em;
}

ul.experience li h3
{
	margin: 0;
}

ul.experience li ul.responsibilities, ul.skills
{
	margin-left: -0.7em;
}

ul.experience li ul.responsibilities li, ul.skills li
{
	margin-bottom: 0em;
	list-style:none; /* if you’re not already using a reset */
}

ul.experience li ul.responsibilities li:before, ul.skills li:before
{
	color: rgb(200,200,200);
	content: "\2022"; /* /2022 is the numerical unicode for • */
	font-size: 1.5em; /* set the font-size of the bullet if necessary. Make sure to use em or %*/
	padding-right: .25em; /* give the bullet some padding from the text Make sure to use em*/
	position: relative;
	top: .075em; /* set the vertical position of the bullet if necessary. Make sure to use em or % */
	line-height: 0.66em;
}

div#footer 
{
	padding: 2em 0 2em 0;
	border-top: 1px solid rgb(200,200,200);
}

div#footer img
{
	vertical-align: middle;
}

div#footer img#linkedIn
{
	margin-right: 25px;
}