Style mobile full page close buttons

The mobile full pages are now modals meaning the
close button should be absolutely positioned.

This also adds a background to the buttons so they
look okay when they cover other elements.

Author: Abban

banners/mobile/styles/FullPageBanner.scss

@@ -13,7 +13,7 @@
 		width: 100vw;
 
 		&-content {
-			overflow-y: scroll;
+			overflow-y: auto;
 			height: 100%;
 			width: 100%;
 		}
@@ -26,8 +26,12 @@
 			position: absolute;
 			top: 16px;
 			right: 16px;
-			height: 25px;
+			height: 35px;
+			width: 35px;
+			padding: 5px;
 			background: colors.$white;
+			z-index: 99;
+			border-radius: 50%;
 
 			&:hover {
 				cursor: pointer;

banners/mobile_english/components/FullPageBanner.vue

@@ -1,10 +1,10 @@
 <template>
 	<div class="wmde-banner-full">
-		<div class="wmde-banner-full-content">
+		<button class="wmde-banner-full-close t-close-full-banner" @click.prevent="$emit( 'close' )">
+			<CloseIconChunky/>
+		</button>
 
-			<button class="wmde-banner-full-close t-close-full-banner" @click.prevent="$emit( 'close' )">
-				<CloseIconChunky/>
-			</button>
+		<div class="wmde-banner-full-content">
 
 			<header class="wmde-banner-headline">
 				<span class="wmde-banner-headline-content">the wikimedia fundraising campaign</span>

banners/mobile_english/styles/FullPageBanner.scss

@@ -8,7 +8,6 @@
 		z-index: 1000;
 		height: 100%;
 		width: 100%;
-		overflow-y: auto;
 		background: colors.$primary-lighter;
 		box-shadow: 0 7px 22px 0 rgba( 0, 0, 0, 0.35 );
 		text-align: center;
@@ -18,11 +17,22 @@
 		border: 8px solid colors.$primary;
 		padding: 5px 5px 15px;
 
+		&-content {
+			overflow-y: auto;
+			height: 100%;
+			width: 100%;
+		}
+
 		&-close {
 			position: absolute;
-			top: 8px;
-			right: 8px;
+			top: 3px;
+			right: 3px;
 			z-index: 2;
+			height: 36px;
+			width: 36px;
+			padding: 5px;
+			border-radius: 50%;
+			background: colors.$primary-lighter;
 		}
 
 		&-info {

banners/wpde_mobile/styles/FullPageBanner.scss

@@ -17,7 +17,7 @@
 		width: 100vw;
 
 		&-content {
-			overflow-y: scroll;
+			overflow-y: auto;
 			height: 100%;
 			width: 100%;
 		}
@@ -32,8 +32,12 @@
 			position: absolute;
 			top: 16px;
 			right: 16px;
-			height: 25px;
+			height: 35px;
+			width: 35px;
+			padding: 5px;
 			background: colors.$white;
+			z-index: 99;
+			border-radius: 50%;
 			border: 0;
 
 			&:hover {