diff --git a/PRACTICAL_VISION/scripts/hcindex.js b/PRACTICAL_VISION/scripts/hcindex.js index 81c996f..cc09c2d 100644 --- a/PRACTICAL_VISION/scripts/hcindex.js +++ b/PRACTICAL_VISION/scripts/hcindex.js @@ -27,7 +27,7 @@ cnv.position(innerWidth/4, innerHeight*0.1); cnv.style('z-index','-10'); } else { - var cnv = createCanvas(innerWidth*0.9, windowHeight, WEBGL); + var cnv = createCanvas(innerWidth, windowHeight, WEBGL); cnv.position(innerWidth*1.35); cnv.style('z-index','-10'); } diff --git a/README.md b/README.md new file mode 100644 index 0000000..10608ac --- /dev/null +++ b/README.md @@ -0,0 +1,4 @@ +# WOR(L)DS FOR THE FUTURE +## A Republishing Toolkit for an Imaginary Atlas + +SPECIAL ISSUE 13 - XPUB2020 \ No newline at end of file diff --git a/TEST b/TEST deleted file mode 100644 index e69de29..0000000 diff --git a/UNDECIDABILITY/index.html b/UNDECIDABILITY/index.html index a53b557..46683f9 100644 --- a/UNDECIDABILITY/index.html +++ b/UNDECIDABILITY/index.html @@ -1,3 +1,5 @@ + + @@ -748,8 +750,10 @@ var chap1 = document.getElementById("emoji"); chap1.addEventListener('click', function changeText(){ chap1.innerHTML = "When are your 'thinking and imagining and fantasisng and conceptualising' born?
Have you ever seen physical births of these activities? They are not tangible and not visible. Don't you normally have them during your daily rituals? For instance,

