.group:after {
  content: "";
  display: table;
  clear: both; }

html, body, div, p, ul, li, nav, h1, form, 
.form div button, dl, dt, dd, h2, h3 {
	font-family:  Helvetica, Arial, "Lucida Grande", sans-serif; 
   font-weight: 500;
	margin: 0;
	padding: 0;
	list-style: none; 
background-color: none}

html, body {
	width: 100%;
}

	





/*-------------Banner-------------*/

.banner {
	
	overflow: hidden;
}


.banner {
	background: #00df8e; /* Old browsers */
background: -moz-radial-gradient(center, ellipse cover,  #00df8e 6%, #008e5e 100%); /* FF3.6+ */
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(6%,#00df8e), color-stop(100%,#008e5e)); /* Chrome,Safari4+ */
background: -webkit-radial-gradient(center, ellipse cover,  #00df8e 6%,#008e5e 100%); /* Chrome10+,Safari5.1+ */
background: -o-radial-gradient(center, ellipse cover,  #00df8e 6%,#008e5e 100%); /* Opera 12+ */
background: -ms-radial-gradient(center, ellipse cover,  #00df8e 6%,#008e5e 100%); /* IE10+ */
background: radial-gradient(ellipse at center,  #00df8e 6%,#008e5e 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00df8e', endColorstr='#008e5e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	overflow: hidden;
	text-align: center;
}


.banner > div {
	max-width: 1200px;
	margin: 0 auto;
}
.banner div div {
	display: inline-block;
	vertical-align: top;
	margin-top: 250px;
	padding-left: 20px;
	
}

.banner img {
	margin-top: 30px;
	padding-bottom: -30px;
	float: left;
	margin-left: -100px;
	height: 520px;
}

.banner div h1, .banner div h2 {
	font-weight: normal;
	color: white;
	text-shadow: 2px 3px 2px #389534;

}

.banner div div {
     padding-right: 20px;
}


.banner div h1 {
	font-size: 5em;
}

.banner div h2 {
	font-size: 2.4em;
	padding-top: 12px;
}

/*-----bar-------*/

.bar{
	background: #f5f5d4;
	height: 35px;
}


#full-resume {
	height: 400px;
	overflow: scroll;
}

/*--------About Me---------*/
/*--------About Me---------*/
/*--------About Me---------*/
/*--------About Me---------*/


 {
	border: 1px solid black;
}

.aboutme div {
	padding-top: 40px;
	padding-bottom: 30px;
}

.aboutme div div{
	padding-left: 5%;
	padding-top: 110px;

}

.aboutme img {
	height: 600px;
	float: right;
	padding-right: 10%;
}

.aboutme div div h1 {
	color:#ec8400;
	font-size: 5em;
}

/*-----bg check---------*/
/*-----bg check---------*/
/*-----bg check---------*/
/*-----bg check---------*/



.bgcheck div {
	padding-top: 100px;
	padding-bottom: 90px;
}

.bgcheck > div div {
	float: left;
}

.bgcheck div div span, .resume h2 {
	font-size: 1.5em;
	line-height: 3em;
}

.bgcheck div img {
	margin-left: 100px;
}

.bgcheck > div div {
	padding-top: 30px;
	padding-bottom: 0;
}

.bgcheck {
	
}

.bgcheck img {
	padding: 5px; 
	border: 1px solid #c5c5c5;
	border-radius: 7px;
	box-shadow: 0px 0px 3px 0px #a7a7a7;
	background-color: #f4f4ef;
}

/*--------resume-----------*/
/*--------resume-----------*/
/*--------resume-----------*/
/*--------resume-----------*/

.resume h2 {
	color: #4c4c4c;
}

.resume div div ul {
	padding-top: 40px;
	line-height: 3.2em;
}

.resume ul li {
	font-size: 1.1em;
	color: #4c4c4c;
}



 .resume div div {
	padding-top: 47px;
	padding-bottom: 60px;
}

.resume div div {
	float: right;
	text-align: center;
	padding-right: 1%;
	width: 53%;
}

.resume {
	background-color: #f3f2ed;
}

.resume div {
	margin-top: 0px;
	padding-top: 50px;
	padding-bottom: 30px;
}

.resume img {
	height: 580px;
	padding-left: 2%;
	float: left;
	padding-top: 35px;
}

.resume a:link, .resume a:visited, .mystory a:link, .mystory a:visited {
	color:#ec8400;
	;
	text-decoration: none;
}

#full-resume {
	max-width: 1000px;
	margin: 0 auto;

}

#full-resume h3 {
	font-size: 3em;
	margin-top: -30px;

}

#full-resume h4 {
	font-size: 2em;
	font-weight: normal;
	padding: 0;
	margin: 0;
	padding-bottom: 15px;
}

#full-resume li {
	line-height: 1.8em;
	width: 90%;
	margin: 0 auto;
	padding-top: 5px;
	padding-bottom: 5px
}

#full-resume h3, #full-resume h4, #full-resume h5, #full-resume h6  {
	color: #303030;
	margin-left: auto;
	margin-right: auto;
}

 #full-resume h5, #full-resume h6 {
 	width: 90%;
 }

 #full-resume h3, #full-resume h4 {
 	width: 72%;
 }



