/*last edit by Rachel, as of: July 20, 1:42PM*/

@media(max-width:499px){
.header{
	font-family:Arial;
	width:100%;
}
.header li {
	list-style-type:none;
}
.row1{
	display:flex;
	width:100%;
	padding:0;
	margin:0;
	text-align:center;	
}	
.row1 li{
	border:1px solid black;
}

.row2{
	display:flex;
	width:100%;
	padding:0;
	margin:0;
}
.row2 li{
	border:1px solid black;
}	

.row3{
	display:flex;
	width:100%;
	padding:0;
	margin:0;
}	
.row3 li{

}

  h2{
    border:1px solid black;
    text-align:center;
    padding:10px;
    margin:5%;
  } 
  
  .footer{
    margin:20%;
  }
}

@media(min-width:500px){ /*for desktop display*/

h1{
	font-size:1em;
	text-align:center;
}

/*header styling*/
.header{
	border:1px solid black;
}

.header li{
	list-style-type:none;
	border:1px solid black;
}

		/*first row*/
.row1{
	height:20%;
}
.row1 li {
	float:left;
}

.logo{
	width:20%;
}

.place{
	width:70%;
	background:red;
}

.changeLoc{
	width:10%;

}

		/*second row*/
.row2 {
	clear:both;
}

.row2 li{
	float:left;
}

		/*third row*/
.row3 {
	clear:both;
}

.row3 li{
	float:left;
}

/*content*/
.cols{
	clear:both;
}

.mainButton browse{
	float:left;
}
  h2{
    border:1px solid black;
    padding:20px 20px;
    margin:15%;
    background:#B2B2B2;
    text-align:center;
  }

/*footer styling*/
.footer{
  clear:both;
  text-align:center;

}

}