diff --git a/resources/js/icons/instagram.vue b/resources/js/icons/instagram.vue
new file mode 100644
index 0000000..6cd5cb0
--- /dev/null
+++ b/resources/js/icons/instagram.vue
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 551.034 551.034" style="enable-background:new 0 0 551.034 551.034;" xml:space="preserve">
+<g>
+	
+		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="275.517" y1="4.57" x2="275.517" y2="549.72" gradientTransform="matrix(1 0 0 -1 0 554)">
+		<stop  offset="0" style="stop-color:#E09B3D"/>
+		<stop  offset="0.3" style="stop-color:#C74C4D"/>
+		<stop  offset="0.6" style="stop-color:#C21975"/>
+		<stop  offset="1" style="stop-color:#7024C4"/>
+	</linearGradient>
+	<path style="fill:url(#SVGID_1_);" d="M386.878,0H164.156C73.64,0,0,73.64,0,164.156v222.722
+		c0,90.516,73.64,164.156,164.156,164.156h222.722c90.516,0,164.156-73.64,164.156-164.156V164.156
+		C551.033,73.64,477.393,0,386.878,0z M495.6,386.878c0,60.045-48.677,108.722-108.722,108.722H164.156
+		c-60.045,0-108.722-48.677-108.722-108.722V164.156c0-60.046,48.677-108.722,108.722-108.722h222.722
+		c60.045,0,108.722,48.676,108.722,108.722L495.6,386.878L495.6,386.878z"/>
+	
+		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="275.517" y1="4.57" x2="275.517" y2="549.72" gradientTransform="matrix(1 0 0 -1 0 554)">
+		<stop  offset="0" style="stop-color:#E09B3D"/>
+		<stop  offset="0.3" style="stop-color:#C74C4D"/>
+		<stop  offset="0.6" style="stop-color:#C21975"/>
+		<stop  offset="1" style="stop-color:#7024C4"/>
+	</linearGradient>
+	<path style="fill:url(#SVGID_2_);" d="M275.517,133C196.933,133,133,196.933,133,275.516s63.933,142.517,142.517,142.517
+		S418.034,354.1,418.034,275.516S354.101,133,275.517,133z M275.517,362.6c-48.095,0-87.083-38.988-87.083-87.083
+		s38.989-87.083,87.083-87.083c48.095,0,87.083,38.988,87.083,87.083C362.6,323.611,323.611,362.6,275.517,362.6z"/>
+	
+		<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="418.31" y1="4.57" x2="418.31" y2="549.72" gradientTransform="matrix(1 0 0 -1 0 554)">
+		<stop  offset="0" style="stop-color:#E09B3D"/>
+		<stop  offset="0.3" style="stop-color:#C74C4D"/>
+		<stop  offset="0.6" style="stop-color:#C21975"/>
+		<stop  offset="1" style="stop-color:#7024C4"/>
+	</linearGradient>
+	<circle style="fill:url(#SVGID_3_);" cx="418.31" cy="134.07" r="34.15"/>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/resources/js/icons/youtube.vue b/resources/js/icons/youtube.vue
new file mode 100644
index 0000000..9c931a8
--- /dev/null
+++ b/resources/js/icons/youtube.vue
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 461.001 461.001" style="enable-background:new 0 0 461.001 461.001;" xml:space="preserve">
+<path style="fill:#F61C0D;" d="M365.257,67.393H95.744C42.866,67.393,0,110.259,0,163.137v134.728
+	c0,52.878,42.866,95.744,95.744,95.744h269.513c52.878,0,95.744-42.866,95.744-95.744V163.137
+	C461.001,110.259,418.135,67.393,365.257,67.393z M300.506,237.056l-126.06,60.123c-3.359,1.602-7.239-0.847-7.239-4.568V168.607
+	c0-3.774,3.982-6.22,7.348-4.514l126.06,63.881C304.363,229.873,304.298,235.248,300.506,237.056z"/>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+<g>
+</g>
+</svg>
diff --git a/resources/js/panel/service-pane.vue b/resources/js/panel/service-pane.vue
index 784306a..1c48f0c 100644
--- a/resources/js/panel/service-pane.vue
+++ b/resources/js/panel/service-pane.vue
@@ -2,7 +2,7 @@
 <section class="services-pane youtube" >
 	<h4>{{site.charAt(0).toUpperCase() + site.slice(1)}}</h4>
 	<ul :key="service.id" v-for="service in filter(site)">
