video close button

scotty · scotty · commit 1fdea6039bc8 · 2016-03-07T13:24:07.000-08:00
diff --git a/_sass/_base.sass b/_sass/_base.sass
@@ -1216,13 +1216,41 @@ $feature-box-div-margin-bottom: 40px
 
 #videoPlayer
 	@include fullScreen
-	background-color: rgba(0, 0, 0, 0.75)
+	background-color: rgba(0, 0, 0, 0.9)
 	display: none
 
 	iframe
 		@include pureCenter
 		@include maintain-aspect-ratio
 
+	#closeButton
+		position: absolute
+		top: 20px
+		right: 20px
+		width: 50px
+		height: 50px
+		border: 2px solid transparent
+		transition: 0.3s
+
+		&:before, &:after
+			content: ""
+			position: absolute
+			top: calc(50% - 1px)
+			left: 10%
+			width: 80%
+			height: 2px
+			background-color: white
+
+		&:before
+			transform: rotate(45deg)
+
+		&:after
+			transform: rotate(-45deg)
+
+		&:hover
+			border-color: white
+
+
 
 
 // Features
diff --git a/_sass/_desktop.sass b/_sass/_desktop.sass
@@ -38,6 +38,7 @@ $video-section-height: 550px
 		background-size: cover
 
 
+
 	#talkToUs
 		h4
 			br
diff --git a/index.html b/index.html
@@ -161,7 +161,7 @@ <h4>We would love to hear from you, how you are using Kubernetes,<br> and what w
 
 <div id="videoPlayer">
 	<iframe data-url="https://www.youtube.com/embed/WwBdNXt6wO4?autoplay=1" frameborder="0" allowfullscreen></iframe>
-	<button class="close-button">foo</button>
+	<button id="closeButton"></button>
 </div>
 
 <style>
