diff --git a/data/borders/defaultBorder.js b/data/borders/defaultBorder.js
index 1145873f..cf5ad042 100644
--- a/data/borders/defaultBorder.js
+++ b/data/borders/defaultBorder.js
@@ -7,6 +7,7 @@ var nyxBorder = false
 var miracleBorder = false
 var stampBorder = false
 var flipBorder = false
+titleRightShift = 0
 //Loads the correct border data
 borderPath = "data/borders/" + document.getElementById("borderSelection").value
 loadScript(borderPath + "border.js")
\ No newline at end of file
diff --git a/data/borders/m15/artifact/darkTitle.png b/data/borders/m15/artifact/darkTitle.png
deleted file mode 100644
index dfefd34a..00000000
Binary files a/data/borders/m15/artifact/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/artifact/darkframe.png b/data/borders/m15/artifact/darkframe.png
deleted file mode 100644
index c365f84c..00000000
Binary files a/data/borders/m15/artifact/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/artifact/flippedDark.png b/data/borders/m15/artifact/flippedDark.png
new file mode 100644
index 00000000..ba8aea0e
Binary files /dev/null and b/data/borders/m15/artifact/flippedDark.png differ
diff --git a/data/borders/m15/black/darkTitle.png b/data/borders/m15/black/darkTitle.png
deleted file mode 100644
index 0648b53c..00000000
Binary files a/data/borders/m15/black/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/black/darkframe.png b/data/borders/m15/black/darkframe.png
deleted file mode 100644
index 6c3728d1..00000000
Binary files a/data/borders/m15/black/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/black/flippedDark.png b/data/borders/m15/black/flippedDark.png
new file mode 100644
index 00000000..e45587c8
Binary files /dev/null and b/data/borders/m15/black/flippedDark.png differ
diff --git a/data/borders/m15/blackLand/darkTitle.png b/data/borders/m15/blackLand/darkTitle.png
deleted file mode 100644
index 0648b53c..00000000
Binary files a/data/borders/m15/blackLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/blackLand/darkframe.png b/data/borders/m15/blackLand/darkframe.png
deleted file mode 100644
index 6a3c961a..00000000
Binary files a/data/borders/m15/blackLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/blackLand/flippedDark.png b/data/borders/m15/blackLand/flippedDark.png
new file mode 100644
index 00000000..48176e7f
Binary files /dev/null and b/data/borders/m15/blackLand/flippedDark.png differ
diff --git a/data/borders/m15/blue/darkTitle.png b/data/borders/m15/blue/darkTitle.png
deleted file mode 100644
index 60d4ee05..00000000
Binary files a/data/borders/m15/blue/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/blue/darkframe.png b/data/borders/m15/blue/darkframe.png
deleted file mode 100644
index 5af4ec60..00000000
Binary files a/data/borders/m15/blue/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/blue/flippedDark.png b/data/borders/m15/blue/flippedDark.png
new file mode 100644
index 00000000..f755f502
Binary files /dev/null and b/data/borders/m15/blue/flippedDark.png differ
diff --git a/data/borders/m15/blueLand/darkTitle.png b/data/borders/m15/blueLand/darkTitle.png
deleted file mode 100644
index 60d4ee05..00000000
Binary files a/data/borders/m15/blueLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/blueLand/darkframe.png b/data/borders/m15/blueLand/darkframe.png
deleted file mode 100644
index c6d9a896..00000000
Binary files a/data/borders/m15/blueLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/blueLand/flippedDark.png b/data/borders/m15/blueLand/flippedDark.png
new file mode 100644
index 00000000..139cb2f9
Binary files /dev/null and b/data/borders/m15/blueLand/flippedDark.png differ
diff --git a/data/borders/m15/colorless/darkTitle.png b/data/borders/m15/colorless/darkTitle.png
deleted file mode 100644
index c41c850e..00000000
Binary files a/data/borders/m15/colorless/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/colorless/darkframe.png b/data/borders/m15/colorless/darkframe.png
deleted file mode 100644
index 96e7d443..00000000
Binary files a/data/borders/m15/colorless/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/colorless/flippedDark.png b/data/borders/m15/colorless/flippedDark.png
new file mode 100644
index 00000000..c27ab477
Binary files /dev/null and b/data/borders/m15/colorless/flippedDark.png differ
diff --git a/data/borders/m15/colorlessLand/darkTitle.png b/data/borders/m15/colorlessLand/darkTitle.png
deleted file mode 100644
index c41c850e..00000000
Binary files a/data/borders/m15/colorlessLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/colorlessLand/darkframe.png b/data/borders/m15/colorlessLand/darkframe.png
deleted file mode 100644
index aa5846ad..00000000
Binary files a/data/borders/m15/colorlessLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/colorlessLand/flippedDark.png b/data/borders/m15/colorlessLand/flippedDark.png
new file mode 100644
index 00000000..170d5cc8
Binary files /dev/null and b/data/borders/m15/colorlessLand/flippedDark.png differ
diff --git a/data/borders/m15/gold/darkTitle.png b/data/borders/m15/gold/darkTitle.png
deleted file mode 100644
index 752d0439..00000000
Binary files a/data/borders/m15/gold/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/gold/darkframe.png b/data/borders/m15/gold/darkframe.png
deleted file mode 100644
index f3976ca6..00000000
Binary files a/data/borders/m15/gold/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/gold/flippedDark.png b/data/borders/m15/gold/flippedDark.png
new file mode 100644
index 00000000..8e36efc0
Binary files /dev/null and b/data/borders/m15/gold/flippedDark.png differ
diff --git a/data/borders/m15/goldLand/darkTitle.png b/data/borders/m15/goldLand/darkTitle.png
deleted file mode 100644
index 752d0439..00000000
Binary files a/data/borders/m15/goldLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/goldLand/darkframe.png b/data/borders/m15/goldLand/darkframe.png
deleted file mode 100644
index d29ed84c..00000000
Binary files a/data/borders/m15/goldLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/goldLand/flippedDark.png b/data/borders/m15/goldLand/flippedDark.png
new file mode 100644
index 00000000..faf2432b
Binary files /dev/null and b/data/borders/m15/goldLand/flippedDark.png differ
diff --git a/data/borders/m15/green/darkTitle.png b/data/borders/m15/green/darkTitle.png
deleted file mode 100644
index 419b8b8e..00000000
Binary files a/data/borders/m15/green/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/green/darkframe.png b/data/borders/m15/green/darkframe.png
deleted file mode 100644
index 8419db43..00000000
Binary files a/data/borders/m15/green/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/green/flippedDark.png b/data/borders/m15/green/flippedDark.png
new file mode 100644
index 00000000..971a0210
Binary files /dev/null and b/data/borders/m15/green/flippedDark.png differ
diff --git a/data/borders/m15/greenLand/darkTitle.png b/data/borders/m15/greenLand/darkTitle.png
deleted file mode 100644
index 419b8b8e..00000000
Binary files a/data/borders/m15/greenLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/greenLand/darkframe.png b/data/borders/m15/greenLand/darkframe.png
deleted file mode 100644
index e54275af..00000000
Binary files a/data/borders/m15/greenLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/greenLand/flippedDark.png b/data/borders/m15/greenLand/flippedDark.png
new file mode 100644
index 00000000..14e22ba4
Binary files /dev/null and b/data/borders/m15/greenLand/flippedDark.png differ
diff --git a/data/borders/m15/red/darkTitle.png b/data/borders/m15/red/darkTitle.png
deleted file mode 100644
index 62c0fee7..00000000
Binary files a/data/borders/m15/red/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/red/darkframe.png b/data/borders/m15/red/darkframe.png
deleted file mode 100644
index bc326cde..00000000
Binary files a/data/borders/m15/red/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/red/flippedDark.png b/data/borders/m15/red/flippedDark.png
new file mode 100644
index 00000000..2cbbe7c6
Binary files /dev/null and b/data/borders/m15/red/flippedDark.png differ
diff --git a/data/borders/m15/redLand/darkTitle.png b/data/borders/m15/redLand/darkTitle.png
deleted file mode 100644
index 62c0fee7..00000000
Binary files a/data/borders/m15/redLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/redLand/darkframe.png b/data/borders/m15/redLand/darkframe.png
deleted file mode 100644
index 23262d18..00000000
Binary files a/data/borders/m15/redLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/redLand/flippedDark.png b/data/borders/m15/redLand/flippedDark.png
new file mode 100644
index 00000000..81769f61
Binary files /dev/null and b/data/borders/m15/redLand/flippedDark.png differ
diff --git a/data/borders/m15/vehicle/darkTitle.png b/data/borders/m15/vehicle/darkTitle.png
deleted file mode 100644
index dfefd34a..00000000
Binary files a/data/borders/m15/vehicle/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/vehicle/darkframe.png b/data/borders/m15/vehicle/darkframe.png
deleted file mode 100644
index c365f84c..00000000
Binary files a/data/borders/m15/vehicle/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/vehicle/flippedDark.png b/data/borders/m15/vehicle/flippedDark.png
new file mode 100644
index 00000000..31a71f30
Binary files /dev/null and b/data/borders/m15/vehicle/flippedDark.png differ
diff --git a/data/borders/m15/white/darkTitle.png b/data/borders/m15/white/darkTitle.png
deleted file mode 100644
index 1890671a..00000000
Binary files a/data/borders/m15/white/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/white/darkframe.png b/data/borders/m15/white/darkframe.png
deleted file mode 100644
index 56fff2f6..00000000
Binary files a/data/borders/m15/white/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/white/flippedDark.png b/data/borders/m15/white/flippedDark.png
new file mode 100644
index 00000000..70c163a6
Binary files /dev/null and b/data/borders/m15/white/flippedDark.png differ
diff --git a/data/borders/m15/whiteLand/darkTitle.png b/data/borders/m15/whiteLand/darkTitle.png
deleted file mode 100644
index 1890671a..00000000
Binary files a/data/borders/m15/whiteLand/darkTitle.png and /dev/null differ
diff --git a/data/borders/m15/whiteLand/darkframe.png b/data/borders/m15/whiteLand/darkframe.png
deleted file mode 100644
index 4f27156e..00000000
Binary files a/data/borders/m15/whiteLand/darkframe.png and /dev/null differ
diff --git a/data/borders/m15/whiteLand/flippedDark.png b/data/borders/m15/whiteLand/flippedDark.png
new file mode 100644
index 00000000..ac6ff218
Binary files /dev/null and b/data/borders/m15/whiteLand/flippedDark.png differ
diff --git a/index.html b/index.html
index 183c1460..2d6833b7 100644
--- a/index.html
+++ b/index.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML>
+<!DOCTYPE html5>
 <html>
 <head>
 	<title>Card Conjurer - Custom Magic Card Maker (v1.3.1)</title>
