ATATA

4 years ago · 1e8c95572d
parent 1a4adea8b1
commit 1e8c95572d
33 changed files with 1875 additions and 0 deletions
--- a/ATATA/atata.ico
+++ b/ATATA/atata.ico
--- a/ATATA/atata.pdf
+++ b/ATATA/atata.pdf
--- a/ATATA/atata_blue.ico
+++ b/ATATA/atata_blue.ico
--- a/ATATA/figs/atata.png
+++ b/ATATA/figs/atata.png
--- a/ATATA/figs/atata_layer.png
+++ b/ATATA/figs/atata_layer.png
--- a/ATATA/figs/lagoon.html
+++ b/ATATA/figs/lagoon.html
@ -0,0 +1,70 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <meta charset="utf-8" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <title></title>
+</head>
+    <a href="../"> ↪ go back </a>
+<body>
+
+<div class="images"> 
+
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
+|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|+<br>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
+|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|++|+++|++|++|+++|++|++|++|++|++|++|++|++<br>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++=+++++=++=+++=++=++=+++++=++++++++++++++++++++<br>
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++<br>
+|++|++|++|++|++|++|+++++++++++++++++++++++++++++++|=+++++++++++++++++++++++=+++++++++++++++++++=++=++=+++++=+++++++++++++++++=++++++=++++++++++|++|++<br>
+++++++++++++++++++++++|+++++++++++++++++++++++++++++++++++++++=++=====+=+=+=+===+==+==+++++=+==++=++=+=+==+=+=+==+=+=+=+=+=+=+++=++=+++++++++++++++++<br>
+++++++++++++++++++++++=+++++++++++=++=++++++++++|=|+++++++=+++=+==++|+++++==+=++=+=+==========+==========+===+==+====+===+=+=+=+++=+++++++++++++++|=|<br>
+|++|++|++|++|++|++|++|=+++=+=++===+=++++=+==+========++++++==;===++++|+====|+++++==+=++==;;=+++=++==++===================================++++++++++++<br>
+++++++++++++++++++++|=|=+=++=========+====;;;=;;=|==||==+=+=+||||+|||+=====;;==;;==;===;==+===+||+|||++|=||==;;::::::;::;=;;;;=;=;===========+=++++++<br>
+++++++++++++++++|+|=+|=++||+==|====++==;;=::=|+=====-=i==+|=+====++===+=====+=++==;:::+=;=;;;====|>====;====++=;::.::::::.:;:;=+=;::;;;;====+=+++=+++<br>
+|++|++|++|++|+|++++++=+==||=|+++++=|===:+--::_:=i:.._=;==::==+=|=+=|==|==+=+|++====;:=======:==:=:;;:=====+=+=:;;:=:::::::-:-::::;;:;;:;;;;;:;;======<br>
++++++++++++++==+===+=|+||=:::::=||+++||;.....::=__==i=+====++=+=ii+=||=|==;===+==i|=|==::+==:|+=::::;=+=|=:::::::..-:::.:::.::::=::::;::;======;;;;==<br>
+++++++++++++++|=+|||||=====|||+++-- -+-==||=|iIi>+=+=:;=;==||= +|||= >====||=;|+|vii=i>;=|=:-::-:::;;==+==:::.:-:=:;.:====++===;:::-:-::::;=;:==+++==<br>
+|++|++++++++++++|=|+|+|+=+-=~-.. _==%>:||+||||=||||% i>||+|=i=||i|isi>=||i+:|iI|||ivi|+_=-::;:.====:=::=|:=::=::;:.;:=:;::::-::::-::;::.:.:::;=====++<br>
+++++++|++|++|+|++++=;:::.:_::__==||+===|=||%i>+|={ivvus=i|i{(=|i>+|svv=i=====|+|+=ivv|;+-.:+=+==|:;:.==.:=;==::;;=;===:::::.::.::-.;-:::::;====:=====<br>
+++++++++++++++=====:;;===iiic iv>|==vis%l}||=:||||nnno1vs %|i |}iii||+i>|i:+=i++|| %i=;.::||===+|=:.|=;.: :::===:~::+=:=.:.:.::==;:.:.::=+;::=:;====+<br>
+|++|+++++++++====;;:=++||""~==i|||{|+|==|; |> lvopv21ovnnvsvvioii%ilIi=iIi=|i|i+=i> :.::==|:;==>= =:|=+=;::.:;=:=:;=::--::=======:=: :=:=:=====;;;===<br>
+++++++|+++++=+===;::::-.-.-:-+=:;=%=ua%ivvnvi%vnnvnInvoon%slili1vsvvvsvvii%i|||%i==|:==:=|>==>=i:~-|=|=;::=:`-.--:..:::_;+:`:====:::..::-:=:;=;:=;===<br>
++++++++=+++=====;:;::-::::.::-==|=vn%XnXvnonnnoXnuo1nSo21vvvnllIivv%vvlliii|i=|=_%==||==|-:=+:+:..:-....-:.:._:..:_.../:. ._:;;==-.:::_:::..:::====;=<br>
+++|=|=+++=+====;:;=li=;=-===:: 1XmXozv%nXo3XSvoXXn2Xnvnvnzvv ziv2vnlzi{vic= aaw%i>i+=|==;~::.............:;:. -:.-::.:...:::.-----_;==+=:=:::;===;;==<br>
+++++=+++=+====;;=++|=+;=;;;==;ivo#Z#mnXZ1XvSvononnvon*%IIvvod1Iooqq.<span class="water">####WATER######mwa%</span> ==::: -.:..-..-...-:...:.....::.:......--.:;=.:.:-;-:::=++||<br>
+++++++======+=====:=:::-::=|||=|{3#UZ#ZXvdXnXvvz{v{vaoXdXXnooqm#mm<span class="water">##WA#T###########E##R##mm%</span>..:.:.-..:...:.-:......:: ...........:::=:=+:;_i._::::=||<br>
++++++=+=+=+======;;::-...:.::..:.:+!YYmo|InXe{*1vvd##Xwwqm##m<span class="water">#####WAT#ER.WATER#W#A#T##E#R###mma%</span>`.........:......:..:...............; :=;;--:;`;:=+=;<br>
++++++=++=+===;;=:;::::::..::. ..:....--:::|:+1%lXmWW<span class="water">#####WAT#WATER.WATER.WATER.WATER#W#A#TER.WATEmma%</span>:_:;:.__...:+.:.............:>+=.=-.:.:)+>:==;;;<br>
+++++++++====;;=;;;;:::...:...- -`.: >:v=u111=|!={Q<span class="water">#####WATER.WATER.WAT#E##R##W#A#T#E#R.WATER#W#A#T###wa</span>,;.=--:=:+;:;..`.;........_= ..:;+i_=,:; =====<br>
++|++|++|=|==;;;:::::::...-.:.......=|i>wsai}l=.=;+!?<span class="water">###WATER#WATER.WA#T#E#R#W#A#T#E#R#WAT#ER.WAT#E#R##W#A##qa</span>,=..:=`.;+:/.-----.,..:(.a c_;)=;===i===<br>
++++++++++|=+==;;:::-...:.:. ......=|izi1}>=v2|;==i||=;:+"!?<span class="water">##WATER.#W#A#TE#R#W#ATER.#WAT#E#RWA#TE#R#W#A#TE</span>(_=.:=:........... . .||)']sv =:==i lvi|i|l<br>
+|=|=|+++|+===|=+=::..::.....-.....-=|(v= |{>:====-=n}===: ..-+!?<span class="water">##WATE#R#W#A#TE#R#W#ATER#WAT#ER.#W#A#T#E#R</span>`+ . .. .. . ... - := ..:|](==..:= >:=i|=||<br>
+++++++++++==|==||;==;::..-......--.:|==)(=|s=;|::=+iv%i+:=.:.=:+ )l?Y<span class="water">##WATER.WATER.WATER.WATER.WAT!""</span>++~  ;.:.,. .:+ .lll.;.=)o%=>.i =X1||=;==+++++|+<br>
+++++++++===|======= >:;.......=::|>:+||i>i|*1q%:==::vv==;=+;:-:: =;_ i||<span class="water">*WATER.WATER.WATER.</span>!^-...=:;;-/-  .+".,:-..--------....-==|=v;:;as}..>+|:=|=+<br>
+++++++=+||++|=|====+=::_>.,....v>=|.:|vvliII|+^:,=|.>au|=%=|;;;==:==u#mZ...aa<span class="water">.WATER.W""</span>^-: =;.-.:>==........-=::. :..:.. .-...: ::>a:-a=;:+=|l::==>==<br>
++|=|=+++===|++=+==|==--+:._..;=e;|=:==|i-a:.=;:=a>=vau#ws+_::==;::nZ....m.ZY../Z".......... -:...=2=:+~:.......... .`-`-......:=..|=;=a}:-::=|==|i=++<br>
++++++++++|==+|+===|::;::.:"|=oia(.a::.i^=e:|)====v{1Xm!{(=n.:.:||.,,,.........;`.......;:: =;:=>+v-+::,_. :_..------......:;=a;+.-||=_a;-.===|=ii=|==<br>
+|=++++++++=+++=====:::::.::|_%I!+++=+>}:I(:v%`::|;.%==;vswc_:=%v==i..............:...`:_:;/+=:>=+ . -a`. ..-.......--.-..:+a(=%:=,--++::.;=;+====+++|<br>
+++++|++|+++=+===|;|:i>;;;:-:=|.=>a._=,..:c.{;:av+I-:{iauZ!:=.....ai.......#..1:`..;.:::+==a{v:~:.l:..=;:_:-.: _--......+..,a|%`>---::|::+=======|===+<br>
+++|=+++++|=||=|===;;=|+=:;.---=|2I~={r.:=-:=|=s,.-:==+_ac+!|"=..}n.......;.?'- ..;..=..`..._.;;l. .:_.,,:.:`.:-_./../_.::>=I||=- :::;:i:;==+======+++<br>
+|++++++|++++==++|==;:i=;;=;;.::=~ .=>:,..:>%:>....---.:>^,"~:;._svIq,.?A"i=|- . .:~-: .::+;. ~..> :`. -- ....=- -: .=|.. =>=:;::.:+;;;:;=;=+=|=+++++=<br>
++++++|+++++++|=+========;==+:i..a>`-+Ii=.-`..........:=.a,i;vi|+deuYVwmmeof+`..../..:/..:>_a :`.._.-._.=;:= . :...-=i=.:;::=i======:::=|====+=+|=++++<br>
+++++++++++++++++=>=======:=;==..-`....:,...:au,:;-`..as'=++:_;a+Y1+aaX)3f)'_-.//...);:.~=,=~..=:|~;.=..:=_%. =+`..:=;.|=li;:_=>=:=:;;=;;;===+++=++++|<br>
+|++|+++|=|=|=++++|=+i===:;:==;:....:.::--.;:-^./==::.:v.a>)E a/_d>aa=!ajp_:,>..=--.a==:.o=/.;-_=;>:==:_,:)aai:;.:::;=:;=:|::>=iiIi===;=+==+=+++++++++<br>
+++++++|=+++++|=+=========+=+=+~-...- ..::;:-=--=v%.-;%`:: - ;a)+?("r-_33}^;=u;://i)".-., ..__%;%==>:====::>=_i==:::===::|::a>||=>=>===+=+=+++++++|+++<br>
++++++++++++++=++++|==|=|=|=+;-.:;...,. >`:..:.=}".::.::==,=ai;.._%..IYY$2-vp~`.:_,.:`...::.===:1:==>=|~=|ai>*i====::;:;a;==>=|======+=+=+++++++++++++<br>
+|++|++++|++|++|+++=++=|====+=:||=;..=-.:-....=:`-:|::..=:+.-:an>YYX+`aade{d( .=-2;...:`.: =|..:=;:i=|-_=v}i%=++::::.i%|+=|==|===|+|++++++++++++|=|=+|<br>
+++++++|+++++++++++|+===|===|;=2i>^:--._:_,.:==..:"`.;-.~.::-+{*':=; .:3#::uc .==e`:-`..._.vui-a>=+:a=||I}|:=:=;l:::=:====+=a===||==++++++++++++++++++<br>
+++++++++++++++++++||++===|Il^.ai_.%:_}C=)+=a>a...:.--.:=:`.:.._/-aS(:%mmqc3Wc(_c`._, ..- :-::u*::+=::==+====;==a=|;=++===|==+++|==+|=+++++|++|+++++++<br>
+|++|++++++|++|+||=|++=|=+=|=_%(ai+|=>=v(.:a%=;=. =ia;- ... :=;-`+=`=_i3r}"=32-.s;_;..:==.=|=)+=i=s::::;:====+;;;;;|==|==++||++++++|=+|=++++++++++|+++<br>
+++++++|++|=++++|+|+|=|=;==;i%a}~:=*!+|-.|=v=n-:.;n?Xi-a>%|=:;. :.+.-*m(`|::a>av>C......-=*. :_p==|>=;====>======++==||==+===++|=++++++++|=+++++++++++<br>      <br> 
+<div class="title" > Guatavita Lagoon, CUN, COL <div>
+</div>
+  
+    
+</body>
+    
+</html>
--- a/ATATA/figs/maiz.html
+++ b/ATATA/figs/maiz.html
@ -0,0 +1,18 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <meta charset="utf-8" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <title></title>
+</head>
+    
+    <a href="../"> ↪ go back </a>
+
+<body>
+    
+    <div><img src="maiz.png" alt="corn"></div>
+    
+</body>
+    
+</html>
--- a/ATATA/figs/maiz.png
+++ b/ATATA/figs/maiz.png
--- a/ATATA/figs/style.css
+++ b/ATATA/figs/style.css
@ -0,0 +1,74 @@
+body {
+/*     background-image: url("atata_layer.png");
+    min-height: 500px;
+    background-attachment: fixed;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: cover; */
+    height: 100%;
+    margin: 20px;
+    font-family: monospace;
+    line-height: 1.2;
+    color: black;
+    column-count: 4; 
+    
+}
+
+/* .bg {
+  
+  height: 100%; 
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: cover;
+} */
+
+
+a{
+    text-decoration: none;
+    color: blue;
+}
+
+a:visited{
+    text-decoration: none;
+}
+a:hover {
+    color: white;
+    background: blue;
+}
+
+.images {
+    margin: 0;
+    font-family: monospace;
+    font-size:0.5vw;
+    line-height: 1;
+    position: fixed;
+    color: green; 
+    padding-top: 15px; 
+}
+
+/* .water {
+    color:blue;
+}
+ */
+a{
+    text-decoration: none;
+    color: blue;
+}
+
+a:visited{
+    text-decoration: none;
+}
+
+.title {
+    color: green;
+    font-family: Arial;
+    font-size: 20pt;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.box {
+    display: flex;
+    align-items: center;
+}
--- a/ATATA/figs/symbols.html
+++ b/ATATA/figs/symbols.html
@ -0,0 +1,25 @@
+<!DOCTYPE html>
+
+<html>
+<head>
+    <meta charset="utf-8" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" type="text/css" href="style.css">
+    <title></title>
+</head>
+    
+    <a href="../"> ↪ go back </a>
+
+<body>
+    
+    <div class= "box">
+         <div class="bg"> </div>
+        <div><img src="atata.png" alt="symbol"></div>
+        <div class="title" > 
+        (give) ata: primordial pond (water) <br>
+        (recive) ta: tillage (harvest) <br>
+     </div>
+  </div>
+    
+</body>
+    
+</html>
--- a/ATATA/fonts/CrimsonText-Regular.ttf
+++ b/ATATA/fonts/CrimsonText-Regular.ttf
--- a/ATATA/fonts/Cursor-Apple.otf
+++ b/ATATA/fonts/Cursor-Apple.otf
--- a/ATATA/fonts/iAWriterDuoS-Bold.ttf
+++ b/ATATA/fonts/iAWriterDuoS-Bold.ttf
--- a/ATATA/fonts/iAWriterMonoS-Regular.ttf
+++ b/ATATA/fonts/iAWriterMonoS-Regular.ttf
--- a/ATATA/fonts/wftfs-Regular.otf
+++ b/ATATA/fonts/wftfs-Regular.otf
--- a/ATATA/images/atata.png
+++ b/ATATA/images/atata.png
--- a/ATATA/images/atata_old.png
+++ b/ATATA/images/atata_old.png
--- a/ATATA/images/bio_cycle.png
+++ b/ATATA/images/bio_cycle.png
--- a/ATATA/images/bio_cycle_old.png
+++ b/ATATA/images/bio_cycle_old.png
--- a/ATATA/index.html
+++ b/ATATA/index.html
--- a/ATATA/index_text.html
+++ b/ATATA/index_text.html
--- a/ATATA/main.js
+++ b/ATATA/main.js
@ -0,0 +1,63 @@
+Array.from(document.querySelectorAll(".reveal")).forEach(function(reveal) {
+	reveal.addEventListener("click", function (e) {
+		console.log("Surprise, there's text!");
+		reveal.classList.toggle("tada");
+	})
+});
+
+Array.from(document.querySelectorAll(".entrance")).forEach(function(entrance) {
+	entrance.addEventListener("mouseover", function (b) {
+		console.log("Surprise, there's text!");
+		entrance.classList.toggle("tada");
+	})
+});
+
+
+//     function myFunction() {
+//   var popup = document.getElementByClass("myPopup");
+//       popup.classList.toggle("show");
+// }
+        
+
+
+
+//     const arrows = document.getElementsByClassName("myPopup");
+//     const popup = document.createElement("span"); 
+//     popup.setAttribute("class", "popIN");
+//     popup.style.visibility = "hidden";
+//     popup.style.width = "30px";
+//     popup.style.position = "absolute";
+//     popup.style.bottom = "110%";
+//     popup.style.left = "10%";
+//     popup.style.marginleft = "-4px";
+//     popup.style.border = "solid 1pt";
+//     popup.style.borderadius = "3px";
+//     popup.style.padding = "4px 0";
+//     popup.style.color = "red";
+//     popup.style.backgroundColor = "white";
+//     popup.style.zIndex = "1";
+
+    
+//     const popup_on = ((evt) => {
+//         const title = evt.target.title;
+//         popup.style.visibility = "visible";
+//         popup.innerHTML =
+//             <span> ${title} </span>;
+
+//     });
+    
+//     const popup_off = ((ev) => {
+//         popup.style.visibility = "hidden";
+//     });
+    
+// //     document.getElementByClassName("myPopup").addEventListener("mouseover", myFunction, false);
+    
+//     for (let x of arrows) {
+//         if (x.tagName === "MARK") {
+//             x.addEventListener("click", popup_on, false);
+//             x.addEventListener("click", popup_off, false);
+//         }
+//     }
+    
+
+// }
--- a/ATATA/print/atata.pdf
+++ b/ATATA/print/atata.pdf
--- a/ATATA/print/images/atata.png
+++ b/ATATA/print/images/atata.png
--- a/ATATA/print/images/bio_cycle.png
+++ b/ATATA/print/images/bio_cycle.png
--- a/ATATA/print/index_pdf.html
+++ b/ATATA/print/index_pdf.html
--- a/ATATA/print/text_pdf.css
+++ b/ATATA/print/text_pdf.css
@ -0,0 +1,261 @@
+@page{
+        size: A3;
+        margin: 15mm;
+        font-family: monospace;
+        font-size: 5pt;
+        color: black;
+        
+        @top-left{
+            content: "atata";
+        }
+        @top-center{
+            content: "Wor(l)ds for the future";
+        }
+        @top-right{
+            content: "2020";
+        }
+        @top-middle{
+            content: ""
+        }
+        @left-top{
+            content: "XPUB";
+        }
+        @right-top{
+            content: "#13";
+        }
+        @bottom-left{
+            content: "No body can live";
+        }
+        @bottom-center{
+            font-family: wfdtf;
+            font-size: 10pt;
+            content: "A";
+        }
+        @bottom-right{
+            content: " without others";
+        }
+    }
+
+@font-face {
+    font-family: CrimsonR;
+    src: url(fonts/CrimsonText-Regular.ttf);
+}
+@font-face {
+    font-family: Cursor;
+    src: url(fonts/Cursor-Apple.otf);
+}
+@font-face {
+    font-family: iAWriteBold;
+    src: url(fonts/iAWriterDuoS-Bold.ttf);
+}
+@font-face {
+    font-family: iAWriteRegular;
+    src: url(fonts/iAWriterMonoS-Regular.ttf)
+}
+@font-face {
+    font-family: wfdtf;
+    src: url(fonts/wftfs-Regular.otf)
+}
+
+/* span.title{
+font-family: iAWriteBold;
+font-size: 90pt;
+text-align: left;
+}
+ */
+
+span.subtitle{
+    font-family: CrimsonR;
+    font-size: 13pt;
+    text-align: left;
+}
+
+img {
+    padding-top:15px;
+    width: 280px;
+    object-fit: contain;
+}
+
+body {
+    margin: 15px;
+    font-family: CrimsonR;
+    font-size: 10pt;
+    font-style: normal;
+    line-height: 1.2;
+    color: Black;
+    column-count: 3;
+}
+
+span.intro {
+    margin-top:0px;
+    font-family: iAWriteRegular;
+    font-size: 23pt;
+    line-height: 1;
+}
+
+span.cursor {
+    font-family: Cursor;
+}
+span.quote {
+    font-family: iAWriteRegular;
+    font-size: 45pt;
+    line-height: 0.9;
+}
+
+a{
+    font-family: iAWriteRegular;
+    font-size: 10pt;
+    text-decoration: none;
+    color: Black;
+}
+
+a.link{
+    font-family: wfdtf;
+    color: black;
+}
+
+a:visited{
+    text-decoration: none;
+}
+a:hover {
+    color: white;
+    background: Black;
+}
+
+
+a.fig{
+    font-family: CrimsonR;
+    text-decoration: none;
+    color: Black;
+}
+
+a.fig:visited{
+    text-decoration: none;
+    font-family: CrimsonR;
+}
+a.fig:hover {
+    padding-top: 5px;
+    color: white;
+    background: gold;
+    font-family: CrimsonR;
+}
+
+span.chapters {
+    font-family: CrimsonR;
+    font-style: bold;
+    font-size: 20pt;
+}
+
+span.CC {
+    position: relative;
+    font-size: 8pt;
+    display: inline-block;
+/*     cursor: pointer; */
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+    color:Blue;
+}
+
+span.IN {
+    position: relative;
+    font-size: 8pt;
+    color: Blue;
+    display: inline-block;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+/*     background-color: transparent; */
+}
+
+span.CC:hover {
+    color: white;
+    background: #027e1f;
+}
+
+span.IN:hover {
+    color: white;
+    background: #027e1f;
+   
+}
+
+span.reveal {
+	cursor: pointer !important;
+}
+
+span.reveal > .popIN {
+	display: none;
+}
+
+span.reveal > .popCC {
+	display: none;
+}
+
+
+span.reveal.tada > span.popIN {
+    display:inline;
+    background-color: white;
+    width: 25px;
+    border: solid 1pt;
+    color: #15e85c;
+    text-align: center;
+    border-radius: 3px;
+    padding: 4px 0;
+    position: absolute;
+    z-index: 1;
+    bottom: 110%;
+    left: 10%;
+    margin-left: -4px;
+}
+
+span.reveal.tada > span.popCC {
+    display:inline;
+    background-color: white;
+    width: 25px;
+    border: solid 1pt;
+    color: #15e85c;
+    text-align: center;
+    border-radius: 3px;
+    padding: 4px 0;
+    position: absolute;
+    z-index: 1;
+    bottom: 110%;
+    left: 10%;
+    margin-left: -4px;
+}
+
+span.entrance {
+	cursor: pointer !important;
+}
+
+span.entrance > .arrow {
+	display: none;
+}
+
+span.entrance.tada > span.arrow {
+    display:inline;
+}
+
+span.entrance.tada > .intro {
+    display:hidden;
+}
+
+@media only screen and (max-width: 1400px){
+    body {
+        column-count:3;
+    }
+}
+@media only screen and (max-width: 1000px){
+    body {
+        column-count:2;
+    }
+}
+@media only screen and (max-width: 750px){
+    body {
+        column-count:1;
+    }
+}
--- a/ATATA/proofs/index-Copy1.html
+++ b/ATATA/proofs/index-Copy1.html
--- a/ATATA/proofs/index_old.html
+++ b/ATATA/proofs/index_old.html
--- a/ATATA/proofs/index_text.html
+++ b/ATATA/proofs/index_text.html
--- a/ATATA/proofs/index_white.html
+++ b/ATATA/proofs/index_white.html
--- a/ATATA/text.css
+++ b/ATATA/text.css
@ -0,0 +1,260 @@
+@font-face {
+    font-family: CrimsonR;
+    src: url(fonts/CrimsonText-Regular.ttf);
+}
+@font-face {
+    font-family: Cursor;
+    src: url(fonts/Cursor-Apple.otf);
+}
+@font-face {
+    font-family: iAWriteBold;
+    src: url(fonts/iAWriterDuoS-Bold.ttf);
+}
+@font-face {
+    font-family: iAWriteRegular;
+    src: url(fonts/iAWriterMonoS-Regular.ttf)
+}
+@font-face {
+    font-family: wfdtf;
+    src: url(fonts/wftfs-Regular.otf)
+}
+
+/* span.title{
+font-family: iAWriteBold;
+font-size: 90pt;
+text-align: left;
+}
+ */
+
+:root{
+    --orange: #ff691e;
+    --blue: #042bda;
+}
+ 
+
+
+span.subtitle{
+    font-family: CrimsonR;
+    font-size: 13pt;
+    text-align: left;
+}
+
+img {
+    padding-top:15px;
+    width:390px;
+    object-fit: contain;
+}
+
+body {
+    margin: 15px;
+    font-family: CrimsonR;
+    font-size: 13pt;
+    font-style: normal;
+    line-height: 1.2;
+    color: var(--blue);
+    column-count: 4;
+}
+
+span.intro {
+    padding-top: 0px;
+    font-family: iAWriteRegular;
+    font-size: 25pt;
+    line-height: 1;
+}
+
+
+span.quote {
+    font-family: CrimsonR;
+    font-size: 45pt;
+    line-height: 0.9;
+}
+
+a{
+    font-family: iAWriteRegular;
+    font-size: 10pt;
+    text-decoration: none;
+    color: var(--blue);
+
+}
+
+a.home{
+    position: fixed; 
+    color:var(--blue); 
+    background: white;
+    cursor: pointer;
+    z-index:1000;
+    mix-blend-mode: luminosity;
+    border-radius: 20px;
+/*     border: solid 0.5pt ; */
+    padding-right: 6px;
+    padding-left: 6px;
+    padding-top: 1px;
+    padding-bottom: 1px;
+/*     mix-blend-mode: exclusion; */
+}
+
+a.link{
+    font-family: wfdtf;
+    color: black;
+
+}
+
+a:visited{
+    text-decoration: none;
+}
+
+a:hover {
+    color: white;
+    color: var(--orange);
+    cursor: pointer;
+}
+
+
+a.fig{
+    font-family: CrimsonR;
+    text-decoration: none;
+    color: var(--blue);
+}
+
+a.fig:visited{
+    text-decoration: none;
+    font-family: CrimsonR;
+}
+a.fig:hover {
+    padding-top: 5px;
+    color: white;
+    background: gold;
+    font-family: CrimsonR;
+}
+
+span.chapters {
+    font-family: CrimsonR;
+    font-style: bold;
+    font-size: 20pt;
+}
+
+span.CC {
+    position: relative;
+    font-size: 8pt;
+    display: inline-block;
+/*     cursor: pointer; */
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+    color: var(--orange);
+}
+
+span.IN {
+    position: relative;
+    cursor: pointer;
+    font-size: 8pt;
+    color: var(--orange);
+    display: inline-block;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+/*     background-color: transparent; */
+}
+
+span.CC:hover {
+    color: white;
+    background-color: var(--orange);
+}
+
+span.IN:hover {
+    color: white;
+    background-color: var(--orange);
+   
+}
+
+span.reveal {
+	cursor: pointer !important;
+}
+
+span.reveal > .popIN {
+	display: none;
+}
+
+span.reveal > .popCC {
+	display: none;
+}
+
+
+span.reveal.tada > span.popIN {
+    display:inline;
+    background-color: white;
+    width: 25px;
+    border: solid 1pt;
+    color: var(--orange);
+    text-align: center;
+    border-radius: 3px;
+    padding: 4px 0;
+    position: absolute;
+    z-index: 1;
+    bottom: 110%;
+    left: 10%;
+    margin-left: -4px;
+}
+
+span.reveal.tada > span.popCC {
+    display:inline;
+    background-color: white;
+    width: 25px;
+    border: solid 1pt;
+    color: var(--orange);
+    text-align: center;
+    border-radius: 3px;
+    padding: 4px 0;
+    position: absolute;
+    z-index: 1;
+    bottom: 110%;
+    left: 10%;
+    margin-left: -4px;
+}
+
+span.entrance {
+	cursor: pointer !important;
+}
+
+span.entrance > .arrow {
+	display: none;
+}
+
+span.entrance.tada > span.arrow {
+    display:inline;
+}
+
+span.entrance.tada > .intro {
+    display:hidden;
+}
+
+@media only screen and (max-width: 1400px){
+    body {
+        column-count:3;
+    }
+}
+@media only screen and (max-width: 1000px){
+    body {
+        column-count:2;
+    }
+}
+@media only screen and (max-width: 600px){
+    body {
+        column-count:1;
+    }
+}
+
+@media only screen 
+  and (min-device-width: 375px) 
+  and (max-device-width: 667px) 
+  and (-webkit-min-device-pixel-ratio: 2) { 
+      body {
+        font-size: 50pt;
+        column-count:1;
+    }
+
+}
--- a/ATATA/text_white.css
+++ b/ATATA/text_white.css
@ -0,0 +1,375 @@
+@font-face {
+    font-family: CrimsonR;
+    src: url(fonts/CrimsonText-Regular.ttf);
+}
+@font-face {
+    font-family: Cursor;
+    src: url(fonts/Cursor-Apple.otf);
+}
+@font-face {
+    font-family: iAWriteBold;
+    src: url(fonts/iAWriterDuoS-Bold.ttf);
+}
+@font-face {
+    font-family: iAWriteRegular;
+    src: url(fonts/iAWriterMonoS-Regular.ttf)
+}
+@font-face {
+    font-family: wfdtf;
+    src: url(fonts/wftfs-Regular.otf)
+}
+
+:root{
+    --orange: #ff691e;
+    --blue: #0631f6;
+}
+
+::-moz-selection { /* Code for Firefox */
+  color: white;
+  background: var(--orange);
+}
+
+::selection {
+  color: white;
+  background: var(--orange);
+}
+
+
+span.subtitle{
+    font-family: CrimsonR;
+    font-size: 13pt;
+    text-align: left;
+    color:white;
+}
+
+img {
+    padding-top:15px;
+    width:390px;
+    object-fit: contain;
+    opacity:0;
+}
+
+body {
+    margin: 15px;
+    font-family: CrimsonR;
+    font-size: 13pt;
+    font-style: normal;
+    line-height: 1.2;
+    color: black;
+    column-count: 4;
+}
+
+span.intro {
+    margin-top:25px;
+    font-family: CrimsonR;
+    font-size: 15pt;
+    line-height: 0.8;
+    color: var(--orange);
+}
+
+span.quote {
+    font-family: iAWriteRegular;
+    font-size: 45pt;
+    line-height: 0.9;
+    color:white;
+}
+
+a{
+    font-family: iAWriteRegular;
+    font-size: 10pt;
+    cursor: pointer;
+    text-decoration: none;
+    color: white;
+}
+
+a.home{
+    position: fixed; 
+    color:var(--orange); 
+    background: white;
+    z-index:1000;
+    mix-blend-mode: luminosity;
+    border-radius: 20px;
+/*     border: solid 0.5pt ; */
+    padding-right: 6px;
+    padding-left: 6px;
+    padding-top: 1px;
+    padding-bottom: 1px;
+/*     mix-blend-mode: exclusion; */
+}
+
+a.h1 {
+    margin-top:25px;
+    font-family: CrimsonR;
+    font-size: 15pt;
+    line-height: 1;
+    color: var(--orange);
+}
+
+a.link{
+    font-family: wfdtf;
+    color: var(--blue);
+    cursor: pointer;
+}
+
+/* a:visited{
+    text-decoration: none;
+} */
+
+a:hover {
+    color: var(--blue);
+}
+
+span.intro:hover {
+    color: var(--blue);
+}
+
+
+
+a.fig{
+    font-family: CrimsonR;
+    text-decoration: none;
+    color: white;
+}
+
+a.fig:visited{
+    text-decoration: none;
+    font-family: CrimsonR;
+}
+a.fig:hover {
+    padding-top: 5px;
+    color: white;
+    background: gold;
+    font-family: CrimsonR;
+}
+
+span.chapters {
+    font-family: CrimsonR;
+    font-style: bold;
+    font-size: 20pt;
+    color: white;
+}
+
+span.CC {
+    position: relative;
+    font-size: 8pt;
+    display: inline-block;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+    color: var(--orange);
+}
+
+span.IN {
+    position: relative;
+    font-size: 8pt;
+    color: var(--orange);
+    display: inline-block;
+    cursor: pointer;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-family: iAWriteRegular;
+/*     background-color: transparent; */
+}
+
+span.NN {
+    color:white;
+}
+
+span.FW{
+    color:white;
+}
+
+span.DT {
+    color:white;
+}
+
+span.VB {
+    color:white;
+}
+
+span.VBP {
+    color:white;
+}
+
+span.PRP {
+    color:white;
+}
+
+span.JJ {
+    color:white;
+}
+
+span.VBZ {
+    color:white;
+}
+
+span.TO {
+    color:white;
+}
+
+span.NNS {
+    color:white;
+}
+
+span.NNP {
+    color:white;
+}
+
+span.VBN {
+    color:white;
+}
+
+span.CD {
+    color:white;
+}
+
+span.WP {
+    color:white;
+}
+
+span.WDT {
+    color:white;
+}
+
+span.RB{
+    color:white;
+}
+
+span.VBG{
+    color:white;
+}
+
+span.JJS{
+    color:white;
+}
+
+span.WRB{
+    color:white;
+}
+
+span.JJR{
+    color:white;
+}
+
+span.VBD{
+    color:white;
+}
+
+span.RBS{
+    color:white;
+}
+
+span.DOT{
+    color:white;
+}
+
+span.COM{
+    color:white;
+}
+
+span.MD{
+    color:white;
+}
+
+span.EX{
+    color:white;
+}
+
+span.PRP{
+    color:white;
+}
+
+span.NNPS{
+    color:white;
+}
+
+span.RBR{
+    color:white;
+}
+
+span.RP{
+    color:white;
+}
+
+span.PDT{
+    color:white;
+}
+
+
+
+span.CC:hover {
+    color: var(--blue);
+}
+
+span.IN:hover {
+    color: var(--blue);
+   
+}
+
+span.popIN {
+  visibility: hidden;
+  background-color: white;
+  width: 30px;
+  border: solid 1pt;
+  color: red;
+  text-align: center;
+  border-radius: 3px;
+  padding: 4px 0;
+  position: absolute;
+  z-index: 1;
+  bottom: 110%;
+  left: 10%;
+  margin-left: -4px;
+}
+
+span.popCC {
+  visibility: hidden;
+  background-color: white;
+  width: 30px;
+  border: solid 1pt;
+  color: orange;
+  text-align: center;
+  border-radius: 3px;
+  padding: 4px 0;
+  position: absolute;
+  z-index: 1;
+  bottom: 110%;
+  left: 10%;
+  margin-left: -4px;
+}
+
+.footnotes {
+    color:white;
+    
+}
+
+@media only screen and (max-width: 1400px){
+    body {
+        column-count:3;
+    }
+}
+@media only screen and (max-width: 1000px){
+    body {
+        column-count:2;
+    }
+}
+@media only screen and (max-width: 600px){
+    body {
+        column-count:1;
+    }
+}
+
+@media only screen 
+  and (min-device-width: 375px) 
+  and (max-device-width: 667px) 
+  and (-webkit-min-device-pixel-ratio: 2) { 
+      body {
+        column-count:1;
+    }
+
+}