add hovers, logos

css/style.css

@@ -627,6 +627,10 @@ input[type="radio"][class="style"]:checked + label {
   padding: .5rem 1rem;
 }
 
+.nav-link {
+  cursor: pointer;
+}
+
 .hero {
   height: 42rem;
   background-position: center;
@@ -786,6 +790,25 @@ input[type="radio"][class="style"]:checked + label {
   cursor: pointer;
 }
 
+.cards .card__imgfr::before {
+  content: " ";
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background-color: rgba(0, 0, 0, 0.25);
+  display: none;
+}
+
+.cards .card__imgfr:hover::before {
+  display: block;
+}
+
+.cards .card__imgfr:hover .card__comingSoon {
+  display: inline-block;
+}
+
 .cards .card__play {
   position: absolute;
   left: 50%;
@@ -807,6 +830,20 @@ input[type="radio"][class="style"]:checked + label {
   height: 340px;
 }
 
+.cards .card__comingSoon {
+  display: inline-block;
+  border: 2px solid white;
+  font-weight: 600;
+  color: white;
+  padding: .3rem;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  display: none;
+}
+
 .cards .card-img-top {
   height: 16rem;
 }
@@ -886,4 +923,10 @@ input[type="radio"][class="style"]:checked + label {
     width: 90%;
   }
 }
+
+@media (min-width: 1400px) {
+  .hero .container {
+    max-width: 1190px;
+  }
+}
 /*# sourceMappingURL=style.css.map */

css/style.scss

@@ -583,6 +583,10 @@ input[type="radio"][class="style"]:checked + label {
 	padding: .5rem 1rem;
 }
 
+.nav-link {
+	cursor: pointer;
+}
+
 .hero {
 	height: 42rem;
 	background-position: center;
@@ -706,6 +710,24 @@ input[type="radio"][class="style"]:checked + label {
 		&__imgfr {
 			position: relative;
 			cursor: pointer;
+			&::before {
+				content: " ";
+				position: absolute;
+				width: 100%;
+				height: 100%;
+				top: 0;
+				left: 0;
+				background-color: rgba(0, 0, 0, 0.25);
+				display: none;
+			}
+			&:hover {
+				&::before {
+					display: block;
+				}
+				.card__comingSoon {
+					display: inline-block;
+				}
+			}
 		}
 		&__play {
 			position: absolute;
@@ -723,6 +745,18 @@ input[type="radio"][class="style"]:checked + label {
 		&-body {
 			height: 340px;
 		}
+		&__comingSoon {
+			display: inline-block;
+			border: 2px solid white;
+			font-weight: 600;
+			color: white;
+			padding: .3rem;
+			position: absolute;
+			left: 50%;
+			top: 50%;
+			transform: translate(-50%, -50%);
+			display: none;
+		}
 	}
 	.card-img-top {
 		height: 16rem;
@@ -792,4 +826,12 @@ input[type="radio"][class="style"]:checked + label {
 		width: 90%;
 	}
 }
+
+.hero {
+	.container {
+		@media (min-width: 1400px){
+			max-width: 1190px;
+		}
+	}
+}
  

imgs/dodoker.svg

@@ -0,0 +1,166 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 25.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="圖層_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 239.8 60" style="enable-background:new 0 0 239.8 60;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#FF7962;}
+	.st1{enable-background:new    ;}
+</style>
+<g>
+	<path class="st0" d="M59.9,20.4c-8.9,0-15.6,6.9-15.6,15.6s6.6,15.6,15.6,15.6S75.5,44.7,75.5,36S68.9,20.4,59.9,20.4z M59.9,45.6
+		c-5.2,0-9-4.3-9-9.6s3.9-9.6,9-9.6c5.2,0,9,4.3,9,9.6C68.9,41.2,65,45.6,59.9,45.6z"/>
+	<path class="st0" d="M131.3,20.4c-8.9,0-15.6,6.9-15.6,15.6s6.6,15.6,15.6,15.6s15.6-6.9,15.6-15.6S140.3,20.4,131.3,20.4z
+		 M131.3,45.6c-5.2,0-9-4.3-9-9.6s3.9-9.6,9-9.6c5.1,0,9,4.3,9,9.6C140.4,41.2,136.5,45.6,131.3,45.6z"/>
+	<path class="st0" d="M176.7,43.8c-0.4,0.1-0.7,0.3-1.5,0.3c-0.9,0-1.6-0.5-2.2-1.2c-0.9-1.4-1.7-2.8-2.5-4.2
+		c-0.2-0.3-0.4-0.6-0.5-0.9l0,0c-0.1-0.1-0.2-0.2-0.2-0.3l-0.1-0.1c-0.5-0.9-0.4-1.6-0.4-1.6c0-0.9,0.7-1.8,0.8-2l6.9-8.3
+		c0.5-0.6,0.7-1.2,0.7-1.9c0-1.7-1.4-2.9-3.1-2.9c-0.9,0-1.6,0.4-2.2,1.1l-10.1,12c-0.3,0.3-0.5,0.7-0.7,1.1l0,0
+		c0,0.1-0.1,0.2-0.1,0.3l0,0c-0.1,0.2-0.1,0.4-0.1,0.6v0.1l0,0l0,0c0,0.8,0.2,1.5,0.7,2.2c1,1.4,2,2.7,2.9,4.1
+		c1,1.4,1.9,2.8,2.9,4.2c0.5,0.7,1,1.4,1.6,2.1c0.3,0.4,0.6,0.8,1,1.2s0.9,0.9,1.8,1.4c0.4,0.2,1,0.4,1.7,0.5c0.6,0.1,1.2,0,1.7-0.2
+		c0.5-0.1,0.8-0.3,1.1-0.4c0.1-0.1,0.3-0.1,0.4-0.2l0.2-0.1l0.2-0.1c0.7-0.5,1.4-1,2.1-1.4l0,0l0.1-0.1c1.3-1,1.6-2.9,0.6-4.2
+		C179.7,43.5,178,43.1,176.7,43.8z"/>
+	<path class="st0" d="M205.9,40.9l-0.2,0.2c-0.2,0.2-2.9,3.1-5.2,3.9c-1.6,0.7-3.8,0.8-6.1,0.1c-3.9-1.2-7.2-6.3-5.9-11.5
+		c1.2-5.2,6.5-8.3,11.4-6.9c1.2,0.4,2.7,1.2,3.4,2.1l-9.2,6c-0.7,0.4-1,1-1.2,1.7c-0.5,1.6,0.4,3.2,2.1,3.7c0.8,0.3,1.6,0.2,2.4-0.4
+		l11.7-7.7c0.9-0.6,1.3-1.2,1.6-2c0.3-0.9,0.1-1.9-0.4-2.7c-1.4-2.3-4.3-5.1-8.7-6.4c-8.6-2.5-16.9,2.3-19.3,10.6
+		c-2.5,8.3,2.2,16.8,10.5,19.2c3.6,1.1,7,0.8,9.7-0.2c0.6-0.2,1.1-0.4,1.6-0.6c0.8-0.4,1.5-0.9,2.2-1.4s1.4-1,2-1.6
+		c0.3-0.3,0.6-0.6,1-0.9c0.3-0.3,0.6-0.7,1-1.1c0.9-1.1,0.9-2.7,0-3.8C209.1,40,207.2,39.9,205.9,40.9z"/>
+	<path class="st0" d="M113.7,45.9l-0.2-0.1c-1.8-0.6-2.2-1.9-2.3-2.3V12.6c0-1.8-1.4-3.2-3.2-3.2h-0.1h-0.1h-3.7c-1.7,0-3,1.4-3,3
+		c0,1.1,0.6,2.1,1.4,2.6s2.2,1.4,2.2,2.8s0,6.4,0,6.4c-2.6-2.3-6-3.7-9.8-3.7c-8.5,0-14.9,6.9-14.9,15.6s6.5,15.5,15,15.5
+		c3.8,0,7.2-1.4,9.8-3.6v0.3c0,1.4,0.9,2.6,2.1,3.1c0.4,0.2,0.8,0.3,1.3,0.3h4c1.7,0,3-1.4,3-3C115.2,47.3,114.8,46.3,113.7,45.9z
+		 M104.7,36c0,5.5-4,9.6-9,9.6s-9-4.1-9-9.6s4-9.6,9-9.6c4.9,0,8.8,3.9,9,9.2V36z"/>
+	<path class="st0" d="M42,45.9l-0.2-0.1c-1.8-0.6-2.2-1.9-2.3-2.3V12.6c0-1.8-1.4-3.2-3.2-3.2h-0.1h-0.1h-3.7c-1.7,0-3,1.4-3,3
+		c0,1.1,0.6,2.1,1.4,2.6s2.2,1.4,2.2,2.8s0,6.4,0,6.4c-2.6-2.3-6-3.7-9.8-3.7c-8.5,0-14.9,6.9-14.9,15.6s6.4,15.6,14.9,15.6
+		c3.8,0,7.2-1.4,9.8-3.6v0.3c0,1.4,0.9,2.6,2.1,3.1c0.4,0.2,0.8,0.3,1.3,0.3h4c1.7,0,3-1.4,3-3C43.5,47.3,43.1,46.3,42,45.9z M33,36
+		c0,5.5-4,9.6-9,9.6s-9-4.1-9-9.6s4-9.6,9-9.6c4.9,0,8.8,3.9,9,9.2V36z"/>
+	<path class="st0" d="M156.7,9.3L156.7,9.3L156.7,9.3L156.7,9.3c-0.1,0-0.1,0-0.2,0h-3.7c-1.7,0-3,1.4-3,3c0,1.1,0.6,2.1,1.4,2.6
+		c0.8,0.5,2.2,1.4,2.2,2.8c0,0.5,0,1.6,0,2.7l0,0v27.8c0,1.8,1.4,3.3,3.2,3.3s3.2-1.5,3.2-3.3V20.4v-7.8c0-0.6-0.1-1.1-0.4-1.6
+		C159,10,158,9.3,156.7,9.3z"/>
+	<path class="st0" d="M232.7,23.4c0-1.7-1.4-3-3-3c-2.1,0-4.6,3.3-6.8,6.7v-3.4c0-0.6-0.1-1.1-0.4-1.6c-0.5-1-1.6-1.7-2.8-1.7l0,0
+		l0,0h-0.1h-0.1h-3.7c-1.7,0-3,1.4-3,3c0,1.1,0.6,2.1,1.4,2.6c0.8,0.5,2.2,1.4,2.2,2.8c0,0.5,0,1.6,0,2.7l0,0v0.6l0,0v13.3
+		c0,0.2,0,0.5,0,0.7v2.2c0,1.8,1.4,3.3,3.2,3.3s3.2-1.5,3.2-3.3v-2.2c0-3.1-0.7-6.2,1-10.8c1.1-3.2,4.2-6.4,5.6-7.6
+		C231,26.6,232.8,26.6,232.7,23.4z"/>
+</g>
+<g class="st1">
+	<path d="M167.8,13.6c0-0.4,0.1-0.9,0.2-1.3c0.1-0.4,0.3-0.8,0.6-1.2c0.3-0.4,0.6-0.6,0.9-0.9c0.4-0.2,0.8-0.3,1.3-0.3
+		c0.2,0,0.4,0,0.6,0c0.2,0,0.3,0.1,0.4,0.1c0.2,0.1,0.3,0.2,0.2,0.5l-0.1,0.3c0,0.1-0.1,0.2-0.2,0.2s-0.2,0-0.3,0
+		c-0.1,0-0.2,0-0.3-0.1c-0.1,0-0.2,0-0.3,0c-0.3,0-0.5,0.1-0.7,0.2c-0.2,0.1-0.4,0.2-0.5,0.4c-0.1,0.2-0.3,0.4-0.3,0.6
+		s-0.2,0.4-0.2,0.7h0c0.1-0.1,0.3-0.3,0.5-0.4s0.5-0.2,0.8-0.2c0.3,0,0.6,0.1,0.8,0.2c0.3,0.1,0.5,0.3,0.6,0.5s0.3,0.4,0.4,0.7
+		c0.1,0.3,0.1,0.5,0.1,0.8c0,0.3-0.1,0.6-0.2,0.9c-0.1,0.3-0.2,0.5-0.4,0.7c-0.2,0.2-0.4,0.4-0.7,0.5c-0.3,0.1-0.6,0.2-0.9,0.2
+		c-0.3,0-0.7-0.1-1-0.2s-0.6-0.3-0.8-0.6c-0.2-0.3-0.4-0.6-0.6-1C167.9,14.5,167.8,14.1,167.8,13.6z M169.1,14c0,0.2,0,0.3,0.1,0.5
+		c0.1,0.2,0.2,0.4,0.3,0.5c0.1,0.2,0.3,0.3,0.4,0.4c0.2,0.1,0.3,0.1,0.5,0.1c0.3,0,0.5-0.1,0.7-0.3s0.3-0.5,0.3-0.8
+		c0-0.2,0-0.3-0.1-0.5s-0.1-0.3-0.2-0.4c-0.1-0.1-0.2-0.2-0.4-0.3c-0.2-0.1-0.3-0.1-0.6-0.1c-0.3,0-0.5,0.1-0.7,0.2
+		S169.1,13.8,169.1,14z"/>
+</g>
+<g class="st1">
+	<path d="M173.4,11.3h-0.1c-0.1,0-0.2-0.1-0.2-0.2V11c0-0.2,0.1-0.2,0.2-0.2h0.2v-0.6c0-0.2,0.1-0.2,0.2-0.2h0.2
+		c0.2,0,0.2,0.1,0.2,0.2v0.6h0.4c0.2,0,0.2,0.1,0.2,0.2v0.1c0,0.2-0.1,0.2-0.2,0.2h-0.4v1.1c0,0.1,0,0.2,0,0.3
+		c0,0.1,0.1,0.1,0.1,0.2c0,0,0.1,0.1,0.1,0.1c0.1,0,0.1,0,0.1,0c0.1,0,0.1,0,0.2,0.1c0,0,0.1,0.1,0.1,0.2v0.2c0,0.1,0,0.1-0.1,0.2
+		s-0.1,0.1-0.2,0.1c-0.1,0-0.2,0-0.4-0.1c-0.1,0-0.2-0.1-0.3-0.2c-0.1-0.1-0.2-0.2-0.3-0.3c-0.1-0.1-0.1-0.3-0.1-0.5V11.3z"/>
+	<path d="M175.3,9.8c0-0.2,0.1-0.2,0.2-0.2h0.2c0.2,0,0.2,0.1,0.2,0.2V11c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1c0,0,0,0,0,0.1h0
+		c0-0.1,0.1-0.1,0.1-0.2c0.1-0.1,0.1-0.1,0.2-0.2c0.1-0.1,0.2-0.1,0.3-0.1c0.1,0,0.2,0,0.3,0c0.3,0,0.5,0.1,0.7,0.2s0.3,0.4,0.3,0.8
+		v1.5c0,0.2-0.1,0.2-0.2,0.2h-0.2c-0.2,0-0.2-0.1-0.2-0.2v-1.4c0-0.2,0-0.3-0.1-0.4c-0.1-0.1-0.2-0.2-0.3-0.2c-0.1,0-0.2,0-0.3,0.1
+		s-0.2,0.1-0.3,0.2c-0.1,0.1-0.1,0.2-0.2,0.3c0,0.1-0.1,0.2-0.1,0.4v1.1c0,0.2-0.1,0.2-0.2,0.2h-0.2c-0.2,0-0.2-0.1-0.2-0.2V9.8z"/>
+</g>
+<g class="st1">
+	<path d="M182.7,10.3c0.1-0.2,0.2-0.3,0.4-0.3h0.6c0.2,0,0.4,0.1,0.4,0.3l2.1,5.8c0,0.1,0,0.2,0,0.3c-0.1,0.1-0.2,0.1-0.3,0.1h-0.4
+		c-0.2,0-0.4-0.1-0.4-0.3l-0.5-1.4h-2.3l-0.5,1.4c-0.1,0.2-0.2,0.3-0.4,0.3h-0.4c-0.1,0-0.2,0-0.3-0.1c-0.1-0.1-0.1-0.2,0-0.3
+		L182.7,10.3z M184.3,13.9l-0.6-1.8c0-0.1-0.1-0.2-0.1-0.3c0-0.1-0.1-0.2-0.1-0.3c0-0.1-0.1-0.2-0.1-0.4h0c0,0.1-0.1,0.3-0.1,0.4
+		c0,0.1-0.1,0.2-0.1,0.3c0,0.1-0.1,0.2-0.1,0.3l-0.6,1.8H184.3z"/>
+	<path d="M187,12.2c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v0.3c0,0,0,0.1,0,0.1c0,0,0,0,0,0.1c0,0,0,0,0,0.1h0
+		c0-0.1,0.1-0.2,0.2-0.3c0.1-0.1,0.2-0.2,0.3-0.3c0.1-0.1,0.3-0.2,0.5-0.3s0.4-0.1,0.6-0.1c0.5,0,0.9,0.1,1.2,0.4s0.4,0.7,0.4,1.4
+		v2.7c0,0.3-0.1,0.4-0.4,0.4h-0.4c-0.3,0-0.4-0.1-0.4-0.4v-2.4c0-0.3,0-0.5-0.1-0.7c-0.1-0.2-0.3-0.3-0.6-0.3c-0.2,0-0.4,0-0.6,0.1
+		c-0.2,0.1-0.3,0.2-0.4,0.3c-0.1,0.1-0.2,0.3-0.3,0.5c-0.1,0.2-0.1,0.4-0.1,0.6v1.8c0,0.3-0.1,0.4-0.4,0.4h-0.4
+		c-0.3,0-0.4-0.1-0.4-0.4V12.2z"/>
+	<path d="M192.5,12.2c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v0.3c0,0,0,0.1,0,0.1c0,0,0,0,0,0.1c0,0,0,0,0,0.1h0
+		c0-0.1,0.1-0.2,0.2-0.3c0.1-0.1,0.2-0.2,0.3-0.3c0.1-0.1,0.3-0.2,0.5-0.3c0.2-0.1,0.4-0.1,0.6-0.1c0.5,0,0.9,0.1,1.2,0.4
+		c0.3,0.3,0.4,0.7,0.4,1.4v2.7c0,0.3-0.1,0.4-0.4,0.4h-0.4c-0.3,0-0.4-0.1-0.4-0.4v-2.4c0-0.3,0-0.5-0.1-0.7s-0.3-0.3-0.6-0.3
+		c-0.2,0-0.4,0-0.6,0.1c-0.2,0.1-0.3,0.2-0.4,0.3s-0.2,0.3-0.3,0.5c-0.1,0.2-0.1,0.4-0.1,0.6v1.8c0,0.3-0.1,0.4-0.4,0.4h-0.4
+		c-0.3,0-0.4-0.1-0.4-0.4V12.2z"/>
+	<path d="M198.5,11c-0.3,0-0.4-0.1-0.4-0.4v-0.3c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v0.3c0,0.3-0.1,0.4-0.4,0.4H198.5z
+		 M198.1,12.2c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v4c0,0.3-0.1,0.4-0.4,0.4h-0.4c-0.3,0-0.4-0.1-0.4-0.4V12.2z"/>
+	<path d="M200,12.3c0-0.1,0-0.2,0-0.3c0.1-0.1,0.2-0.1,0.3-0.1h0.4c0.2,0,0.4,0.1,0.4,0.3l0.9,2.6c0,0.1,0,0.1,0.1,0.2
+		c0,0.1,0,0.2,0.1,0.2c0,0.1,0,0.2,0.1,0.3h0c0-0.1,0-0.2,0-0.3c0-0.1,0-0.1,0.1-0.2c0-0.1,0-0.2,0.1-0.2l0.9-2.6
+		c0.1-0.2,0.2-0.3,0.4-0.3h0.4c0.1,0,0.2,0,0.3,0.1s0.1,0.2,0,0.3l-1.4,4c-0.1,0.2-0.2,0.3-0.4,0.3h-0.7c-0.2,0-0.4-0.1-0.4-0.3
+		L200,12.3z"/>
+	<path d="M204.9,14.2c0-0.4,0.1-0.7,0.2-1c0.1-0.3,0.3-0.6,0.5-0.8s0.5-0.4,0.8-0.5c0.3-0.1,0.6-0.2,1-0.2c0.3,0,0.6,0.1,0.9,0.2
+		c0.3,0.1,0.5,0.3,0.7,0.5s0.3,0.4,0.4,0.7c0.1,0.3,0.1,0.6,0.1,0.9c0,0.1,0,0.2-0.1,0.3c-0.1,0.1-0.2,0.1-0.3,0.1h-2.9
+		c0,0.2,0.1,0.4,0.2,0.6s0.2,0.3,0.3,0.4s0.3,0.2,0.4,0.2s0.3,0.1,0.5,0.1c0.2,0,0.4,0,0.6-0.1s0.3-0.1,0.4-0.2
+		c0.1-0.1,0.2-0.1,0.3-0.1s0.2,0.1,0.2,0.2l0.1,0.2c0.1,0.2,0.1,0.4-0.1,0.5c-0.2,0.1-0.4,0.2-0.6,0.3c-0.3,0.1-0.6,0.2-1,0.2
+		c-0.4,0-0.7-0.1-1.1-0.2c-0.3-0.1-0.6-0.3-0.8-0.5c-0.2-0.2-0.4-0.5-0.5-0.8C205,14.8,204.9,14.5,204.9,14.2z M208.3,13.6
+		c0-0.3-0.1-0.6-0.3-0.8c-0.2-0.2-0.4-0.3-0.7-0.3c-0.3,0-0.6,0.1-0.8,0.3c-0.2,0.2-0.3,0.4-0.4,0.8H208.3z"/>
+	<path d="M210.3,12.2c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v0.4c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1h0
+		c0-0.1,0.1-0.3,0.2-0.4c0.1-0.1,0.2-0.3,0.3-0.4c0.1-0.1,0.3-0.2,0.4-0.3c0.1-0.1,0.3-0.1,0.5-0.1c0.1,0,0.2,0,0.3,0.1
+		s0.1,0.2,0.1,0.3v0.4c0,0.3-0.1,0.4-0.4,0.4c-0.2,0-0.4,0-0.6,0.1c-0.2,0.1-0.3,0.2-0.4,0.4c-0.1,0.2-0.2,0.3-0.2,0.5
+		c-0.1,0.2-0.1,0.4-0.1,0.6v1.5c0,0.3-0.1,0.4-0.4,0.4h-0.4c-0.3,0-0.4-0.1-0.4-0.4V12.2z"/>
+	<path d="M213.7,16.2c-0.1-0.1-0.2-0.1-0.2-0.2c0-0.1,0-0.2,0.1-0.3l0.1-0.2c0.1-0.1,0.1-0.2,0.2-0.2c0.1,0,0.2,0,0.3,0.1
+		c0.1,0.1,0.3,0.1,0.4,0.2c0.2,0.1,0.4,0.1,0.6,0.1c0.2,0,0.4,0,0.5-0.1c0.1-0.1,0.2-0.2,0.2-0.4c0-0.1-0.1-0.2-0.2-0.3
+		c-0.1-0.1-0.3-0.1-0.4-0.2c-0.2-0.1-0.4-0.1-0.6-0.2c-0.2-0.1-0.4-0.2-0.6-0.3c-0.2-0.1-0.3-0.3-0.4-0.4s-0.2-0.4-0.2-0.7
+		c0-0.2,0-0.4,0.1-0.6c0.1-0.2,0.2-0.3,0.4-0.4c0.2-0.1,0.4-0.2,0.6-0.3c0.2-0.1,0.5-0.1,0.7-0.1c0.3,0,0.6,0,0.8,0.1
+		c0.2,0.1,0.4,0.2,0.5,0.2c0.1,0.1,0.2,0.1,0.2,0.2c0,0.1,0,0.2,0,0.3l-0.1,0.2c-0.1,0.1-0.1,0.2-0.2,0.2c-0.1,0-0.2,0-0.3,0
+		c-0.1,0-0.2-0.1-0.4-0.2c-0.1-0.1-0.3-0.1-0.5-0.1c-0.2,0-0.4,0-0.5,0.1c-0.1,0.1-0.2,0.2-0.2,0.3c0,0.1,0.1,0.2,0.2,0.3
+		s0.3,0.2,0.4,0.2c0.2,0.1,0.4,0.1,0.6,0.2s0.4,0.2,0.6,0.3s0.3,0.3,0.4,0.4c0.1,0.2,0.2,0.4,0.2,0.7c0,0.2,0,0.4-0.1,0.6
+		s-0.2,0.3-0.4,0.5c-0.2,0.1-0.3,0.2-0.6,0.3c-0.2,0.1-0.5,0.1-0.7,0.1c-0.4,0-0.7-0.1-1-0.2S213.8,16.3,213.7,16.2z"/>
+	<path d="M217.6,15.2c0-0.2,0-0.4,0.1-0.6c0.1-0.2,0.2-0.3,0.4-0.4c0.1-0.1,0.3-0.2,0.5-0.3c0.2-0.1,0.4-0.1,0.6-0.2
+		s0.4-0.1,0.6-0.1c0.2,0,0.4,0,0.6,0h0.2v-0.1c0-0.3-0.1-0.5-0.3-0.7c-0.2-0.1-0.4-0.2-0.6-0.2c-0.2,0-0.4,0-0.6,0.1
+		c-0.2,0.1-0.3,0.1-0.4,0.2c-0.2,0.1-0.4,0.1-0.5-0.2l-0.1-0.2c-0.1-0.2-0.1-0.4,0.1-0.5c0.2-0.1,0.4-0.2,0.6-0.3
+		c0.3-0.1,0.6-0.1,0.9-0.1c0.6,0,1.1,0.2,1.4,0.5c0.3,0.3,0.5,0.8,0.5,1.4v2.6c0,0.3-0.1,0.4-0.4,0.4H221c-0.3,0-0.4-0.1-0.4-0.4V16
+		c0-0.1,0-0.1,0-0.1c0,0,0,0,0-0.1h0c-0.1,0.2-0.2,0.3-0.4,0.4c-0.1,0.1-0.3,0.2-0.5,0.3c-0.2,0.1-0.4,0.1-0.7,0.1
+		c-0.2,0-0.4,0-0.6-0.1c-0.2-0.1-0.4-0.2-0.5-0.3s-0.3-0.3-0.3-0.4C217.6,15.7,217.6,15.5,217.6,15.2z M218.7,15.1
+		c0,0.2,0.1,0.3,0.2,0.4s0.3,0.2,0.5,0.2c0.2,0,0.3,0,0.5-0.1c0.1-0.1,0.2-0.2,0.3-0.3c0.1-0.1,0.2-0.3,0.2-0.4
+		c0.1-0.1,0.1-0.3,0.1-0.4v-0.2h-0.2c-0.1,0-0.3,0-0.5,0c-0.2,0-0.4,0.1-0.5,0.1s-0.3,0.1-0.4,0.2C218.8,14.8,218.7,15,218.7,15.1z"
+		/>
+	<path d="M222.8,12.2c0-0.3,0.1-0.4,0.4-0.4h0.4c0.3,0,0.4,0.1,0.4,0.4v0.4c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1c0,0,0,0.1,0,0.1h0
+		c0-0.1,0.1-0.3,0.2-0.4c0.1-0.1,0.2-0.3,0.3-0.4c0.1-0.1,0.3-0.2,0.4-0.3c0.1-0.1,0.3-0.1,0.5-0.1c0.1,0,0.2,0,0.3,0.1
+		s0.1,0.2,0.1,0.3v0.4c0,0.3-0.1,0.4-0.4,0.4c-0.2,0-0.4,0-0.6,0.1c-0.2,0.1-0.3,0.2-0.4,0.4c-0.1,0.2-0.2,0.3-0.2,0.5
+		c-0.1,0.2-0.1,0.4-0.1,0.6v1.5c0,0.3-0.1,0.4-0.4,0.4h-0.4c-0.3,0-0.4-0.1-0.4-0.4V12.2z"/>
+	<path d="M226.1,17.5c0.1,0,0.2,0,0.2,0c0,0,0.1,0,0.1,0.1c0.1,0,0.1,0,0.2,0c0.2,0,0.3-0.1,0.5-0.2c0.1-0.1,0.2-0.3,0.3-0.4
+		l0.2-0.4l-1.8-4.2c-0.1-0.1-0.1-0.2,0-0.3c0.1-0.1,0.2-0.1,0.3-0.1h0.5c0.2,0,0.4,0.1,0.4,0.3l0.9,2.4c0,0.1,0,0.1,0.1,0.2
+		s0,0.1,0.1,0.2c0,0.1,0,0.1,0.1,0.2h0c0-0.1,0-0.1,0-0.2c0-0.1,0-0.1,0.1-0.2s0-0.1,0.1-0.2l0.8-2.4c0.1-0.2,0.2-0.3,0.4-0.3h0.5
+		c0.1,0,0.2,0,0.3,0.1s0.1,0.2,0,0.3l-2,5c-0.1,0.2-0.2,0.4-0.3,0.6c-0.1,0.2-0.3,0.3-0.4,0.4s-0.3,0.2-0.5,0.2
+		c-0.2,0-0.3,0.1-0.5,0.1c-0.1,0-0.3,0-0.4,0c-0.1,0-0.2-0.1-0.3-0.1c-0.1,0-0.2-0.1-0.2-0.2s0-0.2,0-0.3l0.1-0.2
+		C226,17.6,226,17.5,226.1,17.5z"/>
+</g>
+<g class="st1">
+	<path class="st0" d="M55.3,37.1c0-0.8,0.1-1.6,0.3-2.4c0.2-0.8,0.6-1.5,1-2.2s1-1.2,1.7-1.5c0.7-0.4,1.5-0.6,2.4-0.6
+		c0.4,0,0.7,0,1,0.1c0.3,0.1,0.6,0.1,0.8,0.2c0.4,0.1,0.6,0.4,0.4,0.9l-0.2,0.6c-0.1,0.2-0.2,0.4-0.3,0.4c-0.1,0.1-0.3,0.1-0.5,0
+		c-0.1,0-0.3-0.1-0.5-0.1s-0.4-0.1-0.6-0.1c-0.5,0-0.9,0.1-1.3,0.3c-0.4,0.2-0.7,0.4-0.9,0.7c-0.3,0.3-0.5,0.7-0.6,1
+		c-0.2,0.4-0.3,0.8-0.4,1.2h0c0.2-0.2,0.5-0.5,0.9-0.7c0.4-0.2,0.9-0.3,1.5-0.3c0.6,0,1.1,0.1,1.5,0.3c0.5,0.2,0.8,0.5,1.2,0.8
+		c0.3,0.4,0.6,0.8,0.7,1.2c0.2,0.5,0.3,1,0.3,1.5c0,0.6-0.1,1.1-0.3,1.6s-0.4,0.9-0.8,1.3c-0.3,0.4-0.8,0.7-1.2,0.9
+		c-0.5,0.2-1,0.3-1.6,0.3c-0.6,0-1.2-0.1-1.8-0.4s-1-0.6-1.5-1.1s-0.8-1.1-1-1.8C55.5,38.7,55.3,38,55.3,37.1z M57.6,37.9
+		c0,0.3,0.1,0.6,0.2,0.9c0.1,0.3,0.3,0.6,0.5,0.9c0.2,0.3,0.5,0.5,0.7,0.7s0.6,0.3,0.9,0.3c0.5,0,1-0.2,1.3-0.6
+		c0.3-0.4,0.5-0.9,0.5-1.5c0-0.3,0-0.6-0.1-0.8c-0.1-0.3-0.2-0.5-0.4-0.7s-0.4-0.4-0.7-0.5c-0.3-0.1-0.6-0.2-1-0.2
+		c-0.5,0-1,0.1-1.3,0.4C57.8,37.1,57.6,37.4,57.6,37.9z"/>
+</g>
+<g class="st1">
+	<path class="st0" d="M126.7,37.1c0-0.8,0.1-1.6,0.3-2.4c0.2-0.8,0.6-1.5,1-2.2c0.5-0.6,1-1.2,1.7-1.5c0.7-0.4,1.5-0.6,2.4-0.6
+		c0.4,0,0.7,0,1,0.1c0.3,0.1,0.6,0.1,0.8,0.2c0.4,0.1,0.6,0.4,0.4,0.9l-0.2,0.6c-0.1,0.2-0.2,0.4-0.3,0.4c-0.1,0.1-0.3,0.1-0.5,0
+		c-0.1,0-0.3-0.1-0.5-0.1c-0.2,0-0.4-0.1-0.6-0.1c-0.5,0-0.9,0.1-1.3,0.3c-0.4,0.2-0.7,0.4-0.9,0.7c-0.3,0.3-0.5,0.7-0.6,1
+		c-0.2,0.4-0.3,0.8-0.4,1.2h0c0.2-0.2,0.5-0.5,0.9-0.7c0.4-0.2,0.9-0.3,1.5-0.3c0.6,0,1.1,0.1,1.5,0.3c0.5,0.2,0.8,0.5,1.2,0.8
+		c0.3,0.4,0.6,0.8,0.7,1.2c0.2,0.5,0.3,1,0.3,1.5c0,0.6-0.1,1.1-0.3,1.6c-0.2,0.5-0.4,0.9-0.8,1.3c-0.3,0.4-0.8,0.7-1.2,0.9
+		c-0.5,0.2-1,0.3-1.6,0.3c-0.6,0-1.2-0.1-1.8-0.4c-0.6-0.3-1-0.6-1.5-1.1c-0.4-0.5-0.8-1.1-1-1.8S126.7,38,126.7,37.1z M129,37.9
+		c0,0.3,0.1,0.6,0.2,0.9c0.1,0.3,0.3,0.6,0.5,0.9c0.2,0.3,0.5,0.5,0.7,0.7s0.6,0.3,0.9,0.3c0.5,0,1-0.2,1.3-0.6
+		c0.3-0.4,0.5-0.9,0.5-1.5c0-0.3,0-0.6-0.1-0.8c-0.1-0.3-0.2-0.5-0.4-0.7c-0.2-0.2-0.4-0.4-0.7-0.5s-0.6-0.2-1-0.2
+		c-0.5,0-1,0.1-1.3,0.4S129,37.4,129,37.9z"/>
+</g>
+<g class="st1">
+	<path class="st0" d="M90.6,37.1c0-0.8,0.1-1.6,0.3-2.4c0.2-0.8,0.6-1.5,1-2.2s1-1.2,1.7-1.5c0.7-0.4,1.5-0.6,2.4-0.6
+		c0.4,0,0.7,0,1,0.1c0.3,0.1,0.6,0.1,0.8,0.2c0.4,0.1,0.6,0.4,0.4,0.9l-0.2,0.6c-0.1,0.2-0.2,0.4-0.3,0.4c-0.1,0.1-0.3,0.1-0.5,0
+		c-0.1,0-0.3-0.1-0.5-0.1s-0.4-0.1-0.6-0.1c-0.5,0-0.9,0.1-1.3,0.3c-0.4,0.2-0.7,0.4-0.9,0.7c-0.3,0.3-0.5,0.7-0.6,1
+		c-0.2,0.4-0.3,0.8-0.4,1.2h0c0.2-0.2,0.5-0.5,0.9-0.7c0.4-0.2,0.9-0.3,1.5-0.3c0.6,0,1.1,0.1,1.5,0.3c0.5,0.2,0.8,0.5,1.2,0.8
+		c0.3,0.4,0.6,0.8,0.7,1.2c0.2,0.5,0.3,1,0.3,1.5c0,0.6-0.1,1.1-0.3,1.6s-0.4,0.9-0.8,1.3c-0.3,0.4-0.8,0.7-1.2,0.9
+		c-0.5,0.2-1,0.3-1.6,0.3c-0.6,0-1.2-0.1-1.8-0.4s-1-0.6-1.5-1.1s-0.8-1.1-1-1.8C90.7,38.7,90.6,38,90.6,37.1z M92.8,37.9
+		c0,0.3,0.1,0.6,0.2,0.9c0.1,0.3,0.3,0.6,0.5,0.9c0.2,0.3,0.5,0.5,0.7,0.7s0.6,0.3,0.9,0.3c0.5,0,1-0.2,1.3-0.6
+		c0.3-0.4,0.5-0.9,0.5-1.5c0-0.3,0-0.6-0.1-0.8c-0.1-0.3-0.2-0.5-0.4-0.7s-0.4-0.4-0.7-0.5c-0.3-0.1-0.6-0.2-1-0.2
+		c-0.5,0-1,0.1-1.3,0.4C93,37.1,92.8,37.4,92.8,37.9z"/>
+</g>
+<g class="st1">
+	<path class="st0" d="M19.4,37.1c0-0.8,0.1-1.6,0.3-2.4c0.2-0.8,0.6-1.5,1-2.2s1-1.2,1.7-1.5c0.7-0.4,1.5-0.6,2.4-0.6
+		c0.4,0,0.7,0,1,0.1c0.3,0.1,0.6,0.1,0.8,0.2c0.4,0.1,0.6,0.4,0.4,0.9l-0.2,0.6c-0.1,0.2-0.2,0.4-0.3,0.4c-0.1,0.1-0.3,0.1-0.5,0
+		c-0.1,0-0.3-0.1-0.5-0.1s-0.4-0.1-0.6-0.1c-0.5,0-0.9,0.1-1.3,0.3c-0.4,0.2-0.7,0.4-0.9,0.7c-0.3,0.3-0.5,0.7-0.6,1
+		c-0.2,0.4-0.3,0.8-0.4,1.2h0c0.2-0.2,0.5-0.5,0.9-0.7c0.4-0.2,0.9-0.3,1.5-0.3c0.6,0,1.1,0.1,1.5,0.3c0.5,0.2,0.8,0.5,1.2,0.8
+		c0.3,0.4,0.6,0.8,0.7,1.2c0.2,0.5,0.3,1,0.3,1.5c0,0.6-0.1,1.1-0.3,1.6s-0.4,0.9-0.8,1.3c-0.3,0.4-0.8,0.7-1.2,0.9
+		c-0.5,0.2-1,0.3-1.6,0.3c-0.6,0-1.2-0.1-1.8-0.4s-1-0.6-1.5-1.1s-0.8-1.1-1-1.8C19.5,38.7,19.4,38,19.4,37.1z M21.7,37.9
+		c0,0.3,0.1,0.6,0.2,0.9c0.1,0.3,0.3,0.6,0.5,0.9c0.2,0.3,0.5,0.5,0.7,0.7s0.6,0.3,0.9,0.3c0.5,0,1-0.2,1.3-0.6
+		c0.3-0.4,0.5-0.9,0.5-1.5c0-0.3,0-0.6-0.1-0.8c-0.1-0.3-0.2-0.5-0.4-0.7s-0.4-0.4-0.7-0.5c-0.3-0.1-0.6-0.2-1-0.2
+		c-0.5,0-1,0.1-1.3,0.4C21.8,37.1,21.7,37.4,21.7,37.9z"/>
+</g>
+</svg>

index_withoutAmp.html

@@ -202,13 +202,14 @@
                     alt="mountains"
                     class="card-img-top">
                   </img>
-                  <img src="./imgs/play.png"
+                  <img src="./imgs/Icon-play.png"
                     width="50"
                     height="50"
                     alt="mountains"
                     class="card__play"
                   >
                   </img>
+                  <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4">
                   <h5 class="card-title text-start">台灣導盲犬協會</h5>
@@ -232,7 +233,7 @@
             </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" onclick="window.open('https://www.youtube.com/channel/UC2Qda9PhJWuiMTCZ-j7K_hg')">
+                <div class="card__imgfr">
                   <img src="./imgs/01.png"
                     width="266"
                     height="150"
@@ -240,13 +241,14 @@
                     alt="mountains"
                     class="card-img-top">
                   </img>
-                  <img src="./imgs/play.png"
+                  <img src="./imgs/Icon-play.png"
                     width="50"
                     height="50"
                     alt="mountains"
                     class="card__play"
                   >
                   </img>
+                  <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4">
                   <h5 class="card-title text-start">婦女救援協會</h5>
@@ -269,7 +271,7 @@
             </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" onclick="window.open('https://www.youtube.com/channel/UC2Qda9PhJWuiMTCZ-j7K_hg')">
+                <div class="card__imgfr">
                   <img src="./imgs/3.png"
                     width="266"
                     height="150"
@@ -277,13 +279,14 @@
                     alt="mountains"
                     class="card-img-top">
                   </img>
-                  <img src="./imgs/play.png"
+                  <img src="./imgs/Icon-play.png"
                     width="50"
                     height="50"
                     alt="mountains"
                     class="card__play"
                   >
                   </img>
+                  <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4">
                   <h5 class="card-title text-start">至善社會福利基金會</h5>
@@ -306,7 +309,7 @@
             </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" onclick="window.open('https://www.youtube.com/channel/UC2Qda9PhJWuiMTCZ-j7K_hg')">
+                <div class="card__imgfr">
                   <img src="./imgs/2.png"
                     width="266"
                     height="150"
@@ -314,13 +317,14 @@
                     alt="mountains"
                     class="card-img-top">
                   </img>
-                  <img src="./imgs/play.png"
+                  <img src="./imgs/Icon-play.png"
                     width="50"
                     height="50"
                     alt="mountains"
                     class="card__play"
                   >
                   </img>
+                  <span class="card__comingSoon">敬請期待</span>
                 </div>
                 <div class="card-body p-4">
                   <h5 class="card-title text-start mb-3">勵馨基金會</h5>
@@ -342,7 +346,7 @@
               </div>
             </div>
           </div>
-          <button class="btn-blue">了解更多AI主播</button>
+          <button class="btn-blue" onclick="window.open('https://ai.choozmo.com/')">了解更多AI主播</button>
         </div>
       </section>
       <section class="logos" style="background-color: white;padding: 3rem 0;" id="section2">
@@ -354,12 +358,16 @@
                 <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/tzuchi.png);"></div>
                 <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/guide_dog.png);"></div>
                 <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/women_rescue.png);"></div>
+                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/zhishan.png);"></div>
+                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/garden_hope.png);"></div>
+                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/books.jpg);"></div>
               </div>
