diff --git a/ExtensionPage.js b/ExtensionPage.js
index 9215cca..312323e 100644
--- a/ExtensionPage.js
+++ b/ExtensionPage.js
@@ -3,7 +3,11 @@ $(document).ready(function() {
 		try{
 			var element = document.getElementById("input");
 			
-			if(element != null)
+
+			if(v.amount == undefined || v.amount == null)
+			v.amount = 0;
+
+			if(element != null && element.value != null)
 				element.value = v.amount
 			else{
 				console.log("no input loaded");
@@ -18,7 +22,7 @@ $(document).ready(function() {
 					
 					var element = document.getElementById("input");
 			
-					if(element != null)
+					if(element != null && element.value != null)
 						element.value = v.amount
 					else{
 						console.log("no input loaded");
diff --git a/PlayerCenterer.js b/PlayerCenterer.js
index 1c46611..55e9592 100644
--- a/PlayerCenterer.js
+++ b/PlayerCenterer.js
@@ -8,7 +8,22 @@ function waitFor(condition, callback) {
 
 var players = [];
 var booli = false;
+var currentamount = null;
 
+var CinemaOrFullScreen = {
+	aInternal: 1000,
+	aListener: function(val) {},
+	set value(val) {
+	  this.aInternal = val;
+	  this.aListener(val);
+	},
+	get value() {
+	  return this.aInternal;
+	},
+	registerListener: function(listener) {
+	  this.aListener = listener;
+	}
+  }
 
 var interval = null;
 
@@ -20,10 +35,75 @@ var interval = null;
 				booli = true;
 			}
 },500)
+  function AddModeListeners(){
+	var ModeButton = document.getElementsByClassName("ytp-size-button")[0]
+	var FSButton = document.getElementsByClassName("ytp-fullscreen-button")[0]
+	
+	
+	ModeButton.addEventListener("click", function() {
+		var cinemamode = false;
+		
+		var players = document.getElementsByTagName("ytd-watch-flexy")
+	
+		if(ModeButton.getAttribute("data-title-no-tooltip") != "Cinema mode"){
+			cinemamode = true;
+		}	
+	
+		if(cinemamode){
+			players[0]['style']['paddingLeft'] = currentamount+"vw";
+			CinemaOrFullScreen.value = false;
+		}else{
+			players[0]['style']['paddingLeft'] = 0+"vw";
+			CinemaOrFullScreen.value = true;
+		}
+
+		console.log("clicked modebutton" + cinemamode)
+	
+		setTimeout(() => {
+			AddModeListeners();
+		}, 1000);
+	
+	});
+	
+	FSButton.addEventListener("click", function() {
+		var fsmode = false;
+		var players = document.getElementsByTagName("ytd-watch-flexy")
+	
+		if(FSButton.getAttribute("data-title-no-tooltip") != "Full screen"){
+			fsmode = true;
+		}	
+	
+		if(fsmode){
+			players[0]['style']['paddingLeft'] = currentamount+"vw";
+		}else{
+			players[0]['style']['paddingLeft'] = 0+"vw";
+			CinemaOrFullScreen.value = true;
+		}
+
+		console.log("clicked fsbutton" + fsmode)
+		setTimeout(() => {
+			AddModeListeners();
+		}, 1000);
 
+	});
+  }
 
- waitFor(()=> booli == true, () => {
+waitFor(()=> booli == true, () => {
 clearInterval(interval)
+AddModeListeners();
+
+
+var players = document.getElementsByTagName("ytd-watch-flexy")	
+	if(players != null)
+		if(players[0] != null)
+			if(players[0].className =="style-scope ytd-page-manager hide-skeleton"
+			&& ( players[0].hasAttribute("theater") == true || players[0].hasAttribute("fullscreen") == true )
+			){
+				CinemaOrFullScreen.value = true;
+			}
+			else{
+				CinemaOrFullScreen.value = false;
+			}
 
 chrome.storage.onChanged.addListener(function (changes, namespace) {
 	  for (let [key, { oldValue, newValue }] of Object.entries(changes)) {
@@ -35,6 +115,9 @@ chrome.storage.onChanged.addListener(function (changes, namespace) {
 	var update = function(amount){
 		var players = document.getElementsByTagName("ytd-watch-flexy")
 		if(amount != null){
+			currentamount = amount;
+
+			if(CinemaOrFullScreen.value == false)
 			players[0]['style']['paddingLeft'] = amount+"vw";
 		}
 	}