@charset "utf-8";
/* CSS Document */

/* Table of Contents
---------------------------------------------------------
- General Content
- Typography
- Header & Navigation
- Images & Media
- Footer
- Media Queries
--------------------------------------------------------- */

/* General Content
--------------------------------------------------------- */
.main{padding-top:.25%;}
.main a{text-decoration:none;color:rgb(255,0,0);}
.main a:hover{text-decoration:underline;}
.main p {
	font-family: 'Open Sans', sans-serif;
	font-size: .85em;
	text-align:center;
	margin-bottom:-2%;
}
.main h3 {
	font-family: 'Open Sans', sans-serif;
	font-size:1.5em;
	text-align:center;
	margin-bottom:-1%;
}

.main h4 {
	font-family: 'Open Sans', sans-serif;
	font-size:1.1em;
	text-align:center;
	margin-bottom:-1%
}

.row {
	padding:1% 0;
	border-bottom: 1px hidden #bdbdbd;
	margin-bottom:1%;
}

.blue{background-color:#0033cc;}
.green{background-color:#7accc8;}
.orange{background-color:#ECB44C;}
.white{color:#fff;}
.bold {font-weight:bold;}

/* Typography
--------------------------------------------------------- */
body{
	font-family: 'Heebo', sans-serif;
	font-size: 1.5em;
	font-weight:400;
	background-color: rgb(205,194,174);	
}

h1 {
  font-family: 'Heebo', sans-serif;
  text-align: center;
  font-size: 3em;
  margin-bottom: 0.25em;
  margin-top: .5em;
}

h2{
	font-family: 'Heebo', sans-serif;
	font-size: 2.5em;
	text-align: center;
	margin: 0.25em;
}

.portfolio {
	border: 5px solid #ffffff;
	padding: 10px;
	margin-bottom: 2%;
}

.italic{
	font-style:italic;
}

/* Bio
---------------------------------------------------------- */
/*h2.bio{color:#3f7f7c;text-align:center;}*/

/*h2.bio{color:#fff;text-align:center;}*/

h1.bio {
	color:#000;
	text-align:center;
	font-size:3em;
	font-family: 'Heebo', sans-serif;
	margin-bottom:0px;
	margin-top: -50px;
}

h2.bio {
	color:#000;
	text-align:center;
	font-size:2em;
	font-family: 'Heebo', sans-serif;
	font-weight: 400;
	margin-bottom:0px;
}

p.bio {
	color:#000;
	font-size:1.3em;
	margin-bottom:1.5%;
}

p.sample {
	font-family: "Open Sans", sans-serif;
	font-size: 1.2em;
	font-weight:bold;
	line-height: 1.8em;
	margin-bottom: 2%;
}

p.opening {
	font-family: "Abril Fatface", sans-serif;
	font-size: 1.2em;
	text-align: center;
	line-height: 1.8em;
	margin-bottom: 2%;
}

p.header {
	color:#000;
	font-size:1.25em;
	font-family:"Times New Roman", Times, serif;
	margin-top: -10px;
}

p.caption {
	margin-top:1%;
	color:#000;
	font-size:1.1em;
	font-family:'PT Sans Narrow', sans-serif;
	line-height:1.3em;
	text-align:center;
}

p.toc1 {
	font-family: 'Open Sans', sans-serif;
	font-size: 1.1em;
	font-weight:bold;
	margin-bottom: -.1em;
	margin-top: 1em;
/*	margin-left:0px; */
}

p.toc1top {
	font-family: 'Open Sans', sans-serif;
	font-size: 1.1em;
	font-weight:bold;
	margin-bottom: -.1em;
	margin-top: -.5em;
	margin-left:200px;
}

p.toc2 {
	font-family: 'Open Sans', sans-serif;
	font-size:1em;
	line-height:1.3em;
	padding-left: 150px;
	text-indent:-20px; 
	margin-bottom: .5em;
}

p.toc {
	font-family: "Open Sans", sans-serif;
	font-size: 1.2em;
	font-weight:bold;
	line-height: 1.8em;
	margin-bottom:-0.15em;
}

p.center {
	text-align: center;
}

ul {
	color: #000;
	margin-top:-0.25em;
}

li.bio {
	margin-bottom:-3px;
	font-size:1.3em;
	list-style-type: disc;
}

a.bio {
	color:rgb(185,0,0);
	text-decoration:none;	
}

a:hover.bio {
	text-decoration:underline;
}


/* Header & Navigation
--------------------------------------------------------- */
header.main_nav{
	padding: 0 0;
	display:block;
	font-family: 'Abril Fatface',cursive;
}

.logo{
	margin: 2% auto;
	text-align: left;
	font-size: 3em;
	color: #000;
/*	text-decoration: none;
	border: 3px solid #fff;
	border-radius: 10px; */

	padding: 2px 0px 0 0px;
	margin: 0;
}

.logo a {
	text-decoration: none;
	color:#000000;	
}

.logo a:hover {
	text-decoration: underline;
}

/*.logo a {
	font-size: 3em;
	color: #fff;
	text-decoration: none;
	border: 3px solid #fff;
	border-radius: 10px;
	text-transform: uppercase;
	padding: 2px 10px 0 10px;
	margin: 0;
}

.logo a:hover {
	background-color: #fff;
	color: #7accc8;
}*/

/* Fade In
--------------------------------------------------------- */

.in4 {
   animation:demo 4s;
   -moz-animation:demo 4s; /* Firefox */
   -webkit-animation:demo 4s; /* Safari and Chrome */
   -o-animation:demo 4s; /* Opera */

}

@keyframes demo {
   0% {opacity:0;}
   100% {opacity:1;}
}

@-moz-keyframes demo { /* Firefox */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-webkit-keyframes demo { /* Safari and Chrome */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-o-keyframes demo { /* Opera */
   0% {opacity:0;}
   100% {opacity:1;}
}

.in2 {
   animation:demo 2s;
   -moz-animation:demo 2s; /* Firefox */
   -webkit-animation:demo 2s; /* Safari and Chrome */
   -o-animation:demo 2s; /* Opera */

}

@keyframes demo {
   0% {opacity:0;}
   100% {opacity:1;}
}

@-moz-keyframes demo { /* Firefox */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-webkit-keyframes demo { /* Safari and Chrome */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-o-keyframes demo { /* Opera */
   0% {opacity:0;}
   100% {opacity:1;}
}

.in6 {
   animation:demo 6s;
   -moz-animation:demo 6s; /* Firefox */
   -webkit-animation:demo 6s; /* Safari and Chrome */
   -o-animation:demo 6s; /* Opera */

}

@keyframes demo {
   0% {opacity:0;}
   100% {opacity:1;}
}

@-moz-keyframes demo { /* Firefox */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-webkit-keyframes demo { /* Safari and Chrome */
   0% {opacity:0;}
   100% {opacity:1;}
}

@-o-keyframes demo { /* Opera */
   0% {opacity:0;}
   100% {opacity:1;}
}



/* Images & Media
--------------------------------------------------------- */
img{max-width:100%;}

img.avatar {
	border-radius: 50px;
	border: 5px solid #000;
	margin-bottom:5%;
}

img.u-pull-left {
  float: left;
  margin-right: 20px;
}

img.u-cf {
  content: "";
  display: table;
  margin: 0px auto;
  clear: both; }
  

/*img:hover{opacity:0.8;}*/


/* Footer
--------------------------------------------------------- */
footer.main_nav{
	padding: .25% 0;
	display:block;
}

.footerrow {
	padding:.5% 0;
	border-bottom: 1px hidden #bdbdbd;
    margin-bottom:1%
}

.socialmedia{
	margin: 1% auto;
	text-align: center;
}

.socialmedia a {
	font-size: 1.25em;
	color: #fff;
	text-decoration: none;
	border: 2px solid #fff;
	border-radius: 10px;
	padding: 2px 10px 0 10px;
	margin: 0;
}

.socialmedia a:hover {
	background-color: #fff;
	color: #ECB44C;
}

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.wordpress a:hover {color: rgb(0,0,0);}
ul.social li.book a:hover {color: rgb(25, 103, 25);}

p.copyright {
	text-align: center;
	color: #000;
	font-size: 1em;
}

p.copyright a{
	text-decoration: none;
	color: rgb(185,0,0);
}

p.copyright a:hover {text-decoration:underline;}

/* Media Queries
--------------------------------------------------------- */
/* Larger than mobile */
@media (max-width: 479px) {
	img.u-cf
	.row{border-bottom: 1px hidden #bdbdbd;}
	.logo {font-size: 1.55em;}
	.socialmedia a{font-size: 1em;}
	footer.main_nav{padding: 1% 0 0 0;}
	.main{padding-top:5%;}
	.main h3{font-size:1.35em;}
	.main h4{font-size:1em;}
	/*.portfolio img{margin-bottom:3%;}*/
	.portfolio{margin-bottom:3%;}
	img.avatar{margin-top:0%;border-radius:25px;}
	h1{font-size:2em;}
	h2{font-size:1.5em;}
	h1.bio{font-size:2em;margin-top:-20px;}
	h2.bio{font-size:1.5em;}
	p.bio{font-size:1em;margin-bottom:5%;text-align:justify;}
	p.sample{font-size:1em;line-height:1.6em;margin-bottom:10%;}
	p.opening{font-size: 1.1em;line-height: 1.6em;margin-bottom:10%;}
	p.caption{font-size:1.1em;margin-bottom:5%;}
	li.bio{font-size:1em;}
	ul.social li a{font-size:.6em;}
}

/* Larger than phablet (also point when grid becomes active)*/
@media (min-width: 480px) {
	img.u-cf
	.logo {font-size:2em;}
	p.bio{font-size:1.1em;margin-bottom:4%;}
	li.bio{font-size:1.1em;}
	h1.bio{font-size:2em;margin-top:-20px;}
	h2.bio{font-size:1.6em;}
	h2{font-size:1.6em;}
	p.sample{font-size:1.1em;line-height:1.6em;margin-bottom:8%;}
}


/* Larger than tablet */
@media (min-width: 600px) {
	img.u-pull-left
	.logo{font-size: 2.25em;}
	p.bio{font-size:1.2em;margin-bottom:2.5%;}
	li.bio{font-size:1.2em;}
	h1.bio{font-size:2.5em;margin-top:-20px;}
	h2.bio{font-size:1.7em;}
	h2{font-size:1.7em;}
}

/* Larger than tablet */
@media (min-width: 750px) {
	.logo{font-size: 2.5em;}
	p.bio{font-size:1.25em;margin-bottom:2%;}
	li.bio{font-size:1.25em;}
	h1.bio{font-size:2.75em;margin-top:-20px;}
	h2.bio{font-size:1.75em;}
	h2{font-size:2em;}
	p.sample{font-size:1.1em;line-height:1.6em;margin-bottom:2%;
}

@media (min-width: 1000px) {
	.logo{font-size: 3em;}
	h2{font-size:2.5em;}
	h1.bio{font-size:3em;margin-top:-20px;}
}