add video link

index_withoutAmp.html

@@ -321,8 +321,8 @@
             </div>
             <div class="col-12 col-md-6 col-xl-4">
               <div class="card text-dark mb-4" style="border: none;">
-                <div class="card__imgfr">
-                  <img src="./imgs/hero-img.jpg"
+                <div class="card__imgfr" onclick="window.open('https://youtu.be/OkOCk6V9tmo')">
+                  <img src="./imgs/dog.png"
                     width="266"
                     height="150"
                     layout="responsive"
@@ -337,24 +337,24 @@
                     class="card__play"
                   >
                   </img>
-                  <span class="card__comingSoon">敬請期待</span>
+                  <!-- <span class="card__comingSoon">敬請期待</span> -->
                 </div>
                 <div class="card-body p-4 position-relative">
-                  <h5 class="card-title text-start">度度客群眾募資平台</h5>
-                  <p class="card-text text-start">度度客dodoker是一個群眾募資平台，擔任陪跑教練的角色，陪伴提案人發想，並推行社會公益群募專案，提供上架諮詢、前置研究、文案撰寫、短片拍攝、行銷宣傳等服務。
-                    我們希望透過網路科技及社群經營，集結眾人之力，改變或解決社會問題。
+                  <h5 class="card-title text-start">台灣導盲犬協會</h5>
+                  <p class="card-text text-start">協會主要目標是建立並推動導盲犬制度，讓台灣的視障者除了使用白手杖外，也有使用導盲犬的權利。
+                    主要工作內容包括導盲犬觀念的推廣、本土導盲犬的培育繁殖、導盲犬的訓練、相關法令推動與宣導，並且將訓練成功的導盲犬，免費提供給視障者。
                   </p>
                   <p class="card-text">
-                    <a href="https://www.dodoker.com/" target="_blank" class="d-flex align-items-center card-learn">
-                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解度度客群眾募資平台</small>
+                    <a href="http://www.guidedog.org.tw" target="_blank" class="d-flex align-items-center card-learn">
+                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解台灣導盲犬協會</small>
                     </a>
                   </p>
                   <div class="d-flex justify-content-between position-absolute" style="left: 1.5rem; bottom: 2rem; width: calc(100% - 3rem);">
                     <div class="d-flex">
-                      <a href="https://www.youtube.com/channel/UCHvdB02DX58W2vRQPTLcAPw" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
-                      <a href="https://www.facebook.com/dodoker/" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.youtube.com/channel/UCzsepV8mqo9vS3f4PWB0T2A" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.facebook.com/TWGDA" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
                     </div>
-                    <a href="https://www.dodoker.com/index.php?r=project%2Findex" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
+                    <a href="http://www.guidedog.org.tw/donation/donation-1.html" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
                   </div>
                 </div>
               </div>
@@ -380,20 +380,21 @@
                   <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4 position-relative">
-                  <h5 class="card-title text-start">天下顧問<small>（B型企業）</small></h5>
-                  <p class="card-text text-start">天下顧問是一個組織健檢平台，組織可在網上填答問卷內容，再經由具豐富經驗的顧問針對企業狀況能夠幫助企業將資源做最有效的整合，對診斷報告進行討論，進而規劃出合適的方案與策略，並確實執行與追蹤。
+                  <h5 class="card-title text-start">度度客群眾募資平台</h5>
+                  <p class="card-text text-start">度度客dodoker是一個群眾募資平台，擔任陪跑教練的角色，陪伴提案人發想，並推行社會公益群募專案，提供上架諮詢、前置研究、文案撰寫、短片拍攝、行銷宣傳等服務。
+                    我們希望透過網路科技及社群經營，集結眾人之力，改變或解決社會問題。
                   </p>
                   <p class="card-text">
-                    <a href="https://www.welohas.org/" target="_blank" class="d-flex align-items-center card-learn">
-                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解天下顧問</small>
+                    <a href="https://www.dodoker.com/" target="_blank" class="d-flex align-items-center card-learn">
+                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解度度客群眾募資平台</small>
                     </a>
                   </p>
                   <div class="d-flex justify-content-between position-absolute" style="left: 1.5rem; bottom: 2rem; width: calc(100% - 3rem);">
                     <div class="d-flex">
-                      <a href="https://www.youtube.com/channel/UCHt-2v9UToNOB8-YDbbAGFg" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
-                      <a href="https://www.facebook.com/%E5%A4%A9%E4%B8%8B%E9%A1%A7%E5%95%8F%E8%82%A1%E4%BB%BD%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8-661010837376000/" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.youtube.com/channel/UCHvdB02DX58W2vRQPTLcAPw" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.facebook.com/dodoker/" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
                     </div>
-                    <a href="https://www.welohas.org/" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
+                    <a href="https://www.dodoker.com/index.php?r=project%2Findex" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
                   </div>
                 </div>
               </div>
@@ -419,25 +420,25 @@
                   <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4 position-relative">
-                  <h5 class="card-title text-start">台灣導盲犬協會</h5>
-                  <p class="card-text text-start">協會主要目標是建立並推動導盲犬制度，讓台灣的視障者除了使用白手杖外，也有使用導盲犬的權利。
-                    主要工作內容包括導盲犬觀念的推廣、本土導盲犬的培育繁殖、導盲犬的訓練、相關法令推動與宣導，並且將訓練成功的導盲犬，免費提供給視障者。
+                  <h5 class="card-title text-start">天下顧問<small>（B型企業）</small></h5>
+                  <p class="card-text text-start">天下顧問是一個組織健檢平台，組織可在網上填答問卷內容，再經由具豐富經驗的顧問針對企業狀況能夠幫助企業將資源做最有效的整合，對診斷報告進行討論，進而規劃出合適的方案與策略，並確實執行與追蹤。
                   </p>
                   <p class="card-text">
-                    <a href="http://www.guidedog.org.tw" target="_blank" class="d-flex align-items-center card-learn">
-                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解台灣導盲犬協會</small>
+                    <a href="https://www.welohas.org/" target="_blank" class="d-flex align-items-center card-learn">
+                      <i class="fas fa-angle-double-right"></i><small class="me-1">深入瞭解天下顧問</small>
                     </a>
                   </p>
                   <div class="d-flex justify-content-between position-absolute" style="left: 1.5rem; bottom: 2rem; width: calc(100% - 3rem);">
                     <div class="d-flex">
-                      <a href="https://www.youtube.com/channel/UCzsepV8mqo9vS3f4PWB0T2A" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
-                      <a href="https://www.facebook.com/TWGDA" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.youtube.com/channel/UCHt-2v9UToNOB8-YDbbAGFg" class="me-1 card-learn"><i class="fab fa-youtube" style="font-size: 2rem;"></i></a>
+                      <a href="https://www.facebook.com/%E5%A4%A9%E4%B8%8B%E9%A1%A7%E5%95%8F%E8%82%A1%E4%BB%BD%E6%9C%89%E9%99%90%E5%85%AC%E5%8F%B8-661010837376000/" class="ms-1 card-learn"><i class="fab fa-facebook-square" style="font-size: 2rem;"></i></a>
                     </div>
-                    <a href="http://www.guidedog.org.tw/donation/donation-1.html" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
+                    <a href="https://www.welohas.org/" class="btn btn-yellow__fill"  target="_blank">愛心捐款</a>
                   </div>
                 </div>
               </div>
             </div>
+         
             <div class="col-12 col-md-6 col-xl-4">
               <div class="card text-dark mb-4" style="border: none;">
                 <div class="card__imgfr">