when you have a 🚿 to refresh yourself.
And when you drink a cup of ☕.
And when you get some 🔆.
And when you water your 🌱.
And when you smoke 🚬
And when you 📞 your freinds.
You may think you're not in working mode, yet in fact, unconsciously get into labours..."; - chap1.style.cssText = "position: relative; display: inline-block; font-size: 16px; font-family: 'Avenir'; margin-left: 12%; left: 30px; line-height: 1.8; color: white; background-color: black; width: 60%; text-align: left; border: 1px solid; box-shadow: 5px 5px blue;"}); - + chap1.style.cssText = "position: relative; display: inline-block; font-size: 16px; font-family: 'Avenir'; margin-left: 12%; left: 30px; line-height: 1.8; color: white; background-color: black; width: 60%; text-align: left; border: 1px solid; box-shadow: 5px 5px blue;" + +}); + var chap2 = document.getElementById("emoji2"); diff --git a/UNDECIDABILITY/und_response.html b/UNDECIDABILITY/und_response.html index 997a4d7..418cc8b 100644 --- a/UNDECIDABILITY/und_response.html +++ b/UNDECIDABILITY/und_response.html @@ -43,7 +43,7 @@ a{ #buttons { position: absolute; padding: 5px; - top: 75px; + top: 55px; left: 580px; width: 400px; color: blue; @@ -57,7 +57,7 @@ a{ #symbol{ position: absolute; - top: 50px; + top: 40px; margin-left: 50px; font-family: 'wftfs-Regular'; font-size: 47px; @@ -72,7 +72,7 @@ h1 { font-size: 24px; position: absolute; left: 100px; - top: 41px; + top: 31px; text-justify: inter-word; line-height: 2.4; @@ -93,7 +93,7 @@ h1 { display: inline-block; width: 420px; margin-left: 50px; - margin-top: 145px; + margin-top: 135px; border: 1px solid; box-shadow: 5px 5px blue; @@ -102,7 +102,7 @@ h1 { #text { position: absolute; padding-right: 15px; - top: 145px; + top: 135px; margin-left: 540px; font-family: Noto Serif; font-size: 12.4pt; @@ -118,7 +118,7 @@ h1 { #text2 { position: absolute; padding-right: 15px; - top: 145px; + top: 135px; left: 1940px; font-family: Noto Serif; font-size: 12.4pt; diff --git a/fonts/EBGaramond-Bold.ttf b/fonts/EBGaramond-Bold.ttf new file mode 100644 index 0000000..f380a1c Binary files /dev/null and b/fonts/EBGaramond-Bold.ttf differ diff --git a/fonts/EBGaramond-BoldItalic.ttf b/fonts/EBGaramond-BoldItalic.ttf new file mode 100644 index 0000000..a4678e1 Binary files /dev/null and b/fonts/EBGaramond-BoldItalic.ttf differ diff --git a/fonts/EBGaramond-ExtraBold.ttf b/fonts/EBGaramond-ExtraBold.ttf new file mode 100644 index 0000000..dd935be Binary files /dev/null and b/fonts/EBGaramond-ExtraBold.ttf differ diff --git a/fonts/EBGaramond-ExtraBoldItalic.ttf b/fonts/EBGaramond-ExtraBoldItalic.ttf new file mode 100644 index 0000000..2eae45a Binary files /dev/null and b/fonts/EBGaramond-ExtraBoldItalic.ttf differ diff --git a/fonts/EBGaramond-Italic.ttf b/fonts/EBGaramond-Italic.ttf new file mode 100644 index 0000000..a7201b0 Binary files /dev/null and b/fonts/EBGaramond-Italic.ttf differ diff --git a/fonts/EBGaramond-Medium.ttf b/fonts/EBGaramond-Medium.ttf new file mode 100644 index 0000000..b9d6964 Binary files /dev/null and b/fonts/EBGaramond-Medium.ttf differ diff --git a/fonts/EBGaramond-MediumItalic.ttf b/fonts/EBGaramond-MediumItalic.ttf new file mode 100644 index 0000000..a7cf2e5 Binary files /dev/null and b/fonts/EBGaramond-MediumItalic.ttf differ diff --git a/fonts/EBGaramond-Regular.ttf b/fonts/EBGaramond-Regular.ttf new file mode 100644 index 0000000..f57146c Binary files /dev/null and b/fonts/EBGaramond-Regular.ttf differ diff --git a/fonts/EBGaramond-SemiBold.ttf b/fonts/EBGaramond-SemiBold.ttf new file mode 100644 index 0000000..e7e91a3 Binary files /dev/null and b/fonts/EBGaramond-SemiBold.ttf differ diff --git a/fonts/EBGaramond-SemiBoldItalic.ttf b/fonts/EBGaramond-SemiBoldItalic.ttf new file mode 100644 index 0000000..559ad88 Binary files /dev/null and b/fonts/EBGaramond-SemiBoldItalic.ttf differ diff --git a/fonts/Roboto-Black.ttf b/fonts/Roboto-Black.ttf new file mode 100644 index 0000000..2d45238 Binary files /dev/null and b/fonts/Roboto-Black.ttf differ diff --git a/fonts/Roboto-BlackItalic.ttf b/fonts/Roboto-BlackItalic.ttf new file mode 100644 index 0000000..29a4359 Binary files /dev/null and b/fonts/Roboto-BlackItalic.ttf differ diff --git a/fonts/Roboto-Bold.ttf b/fonts/Roboto-Bold.ttf new file mode 100644 index 0000000..d998cf5 Binary files /dev/null and b/fonts/Roboto-Bold.ttf differ diff --git a/fonts/Roboto-BoldItalic.ttf b/fonts/Roboto-BoldItalic.ttf new file mode 100644 index 0000000..b4e2210 Binary files /dev/null and b/fonts/Roboto-BoldItalic.ttf differ diff --git a/fonts/Roboto-Italic.ttf b/fonts/Roboto-Italic.ttf new file mode 100644 index 0000000..5b390ff Binary files /dev/null and b/fonts/Roboto-Italic.ttf differ diff --git a/fonts/Roboto-Light.ttf b/fonts/Roboto-Light.ttf new file mode 100644 index 0000000..3526798 Binary files /dev/null and b/fonts/Roboto-Light.ttf differ diff --git a/fonts/Roboto-LightItalic.ttf b/fonts/Roboto-LightItalic.ttf new file mode 100644 index 0000000..46e9bf7 Binary files /dev/null and b/fonts/Roboto-LightItalic.ttf differ diff --git a/fonts/Roboto-Medium.ttf b/fonts/Roboto-Medium.ttf new file mode 100644 index 0000000..f714a51 Binary files /dev/null and b/fonts/Roboto-Medium.ttf differ diff --git a/fonts/Roboto-MediumItalic.ttf b/fonts/Roboto-MediumItalic.ttf new file mode 100644 index 0000000..5dc6a2d Binary files /dev/null and b/fonts/Roboto-MediumItalic.ttf differ diff --git a/fonts/Roboto-Regular.ttf b/fonts/Roboto-Regular.ttf new file mode 100644 index 0000000..2b6392f Binary files /dev/null and b/fonts/Roboto-Regular.ttf differ diff --git a/fonts/Roboto-Thin.ttf b/fonts/Roboto-Thin.ttf new file mode 100644 index 0000000..4e797cf Binary files /dev/null and b/fonts/Roboto-Thin.ttf differ diff --git a/fonts/Roboto-ThinItalic.ttf b/fonts/Roboto-ThinItalic.ttf new file mode 100644 index 0000000..eea836f Binary files /dev/null and b/fonts/Roboto-ThinItalic.ttf differ diff --git a/fonts/RobotoMono-Bold.ttf b/fonts/RobotoMono-Bold.ttf new file mode 100644 index 0000000..900fce6 Binary files /dev/null and b/fonts/RobotoMono-Bold.ttf differ diff --git a/fonts/RobotoMono-BoldItalic.ttf b/fonts/RobotoMono-BoldItalic.ttf new file mode 100644 index 0000000..4bfe29a Binary files /dev/null and b/fonts/RobotoMono-BoldItalic.ttf differ diff --git a/fonts/RobotoMono-ExtraLight.ttf b/fonts/RobotoMono-ExtraLight.ttf new file mode 100644 index 0000000..d535884 Binary files /dev/null and b/fonts/RobotoMono-ExtraLight.ttf differ diff --git a/fonts/RobotoMono-ExtraLightItalic.ttf b/fonts/RobotoMono-ExtraLightItalic.ttf new file mode 100644 index 0000000..b28960a Binary files /dev/null and b/fonts/RobotoMono-ExtraLightItalic.ttf differ diff --git a/fonts/RobotoMono-Italic.ttf b/fonts/RobotoMono-Italic.ttf new file mode 100644 index 0000000..4ee4dc4 Binary files /dev/null and b/fonts/RobotoMono-Italic.ttf differ diff --git a/fonts/RobotoMono-Light.ttf b/fonts/RobotoMono-Light.ttf new file mode 100644 index 0000000..276af4c Binary files /dev/null and b/fonts/RobotoMono-Light.ttf differ diff --git a/fonts/RobotoMono-LightItalic.ttf b/fonts/RobotoMono-LightItalic.ttf new file mode 100644 index 0000000..a2801c2 Binary files /dev/null and b/fonts/RobotoMono-LightItalic.ttf differ diff --git a/fonts/RobotoMono-Medium.ttf b/fonts/RobotoMono-Medium.ttf new file mode 100644 index 0000000..8461be7 Binary files /dev/null and b/fonts/RobotoMono-Medium.ttf differ diff --git a/fonts/RobotoMono-MediumItalic.ttf b/fonts/RobotoMono-MediumItalic.ttf new file mode 100644 index 0000000..a3bfaa1 Binary files /dev/null and b/fonts/RobotoMono-MediumItalic.ttf differ diff --git a/fonts/RobotoMono-Regular.ttf b/fonts/RobotoMono-Regular.ttf new file mode 100644 index 0000000..7c4ce36 Binary files /dev/null and b/fonts/RobotoMono-Regular.ttf differ diff --git a/fonts/RobotoMono-SemiBold.ttf b/fonts/RobotoMono-SemiBold.ttf new file mode 100644 index 0000000..15ee6c6 Binary files /dev/null and b/fonts/RobotoMono-SemiBold.ttf differ diff --git a/fonts/RobotoMono-SemiBoldItalic.ttf b/fonts/RobotoMono-SemiBoldItalic.ttf new file mode 100644 index 0000000..8e21497 Binary files /dev/null and b/fonts/RobotoMono-SemiBoldItalic.ttf differ diff --git a/fonts/RobotoMono-Thin.ttf b/fonts/RobotoMono-Thin.ttf new file mode 100644 index 0000000..ee8a3fd Binary files /dev/null and b/fonts/RobotoMono-Thin.ttf differ diff --git a/fonts/RobotoMono-ThinItalic.ttf b/fonts/RobotoMono-ThinItalic.ttf new file mode 100644 index 0000000..40b01e4 Binary files /dev/null and b/fonts/RobotoMono-ThinItalic.ttf differ diff --git a/fonts/WFTF_custom-Regular.otf b/fonts/WFTF_custom-Regular.otf new file mode 100644 index 0000000..206e41c Binary files /dev/null and b/fonts/WFTF_custom-Regular.otf differ diff --git a/fonts/wftfs-Regular.otf b/fonts/wftfs-Regular.otf new file mode 100644 index 0000000..a1c417d Binary files /dev/null and b/fonts/wftfs-Regular.otf differ diff --git a/DRAW/assets/grid.png b/grid.png similarity index 100% rename from DRAW/assets/grid.png rename to grid.png diff --git a/index.html b/index.html index 277a055..756f707 100644 --- a/index.html +++ b/index.html @@ -4,21 +4,17 @@ - Wor(l)ds for the Future! + Wor(l)ds for the Future - - - - - + + -
-

