

	* {
		box-sizing: border-box;
	}
	.topbox {
		overflow: hidden;
		background: pink;
		width: 100%;
	}
	
	.column1 {
		float: left;
		width:60%;
		padding: 10px;
	
	}
	.column2 {
		float: left;
		width:40%;
		padding: 10px;
		background: #008080;
	}
	 .row:after {
		 content: "";
		 display: table;
		 clear: both;
	 }
	/***********Writing styles**********/

h2 {
font-size: 2em;
color: #2262AD;
line-height: 1.15em;
margin: 30px 0 ;
color:#1E90FF;
font-family:monotype-corsiva;
text-align:center;
}

/*** connect with class="p1" ***/
.p1 {
font-family:arial;
font-size:25px;
}
.p1::first-letter {
font-size:55px;
font-family:monotype corsiva;
font-style:italic;

}
.p1::first-line {
font-size:30px;
color:navy blue;
}

/*** connect with class="p2" ***/
.p2 {
font-family:arial;
font-size:20px;
color:white;
}


/***********images****************/

/*using for column 2*/

.img_left{
float:left;
width:50%;
margin-top:3px;
margin-left:5px;
margin-right:8px;
border:4px solid pink;
padding:2px;
}
.img_right{
float:right;
width:50%;
margin-top:3px;
margin-left:5px;
margin-right:5px;
border:4px solid pink;
padding:2px;
}
/*using for column 1*/
.img_center{
width:80%;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom:5px;
}



/*****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:0%;
margin-bottom:5px;
}

.column1 {
width: 100%;
margin-bottom:5px;
border:2px solid gray;
}

.column2 {
width: 100%;
margin-bottom:5px;
}



.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;
}

}/*closes @media section*/
	
	
	
	
	
