.popup {  
    display: none; /* 默认不显示 */  
    position: fixed; /* 固定定位 */  
    z-index: 2; /* 置于顶层 */  
    left: 0%;  
    top: 0%;  
    width: 100%; /* 宽度占满整个屏幕 */  
    height: 100%; /* 高度占满整个屏幕 */  
    background-color: rgba(0,0,0,0.4); /* 半透明黑色背景 */  
    margin-top: 75px;
    
}  
.popup-image {  
    margin: auto;  
    display: block;  
    max-width: 100%; /* 宽度自适应容器 */  
    height: auto; /* 高度自适应 */  
    margin: 0 auto; /* 居中显示 */ 
    width: 80%; /* 图片宽度 */  
    max-width: 700px; /* 最大宽度 */
    margin-top: 220px;
}  
.close {  
    
    position: absolute;  
    top: 15px;  
    right: 35px;  
    color: #f1f1f1;  
    font-size: 40px;  
    font-weight: bold;  
    transition: 0.3s;  
    cursor: pointer;  
}  
  
.close:hover,  
.close:focus {  
    color: #bbb;  
    text-decoration: none;  
    cursor: pointer;  
}