.container-wrapper {
  width: 400px;
  height: 400px;
  overflow: hidden;
  position: relative;
}

.border-with-padding {
  border: 10px solid rgb(220,220,220); /* 设置绿色边框 */
  padding: -10px; /* 添加10px的内边距 */
}

.container {
width: 100%; 
height: 100%; 
  background-image: url('bottom.jpg'); /* 第一个背景图 */
  background-size: cover;
  background-position: center;
  position: absolute;
  border: 10px solid rgb(220,220,220); /* 设置10px的白色边框 */
  padding: 10px; /* 设置内边距为10px，用于给图片腾出空间 */
  box-sizing: border-box; /* 让边框的宽度包含在容器的总宽度内 */
}
.inner-container {
  width: 400px; /* 容器的宽度 */
  height: 400px; /* 容器的高度 */
  background-image: url('top.png'); /* 第二个背景图 */
  background-size: cover;
  background-position: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
 
}


body{

  background-color: black;
  color:white;
  height:100vh;
margin:10px;

  
}

#upload {
  /* 隐藏默认的上传按钮 */
  display: none;

}

.custom-file-upload {
  /* 自定义按钮的样式 */
  display: inline-block;
  text-align: center;
  padding: 10px 50px; /* 设置按钮大小 */
  background-color: green; /* 设置按钮背景颜色 */
  color: white; /* 设置按钮文字颜色 */
  border: none; /* 去掉边框 */
  cursor: pointer; /* 鼠标移上去显示手型 */

}

.custom-file-upload:hover {
  /* 鼠标移上去时的样式 */
  background-color: darkgreen; /* 修改背景颜色 */


}


canvas {
  display: none; /* 隐藏Canvas元素 */
}

#save-as-image {

margin-left:150px;

}




#section2 {
font-family: 'Arial', sans-serif; /* 使用Arial字体 */
background-color: #000; /* 设置背景颜色 */
margin-top: 10px;
margin-left:-18px;
padding: 0;
text-decoration: none;
text-align: left;
color: white;
background-color: transparent;
display: inline-block; /* 或者可以使用 block，具体根据布局需求选择 */
padding: 8px 15px; /* 添加内边距 */
border-radius: 5px;
transition: background-color 0.3s ease; /* 添加过渡效果 */
position: fixed; /* 将元素固定在页面上 */
bottom: 3px; /* 将元素置于页面的底部 */
}



#section2 a {
background-color: #000; /* 设置背景颜色 */
text-decoration: none;
color: white;
font-size: 14px; /* 增加字号 */
font-weight: bold; /* 加粗 */
border: 2px solid white;
padding: 8px 15px; /* 添加内边距 */
border-radius: 5px;
transition: background-color 0.3s ease; /* 添加过渡效果 */
}

#section2 a:hover {
text-decoration: underline;
}

