{
box-sizing: border-box;
}

/*Sets up area on page for columns*/
.col-container {
color: grey;
display: table;
width: 100%;
/*word-wrap: break-word;*/
}
/*First column controls*/
.col_1 {
display: table-cell;
padding: 16px;
width:50%;
border: 3px solid grey;
}
/*Second column controls*/
.col_2 {
display: table-cell;
padding: 16px;
width:50%;
border: 3px solid grey;
}

/*Image control to be on left side*/
.img_left{
width:55%;
border:2px solid grey;
float:left;
margin:7px;
}
/*Image control to be on right side*/
.img_right{
width:55%;
border:2px solid grey;
float:right;
margin:7px;
}

/* If the browser window is smaller than 600px, make the columns stack on top of each other */
@media only screen and (max-width: 600px) {
.col_1 {
display: block;
width: 100%;
}

.col_2 {
display: block;
width: 100%;
}

.img_left{
width:100%;
border:2px solid grey;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}

.img_right{
width:100%;
border:2px solid grey;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}