body{ margin:0; padding:0; color:#333333;font-size:16px; font-family:Microsoft YaHei; background:url(../images/wmcl_01.jpg) repeat-x top center; }
div,ul,li,span,p,h1,h2,h3,h4,h5{ margin:0; padding:0; display:block}

a{ text-decoration:none; color:#333333 }
a:hover{ text-decoration:none; color:#c53c37}
img{ border:none}
.clear{ clear:both;}

.container{ width:1200px; margin: 0 auto;}
.top{width:1200px; height:459px; background:url("../images/wmcl_02.jpg") no-repeat 0 0; margin-bottom: 5px;}

ul{width:1200px; height:auto;}
ul li{width:1200px; height:237px; margin-bottom: 5px;}

.footer{ width:100%; height:188px; background: url("../images/wmcl_07.jpg") no-repeat top center;}


/* 隐藏默认音频控件 */
    audio {
      display: none;
    }

    /* 自定义按钮样式 */
    .audio-btn {
      --btn-size: 60px; /* 按钮尺寸变量 */
      width: var(--btn-size);
      height: var(--btn-size);
      border: none;
      border-radius: 50%;
      background: #ffffff;
	  border:2px solid #35aae6;
      color:#35aae6;
      font-size: 24px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15);
      transition: transform 0.3s ease;
	  
    }
    

    .audio-btn:hover {
      transform: scale(1.05);
    }

    /* 播放状态下的暂停图标 */
    .audio-btn.playing {
      content: "\f04c"; /* Font Awesome暂停图标 */
    }

    /* 图标字体 */
    @font-face {
      font-family: 'FontAwesome';
      src: url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/webfonts/fa-solid-900.woff2') format('woff2');
    }

    .audio-btn::before {
      font-family: 'FontAwesome';
      content: "\f04b"; /* 播放图标 */
    }

    .audio-btn.playing::before {
      content: "\f04c"; /* 暂停图标 */
    }


button{ display: block; width: 100px; height: 100px; margin-top: 40px; float: right;}
 












