@font-face{ font-family: 'mono'; src:url('fonts/go-mono/Go-Mono.ttf'); font-style: normal; font-weight: normal; } @font-face{ font-family: 'mono'; src:url('fonts/go-mono/Go-Mono-Italic.ttf'); font-style: italic; font-weight: normal; } @font-face{ font-family: 'script'; src:url('fonts/LiberationSansNarrow-Bold.ttf'); font-style: normal; font-weight: normal; } /* animations */ @keyframes blink { 0% { opacity: 1; } 10% { opacity: 0.2; } 20% { opacity: 1; } 100% {opacity: 1;} } /* "if we cant make noise its not our revolution" */ body{ position: relative; min-width: 900px; margin:20px; font-family: mono, sans-serif; font-size: 8px; /*background-color: #f0dfff;*/ overflow-x: hidden; z-index: -1; } h1, h2, h3{ font-size: 16px; font-weight: normal; margin:1em 0; } hr{ border:0; border-bottom:1px dotted; clear: both; margin:1em 0; } a, a:active, a:hover{ color:black; text-decoration: none; border-bottom:1px dotted; padding:0; margin:0; } sup, small{ font-size: 100%; } p{ margin:0; } code{ font-family: 'mono'; font-size: 16px; } blockquote{ margin-left:50px; } i{ vertical-align: text-bottom; position: absolute; margin-left: 3.5em; margin-top: -1px; } .blink{ animation: 2s linear 1s infinite blink; } .blink a.printing{ animation: 0.5s linear 0.5s infinite blink; } .blink a.printing:before, .blink a.printing::before { content: "printing ..."; position: fixed; top: 187px; right: 299px; font-size: 85%; } #wrapper{ position: absolute; z-index: -1; width: calc(100% - 400px); min-width: 600px; margin:10px 0 20px 0; font-family: mono, sans-serif; font-size: 16px; line-height: 1.65; letter-spacing: -0.01em; } #nav-wrapper{ position: relative; width: 100%; left:50px; z-index: 0; margin:0; } #nav{ display: inline-block; } #logo a{ font-family: 'script'; font-size: 64px; /*font-weight: bold;*/ -webkit-text-stroke: 2px black; line-height: 1; letter-spacing: -0.035em; border: 0; } #search{ width: 250px; position: relative; margin:20px 20px 20px 0; line-height: 72px; vertical-align: top; } #search input#query{ width: 100%; height: 40px; padding:0px 10px; border:1px dotted; font-family: 'mono'; font-size: 16px; background-color: #f2f2f3; } #search #submit{ position: absolute; width: 103px; height: 42px; right: -140px; top: 15px; font-family: 'mono'; font-size: 16px; text-align: center; } #search #submit:hover{ cursor: pointer; } #colophon_button{ position: absolute; top:-1em; right: -3em; } #print img{ position: fixed; top: 100px; right: 300px; width:100px; height: auto; } #print.connected{ display: block; } #print.disconnected{ display: none; } #content{ width:100%; margin:10px 0 10px 0; } strong, strong.query, strong.word, .result{ font-family: 'script'; font-size: 22px; line-height: 1.5; font-weight: bold; /*-webkit-text-stroke: 1px;*/ letter-spacing: 0em; } .guides{ max-width: 600px; margin:2em 0 4em 10px; } .guides li{ margin-bottom: 0.5em; } /* crossing TEXT */ .cross{ position: relative; max-width: 1000px; margin-top: 4em; padding-right: 2em; clear: both; } p.tfidf, p.techfem, .cross p{ position: relative; margin: 0 0 1.2em 0; } p.tfidf, p.techfem{ width: calc(50% - 1em); display: inline-block; } p.techfem { float: left; margin-right: 2em; } p.techfem.sync{ display: block; clear: both; } p.techfem:before{ content:' ◕'; padding-right: 0.5em; vertical-align: text-bottom; } p.tfidf{ } p.tfidf.sync{ display: block; float: right; clear: both; } p.tfidf:before{ content:'◧'; padding-right: 0.5em; vertical-align: text-bottom; } p.note{ width: 100%; text-align: center; padding-bottom: 1em; } .cross strong{ line-height: 0; } /* make sure that these blocks don't flow into the cross text blocks*/ #results, #notused, #suggestions, #conditionals, #analytics ,.analytics, .mappings, #colophon{ clear: both; } .results{ columns:220px auto; column-gap:10px; scroll-behavior: smooth; } .result{ display: inline-block; width: 190px; margin:0; page-break-inside: avoid; padding: 0 20px 0 20px; transition: all 0.2s ease-in-out; text-align:center; z-index: 2; } .result strong.query{ display: block; width: 100%; height: 12em; padding: 10em 6em 0; margin:-9.7em 0 -10.5em -6em; text-align: center; } .result .title, .result .ascii{ font-family: 'mono'; font-size: 16px; font-weight: normal; -webkit-text-stroke: 0; } .result .title{ padding:10px; margin:3em 0 10px 0; } #txt-list{ position: absolute; width:170px; right: 0px; top:-7px; margin:20px; font-size: 16px; line-height: 1.4; } #txt-list ul{ margin:1em 0 0 0; padding:0; } #txt-list ul li{ margin:0; padding:0 0 1em 0; text-indent: -3.2em; list-style: none; } #txt-list li a.contrast, a.contrast{ border: 0; } #colophon{ display: block; width: 100%; margin: 5em 0; } #manifesto_content_wrapper{ position: absolute; left:0; width: 100%; margin:10px 0 0 10px; padding:20px 0 40px 40px; } #manifesto_content{ display: block; position: relative; overflow-y: auto; } iframe#manifesto_content { width: 100%; height: calc(100vh - 300px); border:1px dotted; background-color: white; }