* {
box-sizing: border-box;
}


.column {
float: left;
width: 33.33%;
padding: 15px;
background-color:#5edb88;
border:1px solid grey;
}




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


h1 {
font-size: 2em;
color: red;
line-height: 1.15em;
margin: 20px 0 ;
color:darkgreen;
font-family:monotype-corsiva;
text-align:center;
border:2px solid grey;
}

.img_left{
	float:100%;
	width:100%;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:7px;
	margin-top:3px;
	border: 2px solid red;
	padding:3px;
}
.img_right{
	float:100%;
	width:100%;
	margin-top:3px;
	margin-left:3px;
	margin-right:3px;
	border:2px solid orange;
	padding:3px;
}
.img_righte{
	float:100%;
	width:100%;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:7px;
	margin-top:3px;
	border: 2px solid green;
	padding:3px;
}

.img_center{
width:100%;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom:3px;
border:2px solid purple;
padding:3px;
}

.img_centeri{
	float:100%;
	width:100%;
	margin-left:3px;
	margin-right:3px;
	margin-bottom:7px;
	margin-top:3px;
	border: 2px solid blue;
	padding:3px;
}
.p1 {
	font-family:Gabriola;
	font-size:25px;
	color:purple;
	margin-top:20px;
	margin-bottom:15px;
	padding:2px;
}

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

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

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

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

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

}