@@ -10,15 +10,14 @@
 	<div class="title">Card Conjurer</div>
 </head>
 <!-- <img src="data/background.png"></img> -->
-<body>
+<body onresize="resizeThings()" onload="resizeThings()">
 	<div class="row">
 		<div class="column"><canvas id="canvas" width="749" height="1044"></canvas></div>
-		<!--OPTIONS-->
-		<div class="column">
-			<br/>
-			<div style="width: 375px">
-				<div class="toggle" onclick="toggleVisibility('cardBorder', this, 'toggleShown', 'hidden', 'shown')">Card Border</div>
-				<div class="cardBorder hidden">
+		<div class="column" id="optionsColumn">
+			<!--OPTIONS-->
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Card Border</div>
+				<div class="togglee shown">
 					Border
 					<select id="borderSelection" onchange="changeBorder()">
 						<option value="m15/">M15</option>
@@ -36,7 +35,11 @@
 					<br/>
 					<input type="checkbox" id="checkboxCreature" onchange="updateColor()">Power/Toughness
 					<input id="inputPowerToughness" value="" type="text"></input>
-					<br/>
+				</div>
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Border (Advanced)</div>
+				<div class="togglee">
 					<input type="checkbox" id="checkboxLegendary" onchange="updateColor()">Legendary</input>
 					<br/>
 					<input type="checkbox" id="checkboxNyx" onchange="updateColor()">Nyx</input>
