.grid{
	display:grid;
	grid-template-columns:1fr 1fr 1fr;

}



.pest{
	grid-column:1/4;
}

.pestName{
	font-size: 40px;
	font-weight: bold;
	text-align:right;
	margin-right:10%;
	margin-top:50px;
	color:#0682CD
}

.pestLine{
	width:82%;
	margin:auto;
}



.pestInfo{
	margin-top:50px;
	float:right;
	margin-right:10%;
	width:80%;
	font-size: 20px
}

.pestSigns{
	grid-column:1/4;
	width:80%;
	margin-left:8%;
	margin-top:70px;
	margin-bottom:80px;
	padding: 15px;
	border-radius: 15px;
	border: 5px solid #5C5E61;
	background-color:#EFF0F1;
	font-size: 20px;
	line-height: 1.3
}

.birdPics{
	grid-column:1/4
}
.gallery {
	margin:auto;
  width: 1150px;
  padding: px;
  background: white;
  box-shadow: 0 1px 2px rgba(0,0,0,.3);
}

.gallery > div {

  position: relative;
  float: left;
  padding: 15px;
}

.gallery > div > img {

  display: block;
  width: 300px;
height:250px;
  transition: .1s transform;
  transform: translateZ(0); /* hack */
}

.gallery > div:hover {
  z-index: 1;
}



.cf:before, .cf:after {
  display: table;
  content: "";
  line-height: 0;
}

.cf:after {
  clear: both;
}


#slide{
	width:200px;
	height:400px
}



@media screen and (max-width:580px){
	.gallery {display: none}
}
@media screen and (max-width:600px){
	.pestSigns{margin-left:5%; font-size: 17px}
	.pestInfo{font-size: 17px}
}
@media screen and (max-width:680px){
	#name{
		margin-top:20px;
	}
	#name li {
		display:block;
		border:none;
		margin:5px
	}
}
@media screen and (max-width:740px){
	.gallery {width: 540px}
	#slide{
	width:150px;
	height:300px
	}
}
@media screen and (max-width:1100px){
	#pestPic{display:none}
	.pestInfo{width:80%; margin-left:10%; float:none}
}


@media screen and (max-width:1200px){
	.gallery {width: 700px}
}