#full-resume ul {
	width: 80%;
	margin: 0 auto;
}

#full-resume h6 {
	font-size: 1.1em;
	padding: 0 0 10px 0;
	margin: 0 auto;
	text-decoration: underline;
	font-weight: normal;

}

#full-resume h5 {
	padding-top: 15px;
	font-size: 1.4em;
	margin-bottom: 0;
	padding-bottom: 10px;
}

#close {
	background-color:#ec8400;
	color: white;
	border-radius: 8px;
	width: 60px;
	height: 30px;
	padding: 0;
	margin-bottom: 60px;
	margin-right: 15%;

}

#close p {
	padding-top: 8px;
	
}

#close a {
	color: white;

}

/*--------Story-----------*/
/*--------Story-----------*/
/*--------Story-----------*/
/*--------Story-----------*/
/*--------Story-----------*/

.mystory img {
	float: left;
	height: 600px;
	padding-left: 4%;
}

.mystory div h1 {
	color:#ec8400;
	font-size: 4em;
}

.mystory div {
	padding: 60px 10% 70px 10%;
}

.mystory div p {
	color: #4c4c4c;
}

.mystory div p {
	width: 40%;
}

.mystory div h1 {
	padding-bottom: 30px;
	padding-left: 4%;
}

.mystory div p {
	display: inline-block;
	vertical-align: top;
	padding: 0 4%;
	line-height: 1.6em;
	font-size: 1.10em;
	text-align: justify;
}

.mystory {
	background-color: #f3f2ed;
}

.mystory div div {
	float: right;
	width: 70%;
	padding-top: 30px;
	margin-right: -30px;
}

.mystory span {
	font-size: .7em;
	line-height: 1.6em;
}


/*----------Dry------------*/
/*----------Dry------------*/
/*----------Dry------------*/
/*----------Dry------------*/





.aboutme, .bgcheck, .resume, .mystory {
	width: 100%;

}


.aboutme div, .bgcheck div, .resume div, .mystory div {
	max-width: 1200px;
	margin: 0 auto;
	padding-left: 20px;
	padding-right: 30px;

}


.aboutme div div, .bgcheck div div {
	width: 50%;
	display: inline-block;
	text-align: center;
	vertical-align: top;
	
}


.bgcheck div div h1, .resume div div h1 {
	color:#ec8400;
	font-size: 4.5em;
}



.aboutme div div p, .bgcheck div div p {
	line-height: 1.9em;
	padding-top: 15px;
	font-size: 1.18em;
	color: #4c4c4c;
	
}

.aboutme div div p {
	text-align: justify;
}

.box-shadow div div p {
	text-align: center;
}







/*------footer--------*/

.bottom-bar {
	height: 10px;
	background-color: #2c6a8c;
}



/*-----at media------*/


 {
	border: 1px solid grey;
}