+              
                 <!-- <div class="col-1 d-none d-md-block"></div> -->
               <div class="row">
                 <div class="col-2 d-none d-md-block"></div>
-                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/zhishan.png);"></div>
-                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/garden_hope.png);"></div>
+                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/dodoker.svg);"></div>
+                <div class="col-6 col-md-4 logos__img mx-2" style="background-image: url(./imgs/yoyuen.png);"></div>
                 <div class="col-2 d-none d-md-block"></div>
               </div>
                 <!-- <div class="col-1 d-none d-md-block"></div> -->
@@ -368,11 +376,14 @@
           <div class="row justify-content-center d-block d-md-none" style="margin: auto auto;">
             <div class="col-11" style="margin: 0 auto;">
               <div class="row">
-                <div class="col-6 logos__img mx-2" style="background-image: url(./imgs/tzuchi.png);"></div>
-                <div class="col-6 logos__img mx-2" style="background-image: url(./imgs/guide_dog.png);"></div>
-                <div class="col-6 logos__img mx-2" style="background-image: url(./imgs/women_rescue.png);"></div>
-                <div class="col-6 logos__img mx-2" style="background-image: url(./imgs/zhishan.png);"></div>
-                <div class="col-6 logos__img mx-2" style="background-image: url(./imgs/garden_hope.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/tzuchi.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/guide_dog.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/women_rescue.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/zhishan.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/garden_hope.png);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/books.jpg);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/dodoker.svg);"></div>
+                <div class="col-6 logos__img mx-auto" style="background-image: url(./imgs/yoyuen.png);"></div>
               </div>
 
             </div>