/*
	Color Scheme
	
	#3300CC purple
	#B66100 tobacco
	#63FC83 jade
	#00AF23 green
	#6666CC lavender
	#D08B3D tannery
*/

body {background-color: #D08B3D; background-image: url(../img/bg_header.gif); background-repeat: repeat-x; margin: 0;
	-webkit-animation-delay: 0.1s;
    -webkit-animation-name: fontfix;
    -webkit-animation-duration: 0.1s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: linear}

@-webkit-keyframes fontfix {
    from { opacity: 1; }
    to   { opacity: 1; }
}
	
body.resume {background-color: #6666CC; background-image: url(../img/bg_header.gif); background-repeat: repeat-x; margin: 0;}		
h1 {font-family: 'Oswald', sans-serif;}
				
h2 {font-family: Oswald, sans-serif; font-weight: 400; font-size: 1.5em;color: #D08B3D;}
	
h2.resumesubhead {font-family: Oswald, sans-serif; font-weight: 400; font-size: 1.5em; color: #000000;}	
	
h3 {font-family: Oswald, sans-serif;}

li {font-family: 'Roboto Condensed', sans-serif; font-size: 1.1em; color: #3300CC;}
	
li.resume {font-family: 'Roboto Condensed', sans-serif; color: #000; font-size: 1.1em;}		

blockquote {font-family: 'Roboto Condensed', sans-serif; color: #3300CC; font-size: 1em;}
	
blockquote.resume {font-family: 'Roboto Condensed', sans-serif; color: #000000; font-size: 1em;}	
	
div.alignright {font-family: 'Oswald', sans-serif; font-size: 2em; text-align: right;}
							
p {font-family: 'Roboto Condensed', sans-serif; color: #3300CC; font-size: 1.1em;}
	
p.resume {font-family: 'Roboto Condensed', sans-serif; color: #000000; font-size: 1.1em;}	
	
p.jobtitle 	{font-family: 'Roboto Condensed', sans-serif; color: #D08B3D; font-size: 1.1em;}

p.footertext {color: #fff;}

.humans { display: none; }

#humans { display: none; }

.bannertext {margin-top: -10px;}
	
.subheader {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 2.5em; color: #B66100; float: left; width: 80%; margin: 0px 0px 0px -10px;}

.subheader2 {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #3300CC; float: left; width: 55%;}
	
.subheadergreen {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 2.5em; color: #63FC83; float: left; width: 100%;}

.subheadergreen2 {text-align: center; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 4.5em; color: #63FC83; float: left; width: 100%;}

.subheaderdkgreen {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 2.5em; color: #00AF23; float: left; width: 80%;}
	
.subheader2c {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #3300CC; float: left; width: 100%;}	
	
.subheader2b {text-align: center; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #63FC83; float: left; width: 100%;}

.subheader2bc {text-align: center; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #3300CC; line-height: 25px;;width: 100%;}

.subheader2bcc {font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #3300CC; line-height: 25px;;width: 100%;}
	
.subheader3 {text-align: right; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #D08B3D; float: right; width: 80%;}

.subheader4 {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #D08B3D; float: left; width: 80%;}
	
.subheader4b {text-align: left; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 1.5em; color: #D08B3D; float: left; width: 100%;}										
img.smallicons {vertical-align: 60%;}

p.aboutcontent1 {	
	font-family: 'Roboto Condensed', sans-serif;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 25px;
	}

p.aboutcontent2 {	
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	width: 275px;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 25px;
	}

p.aboutcontent2x {	
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	width: 554px;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 25px;
	}

p.aboutcontent3 {	
	font-family: 'Roboto Condensed', sans-serif;
	text-align: left;
	width: 210px;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 25px;
	}

p.aboutcontent4 {	
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	width: 275px;
	color: #ffffff;
	font-size: 1.2em;
	line-height: 25px;
	}
	
.apbzcontainer {	
	font-family: 'Roboto Condensed', sans-serif;
	align-content: center;
	width: 275px;
	float: left;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 20px;
	padding: 30px 30px 30px 30px;
	}

.apbzcontainer4{	
	font-family: 'Roboto Condensed', sans-serif;
	align-content: center;
	width: 275px;
	float: left;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 20px;
	padding: 30px 30px 30px 30px;
	}

.apbzcontainer3{	
	font-family: 'Roboto Condensed', sans-serif;
	align-content: center;
	width: 555px;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 20px;
	padding-top: 30px;
	}

.apbzcontainer2 {	
	font-family: 'Roboto Condensed', sans-serif;
	width: 300px;
	color: #3300CC;
	font-size: 1.2em;
	line-height: 20px;
	padding-top: 30px;
	}

p.photocred {	
	font-family: 'Roboto Condensed', sans-serif;
	color: #3300CC;
	font-size: .9em;
	line-height: 25px;
	}
	
p.copyrightcred {	
	font-family: 'Roboto Condensed', sans-serif;
	color: #B66100;
	font-size: .9em;
	line-height: 25px;
	}
	
p.copyrightcred2 {	
	font-family: 'Roboto Condensed', sans-serif;
	color: #B66100;
	font-size: .9em;
	line-height: 5px;
	}
	
div.copyright {
	width: 960px; 
	margin:0px auto; 
	padding-top: 30px;
	}	
	
.copyright2 {
	width: 75%; 
	margin:0px auto; 
    }
	
p.superscript {
	font-family: 'Oswald', sans-serif;
	color: #63FC83;
	vertical-align: super;
	font-size: 1.1em;
	}
	
.container {
	width: 900px; 
	margin:0px auto; 
	padding-bottom: 30px;
	}

.containerwhite {
	background-color: #FFFFFF;
	width: 80%;
	margin: 0px auto;
	padding: 30px 30px 30px 30px;
	overflow: hidden;
	}
	
.container2 {
	background-color: #6666CC;
	width: 80%; 
	margin: 0px auto;
	padding: 10px 30px 200px 30px;
	}

.container2b {
	background-color: #6666CC;
	width: 80%; 
	margin: 0px auto;
	padding: 10px 30px 30px 30px;
	}

.container2ba {
	background-color: #6666CC;
	width: 80%;
	margin: 0px auto;
	padding: 30px 30px 30px 30px;
	overflow: hidden;
	}

.container2bb {
	width: 75%;
	margin: 0px auto;
	overflow: hidden;
	}

.container2be {	
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
	
.container3 {
	background-color: #FAFAFA;
	width: 75%; 
	margin: 0px auto; 
	padding: 10px 30px 30px 30px;
	}	

.container4 {
	width: 900px; 
	margin:0px auto; 
	padding-bottom: 30px;
	}

.container5 {
	width: 175px;
	float: left;
	padding: 10px 40px 30px 40px;
	}

.container5a {
	width: 225px;
	float: left;
	padding: 10px 30px 30px 30px;
	}

.bannertitle {
	text-align: center;
	font-family: 'Oswald', sans-serif; 
	font-weight: 700; 
	font-size: 5em; 
	color: #d08b3d;
	margin-bottom: 0px;
	padding-top: 40px;
	height: 47px; 
	background: teal url(../img/bg_header.gif); 
	width: 100%; 
	}

.bannertitle2 {
	text-align: center;
	font-family: 'Oswald', sans-serif; 
	font-weight: 700; 
	font-size: 3em; 
	color: #d08b3d;
	margin: 21px 0px -34px 0px;
	padding-top: 30px;
	height: 70px; 
	/* background: teal url(../img/bg_header.gif); */ 
	width: 100%; 
	}

.bannertitle3 {
	text-align: center;
	font-family: 'Oswald', sans-serif; 
	font-weight: 700; 
	font-size: 5em; 
	color: #3300cc;
	margin-bottom: 0px;
	padding-top: 40px;
	height: 47px; 
	background: teal url(../img/bg_header.gif); 
	width: 100%; 
	}

.resumetitle {
	text-align: center;
	font-family: 'Oswald', sans-serif; 
	font-weight: 700; 
	font-size: 4em; 
	color: #d08b3d;
	margin-bottom: 0px;
	padding-top: 5px;
	height: 52px; 
	background: teal url(../img/bg_header.gif); 
	width: 100%; 
	}	
	
div#navtitle {
	position: relative;
	z-index: 100;
	}
	
div#submenu {
	font-family: 'Roboto Condensed', sans-serif;
	color: #3300CC;
	font-size: 1.1em;
	height: 10px; 
	width: 200px;
	margin: 10px 0px 50px 60px;
	padding: 0px;
	clear: both;
	}
	
#home {
	background: url(../img/bg_homepage4.jpg);
	height: 552px; 
	width: 960px;
	/* overflow: auto;*/
	}
	
div.homecontent {
	font-family: 'Roboto Condensed', sans-serif;
	color: #3300CC;
	font-size: 1.1em;
	height: 40px; 
	width: 500px;
	margin: 75px 0px 50px 300px;
	padding: 15px 30px 30px 10px;
	float: left;
	}

div.homecontent2 {
	font-family: 'Roboto Condensed', sans-serif;
	line-height: 25px;
	color: white;
	font-size: 1.5em;
	height: 200px; 
	width: 300px;
	margin: 50px 0px 50px 30px;
	padding: 0px 30px 30px 10px;
	float: left;
	overflow: auto;
	}

div#about {
	background: url(../img/bg_aboutpage2.jpg);
	height: 552px; 
	width: 960px;
	overflow: auto;
	}
	
div#resumelink {
	height: 50px;
	width: 70%;
	padding: 40px 220px 0px 0px;
	float: right;
	}	
	
div#photocred {
	text-align: right;
	height:10px;
	width: 50%;
	padding: 0px 175px 0px 0px;
	float: right;
	}	
	
div#blog {
	background: #6666CC;
	/* url(../img/bg_blogpage.jpg) */
	height: 552px; 
	width: 960px;
	/* overflow: auto;*/
	}
	
div#portfolio {
	background: #6666CC;
	/* url(../img/bg_portfoliopage2.jpg) */
	height: 700px; 
	width: 960px;
	}
	
div#contact {
	background: url(../img/bg_contactpage.jpg);
	height: 552px; 
	width: 960px;
	padding: 50px 0px 0px 20px;
	overflow: auto;
	}
	
div#pageheader {
	opacity: 0.8;
	text-align: left;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: left;
	margin-top: 0px;
	padding: 10px 0px 20px 40px; 
	width: 20%;
	}
	
div.homeheader {
	opacity: 0.8;
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin-top: 0px;
	padding: 10px 200px 20px 0px; 
	width: 40%;
	}		

div#aboutheader {
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin-top: 0px;
	padding: 10px 280px 20px 0px; 
	width: 20%;
	}
	
div.aboutcontent {
	/*background-color: rgba(255, 255, 255, .4);
	color: rgba(255, 255, 255, .4);*/
	height: 250px; 
	width: 220px;
	margin: 50px 175px 50px 0px;
	padding: 5px 30px 30px 10px;
	float: right;
	overflow: auto;	
	}		

div#aboutcontent {
	/*background-color: rgba(255, 255, 255, .4);
	color: rgba(255, 255, 255, .4);*/
	height: 250px; 
	width: 220px;
	margin: 50px 175px 50px 0px;
	padding: 5px 30px 30px 10px;
	float: right;
	overflow: auto;	
	}
div#blogheader {
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin-top: 0px;
	padding: 10px 375px 20px 0px; 
	width: 40%;
	}
	
div#blogpageheader {
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin-top: 0px;
	padding: 5px 200px 20px 0px; 
	width: 40%;
	}
	
div#blogcontent {
	font-family: "Roboto Condensed", sans-serif;
	color: #3300CC;
	font-size: 1.1em;
	height: 400px; 
	width: 550px;
	margin: 20px 0px 50px 135px;
	padding: 5px 30px 30px 10px;
	float: left;
	overflow: auto;
	}	

div.portfolioheader {
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin-top: 0px;
	padding: 10px 230px 20px 0px; 
	width: 40%;
	}	
	
div#portfoliocontainer {
	height: 450px; 
	width: 708px;
	margin: 0px 0px 0px 50px;
	overflow: auto;
	}	

div.portfoliothumbs {
	width: 90%;
	height: 150px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div.portfoliothumbs_b {
	width: 90%;
	height: 150px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div.portfoliothumbs_c {
	width: 90%;
	height: 375px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div.portfoliothumbs_d {
	width: 90%;
	height: 165px;
	margin: 10px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div.portfoliothumbs_e {
	width: 90%;
	height: 260px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}

div.portfoliothumbs_f {
	width: 90%;
	height: 490px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}

div.portfoliothumbs_g {
	width: 90%;
	height: 605px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}

div#portfoliothumbs {
	width: 90%;
	height: 150px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div#portfoliothumbs_b {
	width: 90%;
	height: 150px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div#portfoliothumbs_c {
	width: 90%;
	height: 375px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div#portfoliothumbs_d {
	width: 90%;
	height: 165px;
	margin: 10px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
	}
	
div#portfoliothumbs_e {
	width: 90%;
	height: 260px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}

div#portfoliothumbs_f {
	width: 90%;
	height: 560px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}

div#portfoliothumbs_g {
	width: 90%;
	height: 960px;
	margin: -5px 50px 0px 5px; 
	padding: 10px 20px 10px 20px;
	clear: both;
}
	
div#contactcontainer {
	height: 450px; 
	width: 90%;
	margin: 30px 0px 0px 35px;
	overflow: auto;
	}

div#contactheader {
	text-align: right;
	font-family: 'Oswald', sans-serif; 
	font-weight: 400; 
	font-size: 4em;
	color: #63FC83;
	float: right;
	margin: -50px 170px 20px 0px;
	padding: 10px 174px 20px 0px;
	width: 40%;
	}		

a:link {color: #d08b3d; text-decoration: none; font-family: 'Oswald', sans-serif;}
a:visited {color: #d08b3d; text-decoration: none; font-family: 'Oswald', sans-serif;}
a:hover {color: #63FC83; text-decoration: none; font-family: 'Oswald', sans-serif;}
a:active {color: #d08b3d; text-decoration: none; font-family: 'Oswald', sans-serif;}

#email {
	background: #63FC83; 
	}
	
#comments {
	background: #63FC83; 
	}

#answer {
	background: #63FC83; 
	}

/* For mobile phones: */
[class*="col-"] {
    width: 100%;
	}

@media only screen and (min-width: 400px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}

@media all and (max-width: 607px) {	
	.bannertitle {display:none;}
}

@media all and (min-width: 608px) {	
	.bannertitle2 {display:none;}
}
	
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}