WOR(L)DS FOR THE FUTURE!
A Republishing Toolkit for an Imaginary Atlas

- -
+
+

WOR(L)DS FOR THE FUTURE
A Republishing Toolkit for an Imaginary Atlas

+
@@ -29,7 +25,11 @@
-
+
+ + + +

Words have the power to shape reality. Wor(l)ds for the Future is a set of map making tools to reimagine common landscapes. We invite you to delve into the materials and traverse the texts in any way you desire: by cutting and pasting the printed matter, or by unravelling the texts online. The choice is yours. You can reconstruct images and reinterpret wor(l)ds, to create Wor(l)ds for the Future. @@ -37,20 +37,82 @@

people did things

+

people print stuff

+ + +
diff --git a/js.js b/js.js index 96568c2..54cab9e 100644 --- a/js.js +++ b/js.js @@ -1,6 +1,6 @@ let NN = ["punctuation", "symbol", "conflict", "matter", "flux", "loop", "visibility", "multiplicity", "imagination", "democracy","darkness", "subjectivity", "reciprocity","corn", "water", "communities", "Kanye West", "cunt", "god", "language", "knowledge", "web", "ruins", "interdependence", "oneness", "identity", "values", "systems", "democracy"]; -let VB = ["embrace", "flow", "combine", "reinterpret", "understand", "argue","perform", "dominate", "agrue", "overuse", "express", "imagine", "perform", "coexist", "give", "receive", "reflect", "translate", "disseminate", "learn", "weave", "complicate", "demoralise", "experience", "expand", "dominate", "overuse", "express", "happen", "arrive", "submit", "self-govern"]; +let VB = ["embrace", "flow", "combine", "reinterpret", "understand","perform", "dominate", "argue", "overuse", "express", "imagine", "perform", "coexist", "give", "receive", "reflect", "translate", "disseminate", "learn", "weave", "complicate", "demoralise", "experience", "expand", "dominate", "overuse", "express", "happen", "arrive", "submit", "self-govern"]; let AC = ["boundless","political","pluralistic","accessible", "organic", "sublime", "imaginistic", "linguistic", "undecidable", "potential", "autonomous", "indigenous", "systemic", "reciprocal", "plural", "collective", "foreign", "unrelated", "suspicious", "other", "descriptive", "feminist", "alive", "ecologic", "harmonous"]; @@ -43,7 +43,7 @@ var links = { "boundless": "LIQUID/", "organic": "LIQUID/", "sublime": "LIQUID/", - "vundecidability": "UNDECIDABILITY/", + "undecidability": "UNDECIDABILITY/", "visibility": "UNDECIDABILITY/", "multiplicity": "UNDECIDABILITY/", "imagination": "UNDECIDABILITY/", @@ -93,7 +93,7 @@ var links = { "unrelated": "OTHERNESS/", "suspicious": "OTHERNESS/", "other": "OTHERNESS/", - "tence": "TENSE/", + "tense": "TENSE/", "happen": "TENSE/", "arrive": "TENSE/", "submit": "TENSE/", @@ -119,13 +119,120 @@ var links = { "interdependece": "RESURGENCE/", } +var icons = { + "?!": "M", + "dominate" : "M", + "overuse" : "M", + "express" : "M", + "punctuation" : "M", + "symbol" : "M", + "conflict" : "M", + "political" : "M", + "imaginistic" : "M", + "linguistic" : "M", + "liquid": "L", + "flow": "L", + "combine": "L", + "reinterpret": "L", + "matter": "L", + "flux": "L", + "loop": "L", + "boundless": "L", + "organic": "L", + "sublime": "L", + "undecidability": "U", + "visibility": "U", + "multiplicity": "U", + "imagination": "U", + "imagine": "U", + "perform": "U", + "coexist": "U", + "undecidable": "U", + "potential": "U", + "autonomous": "U", + "hope": "H", + "embrace": "H", + "understand": "H", + "argue": "H", + "democracy": "H", + "darkness": "H", + "subjectivity": "H", + "political": "H", + "pluralistic": "H", + "accessible": "H", + "atata": "A", + "give": "A", + "receive": "A", + "reflect": "A", + "reciprocity": "A", + "corn": "A", + "water": "A", + "indigenous": "A", + "systemic": "A", + "reciprocal": "A", + "practical vision": "P", + "translate": "P", + "disseminate": "P", + "learn": "P", + "plural": "P", + "collective": "P", + "foreign": "P", + "language": "P", + "knowledge": "P", + "web": "P", + "otherness": "O", + "experience": "O", + "expand": "O", + "understand": "O", + "oneness": "O", + "identity": "O", + "values": "O", + "unrelated": "O", + "suspicious": "O", + "other": "O", + "tense": "T", + "happen": "T", + "arrive": "T", + "submit": "T", + "Kanye West": "T", + "cunt": "T", + "god": "T", + "descriptive": "T", + "feminist": "T", + "alive": "T", + "eco swaraj": "E", + "ecologic": "E", + "harmonous": "E", + "political": "E", + "self-govern": "E", + "communities": "E", + "systems": "E", + "democracy": "E", + "resurgence": "R", + "weave": "R", + "complicate": "R", + "demoralise": "R", + "ruins": "R", + "interdependece": "R", +} + + +let message = `In the future, the world could be full of ${TS[0]} ${icons[TS[0]]}.\n\ + +Beings could ${VB[0]} ${icons[VB[0]]} and ${VB[1]} ${icons[VB[1]]} in + +${NNP[0]} ${icons[NNP[0]]} ${NNP[1]} ${icons[NNP[1]]}.\n\ + +The ${TS[2]} ${icons[TS[2]]} would no longer be ${AC[4]} ${icons[AC[4]]}, but + +${AC[2]} ${icons[AC[2]]} and ${AC[5]} ${icons[AC[5]]}.\n\ + +Only with the ${AC[3]} ${icons[AC[3]]} ${TS[3]} ${icons[TS[3]]}, there could finally be + +${TS[4]} ${icons[TS[4]]}.\n\ +Without ${TS[5]} ${icons[TS[5]]}, ${NNP[1]} ${icons[NNP[1]]} ${TS[6]} ${icons[TS[6]]} could never ${VB[3]} ${icons[VB[3]]}.\n\ -let message = `In the future, the world could be full of ${TS[0]}.\n\ -Humans could ${VB[0]} and ${VB[1]} in ${NNP[0]} ${TS[1]}.\n\ -The ${TS[2]} would no longer be ${AC[4]}, but ${AC[2]} and ${AC[1]}.\n\ -Only with the ${AC[3]} ${TS[3]}, there could finally be ${TS[4]}.\n\ -Without ${TS[5]}, ${NNP[1]} ${TS[6]} could never ${VB[3]}.\n\ -This is why we have to ${VB[2]} for the ${TS[7]} of new ${NN[0]}.` +This is why we have to ${VB[2]} ${icons[VB[2]]} for the ${TS[7]} ${icons[TS[7]]} of new ${NN[0]} ${icons[NN[0]]}.` document.querySelector('#showMessage').innerHTML = message \ No newline at end of file diff --git a/license b/license new file mode 100644 index 0000000..ae852aa --- /dev/null +++ b/license @@ -0,0 +1,24 @@ +XPUB - WOR(L)DS FOR THE FUTURE LICENSE (v 0.1) +A pluralistic open license +© 2020 XPUB - SPECIAL ISSUE 13 + +Permission is hereby granted, free of charge, to individual, group(s), and non-profit organization(s), obtaining a copy of this project, to use, copy, print, modify, merge, distribute, and/or sell contents or copies of the project, in whole or in parts, subject to the following conditions. +We encourage you to: + + introduce the project to your neighbours, friends, family, etc; + translate the contents into other languages; + create new dramaturgies (structures, stories, worlds) from the contents; + extend this license, as long as the kinship, commercial use and attribution conditions remain in force. + + +Kinship: + +Kinship implies co-relations between Wor(l)ds For The Future and further distributions which will potentially be made. If you want to republish and re-distribute the content, verbatim or derivative, we ask you to send us a copy. By copy we mean a copy of the republished content. For instance, if it is a print or a physical object please send it to XPUB/ WH4.141 t.a.v. Piet Zwart Institute/ WdKA/ Rotterdam Uni. Postbus 1272 300 BG Rotterdam, NL. If it is a file please send it to pzwart-info@hr.nl /attn: XPUB cc. If it is a change in a cloned git repository of the work, please send a patch so we can archive it in a branch. Which means, if you clone or download our git repos (https://git.xpub.nl/XPUB/S13) to modify the project files, we ask you to send us the modifications so we can archive them as well. + +Commercial use: + +Commercial use is only permitted if no profit is derived. Said differently, you can sell copies of the work only to cover the costs of the distribution, printing and/or production, needed to circulate copies of the work. We are asking you to be transparent about such expenses. + +Attribution: + +The above copyright notice and this license shall be included in all copies or modified versions of the project. Any re-publication, verbatim or derivative, of the contents must explicitly credit the name(s) of the author(s) of WORDS FOR THE FUTURE, as well as those of the author(s) of WOR(L)DS FOR THE FUTURE. This attribution must make clear what changes have been made. diff --git a/style.css b/style.css index 6a1b504..8ab2c7b 100644 --- a/style.css +++ b/style.css @@ -39,6 +39,11 @@ src: url('fonts/Brut_Grotesque-Text.otf'); } + @font-face { + font-family: 'WFTF_custom-Regular'; + src: url('fonts/WFTF_custom-Regular.otf'); +} + * { box-sizing: border-box; } @@ -47,12 +52,16 @@ font-family:'Roboto'; --title: 6vw; --sub: 3vw; - --regular: 3vw; - --description: 1vw + --regular: 2vw; + --description: 1vw; + --right: 1vw; + --icon: 1.7vw } body{ - margin: 0; + background-image: url('grid.png'); + background-size: 8vw; + margin: 0 10vw; padding: 0; max-width: 100%; min-height: 100vh; @@ -62,21 +71,22 @@ body{ z-index: 100; } - .row{ - margin: 0 6vw; - } + button{ - margin-left: 2vw; font-family:'Robotomono'; color: black; background-color: white; + font-size: var(--description); + border-radius: 40px } + + .header{ position: relative; /* height: 1vw; */ - margin: 0 6vw; +/* margin: 0 6vw; */ width: 100vw; line-height: 4vw } @@ -88,71 +98,273 @@ button{ } #sub{ - font-family:'Roboto'; + font-family: 'EBGaramonditalic'; font-size: var(--sub); } .column { float: left; + } .left { - width: 70%; + width: 65%; background-color: white; + font-family:'Robotomono'; + background-color: rgba(0,0,0,0)} + + #showMessage{ + margin-top:3vw; + padding-right: 2vw; + font-family:'EBGaramondregular'; + font-size: var(--regular); + line-height: 3vw; + } -} .right { - width: 30%; + width: 35%; background-color: white; border-left: 2px solid black; - height: 100vw; + height: 300vw; + text-align: right; + background-color: rgba(0,0,0,0) + } + .right p{ + font-size: var(--right); + line-height: 1.5vw; + padding: 0 10vw 0 2vw + } + #button{ - text-align: right; - +text-align: center } - button{ - font-size: var(--description)} -#showMessage{ - margin-top:3vw; - font-size:1.5vw; - padding: 2vw; - font-family:'EBGaramondregular'; - font-size: var(--regular); - } - - #showMessage p{ - font-size: 5vw - } + #intro{ visibility: hidden; position: absolute; - font-family:'Robotomono'; + overflow-y: scroll; - margin: 2vw; + margin: 2vw; line-height: 1.5vw} -#colophon{ + #colophon{ visibility: hidden; position: absolute; - font-family:'Robotomono'; + overflow-y: scroll; margin: 2vw;} -#showMessage{ - margin-top:3vw; - font-size:1.5vw; +#print{ + visibility: hidden; + position: absolute; + + overflow-y: scroll; + margin: 2vw;} + + + + + + + .A{ + color: orange; } -a #showMessage{ - margin-top:3vw; - font-size:1.5vw; - color: blue; + .M{ + color: red; + } + + .T{ + color: silver; + } + + .L{ + color: aqua; + } + + .P{ + color: pink; + } + + .R{ + color: #0F0; + } + + .U{ + color: grey; + } + + .H{ + color: yellow; + } + + .O{ + color: blue; + } + + .E{ + color: green; + } + + + #showMessage a{ + + color: black; + text-decoration: none; + font-family: 'EBGaramonditalic'; + + } + + #showMessage span{ + font-family: "WFTF"; + text-decoration: underline; + font-size: var(--icon); + } + + + #showMessage .A:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: orange; + } + + #showMessage .M:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: red; + } + + #showMessage .T:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: silver; + } + + #showMessage .L:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: aqua; + } + + #showMessage .P:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: pink; + } + + #showMessage .R:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: #0f0; + } + + #showMessage .U:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: grey + } + + #showMessage .E:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: green; + } + + #showMessage .H:hover{ + -webkit-transition: all .5sease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5sease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: yellow; + } + + #showMessage .O:hover{ + -webkit-transition: all .5s ease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5s ease; + transition: all .5s ease; +/* text-decoration: underline; */ + color: blue; + } + + + + #future{ + text-decoration: none; + font-family: 'EBGaramonditalic'; + } + + #future:hover{ + text-decoration: underline; + filter: blur(1px); + -webkit-transition: all .5sease; + -moz-transition: all .5s ease; + -o-transition: all .5s ease; + -ms-transition: all .5sease; + transition: all .5s ease; + animation: sexy 1s infinite; + } + + + @keyframes sexy{ + 0%{font-family: 'Roboto';} + 70%{font-family: 'Brut';} + 100%{font-family: 'EBGaramonditalicsemi';} + } + + + + #gallery{ + font-family: "WFTF"; + font-size: 15vw; +/* text-align: center; */ + margin: 40% 25% + } + + .customfont{ + font-family: "WFTF_custom-Regular"; + font-size: 4vw } \ No newline at end of file