@media screen and (max-width: 1200px) {


.banner  div div {
	margin-left: -60px;

}

.banner img {
	margin-right: 0;
}


.resume ul li {
	line-height: 2.3em;
}

.resume img {
	height: 520px;
	padding-top: 30px;

}

.resume div div h1 {
	font-size: 4.3em;
}

.resume div div {
	padding-top: 50px;
	width: 45%;
	padding-right: 8%;
}


.resume div {
	padding-left: 0;
	padding-right: 0;
}

.mystory div {
	padding: 0 2%;
}

.mystory div div {
	padding-right: 2%;
	padding-bottom: 50px;
	padding-top: 60px;
}

.mystory div img {
	padding-top: 80px;

}

}





@media screen and (max-width: 1061px) {

	.banner img {
		height: 460px;
	}

	.banner div div {
		margin-top: 200px;
	}

	


	.aboutme div div p {
		line-height:  1.5em;
	}

	.aboutme > div div h1, .bgcheck > div div h1, .resume > div  div:nth-child(2) h1 {
		font-size: 3.6em;
	}

	.mystory div {
		padding-left: 0;
		padding-right: 0
	}

	.mystory div p {
		width: 40%;
	}

	.mystory {
		text-align: center;
	}

	.mystory div h1 {
		text-align:  left;
		padding-left: 60px;
		font-size: 3.2em;
		width: 100%;
		padding: 0 0 30px 20px;
	}

	.resume div div > ul {
		padding-top: 0;
	}

	.resume div div {
		padding-right: 4%;
	}

}

@media screen and (max-width: 925px) {

 {
	border:  1px solid grey;
}

	.banner div h1 {
		font-size: 3.9em;
	}

	.banner div h2 {
		font-size: 1.9em;
	}

	.banner img {
		height: 400px;
	}

	.aboutme div img {
	
		padding-top: 20px;

	}

	.bgcheck div div {
		padding-left: 10px;
		padding-right: 20px;
	}

	.bgcheck div img {
		margin-left: 60px;
	}

	.resume > div div:nth-child(2) {
		padding-left: 10px;
		padding-right: 10px;
	}

	
	#full-resume li {
		line-height: 1.5em;
		padding-top: 7px;
		padding-bottom: 7px;
	}

	#resume {
		width: 310px;
	}

	#danielbuble {
		width: 150px;
		padding-top: 30px;
	}

	.resume div img {
		float: none;
		display: inline-block;
		vertical-align: top;
		margin: 0 auto;
		clear: both;
		padding-left: 0;
		padding-right: 30px;
	}

	.resume div {
		width: 100%;
		text-align: center;
	}

	.resume div div {
		width: 90%;
		clear: both;
		float: none;
	}

	.resume-lists {
		text-align: justify;
	}

	.mystory div p {
		width: 100%;
	}

	.mystory div div {
		width: 55%;
		padding-right: 5%;
		margin-right: 0;

	}

	.mystory div p {
		padding-right: 7%;
		padding-left: 0;
	}

	#paragraph2 {
		padding-top: 20px;
	}
}

@media screen and (max-width: 860px) {
	

	.banner {
		padding-top: 30px;
	}

	.mystory div div {
		padding-right: 7%;
	}
}

@media screen and (max-width: 810px) {

	.aboutme div div, .aboutme div img, .bgcheck div img, .bgcheck div div {
		float: none;
		display: inline-block;

	}

	.aboutme div, .bgcheck div, .resume div {
		text-align: center;
		padding-top: 70px;
		padding-bottom: 50px;
	}
	



	.aboutme  div div h1 {
		font-size: 4em;
	}

	.bgcheck div div h1 {
		font-size: 3.5em;
	}

	.aboutme div div p {
		font-size: 1.1em;
	}

	.aboutme div div, .bgcheck div div, .resume > div div:nth-child(2) {
		padding-left: 0;
		padding-right: 0;
		width: 85%;
	}

	.bgcheck div img {
		margin-left: 0;
	}

	.resume >div div:nth-child(1) {
		padding-bottom: 30px;
	}

	.mystory div p {
		font-size:  1em;
	}

	.mystory div h1 {
		padding-left: 40px;
		font-size: 2.6em;
	}

	.aboutme div img {
		padding-bottom: 30px;
		padding-top: 0;
		height: 520px;
	}

	.aboutme div div {
		padding-top: 0;
	}

	.resume > div div:nth-child(1), .resume div div:nth-child(2) {
		float: none;
	}

	.resume div div:nth-child(1) {
		margin-left: 0;
		padding-left: 20px;
		padding-right: 20px;

	}

}

