diff --git a/digitalselves-scripts.js b/digitalselves-scripts.js
new file mode 100644
index 0000000..f1e86cd
--- /dev/null
+++ b/digitalselves-scripts.js
@@ -0,0 +1,303 @@
+//--------------------------------------------------------------------------
+// CHOREOGRAPHIC CODE by Joana Chicau
+//--------------------------------------------------------------------------
+
+
+// errors we live by
+
+// trial and error
+// margin of error
+// https://upload.wikimedia.org/wikipedia/commons/a/a9/Empirical_Rule.PNG
+// printing error messages;
+
+// creating a loop for changing text in all headings
+
+
+// https://developer.mozilla.org/en-US/docs/Web/HTTP/Status
+
+var delay="1";
+var count='0';
+var tempo="500";
+var elements = document.getElementsByTagName("a")
+
+var textarray = [
+"ヽ(´∇´)ノ (∇´ノ) ヽ( )ノ (ヽ´∇) ヽ(´∇`)ノ \ (^_^ ) ノ",
+"(。・・。) 401 Unauthorized",
+" 402 Payment Required 💸 💱 (゜゜)",
+" (゚ρ゚; 403 Forbidden",
+" 404 Not Found ヾ(´・ ・`。)ノ” ",
+" 406 Not Acceptable ⊙ ﹏ ⊙",
+" what error? ʍɥɐʇ ǝɹɹoɹ¿ what error? ʍɥɐʇ ǝɹɹoɹ¿",
+" 408 Request Timeout ☼☼¸.•*",
+"(─‿─) (─‿‿─) (─‿─) (─‿‿─) 409 Conflict (─‿─) (─‿‿─) (─‿─) (─‿‿─)",
+"ˏ 𓏧 𓏲 𓏲 𓏲 𓋒 410 Gone 𓏲 𓏲 𓏲 𓏲 𓏧 ˎ",
+"415 Unsupported Media Type (◔_◔)",
+" ━━━━━━━ 416 Range ▼△▼△▼△▼ Not ▼△▼△▼△▼ Satisfiable ━━━━━━━ ",
+" 417 Expectation ٩( ∩_∩ )۶ Failed (¸.꒳.¸) ",
+" 418 I'm a teapot ☕ the server refuses the attempt to brew coffee with a teapot.",
+"425 ⏰ ⌛ ⏱️ Too Early ⏱️ ⌛ ⏰ ・.⋆。⋆☂˚。⋆。˚☽˚。⋆",
+"【☆】★【☆】★【426 Upgrade Required】★【☆】★【☆】",
+"。°。°。°。°。°。°。°。°。°。°。° 429 Too Many Requests 。°。°。°。°。°。°。°。°。°。°。°",
+"⤹⋆⸙͎۪۫。˚۰˚ 451 Unavailable For Legal Reasons˚⁀➷。˚⸙͎۪۫⋆ ༄ ",
+"■ □ ■ □ ■ □ ■ □ 502 Bad Gateway ■ □ ■ □ ■ □ ■",
+"‿︵‿︵‿︵‿ 508 Loop Detected ︵‿︵‿︵‿︵",
+"○ꊞ○ꊞ○ꊞ○ꊞ○ꊞ 507 Insufficient Storage ꊞ○ꊞ○ꊞ○ꊞ○ꊞ○",
+" 100 Continue ♪ ● ☽ ♩ ○ ♬ ☆ ༝̩̩̥͙ ",
+"٩(✿∂‿∂✿)۶ 200 OK ✿ ✿ ✿ ✿ ✿ "
+];
+
+//textarray.push(" ♪ ♪ ♪ ┌(・ 。・)┘ ♩♪ ♫ ♬");
+
+
+function wonder02() {
+ var rannum= Math.floor(Math.random()*textarray.length);
+ for (var i = 0; i < elements.length; i++) {
+ elements[i].innerHTML = textarray[rannum];
+ }
+ timer = setTimeout("wonder()", delay*tempo);
+}
+// clearTimeout(timer);
+
+function wonder() {
+ document.querySelector('#stage02').innerHTML = textarray[count];
+ count++;
+ if(count==textarray.length){count='0';}
+ setTimeout("wonder()",6000);
+}
+wonder()
+
+// - - - - - - - - INPUT Errors - - - - - - - -
+
+//
Please input a number between 5 and 10:
+//
+//
+//
+
+function myFunction() {
+ const message = document.getElementById("p01");
+ message.innerHTML = "";
+ let x = document.getElementById("demo").value;
+ try {
+ if(x == "") throw "empty";
+ if(isNaN(x)) throw "not a number";
+ x = Number(x);
+ if(x < 5) throw "too low";
+ if(x > 10) throw "too high";
+ }
+ catch(err) {
+ message.innerHTML = "Input is " + err;
+ }
+}
+
+// - - - - - - - - JavaScript Errors - - - - - - - -
+
+$(document).ready(function(){
+if (typeof console != "undefined")
+ if (typeof console.log != 'undefined')
+ console.olog = console.log;
+ else
+ console.olog = function() {};
+
+console.log = function(message) {
+ console.olog(message);
+ $('#err').append(message);
+ // $('#err').append('' + message + '');
+};
+console.error = console.debug = console.info = console.log
+});
+
+
+window.onerror = function (msg, url, lineNo, columnNo, error) {
+ var string = msg.toLowerCase();
+ var substring = 'script error';
+ if (string.indexOf(substring) > -1){
+ alert('Script Error: See Browser Console for Detail');
+ } else {
+ var message = [
+ 'Message: ' + msg,
+ 'URL: ' + url,
+ 'Line: ' + lineNo,
+ 'Column: ' + columnNo,
+ 'Error object: ' + JSON.stringify(error)
+ ].join(' - ');
+
+ alert(message);
+ console.log(message);
+ }
+
+ return false;
+};
+/*
+
+ let num = 1;
+ a = y + 1;
+ let ran = 1;
+
+try {
+ // Type Error
+ num.toUpperCase();
+ // Reference Error
+ a = y + 1;
+ // Syntax Error
+ eval("alert('Hello)");
+ // Range Error
+ ran.toPrecision(500);
+} catch (error) {
+
+ switch (true) {
+ case (error instanceof ForbiddenError): {
+ document.getElementById("err").innerHTML = error.name + "
" + error.message;
+ console.log();
+ break;
+ }
+ case (error instanceof SyntaxError): {
+ document.getElementById("err").innerHTML = error.name + "
" + error.message;
+ console.log();
+ break;
+ }
+ case (error instanceof RangeError): {
+ document.getElementById("err").innerHTML = error.name + "
" + error.message;
+ console.log();
+ break;
+ }
+ default: {
+ document.getElementById("err").innerHTML = error.name + "
" + error.message;
+ console.log();
+ }
+ }
+
+}
+
+
+// Reference Error
+
+
+let a = 5;
+try {
+ a = y + 1; // thrown if you use (reference) a variable that has not been declared
+}
+catch(err) {
+ document.getElementById("err").innerHTML = err.name;
+}
+
+// Syntax Error
+try {
+ eval("alert('Hello)"); // Missing ' will produce an error
+}
+catch(err) {
+ document.getElementById("err").innerHTML = err.name;
+}
+
+//
+try {
+ hello("world(s)!");
+}
+catch(err) {
+ document.getElementById("err").innerHTML =
+ err.name + "
" + err.message;
+}
+
+// URI (Uniform Resource Identifier) Error
+try {
+ decodeURI("%%%"); // You cannot URI decode percent signs
+}
+catch(err) {
+ document.getElementById("err").innerHTML = err.name;
+}
+
+// Type Error
+let num = 1;
+try {
+ num.toUpperCase(); // You cannot convert a number to upper case
+}
+catch(err) {
+ document.getElementById("err").innerHTML = err.name;
+}
+
+// Range Error
+let ran = 1;
+try {
+ ran.toPrecision(500); // A number cannot have 500 significant digits
+}
+catch(err) {
+ document.getElementById("err").innerHTML = err.name;
+}
+*/
+
+function Breathing() {
+ var zooming = document.querySelector("body");
+ currentScale = 1;
+ currenttime = setInterval(function() {
+ zooming.style.transform="scale(" + currentScale + ")";
+ currentScale = Math.random() * 5
+ }, 800);
+}
+
+function No_Breathing() {
+ clearInterval(currenttime);
+}
+
+
+// background: radial-gradient(ellipse at center, #0000FF, #E6E6FA 10%, #0000FF);
+// background: linear-gradient(#fff, #0000FF 100%, #fff 10%)
+// transform: matrix3d(1, 1, 0, 0, 10, 1, 0, 10, 10, 0, 1, 0, 200, 10, 0, 1);
+
+
+function Breathing02() {
+ var zooming = document.querySelector("body");
+ numb = 1;
+ currenttime = setInterval(function() {
+ zooming.style.backgroundSize = numb + "%";
+ numb = Math.random() * 500;
+ }, 800);
+}
+
+
+
+ var x = document.getElementsByTagName("div");
+ var counter = 1000;
+ var i;
+ function Breathing03 () {
+ for (i = 0; i < x.length; i++) {
+// x[i].style.opacity = Math.random() * 2;
+ x[i].style.transform = "scaleY(" + Math.random() * 5 + ")";
+ x[i].style.transition = "all 1s ease-in-out";
+ window.setTimeout(Breathing03, counter);
+ }
+ };
+setTimeout(Breathing03, 1000);
+
+
+
+
+function Breathing(){
+ var x = document.getElementsByTagName("div");
+ var i;
+ for (i = 0; i < x.length; i++) {
+ x[i].style.transform = "scaleY(" + Math.random() * 5 + ")";
+ x[i].style.transition = "all 1s ease-in-out";
+ }
+}
+// clearInterval(timer);
+// timer = setInterval(Breathing, 2000);
+
+
+function noBreathing() {
+ clearInterval(currenttime);
+ clearInterval(thistime);
+}
+
+
+
+
+// document.querySelector("body").style.border="solid #000 0rem"
+// document.querySelector("body").style.borderRadius="30rem"
+// document.querySelector("body").style.background="linear-gradient(70deg, Aquamarine, MistyRose, Blue, Plum, WhiteSmoke, LightYellow)"
+// document.querySelector("html").style.backgroundColor="black"
+
+function skin () {
+ currenttime = setInterval(function() {
+ document.querySelector("body").style.background = "linear-gradient(" + Math.floor(Math.random() * 1000) + "deg, var(--color-pink), var(--color-yel), var(--color-blue), var(--color-gray))";
+ }, 800);
+}
+
diff --git a/digitalselves-test.html b/digitalselves-test.html
new file mode 100644
index 0000000..0b48775
--- /dev/null
+++ b/digitalselves-test.html
@@ -0,0 +1,57 @@
+
+
+
+ Choreo-Graphic Coding
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/digitalselves.css b/digitalselves.css
new file mode 100644
index 0000000..d9ff672
--- /dev/null
+++ b/digitalselves.css
@@ -0,0 +1,114 @@
+@font-face {
+font-family: 'Combine';
+src: url('Combine.otf') format('opentype');
+font-weight: normal;
+}
+
+@font-face {
+font-family: 'Sinistre';
+src: url('Sinistre-S†Caroline.otf') format('opentype');
+font-weight: normal;
+}
+
+:root {
+ --color-blue: #0000FF;
+ --color-gray: #edecec;
+ --color-pink: #f8a8ff;
+ --color-yel: #FDFFF0;
+ --color-aqua: #7FFFD4;
+ --special-font: 'Sinistre';
+}
+
+html {
+ box-sizing: border-box;
+ height: 100%
+}
+*, *:before, *:after {
+ -webkit-box-sizing: inherit;
+ -moz-box-sizing: inherit;
+ box-sizing: inherit;
+}
+
+body{
+ margin:0px;
+ /*animation: bodymove 60s infinite;
+ -webkit-animation: bodymove 60s infinite; */
+}
+
+@keyframes bodymove {
+ 0% { background: radial-gradient(ellipse at center, var(--color-pink), var(--color-blue));
+ background-size: 100% 100%;}
+ 20% { background: radial-gradient(ellipse at top, var(--color-yel), var(--color-blue) 100%);
+ background-size: 10% 10%; }
+ 30% { background: radial-gradient(ellipse at top, var(--color-yel), var(--color-blue) 40%);
+ background-size: 10% 100%;}
+ 35% { background: radial-gradient(ellipse at top, var(--color-yel), var(--color-blue) 40%, var(--color-pink));
+ background-size: 10% 100%;}
+ 45% { background: radial-gradient(ellipse at center, var(--color-yel), var(--color-blue) 10%, var(--color-yel) 100%);}
+ 65% { background: radial-gradient(ellipse at center, var(--color-blue), var(--color-yel) 10%, var(--color-blue) 100%);
+ background-size: 10% 999%;
+ background-position: left;}
+ 70% { background: radial-gradient(ellipse at center, var(--color-pink), var(--color-yel) 10%, #f8a8ff 100%);
+ background-size: 10% 999%;}
+ 85% { background: linear-gradient(var(--color-pink), var(--color-blue) 10%, var(--color-pink) 100%);
+ background-size: 10% 10%;}
+ 90% { background: linear-gradient(var(--color-blue) 50%, var(--color-pink) 10% 10%);
+ background-size: 100% 1%;}
+ 100% { background: linear-gradient(var(--color-pink) 10%, var(--color-blue) 100%);}
+}
+
+marquee{
+ color: var(--color-pink);
+ font-family: var(--special-font);
+}
+
+#stage01{
+ width: 100%;
+ height: 100vh;
+}
+#stage02{
+ color: var(--color-blue);
+ font-size: 14vmax;
+ line-height: 18vmax;
+ position: absolute;
+ z-index: 2;
+ top: 0;
+ font-family: var(--special-font);
+ font-weight: bold;
+ word-spacing: 1vw;
+ filter: opacity(0.9);
+ text-shadow: 2px 2px 2px var(--color-pink);
+}
+
+#stage03{
+ filter: opacity(0.8);
+ position: absolute;
+ z-index: 3;
+ top: 0;
+ right: 0;
+ margin: 2vmax;
+ width: 130vmin;
+ height: 90vmin;
+ border: 0px;
+ box-shadow: 1px 1px 8px 2px var(--color-pink);
+ border-radius: 0 50% 50% 50%;
+ filter: grayscale(1);
+}
+
+span {
+ box-shadow: 1px 1px 8px 2px var(--color-pink);
+ position: absolute;
+ z-index: 1;
+}
+
+span#oval {
+ width: 50%;
+ height: 80%;
+ border-radius: 100% / 50%;
+}
+
+span#dia {
+ width: 90%;
+ height: 90%;
+ transform: rotate(45deg);
+}