
/* Medium devices (tablet / phone horiz) */
/*@media only screen and (max-width: 770px) {*/
@media only screen and (max-width: 900px) {	
	/* 660px */	

	div.banner .content,
	div.signup .content,
	div.IAabout .content,
	div.bio .content,
	div.IAsummary .content,
	div.addltraining .content,
	div.chronology {
		max-width: 660px;
	}


	div.banner {
		padding: 30px 0;
		height: 450px;
	}

	div.banner .content h1 {
		font: 30px / 1em 'Vollkorn';
		font-style: italic;
	}

	div.banner .content h1 span {
		font-size: 20px;
	}




	div.banner #signupbtn {
		width: 210px;
		height: 210px;
	}
	div.banner #signupbtn strong {
		font-size: 30px;
		margin-top: 26%;
	}
	div.banner #signupbtn span {
		margin-top: 6%;
		font-size: 24px;
	}




	div.banner .content .slogan {
		text-align: center;
		margin: 170px 0 0 0;
		font: 65px / .9em 'Vollkorn';
		color: white;
	}


	div.banner .content .slogan span:first-of-type {
		margin: 0;
	}

	div.banner .content .slogan em {
		opacity: 0.5;
		font-size: 40px;
		top: -5px;
		clear: both;
		display: inline-block;
	}

	div.banner .content .slogan em:first-of-type {
		margin-right: 180px;		
	}

	div.banner .content .slogan em:last-of-type {
		margin-left: 180px;
	}





	h2 {
    	font-size: 40px;
    	padding-bottom: 20px;
    }


    div.signup,
	div.IAabout,
	div.bio,
	div.IAsummary,
	div.addltraining {
		padding: 60px 0;
	}



	div.IAabout .content h2 {
		padding: 0 0 10px 0;	
	}
	div.IAabout .content h3 {
		font-size: 20px;
		padding: 0;
	}

	div.IAabout h4 {
		font: 38px/1.2em "Vollkorn";
		margin: 50px 0 0 0;
		font-style: italic;
	}

	div.IAabout h4 span.sub {
		font-size: 25px; 
		line-height: 25px; 
	}



	div.chronsection.left {
		width: 316px;
	}

	div.chronsection.right {
		width: 317px;
	}


	i#pic_sunflower {
		width:200px; 
		height:290px; 
		margin:7px 20px 10px 0; 
		border:8px solid #265471; 
		background-position: bottom 0 left 0;
	}


	div.bio .content h2 {
		padding: 0;
	}

	i#pic_stacey {
		width:200px; 
		height:230px; 
		background-size:120%; 
		margin:4px 0 5px 15px; 
		border:8px solid #df9800; 
	}


	div.end {
		font-size: 14px;
		margin-top: 50px;
	}

	div.end pipe, div.top pipe {
		margin: 0 5px;
	}


/* -------------------------------------------- */
/* -------------------------------------------- */