@@ -65,10 +68,11 @@
 					<input type="color" id="inputColor"> Border Color</input>
 					<br/>
 					<input type="checkbox" id="checkboxFoil">Foil</input>
-					<br/>
 				</div>
-				<div class="toggle" onclick="toggleVisibility('nameCostType', this, 'toggleShown', 'hidden', 'shown')">Name, Mana Cost, Type</div>
-				<div class="nameCostType hidden">
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Name, Mana Cost, Type</div>
+				<div class="togglee">
 					Name
 					<input id="inputName" type="text"></input>
 					<br/>
@@ -77,10 +81,11 @@
 					<br/>
 					Type
 					<input id="inputType" type="text"></input>
-					<br/>
 				</div>
-				<div class="toggle" onclick="toggleVisibility('rulesText', this, 'toggleShown', 'hidden', 'shown')">Rules Text</div>
-				<div class="rulesText hidden">
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Rules Text</div>
+				<div class="togglee">
 					Rules Text
 					<br/>
 					<textarea id="inputText" rows="5" cols="40" style="width: 99%; resize: vertical; height: 100px"></textarea>
@@ -93,10 +98,11 @@
 					<br/>
 					Shift All Text Down
 					<input id="textDown" type="number" min="0" max="300" value="0"></input>
-					<br/>
 				</div>
