body{
    background-image: url("../images/S背景.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;  /* 背景圖片會被置中顯示，避免圖片過度偏移。 */
 
    height: 100%; /* 使容器高度為螢幕高度 */

}
.card{
    background:rgb(248, 241, 200);
    border:dashed 5px rgb(8, 8, 8);
    padding: middle;
    margin-top: 3.5rem;

    width: 300px;
    height:  500px;
    margin:  90px 90px 10px 90px;  /* 四個方向間距*/
    padding: 2px; /* 內間距*/
}

.card img {

        width: 250px;
        height: 250px;         /* 控制圖片大小可選 */
        margin: 15px 15px 5px 15px;   /* 四個方向間距*/
    }

    
.card-text{
    margin:  0px 5px 10px 5px;     /* 四個方向間距*/
    }

.card-botton{
  text-align: center;
  
}

footer{
     background: linear-gradient(#3869dd1c, #86d3f157,  #79ebd27e); /*背景漸成*/
    color: black; 
    height: 60px;  /*區塊高度*/
    font-size: 20px; /*字體大小*/
    display: flex; 
    justify-content: center;
    align-items: center;
    /* position: fixed; */
    /* bottom: 0;             固定在視窗底部 */
    /* width: 100%;       寬度設為100% */
}