body {
			background: url('../images/silhouette-photo-of-trees-during-night-time-365633.jpg') no-repeat #000;
			color: lightblue;
			font-family:"Helvetica";
			font-size: 1em;
			margin-right: 2%;
			background-size: cover;
			text-align: right;
			width: 98%;
}

section {
	clear: both;
	float: right;
	width: 450px;
}

a, a:link, a:active, a:visited, a:hover {
	color: #fff;
	display: inline-block;
	padding: 5px;
	padding-right: 0px;
	text-decoration: outline;
	vertical-align: middle;
}

h1 {
	font-size: 200%;
}

h3 {
	font-size: 133%;
}

img.social-logo {
	display:  inline-block;
	float:  right;
	width: 30px;
}

img.social-logo:hover {
	opacity: 0.5;
	transform: scale(1.25, 1.25);
}

footer {
	color: #fff;
	display: block;
	font-weight: bold;
	margin-top: 1em;
}

.bio {
 color: #fff;
 display: block;
 text-shadow: 2px 2px #2c5783;
}

.bio h1 {
 margin-bottom: -15px;
}

.bio h1, .bio h3 {
  background-position: 0 0;
  background-repeat: repeat-x;
  background-size: 10px 100%;
	padding-bottom: 5px;
	padding-right: 5px;

}

.credits {
	color: #fff;
	float:  left;
	padding: 0.25em;
	position: absolute;
  bottom:0;
	left: 0;
}

.courses {
	  color: #fff;
		text-shadow: 2px 2px purple;
}

.courses a {
	background-image: linear-gradient(to right, purple 100%, transparent 100%);
  background-position: 0 1.1em;
  background-repeat: repeat-x;
  background-size: 10px 15px;
  text-decoration: none;
  font-weight: 800;
  font-size: 1.2em;
}

.courses .description {
	font-size: 100%;
	font-family: 'Arial Rounded MT Bold', 'Arial', sans-serif;
}


@media all and (max-device-width: 480px) and (orientation : portrait) {
	body {
		background-size: 100%;
		font-size: 4em;
	}

	img.social-logo {
		width: 60px;
	}
}

@media all and (min-device-width : 481px) and (max-device-width : 768px) and (orientation: landscape){
	body {
		background-size: 100%;
	}
	a, a:link, a:active, a:visited, a:hover { font-size: 2em; }


}