-				<div class="toggle" onclick="toggleVisibility('cardArt', this, 'toggleShown', 'hidden', 'shown')">Card Art</div>
-				<div class="cardArt hidden">
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Card Art</div>
+				<div class="togglee">
 					Image
 					<input type="file" accept="image/*" onchange="loadImage(event, imgArt, true)" id="inputPicture"></input>
 					<br/>
@@ -108,10 +114,11 @@
 					<br/>
 					Image Up
 					<input id="imageUp" type="number" value="0" step="1"></input>
-					<br/>
 				</div>
-				<div class="toggle" onclick="toggleVisibility('otherInfo', this, 'toggleShown', 'hidden', 'shown')">Other Information</div>
-				<div class="otherInfo hidden">
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Bottom Information</div>
+				<div class="togglee">
 					Other Info
 					<input id="inputInfo" value="Not A Real Card" type="text"></input>
 					<br/>
@@ -131,10 +138,11 @@
 					<input id="inputArtist" value="" type="text"></input>
 					<br/>
 					<input id="checkboxArtistColor" type="checkbox">Make Artist Credit font black</input>
-					<br/>
 				</div>
-				<div class="toggle" onclick="toggleVisibility('setSymbolWatermark', this, 'toggleShown', 'hidden', 'shown')">Set Symbol and Watermark</div>
-				<div class="setSymbolWatermark hidden">
+			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Set Symbol and Watermark</div>
+				<div class="togglee">
 					<input type="checkbox" id="checkboxSetSymbol" checked="true">Set Symbol</input>
 					<br>
 					Set Code
@@ -151,9 +159,11 @@
 					<br/><br/>
 					<input type="checkbox" id="checkboxWatermark" checked="true"></input>
 					Watermark
+					<br/>
 					<input type="file" accept="image/*" onchange="loadImage(event, imgWatermark, true)" id="inputWatermark"></input>
 					<br/>
 					Watermark Color
+					<br/>
 					<select id="watermarkColorSelection">
 						<option value="#afa360">White</option>
 						<option value="#04527c">Blue</option>
@@ -164,11 +174,20 @@
 						<option value="#616b72">Artifact/Colorless</option>
 					</select>
 					<br/>
-					<input type="checkbox" id="checkboxSecondWatermarkColor"> Second Watermark Color <select id="secondWatermarkColorSelection"></select></input>
+					<input type="checkbox" id="checkboxSecondWatermarkColor"> Second Watermark Color
 					<br/>
+					<select id="secondWatermarkColorSelection"></select></input>
 				</div>
-				<div class="toggle" onclick="downloadCardImage()" id="downloadCardImage" href="" download="card.jpg">Download</div>
 			</div>
+			<div class="section">
+				<div class="toggler" onclick="toggleSection(this)">Download/Options</div>
+				<div class="togglee">
+					Frame Rate
+					<input type="number" id="inputFPS" value="10" min="0" onchange="window.clearInterval(cardClockInterval); cardClockInterval = setInterval(cardClock, 1000 / document.getElementById('inputFPS').value)"></input>
+					<div onclick="downloadCardImage()" id="downloadCardImage" href="" download="card.jpg">Download</div>
+				</div>
+			</div>
+			<!--END-->
 		</div>
 	</div>
 	<div class="row text">
