* {
	box-sizing: border-box;
}

.topbox {
overflow: hidden;
width:100%;
}



/* Create three equal coulumns that float next to each other*/
.column {
	float: left;
	width: 50%;
	padding: 15px;
	color: skyblue;
}




/* Clear floats after the coulumns */
.row:after {
	content: "";
	display: table;
	clear: both;
}

/*** connect with class="p1" ***/
.p1 {
font-family:monotype-corsiva;
color:black;
font-size: 20px;
background: white;
}


h1 {
	color: black;
	font-family: ink free;
	font-size: 25px;
	text-align: center;
	margin-bottom: 5px;
	background: violet;
}

.img_center{
	width: 95%;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 5px;
	border: 2px solid black;
	padding: 2px;
}

.img_left{
float:left;
width:75%;
margin-top:3px;
margin-left:5px;
margin-right:8px;
border:2px solid black;
padding:2px;
}
.img_right{
float:right;
width:75%;
margin-top:3px;
margin-left:5px;
margin-right:5px;
border:2px solid black;
padding:2px;
}

/*****MEDIA QUERY-changes website for mobile or smaller screens*****/
@media only screen and (max-width : 800px) {

/***Place other @media controls below here***/

/******COLUMN @media**********/

.topbox{
width:100%;
margin-bottom:5px;
}

.column {
width: 100%;
margin-bottom:5px;
border:2px solid gray;
}


.img_left{
width:100%;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom:7px;
}
.img_right{
width:100%;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom:7px;
}



}