@media screen and (max-width: 750px) {

	.mystory div div {
		float: none;
		clear: both;
		margin: 0 auto;
		width: 90%;
		padding: 0;
	}

	.mystory div img {
		float: none;
		margin: 0 auto;
		height: 480px;
	}

	.mystory div h1 {
		text-align: center;
		font-size: 3.8em;
		padding-top: 20px;
		padding-left: 0;
		padding-right: 0;
	}

	.mystory {
		padding-bottom: 40px;
	}

	}

@media screen and (max-width: 742px) {

 {
	border: 1px solid grey;
}

	.banner div div {
		width: 100%;
		float: none;
		background: #f5f5d4;
		padding-right: 0;
	}

	.banner div div {
		margin-left: 0;
		margin-right: 0;
		padding-left: 0;
		padding-right: 0;
		margin-top: 0;
		padding-bottom: 20px;
		padding-top: 15px;
	}

	.banner div div h1, .banner div div h2 {
		color: #ec8400;
		text-shadow: none;
	}

	.bar {
		display: none;
	}

	.resume div img {
		height: 460px;
		padding-right: 0;
	}

	.resume div {
		padding-bottom: 0px;
	}

}

@media screen and (max-width: 730px) {

	#full-resume ul {
		width: 90%;
	}

}



@media screen and (max-width: 490px) {
	.banner div div h1 {
		font-size: 2.6em;
	}

	.banner div div h2 {
		font-size: 1.4em;
	}

	.aboutme div {
		padding-right: 20px;
	}

	.aboutme div div h1, .bgcheck div div h1  {
		font-size: 2.6em;

	}

	.resume div div:nth-child(2) h1 {
		font-size: 2.4em;
		margin: 0;
		padding: 0;


	}

	.aboutme div div  {
		width: 100%;
	}

	.bgcheck div div p {
		line-height: 1.6em;
	}

	.bgcheck div  div span {
		font-size: 1.2em;
		line-height: 1.5em;
	}

	#resume {
		width: 240;
		margin-left: -20px;
	}

	.resume div div:nth-child(1) img:nth-child(1) {
		display: none;
	}


	.resume div div:nth-child(1) h1 {
		color: #ec8400;
		width: 90%;
		margin-top: 9px;
	}

	.resume div div:nth-child(1) {
		margin-right: 0;
		padding-right: 0;
		width: 90%;
		text-align: center;
	}

	.resume div div:nth-child(2) {
		padding-top: 20px;
	}

	.resume div div:nth-child(2) ul li {
		border-bottom: 1px solid lightgrey;

	}

	.resume div div:nth-child(2) ul {
		padding-top: 10px;
		margin-top: 15px;
		border-top: 1px solid lightgrey;
	}

	.mystory div div {
		width: 85%;
	}

	.mystory div p {
		display: block;
		
	}

	#paragraph2 {
		padding-top: 20px;
	}

	.mystory div h1 {
		
		font-size: 2.4em;
	}

	.resume div img {
		height: 420px;
	}

	.resume div div, .resume div, .aboutme div, .aboutme div div {
		padding-bottom: 20px;
	}

	.aboutme div {
		padding-top: 40px;
	}

	.aboutme div div h1 {
		font-size: 3.25em;

	}

	.resume div {
		padding-top: 30px;
	}
	
}

	@media screen and (max-width: 380px) {
		.resume div img {
			height: 340px;
		}
		
	}