@@ -304,29 +323,24 @@
 	font-family: belerenbsc;
 	font-size: 16px;
 }
-.toggle {
+.section {
+	border: 1px solid rgb(128, 255, 128);
+	background-color: rgba(0, 0, 0, 0.5);
+}
+.toggler {
 	text-align: center;
 	color: rgb(255, 255, 255);
 	font-family: belerenbsc;
 	font-size: 20px;
 	width: 100%;
 	padding: 5px;
-	border: 1px solid rgb(128, 255, 128);
+	
 }
-.toggle:hover {
+.toggler:hover {
 	color: rgb(128, 255, 128);
 }
-.toggleShown {
-	color: rgb(128, 255, 128);
-	border-color: rgb(128, 255, 128);
-	border-style: solid solid hidden solid;
-}
-.hidden {
-	display: none;
-	font-size: 100px;
-}
-.shown {
-	width: 100%;
+.togglee {
+	width: calc(100% - 12px);
 	padding: 5px;
 	border-width: 1px;
 	border-color: rgb(128, 255, 128);
@@ -334,6 +348,10 @@
 	font-size: 20px;
 	color: rgb(255,255,255);
 	font-family: belerenbsc;
+	display: none;
+}
+.shown {
+	display: block;
 }
 .shown * {
 	font-family: mplantin;
@@ -405,7 +423,7 @@ a:active {
 
 
 
-<script>
+<script crossorigin="anonymous">
 //Load the initial border (m15)
 changeBorder()
 //set up initial variables
@@ -417,7 +435,7 @@ var titleRightShift = 0
 var canvas = document.getElementById("canvas")
 var card = canvas.getContext("2d")
 //Load dynamic images
-var dynamicImageList = ["borderColor", "secondBorderColor", "thirdBorderColor", "borderCreature", "borderLegendary", "secondBorderLegendary", "borderRareStamp", "secondBorderRareStamp", "art", "setSymbol", "watermark", "multiMask", "rareStampMask", "frameMask", "legendFrameMask", "borderMask", "borderNyx", "secondBorderNyx", "borderMiracle", "secondBorderMiracle", "borderFlipIcon", "borderFlipCircle", "borderFlipTip", "borderDarkTitle", "secondBorderDarkTitle"]
+var dynamicImageList = ["borderColor", "secondBorderColor", "thirdBorderColor", "borderCreature", "borderLegendary", "secondBorderLegendary", "borderRareStamp", "secondBorderRareStamp", "art", "setSymbol", "watermark", "multiMask", "rareStampMask", "frameMask", "legendFrameMask", "borderMask", "borderNyx", "secondBorderNyx", "borderMiracle", "secondBorderMiracle", "borderFlipIcon", "borderFlipCircle", "borderFlipTip", "borderFlippedDark", "secondBorderFlippedDark"]
 for (i = 0; i < dynamicImageList.length; i ++) {
 	var imgName = "img" + dynamicImageList[i].charAt(0).toUpperCase() + dynamicImageList[i].slice(1)
 	window[imgName] = new Image()
@@ -427,6 +445,7 @@ var staticImageList = ["artistBrush", "foil", "stampGradient", "multiGradient",
 for (i = 0; i < staticImageList.length; i ++) {
 	var imgName = "img" + staticImageList[i].charAt(0).toUpperCase() + staticImageList[i].slice(1)
 	window[imgName] = new Image()
+	//window[imgName].crossOrigin = "use-credentials"
 	window[imgName].src = "data/borders/" + staticImageList[i] + ".png"
 }
 //Mana symbol Array setup
@@ -445,7 +464,7 @@ loadSetSymbol()
 document.getElementById("secondWatermarkColorSelection").innerHTML = document.getElementById("watermarkColorSelection").innerHTML
 
 //Runs ten times every second (main loop)
-setInterval(function() {
+function cardClock() {
 		//Insures that the corners of the final image are transparent
 		card.globalCompositeOperation = "source-over"
 		drawMask(document.getElementById("inputColor").value, 0, 0, canvas.width, canvas.height, imgCardMask, false, false)
@@ -484,7 +503,8 @@ setInterval(function() {
 		//card.moveTo(0, setSymbolY)
 		//card.lineTo(749, setSymbolY)
 		//card.stroke()
-	}, 100)
+	}
+var cardClockInterval = setInterval(cardClock, 1000 / document.getElementById("inputFPS").value)
 
 
 //The two following functions load different types of borders
@@ -520,9 +540,9 @@ function updateColor() {
 	} else {
 		altframe = ""
 	}
-	imgBorderColor.src = firstColorPath + "/" +  altframe + "frame.png"
-	imgSecondBorderColor.src = secondColorPath + "/" +  altframe + "frame.png"
-	imgThirdBorderColor.src = thirdColorPath + "/" +  altframe + "frame.png"
+	imgBorderColor.src = firstColorPath + "/frame.png"
+	imgSecondBorderColor.src = secondColorPath + "/frame.png"
+	imgThirdBorderColor.src = thirdColorPath + "/frame.png"
 	if (thirdColor == true) {
 		imgBorderCreature.src = thirdColorPath + "/" +  altframe + "pt.png"
 	} else if (secondColor == true) {
@@ -556,23 +576,18 @@ function updateColor() {
 	}
 	if (flipBorder == true) {
 		if (thirdColor == true) {
-			imgBorderDarkTitle.src = thirdColorPath + "/darkTitle.png"
+			imgBorderFlippedDark.src = thirdColorPath + "/flippedDark.png"
 		} else {
-			imgBorderDarkTitle.src = firstColorPath + "/darkTitle.png"
-			if (secondColor == true) {
-				imgSecondBorderDarkTitle.src = secondColorPath + "/darkTitle.png"
-			}
+			imgBorderFlippedDark.src = firstColorPath + "/flippedDark.png"
+			imgSecondBorderFlippedDark.src = secondColorPath + "/flippedDark.png"
 		}
 		if (secondColor == true) {
 			imgBorderFlipTip.src = secondColorPath + "/flipTip.png"
 		} else {
 			imgBorderFlipTip.src = firstColorPath + "/flipTip.png"
 		}
-		titleRightShift = 50
 		imgBorderFlipCircle.src = firstColorPath + "/flipCircle.png"
 		imgBorderFlipIcon.src = "data/borders/icons/" + document.getElementById("inputFlipIcon").value
-	} else {
-		titleRightShift = 0
 	}
 }
 //Draw Picture
@@ -649,27 +664,34 @@ function drawBorder() {
 		}
 	}
 	//FLIP CARDS
-	if (document.getElementById("checkboxFlipIcon").checked == true && flipBorder == true) {
-		card.drawImage(imgBorderFlipCircle, 0, 0, canvas.width, canvas.height)
-		card.drawImage(imgBorderFlipIcon, 39, 51, 60, 60)
+	if (flipBorder == true) {
+		if (document.getElementById("checkboxFlippedDark").checked == true && flipBorder == true) {
+			if (thirdColor == true) {
+				drawMask(imgBorderFlippedDark, 0, 0, canvas.width, canvas.height, imgFrameMask, false, false)
+			} else {
+				drawMask(imgBorderFlippedDark, 0, 0, canvas.width, canvas.height, imgFrameMask, false, false)
+				if (secondColor == true) {
+					drawMask(imgSecondBorderFlippedDark, 0, 0, canvas.width, canvas.height, imgSecondBorderFlippedDark, imgMultiGradient, "reverseSecond")
+				}
+			}
+		}
+		if (document.getElementById("checkboxFlipIcon").checked == true) {
+			card.drawImage(imgBorderFlipCircle, 0, 0, canvas.width, canvas.height)
+			card.drawImage(imgBorderFlipIcon, 39, 51, 60, 60)
+		}
+		if (document.getElementById("checkboxFlipTip").checked == true) {
+			card.drawImage(imgBorderFlipTip, 0, 0, canvas.width, canvas.height)
+			card.fillStyle="#666"
+			canvas.style.letterSpacing = "0px"
+			card.font = "28px belerenb"
+			card.fillText(document.getElementById("inputFlipTip").value, 688 - card.measureText(document.getElementById("inputFlipTip").value).width, 880)
+		}
+		if (document.getElementById("checkboxFlipIcon").checked == true || document.getElementById("checkboxFlippedDark").checked == true) {
+			titleRightShift = 50
+		} else {
+			titleRightShift = 0
+		}
 	}
-	if (document.getElementById("checkboxFlipTip").checked == true && flipBorder == true) {
-		card.drawImage(imgBorderFlipTip, 0, 0, canvas.width, canvas.height)
-		card.fillStyle="#666"
-		canvas.style.letterSpacing = "0px"
-		card.font = "28px belerenb"
-		card.fillText(document.getElementById("inputFlipTip").value, 688 - card.measureText(document.getElementById("inputFlipTip").value).width, 880)
-	}
-	// if (document.getElementById("checkboxFlippedDark").checked == true && flipBorder == true) {
-	// 	if (thirdColor == true) {
-	// 		drawMask(imgBorderDarkTitle, 0, 0, canvas.width, canvas.height, imgFrameMask, false, false)
-	// 	} else {
-	// 		drawMask(imgBorderDarkTitle, 0, 0, canvas.width, canvas.height, imgFrameMask, false, false)
-	// 		if (secondColor == true) {
-	// 			drawMask(imgSecondBorderDarkTitle, 0, 0, canvas.width, canvas.height, imgFrameMask, imgMultiGradient, "reverseSecond")
-	// 		}
-	// 	}
-	// }
 }
 //Draw Set Symbol
 function drawSetSymbol() {
@@ -733,7 +755,11 @@ function writeText() {
 	//Draws the entered text onto the card, also draws the power/toughness box if necessary
 	//All use these:
 	card.textBaseline = "top"
-	card.fillStyle = "Black"
+	if (flipBorder == true && document.getElementById("checkboxFlippedDark").checked == true) {
+		card.fillStyle = "White"
+	} else {
+		card.fillStyle = "Black"
+	}
 	//Title
 	canvas.style.letterSpacing = titleFontSpacing
 	card.font = titleFont	
@@ -742,6 +768,7 @@ function writeText() {
 	canvas.style.letterSpacing = typeFontSpacing
 	card.font = typeFont
 	card.fillText(document.getElementById("inputType").value, typeX, typeY)
+	card.fillStyle = "Black"
 	//Rules Text
 	canvas.style.letterSpacing = textFontSpacing + "px"
 	card.font = document.getElementById("textSize").value + textFont
@@ -920,21 +947,28 @@ function drawText(text, xCoord, yCoord) {
 }
 
 //Toggles the visibility of predetermined sections of the input boxes
-function toggleVisibility(targetClass, self, selfClass, hiddenClass, shownClass) {
-	var alreadyShown = document.getElementsByClassName(selfClass)
-	if (alreadyShown.length >= 1 && alreadyShown[0] != self) {
-		alreadyShown[0].click()
+function toggleSection(target) {
+	for (i = 0; i < target.parentElement.parentElement.childNodes.length; i++) {
+		var targetChild = target.parentElement.parentElement.childNodes[i].childNodes[3]
+		if (targetChild != undefined && targetChild.classList.contains("shown") == true) {
+			targetChild.classList.toggle("shown")
+		}
 	}
-	self.classList.toggle(selfClass)
-	var elementList = document.getElementsByClassName(targetClass)
-	for (i = 0; i < elementList.length; i ++) {
-		elementList[i].classList.toggle(hiddenClass)
-		elementList[i].classList.toggle(shownClass)
+	target.parentElement.childNodes[3].classList.toggle("shown")
+}
+
+//Resizes anything that may need to be resized
+function resizeThings() {
+	if (window.innerWidth > 1100) {
+		document.getElementById("optionsColumn").style = "width: calc(100% - 777px)"
+	} else {
+		document.getElementById("optionsColumn").style = "width: 100%"
 	}
 }
 
 //runs the autocrop function for the chosen set symbol
 function loadSetSymbol() {
+	imgSetSymbol.crossOrigin = "anonymous"
 	imgSetSymbol.src = "https://raw.githubusercontent.com/ImKyle4815/MTG-Set-Symbols/master/setSymbols/" + document.getElementById("setSymbolCode").value.toUpperCase() + "_" + document.getElementById("setSymbolRarity").value.toUpperCase() + ".png"
 }