* {
  list-style:none;
  margin:0;
  padding:0 
}
  body {
	  background-color: #98a7b4;
	  margin-top: 5px;
	}
    b {
      font-size: 22px;
      color: white;
      padding: 5px;
    }

    p {
      background-color: black;
      text-align: center;
    }

    .imgs {
      width: 352px;
    } 
    section {
      width: 1000px;
      display: flex;
    }
#wrapper {
  width:515px;
  margin:5% auto;
  border:1px solid #ccc;
  padding:5px 0 5px 5px;
  overflow:hidden
}
#wrapper li {
  float:left;
  margin-right:5px;
  width:115px;
  height:100px;
  border:1px solid #ccc;
  text-align:center;
  padding:3px
}
#wrapper li img {
  max-height:98%;
  max-width:98%;
  cursor:pointer
}
.modal {
  position:fixed;
  background-color:rgba(0, 0, 0, 0.5);
  height:100%;
  width:100%;
  top:0;
  left:0;
  display:none
}
.modalWrap {
  border:1px solid #000;
  background:#fff;
  width:1280px;
  max-height:1280px;
  margin:5% auto;
  position:relative
}
.modalWrap #close {
  display:block;
  height:24px;
  width:24px;
  border-radius:8px;
  cursor:pointer;
  background:#900;
  color:#fff;
  font:14px Georgia, "Times New Roman", Times, serif;
  line-height:24px;
  text-align:center;
  position:absolute;
  top:-10px;
  right:-10px
}
#yourDiv {
  padding:5px;
  text-align:center;
  height: 700px; 
}
#yourDiv img {
  width:100%;
  height:100%;
}