diff --git a/src/views/annual-report/2020/annual-report.jsx b/src/views/annual-report/2020/annual-report.jsx
index 11b4d54d9..c32c5d6af 100644
--- a/src/views/annual-report/2020/annual-report.jsx
+++ b/src/views/annual-report/2020/annual-report.jsx
@@ -1065,18 +1065,19 @@ class AnnualReport extends React.Component {
                                             <FormattedMessage id="annualReport.2020.connectivityWorldSubtitle" />
                                         </p>
                                     </div>
-                                
-                                    <div className="video-container connectivity">
+                                </div>
+                                <div className="video-container connectivity">
+                                    <div className="video-background connectivity">
                                         <MediaQuery minWidth={frameless.tabletPortrait}>
                                             <VideoPreview
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/connectivity/Scratch Around the World Video.png"
-                                                thumbnailWidth="1000"
-                                                videoHeight="450"
+                                                thumbnail="/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png"
                                                 videoId="rlsjbx0st4"
-                                                videoWidth="700"
+                                                thumbnailWidth="580"
+                                                videoHeight="320"
+                                                videoWidth="568"
                                                 alt={
                                                     this.props.intl.formatMessage(
                                                         {id: 'annualReport.2020.altConnectivityVideoPreview'}
@@ -1092,10 +1093,10 @@ class AnnualReport extends React.Component {
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/connectivity/Scratch Around the World Video.png"
-                                                thumbnailWidth="800"
-                                                videoHeight="320"
+                                                thumbnail="/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png"
                                                 videoId="rlsjbx0st4"
+                                                thumbnailWidth="400"
+                                                videoHeight="320"
                                                 videoWidth="568"
                                                 alt={
                                                     this.props.intl.formatMessage(
@@ -1109,10 +1110,10 @@ class AnnualReport extends React.Component {
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/connectivity/Scratch Around the World Video.png"
-                                                thumbnailWidth="500"
-                                                videoHeight="216"
+                                                thumbnail="/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png"
                                                 videoId="rlsjbx0st4"
+                                                thumbnailWidth="300"
+                                                videoHeight="216"
                                                 videoWidth="380"
                                                 alt={
                                                     this.props.intl.formatMessage(
@@ -1122,6 +1123,8 @@ class AnnualReport extends React.Component {
                                             />
                                         </MediaQuery>
                                     </div>
+                                </div>
+                                <div className="inner">
                                     <div className="flex-content">
                                         <CountryBlurb
                                             className="reverse"
@@ -1365,16 +1368,18 @@ class AnnualReport extends React.Component {
                                             <FormattedMessage id="annualReport.2020.adaptationHighlightText3b" />
                                         </p>
                                     </div>
-                                    <div className="video-container themes adaptation">
+                                </div>
+                                <div className="video-container themes adaptation">
+                                    <div className="video-background adaptation">
                                         <MediaQuery minWidth={frameless.tabletPortrait}>
                                             <VideoPreview
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/adaptation/Create-along video.png"
-                                                thumbnailWidth="1000"
-                                                videoHeight="320"
+                                                thumbnail="/images/annual-report/2020/adaptation/createalongs_videothumb.png"
                                                 videoId="uzfapi7t03"
+                                                thumbnailWidth="580"
+                                                videoHeight="320"
                                                 videoWidth="568"
                                                 alt={
                                                     this.props.intl.formatMessage(
@@ -1391,10 +1396,10 @@ class AnnualReport extends React.Component {
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/adaptation/Create-along video.png"
-                                                thumbnailWidth="800"
-                                                videoHeight="320"
+                                                thumbnail="/images/annual-report/2020/adaptation/createalongs_videothumb.png"
                                                 videoId="uzfapi7t03"
+                                                thumbnailWidth="400"
+                                                videoHeight="320"
                                                 videoWidth="568"
                                                 alt={
                                                     this.props.intl.formatMessage(
@@ -1408,10 +1413,10 @@ class AnnualReport extends React.Component {
                                                 buttonMessage={
                                                     this.props.intl.formatMessage({id: 'annualReport.2020.watchVideo'})
                                                 }
-                                                thumbnail="/images/annual-report/2020/adaptation/Create-along video.png"
-                                                thumbnailWidth="500"
-                                                videoHeight="216"
+                                                thumbnail="/images/annual-report/2020/adaptation/createalongs_videothumb.png"
                                                 videoId="uzfapi7t03"
+                                                thumbnailWidth="300"
+                                                videoHeight="216"
                                                 videoWidth="380"
                                                 alt={
                                                     this.props.intl.formatMessage(
@@ -1421,7 +1426,8 @@ class AnnualReport extends React.Component {
                                             />
                                         </MediaQuery>
                                     </div>
-
+                                </div>
+                                <div className="inner">
                                     <div className="flex-content">
                                         <TextAndMediaSnippet
                                             className="regular"
diff --git a/src/views/annual-report/2020/annual-report.scss b/src/views/annual-report/2020/annual-report.scss
index 791a505da..8164fbec3 100644
--- a/src/views/annual-report/2020/annual-report.scss
+++ b/src/views/annual-report/2020/annual-report.scss
@@ -1239,6 +1239,10 @@ img.comment-viz{
                 max-width: 840px;
                 width: 100%;
                 margin-top: 50px;
+                text-align: left;
+                @media #{$medium-and-smaller} {
+                    flex-direction: column;
+                }
                 &.split{
                     &.content{
                         .text{
@@ -1641,36 +1645,62 @@ img.comment-viz{
 
     .video-container {
         width: 100%;
+        height: 500px;
         display: flex;
         justify-content: center;
-        margin-top: 30px;
+        margin-bottom: 72px;
+        @media #{$medium}{
+            height: 400px;
+            margin-bottom: 0px;
+        }
+        @media #{$small}{
+            height: 300px;
+            margin-bottom: 0px;
+        }
+        + .inner{
+            padding-top: 0px;
+        }
+    }
+
+    .video-background {
+        width: 100%;
+        height: 500px;
+        overflow: hidden;
+
+        background-size: auto 100%;
+        background-repeat: no-repeat;
+        background-position: 50% 50%;
+
+        display: flex;
+        align-items: center;
+        justify-content: center;
+
+        @media #{$medium}{
+            height: 400px;
+        }
+
+        @media #{$small}{
+            height: 300px;
+        }
+
+        &.adaptation {
+            background-image: url("/images/annual-report/2020/adaptation/createalongs_splash.svg");
+        }
+
+        &.connectivity {
+            background-image: url("/images/annual-report/2020/connectivity/aroundtheworld_splash.svg");
+        }
     }
 
     .video-thumbnail .button{
-        top: -113px;
+        top: 6px;
         font-size: 15px;
         position: relative;
         border-radius: 3px;
-        @media #{$medium}{
-            top: -99px;
-        }
-        @media #{$small}{
-            top: -107px;
-            top: -74px;
-            font-size: 12px;
-        }
     }
 
     .themes .video-thumbnail .button{
-        top: -119px;
-        @media #{$medium}{
-            top: -107px;
-        }
-        @media #{$small}{
-            top: -105px;
-            top: -74px;
-            font-size: 12px;
-        }
+        top: 0px;
     }
 
     .tweet-container{
@@ -1696,40 +1726,6 @@ img.comment-viz{
             }
         }
     }
-
-    .video-background {
-        width: 100%;
-        height: 500px;
-        overflow: hidden;
-
-        background-size: auto 100%;
-        background-repeat: no-repeat;
-        background-position: 50% 50%;
-
-        display: flex;
-        align-items: center;
-        justify-content: center;
-
-        &.blm {
-            background-image: url("/images/annual-report/initiatives/BLM Video Splash.svg");
-        }
-
-        &.abhi {
-            background-image: url("/images/annual-report/initiatives/Abhi Video Splash.svg");
-
-            .button {
-                background-color: $ui-aqua;
-            }
-        }
-
-        &.cps {
-            background-image: url("/images/annual-report/initiatives/schools/CPS Story/CPS Video Splash.svg");
-
-            .button {
-                background-color: $ui-purple-dark;
-            }
-        }
-    }
 }
 
 .directors-message {
diff --git a/static/images/annual-report/2020/adaptation/createalongs_splash.svg b/static/images/annual-report/2020/adaptation/createalongs_splash.svg
new file mode 100644
index 000000000..a0faa0997
--- /dev/null
+++ b/static/images/annual-report/2020/adaptation/createalongs_splash.svg
@@ -0,0 +1,3 @@
+<svg width="1020" height="500" viewBox="0 0 1020 500" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M7.47369 178.846C13.5341 269.511 79.0963 299.237 36.8286 326.807C-70.7794 396.998 74.9443 535.486 248.094 484.139C353.129 452.992 492.993 460.604 587.379 484.139C733.029 520.457 861.681 494.151 958.796 407.833C1055.91 321.515 1034.94 187.698 913.712 107.33C785.92 22.6142 506.584 -31.1179 248.094 19.8178C107.088 47.6032 3.29736 116.366 7.47369 178.846ZM986.992 6.96484C959.878 3.16931 936.17 20.6422 934.218 37.2736C932.266 53.9051 943.417 78.9368 968.077 83.2485C992.737 87.5602 1010.86 72.4258 1014.49 60.5979C1018.12 48.77 1014.11 10.7604 986.992 6.96484Z" fill="#0FBD8C"/>
+</svg>
diff --git a/static/images/annual-report/2020/adaptation/createalongs_videothumb.png b/static/images/annual-report/2020/adaptation/createalongs_videothumb.png
new file mode 100644
index 000000000..2bf8ee875
Binary files /dev/null and b/static/images/annual-report/2020/adaptation/createalongs_videothumb.png differ
diff --git a/static/images/annual-report/2020/connectivity/aroundtheworld_splash.svg b/static/images/annual-report/2020/connectivity/aroundtheworld_splash.svg
new file mode 100644
index 000000000..b036f4d0a
--- /dev/null
+++ b/static/images/annual-report/2020/connectivity/aroundtheworld_splash.svg
@@ -0,0 +1,3 @@
+<svg width="1020" height="500" viewBox="0 0 1020 500" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path opacity="0.3" fill-rule="evenodd" clip-rule="evenodd" d="M61.6772 70.3664C234.157 -35.4025 677.179 4.68477 750.953 22.1909C858.406 47.6891 1006.11 97.9507 901.513 165.834C860.428 192.498 991.213 227.253 997.104 314.938C1008.61 486.136 650.277 525.115 446.777 486.136C222.451 443.168 26.8853 474.387 19.1859 410.891C11.4865 347.396 164.325 351.218 61.6772 281.991C-38.1378 214.675 -0.898449 108.739 61.6772 70.3664ZM973.642 139.135C996.208 132.302 1020 153.082 1020 176.599C1020 200.116 994.546 221.092 966.091 198.377C937.637 175.662 951.076 145.968 973.642 139.135Z" fill="#9966FF"/>
+</svg>
diff --git a/static/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png b/static/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png
new file mode 100644
index 000000000..6d9da8ce0
Binary files /dev/null and b/static/images/annual-report/2020/connectivity/aroundtheworld_videothumb.png differ