.LTCCalifornianProDisplayItalic {
	font-family: "LTCCalifornianProDisplay-Italic";
}.LTCCalifornianProDisplay {
	font-family: "LTCCalifornianProDisplay";
}.LTCCalifornianProText {
	font-family: "LTCCalifornianProText";
}.LTCCalifornianProTextItalic {
	font-family: "LTCCalifornianProText-Italic";
}.basement_grotesque{
	font-family: "basement_grotesque";
}


html{
		font-size: 20px;

		margin:0;
		padding:0;
		-webkit-text-size-adjust: none;
		  text-size-adjust: none;
		
}
body{
font-family: "LTCCalifornianProText";
font-variant-numeric: oldstyle-nums;
color: #ccc;


	background-color: #333;
	

  padding-left:0;
  margin-left:0;
}

a{
		text-decoration: none;
			color: #ccc;
}

article p, article figcaption, #end-credits p{
	margin-left: 1.2rem;

}
article{

}
h1, h2 {
	padding-left: .2rem;
	font-variant-numeric: normal;
}
h1 {
	font-family: "LTCCalifornianProDisplay";
	font-size: 4rem;
	font-weight: lighter;
	width: 40.5rem;
	margin-bottom: 0;
}

h2 {
	font-family: "LTCCalifornianProDisplay";
	font-size: 2rem;
}

.author{
	margin-top:0;
	padding-top:0;
	
}

h1+p+p{
	font-family: "LTCCalifornianProText-Italic";
	font-size: 2rem;
	line-height: 2.2rem;
	width: 28.5rem;
	text-align: justify;
}

p {
	font-family: "LTCCalifornianProText";
	width: 26.5rem;
	line-height: 1.4rem;
	letter-spacing: .03rem;	
}
figure{
	float:left;
	padding-left: 0;
	margin-left: 0;
}

figure img {
	width: calc(28.5rem + 1.2rem);
}

figcaption{
	font-family: "LTCCalifornianProText";
	text-transform: lowercase;
	font-variant: small-caps;
	font-size: 1.2rem;
	letter-spacing: .01rem;

}

.smallcaps{
		text-transform: lowercase;
		font-variant: small-caps;
}

strong{
	font-weight:bold;
	letter-spacing: .04rem;
}
em{
	font-family: "LTCCalifornianProText-Italic"
}
#end-credits{
		padding-bottom: 3rem;
		padding-top:3rem;
	}
#end-credits p{
	font-size: .8rem;

}


/* ---UI--- */
a:before,  a:after
	{content: '·';
	color: white;
	padding:0;
	margin:0;
	margin-left:-.22rem;
}



h1+p+p a:after{
		margin-left:0rem;
	}

a:hover{
	color: white;
}


.navbar a:before, .navbar a:after
	{content: '·';
	color: #002627;
	padding:0;
	margin:0;
	margin-left:-.22rem;
}


/* Place the navbar at the bottom of the page, and make it stick */
.navbar {
  background-color: white;
  overflow: hidden;
  position: fixed;
  margin:0;
  padding:0;
  bottom: 0;
  width: 100%;
  border-top: 1px dotted #999;
  opacity: .9;
}

#mainnav{
	margin-left: -1.4rem;
	list-style-type: none;
	margin-top: 0;
}
#mainnav li{

}


/* Style the links inside the navigation bar */
.navbar a {
  float: left;
  display: block;
  color: #262627;
  text-transform: lowercase;
  font-variant: small-caps;
  text-align: center;
  padding: .2rem .44rem;
  text-decoration: none;
  font-size: 1rem;
  font-weight: lighter;

}



/* Change the color of links on hover */
.navbar a:hover {
/*   background-color: #292929;
*/
 color: ##555569);
}









/* screen responsiveness */
@media only screen and (max-width: 1000px){
  body{
	  width: 100%;

  }
  article, #end-credits{

	margin-left: 1.2rem;
	padding-right: 1.2rem;
	padding-bottom: 7rem;
  }
  .author{
		 font-size: 2.4rem;
		  
	  }
  .navbar{
	  padding-bottom: .5rem;

  }
  .navbar a {
  		  font-size:3rem;
  }
  figure{
	  width: 100%;
	  padding-left:0;
	  margin-left:0;
  }
  figure img{
	  width: calc(100% + 2.4rem);
	  margin-left:-1.2rem;

  }
  figcaption{
	  font-size:2.4rem;
	  padding-bottom:2.4rem;
  }
  p, h1, h2{
	  width: auto;

  }
  h1 {
  		  font-size: 8rem;
		  padding-bottom: 0;
		  margin-bottom: 0;
		  margin-top: 0;
		  margin-left: 1.2rem;
		 
  }
  h2 {
  		  font-size: 4rem;
		  padding-bottom: 0;
		  margin-bottom: 0;
		  margin-left: 1.2rem;
  }  
  h1+p+p {
 	  width: auto;
	  text-align: left;
	  margin-top: 1rem;
	  padding-top: 0;
	  font-size: 4rem;
	  line-height: 4.6rem;
   }
   p {
	   	  font-size: 3rem;
   	letter-spacing: .03rem;	
	line-height: 3.4rem;
		
   }
   
   #end-credits{
	   padding-bottom:7rem;

   }
   #end-credits p{
	   font-size: 2rem;
   }
}