-		<li><span>{{service.name}}</span><span>{{service.price}}</span><span>{{service.minimum}}</span><span>{{service.maximum}}</span>
+		<li><span>{{service.name}}</span><span>{{service.price}}</span><span>{{service.minimum.toLocaleString('en')}}</span><span>{{service.maximum.toLocaleString('en')}}</span>
 <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-square-fill" viewBox="0 0 16 16">
   <path d="M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z"/>
 </svg>
diff --git a/resources/js/panel/services.vue b/resources/js/panel/services.vue
index 49ce360..d508b5f 100644
--- a/resources/js/panel/services.vue
+++ b/resources/js/panel/services.vue
@@ -12,6 +12,26 @@
 <ServicePane :site="'instagram'" :services="services"></ServicePane>
 <ServicePane :site="'twitter'" :services="services"></ServicePane>
 <ServicePane :site="'tiktok'" :services="services"></ServicePane>
+<div id="overlay">
+	<img class="cancel icon" src="../../images/cancel-icon2.svg" alt=""/>
+	<div class="overlay-item">
+		<img class="icon" src="../../images/youtube-icon.svg" alt="">
+		<h3>Location Targeted Views</h3>
+		<h4>Quantity</h4>
+		<div><input required type="number"><span> / 10000</span></div> 
+		<h4>Location</h4>
+		<div><select required id="country" name="">
+		<option value="usa">USA</option>
+		<option value="canada">Canada</option>
+		<option value="uk">United Kingdom</option>
+		<option value="germany">Germany</option>
+		<option value="france">France</option>
+		</select></div> 
+		<h4>URL</h4>
+		<div><input required type="url" id="url"></div> 
+		<button>Submit</button>
+	</div>
+</div>
 </div>
 </template>
 
diff --git a/resources/scss/main.scss b/resources/scss/main.scss
index 1e9b1a8..0698139 100644
--- a/resources/scss/main.scss
+++ b/resources/scss/main.scss
@@ -43,12 +43,17 @@ ul {
 	padding: 0;
 }
 
-input {
+input, select {
 	border: 2px solid black;
 	border-radius: 20px;
 	padding: 4px;
 }
 
+.icon {
+	width: 25px;
+	margin: 10px;
+}
+
 .services-cards li {
 	padding-bottom: 8px;
 	&:before {
@@ -753,11 +758,6 @@ main.panel {
 		margin: 0;
 	}
 
-	.icon {
-		width: 25px;
-		margin: 10px;
-	}
-
 	.welcome-pane {
 		text-align: center;
 	}
@@ -1060,3 +1060,72 @@ main.panel {
 		color: vars.getColor('dark-orange');
 	}
 }
+
+
+#overlay {
+	position: fixed;
+	width: 100%;
+	height: 100%;
+	background-color: rgba(0,0,0,0.5);
+	left: 0;
+	top: 0;
+
+	.overlay-item {
+		transform: translateY(-50px);
+		width: 20em;
+		height: 20em;
+		background: white;
+		margin: auto;
+		margin-top: 25%;
+		opacity: 1;
+		border-radius: 4px;
+		padding: 5px;
+		@include vars.hovering2;
+
+		div {
+			width: 15em;
+			margin: auto;
+			margin-bottom: 1em;
+		}
+
+		input {
+			// width: 40%;
+			display: inline;
+		}
+	}
+
+	.icon {
+		width: 40px;
+		height: 40px;
+		display: block;
+		margin: 0 auto;
+	}
+
+	h3 {
+		text-align: center;
+		margin-top: 5px;
+	}
+
+	h4 {
+		text-align: center;
+	}
+
+	.cancel {
+		width: 30px;
+		margin-right: 10px;
+		margin-top: 10px;
+	}
+
+	button {
+		display: block;
+		margin: auto;
+		@include vars.brand-button('brand-orange');
+		width: 7em;
+	}
+
+	#url {
+		width: 100%;
+	}
+
+}
+