@import url(https://fonts.googleapis.com/css?family=Open+Sans);
/* 3-Column Template */
* {box-sizing: border-box;}

body {
	font-family: 'Open Sans', sans-serif;
	color: #333;
	text-align: justify;
	text-justify: inter-word;
	background-color:IndianRed;
	}



/* ===========KJ formats============ */

.center {							/* div class */
	display: flex;
	justify-content: center;
	align-items: center;
	/* height: 200px; */
	/* border: 3px solid green;  */
	}

.toCenter {
	text-align:center;
	vertical-align: middle;
	/* margin: auto; */
	}

img {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

h4 {
	line-height: 80%;
	margin: 10px;
	padding: 0px;
	}
h2	{
	line-height: 80%;
	margin: 10px;
	padding: 0px;
	}
audio {
	width:90%;
	margin: auto;
	padding: 5%;
	/* height: 100px; */
	}

mediadiv {
  	background-image: url("./img/cloud-black-white-burst_02_xp.gif") ;
  	background-repeat: repeat-y repeat-x;  
	}
	
.brk	{background-image: url("./img/1x1pip.gif") ;}
.brk2	{height:15px;}

.s150 {font-size: 150%;}

.s200 {font-size: 200%;}
.s300 {font-size: 300%;}

.bigbold	{font-weight: 999;}

.headline {
	font-family: 'arial', sans-serif;
	font-size:300%;
	line-height:50%;
	letter-spacing: .25em;
	transform: scale(1, 1.5);
/* word-wrap: break-word; */
	}

.col-head {
	/*font-family: 'arial', sans-serif;*/
	font-family: 'Open Sans', sans-serif;
	font-size:1.25em;
	/*letter-spacing: .25em;*/
	/*transform: scale(1, 1.5);*/
	transform: scale(1, 1);
	font-weight:999;
	/*text-decoration:underline;*/
	}

.jtxt {text-align: justify; text-justify: inter-word; font-size:1em;}


.line50 {line-height: .25em;}
.line5 {line-height: .1em; background-color:blue;}

/*.bord {border: 5px solid #888; border-radius: 8px; box-shadow: 4px 5px #339; margin:auto;}*/
.dblshad	{text-shadow: 2px 2px #bbb, 3px 3px #000;}
.glowShad	{text-shadow: 0 0 3px #FF0000, 0 0 5px #0000FF;} /*Text-shadow with a red and blue neon glow:*/
.hardShad	{text-shadow: 1px 1px #999, -2px -2px #999;}
/*.narrow 	{line-height: 1;}*/
.shad		{text-shadow: -1px 3px #888;}
.uline		{text-decoration: underline;} 


.rndImage	{border-radius: 15px;}

.bg01	{background: #ffcb47;}

.bg02	{background: lime;} 
.break {
	background: black;
	width:96%;
	height: 20px;
	margin: 15px;
	border: 3px solid;
	border-radius: 8px;
	}



/* responsive		moved below to @media680 */











/* ============STRUCTURE=============== */
.wrapper {
  padding: 5px;
  max-width: 95%;
/*   max-width: 960px; */
  width: 95%;
/*   margin: 20px auto; */
  margin: 20px auto;
	background:skyblue;
	border:3px solid red;
	box-shadow: 5px 10px #000;
}

header {
  /* padding: 0 15px; */
	text-align:center;
	vertical-align: middle;
	line-height:20%;
/* background:teal; */
/* background-color;red; */
}

.headline {	font-size:300%;}

.columns {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin: 5px 0;
}

.column {
  flex: 1;
  border: 1px solid gray;
  margin: 2px;
  padding: 10px;
}
.column:first-child {
  margin-left: 0;
}
.column:last-child {
  margin-right: 0;
}

footer {
  padding: 0 15px;
}






/* ---- ONLY ONE BREAKPOINT ---- */
						/* study - flex-basis*/
@media screen and (max-width: 980px) {
	.columns .column {
		flex-basis: 100%;
		margin: 0 0 5px 0;
		font-size: 180%;
	}
	h2 {font-size: 200%;} 
	.s300 {font-size: 200%;}
	iframe {width:640px; height:480px;}
	audio {height: 50%;}
 	.responsive {width: 100%; height: auto;	} 
}