 <style>
        /* 轮播图区域样式 */
        .carousel {
            position: relative;
            width: 100%;
            max-width: 100%;
            margin: auto;
            overflow: hidden;
        }

        /* 图片容器 */
        .carousel-images {
            display: flex;
            transition: transform 0.5s ease-in-out;
        }

        .carousel-images img {
            width: 100%;
            height: auto;
        }

        /* header 样式 */
        header {
            position: relative;
            text-align: center;
            color: white;
            padding: 0;
            margin-bottom: 0;
            z-index: 1; /* 将 z-index 设置为 1，确保文字不会被导航栏覆盖 */
        }

        /* 标题样式 */
        header h1 {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
     font-size: 5em;
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
            z-index: 10;
        }

        h2{
        font-size: 28px;
        padding-top: 40px;
        padding-bottom: 20px;
        text-align: center;
        }

        h3{
        font-size: 20px;
        text-align: left;
        padding-left: 10px;
        padding-right: 10px;
        }

        p{
        font-size: 15px;
        line-height: 1.6;

        padding-left: 10px;
        padding-right: 10px;
        }
 /* 表格樣式 */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 1em;
    border-radius: 10px;
    overflow: hidden;
}

table th, table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #ddd;
}

table th {
    background-color: #f4a460;
    color: #fff;
}

table tr:nth-child(even) {
    background-color: #fdf8f4;
}


        /* 導航區樣式 */
         nav {
         position: fixed; /* 讓導航欄固定在頁面頂部 */
         top: 0; /* 距離頁面頂部0像素 */
         left: 0;
         width: 100%; /* 占滿頁面寬度 */
         display: flex;
         justify-content: center;
         background-color: #333;
         z-index: 10; /* 確保在其他元素上方 */
         padding: 1px 0;
         box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); /* 增加陰影效果 */
        }
	.navbar img {
            height:10px
            margin-right: 5px
        }
        nav a {
         color: white;
         text-decoration: none;
         padding: 15px 20px;
         font-weight: bold;
         transition: background-color 0.3s, color 0.3s;
         margin: 0 15px;
         font-size: 1.2em;
        }

        nav a:hover {
         background-color: #dfba69; /* 增加懸停時的背景顏色 */
         color: #fff;
        }
/*紅茶種類內容*/
    #Center{
        width: 960px;
        height: 600px;
        margin-left: auto;
        margin-right: auto;
        padding-top: 30px;
    }

    #box-1{
        width:280px ;
        height: 360px;
        float: left;
        margin-left: 30px;
    }
    
    #box-2{
        width:280px ;
        height: 360px;
        float: left;
        margin-left: 30px;
    }

    #box-3{
        width:280px ;
        height: 360px;
        float: left;
        margin-left: 30px;
    }

   
        /* 區塊樣式 */
        .content {
            padding: 0px;
            text-align: center;
            margin: 30px auto;
            max-width: 800px;
            border-radius: 15px;
        }
        /* Back to top button */
        .back-to-top {
            margin-top: 80px;
            display: inline-block;
            background-color: #dfba69;
            color: white;
            font-size: .8em;
            padding: 10px 20px;
            text-decoration: none;
            border-radius: 5px;
        }

        .back-to-top:hover {
            background-color: #c79d41;
        }

       /* 頁尾 */
        footer {
         background-color: #ffffff;
         color: #333;
         text-align: center;
        }

    </style>