/* Medium devices (phone vert) */
@media only screen and (max-width: 670px) {
	/* 370px */

	body,
	div.signup .content,
	div.IAabout .content,
	div.bio .content,
	div.IAsummary .content,
	div.addltraining .content {
		font: 14px/1.8em 'Open Sans';		
	}


	div.banner .content,
	div.signup .content,
	div.IAabout .content,
	div.bio .content,
	div.IAsummary .content,
	div.addltraining .content,
	div.chronology {
		max-width: 600px;
	}


	div.banner {
		padding: 20px 0;
		/*height: 450px;*/
	}


	div.banner .content h1 {
		font: 30px / 1em 'Vollkorn';
		font-style: italic;
	}

	div.banner .content h1 span {
		margin: 0;
		padding: 0;
		border: none;
		display: block;
		font-size: 20px;
	}



	div.banner #signupbtn {
		width: 190px;
		height: 190px;
		/*right: 50px;*/
		margin-top: -30px;
	}
	div.banner #signupbtn strong {
		font-size: 30px;
		margin-top: 26%;
	}
	div.banner #signupbtn span {
		margin-top: 4%;
		font-size: 24px;
	}



	div.banner .content .slogan {
		text-align: center;
		margin: 150px 0 0 0;
		font: 50px / 1em 'Vollkorn';
		color: white;
	}


	div.banner .content .slogan span:first-of-type {
		margin: 0;
	}

	div.banner .content .slogan em {
		margin: 0;
		opacity: 0.5;
		font-size: 36px;
		top: -2px;
		clear: both;
		display: inline-block;
	}

	div.banner .content .slogan em:first-of-type {
		margin: 0px;		
	}

	div.banner .content .slogan em:last-of-type {
		margin: 0px;
	}


	h2 {
    	font-size: 28px;
    	padding-bottom: 10px;
    }



	div.signup .content h2 {
		font-size: 36px;
	}
	div.signup .content h3 {
		font-size: 30px;
	}



	div.IAabout h4 {
		font: 32px/1.2em "Vollkorn";
		margin: 30px 0 0 0;
		font-style: italic;
	}

	div.IAabout h4 span.sub {
		padding: 0;
		margin: 10px;
		display: block;
		font-size: 25px; 
		line-height: 1.4em; 
	}






	i#pic_sunflower {
		width:140px; 
		height:220px; 
		margin:7px 15px 10px 0; 
		border:6px solid #265471; 
		background-position: bottom 0 left 0;
	}

	i#pic_stacey {
		width:140px; 
		height:180px; 
		background-size:120%; 
		margin:4px 0 5px 15px; 
		border:6px solid #df9800; 
	}



	div.bio h2 span {
		display: block;
		font-size: 20px;
		border:none;
		opacity: 0.8;
		margin: 0;
		padding: 5px 0 0 0;
		position: relative;
		top: 0;
	}





	div.IAabout,
	div.bio,
	div.IAsummary,
	div.addltraining {
		padding: 40px 0;
	}



	div.IAsummary div h3 {
		font: 18px/1em 'Open Sans';
		font-weight: bold;
		padding: 14px 20px;
	}	

	div.IAsummary div.info {
		padding: 6px 15px 30px 15px;
	}
	div.IAsummary div.info p {
		font-size: 14px;
		padding-left: 15px;
	}
	div.IAsummary div.info h4 {
		padding: 15px 0 0 0;
		margin: 15px 0 4px 0;
		border-top: 1px dashed #ccc;
		font-size: 16px;
	}
	div.IAsummary div.info h4:first-of-type {
		border: none;
		margin-top: 0;
	}






	div.addltraining .wrapper {
		padding: 15px;
	}

	div.addltraining div h3 {
		margin: 0;
		font: 18px/1em 'Open Sans';
		padding: 12px 10px;
	}	

	div.addltraining div.info {
		padding: 0 15px 0 10px;
		margin: 20px 0 20px 10px;
	}

	div.addltraining div.info p	{
		font-size: 15px;
		line-height: 1.4em;
	}



	div.chronsection.full,
	div.chronsection.left,
	div.chronsection.right {
		border-radius: 4px;
		border: none;
		border-left: 10px solid #2a2a2a;
		width: auto;
		float: none;
		clear: both;
	}


	div.chronsection.training {
		border-left: 10px solid #3a2560 !important;
	}

	div.chronsection.facilitating {
		border-left: 10px solid #df9800 !important;
	}

	div.chronsection.leading {
		border-left: 10px solid #6c4028 !important;
	}

	div.chronsection.staff {
		border-left: 10px solid #5b6540 !important;
	}

	div.chronsection.coaching {
		border-left: 10px solid #254c6a !important;
	}


	div.chronology h2 {
		margin: 0;
		padding: 0;
	}




	div.legend {
		display: none;
	}


	div.end {
		margin-top: 30px;
	}


	div.top {
		padding-top: 10px;
		line-height: 24px;
	}
	div.end pipe, div.top pipe {
		display: block;
		clear: both;
		margin: 0;
		padding: 0;
		border: none;
	}

}



/* -------------------------------------------- */
/* -------------------------------------------- */


/* Medium devices (phone vert) */
/*@media only screen and (max-width: 420px) {*/
@media only screen and (max-width: 550px) {
	/* 370px */

	div.banner .content,
	div.signup .content,
	div.IAabout .content,
	div.bio .content,
	div.IAsummary .content,
	div.addltraining .content,
	div.chronology {
		max-width: 380px;
	}



	div.banner #signupbtn {
		width: 155px;
		height: 155px;
		right: calc(50% - 80px);
		margin-top: -20px;
	}
	div.banner #signupbtn strong {
		font-size: 22px;
		margin-top: 26%;
	}
	div.banner #signupbtn span {
		font-size: 20px;
		margin-top: 4%;
	}


	div.signup .content h2 {
		font-size: 28px;
	}
	div.signup .content h3 {
		font-size: 26px;
	}


}