/* Table of Contents
________________________________
-General content
-Typography
-Header & Navigation
-Images & Media
-Footer
-Media Queries
_________________________________ */

/* General content
_________________________________ */
.main{padding-top:3%;}
.row{padding: 2% 0;}
.green{background-color:#333333;}
/*.green{background-color:#607B8B;}*/
/*.green{background-color:#7accc8;}*/

myvideo{
	
}



/* Typography
_________________________________ */
body{
	font-family: 'Abel',sans-serif;
	font-size: 1.5em;
	color: #000;
}
h3{
	color:#000000;
}
h2{
	/*font-family: 'Miniver', cursive;*/
	font-family: 'serif' ;
	font-style: oblique;
	font-size: 3em;
	margin: 0.67em;
}
h2.bio{color:#A2B5CD;}
/*h2.bio{color:#3f7f7c;}*/
p.bio{color:#fff;}

a.exlink{text-decoration: none;}
a.exlink:hover{color: #B0C4DE;}

/* Header & Navigation
_________________________________ */
header.main_nav{
	padding: 1% 0;
	display: block;
}


.logo{
	margin: 5% auto;
	text-align: center;
}
.logo a{
	font-size: 3em;
	color: #fff;
	text-decoration: none;
	border: 3px solid #000000;
	text-transform: uppercase;
	padding: 2px 10px 0 10px;
	margin: 0;
}
.logo a:hover{
	background-color: #fff;
	color: #333333;
	/*color: #7accc8;*/
}

/* Images & Media
_________________________________ */

img{max-width: 100%;}
img.avatar{
	border-radius: 400px;
	border: 4px solid #fff ;
}

img:hover{opacity:0.8;}

/* CrossFading Images
_________________________________ */


/* Footer
_________________________________ */

ul.social{
	display: block;
	margin: 5% 0;
	list-style-type: none;
	text-align: center;
}
ul.social li{
	font-size: 3em;
	display: inline;
	padding: 0 2%;
}
ul.social li a{
	color: #666;
}
ul.social li.facebook a:hover{color: rgb(59,89,152);}
ul.social li.twitter a:hover{color: rgb(0,172,237);}
ul.social li.instagram a:hover{color: rgb(81,127,237);}
ul.social li.youtube a:hover{color: rgb(187,0,0);}
ul.social li.flickr a:hover{color: rgb(255,0,132);}
ul.social li.linkedin a:hover{color: rgb(0,123,182);}
ul.social li.github a:hover{color: rgb(0,0,0);}

p.copyright{
	text-align: center;
	color: #666;
	font-size: 1em
}

/* Media Queries
_________________________________ */
/* Larger than mobile */
@media (max-width: 479px) {
	.logo a{font-size: 2em;}
	.main{padding-top:15%;}
	.portfolio img {margin-bottom: 10%;}
	img.avatar{margin-top: 15%;}
	h2.bio{font-size: 2.5em;}
	p.bio{font-size: 1.25em; color: #3f7f7c;}
	ul.social li a{font-size: .75;}

}