TOBIAS by @MILENUCCIA87 - Codewith.it

#main, .loader-cont { display: none; } JavaScript disabilitato.
Non puoi usare Codewith.it senza JavaScript.

Referenze

srcIndica la provenienza di una risorsa esterna (tramite URL).
_blankApre i collegamenti ipertestuali in una nuova scheda del browser
<base>Specifica l'URL di base per tutti gli URL relativi all'interno della pagina.
<hr>Inserisce una linea orizzontale
loopL'attributo loop è usato per la riproduzione continua dei contenuti video e audio
<option>Serve ad inserire una voce in un menu di selezione.

Utenti

Accedi per cercare utenti

Esplora

Trova ispirazione

esercitazione 1

Heads Or Tails Random Tally

Heads Or Tails Tally. pre ai

countdown passaporto 2

Esercitazione 2

Bootstrap Basics

Le avventure di Peter Pan

La torta della nonna es esame

HTML

CSS

JS

terminal console

feedback

add_box Nuovo

cookie Informativa

Informativa privacy e cookies

Utilizziamo cookie o tecnologie per finalità tecniche e, con il tuo consenso, anche per altre finalità come specificato nella cookie policy. Il rifiuto del consenso può rendere non disponibili alcune funzioni. Leggi di più sull'informativa privacy

Clicca su “Accetta” per acconsentire.

<style>

/* ------------------------ VARIE --------------------- */
.testo::-webkit-scrollbar {
  width: 0px;
}

.testo::-webkit-scrollbar-thumb {
  background-color: 000000;
  
}

.testo::-webkit-scrollbar-track {
  background: transparent;
}



/* -------------- BOX GENERALE -------------------------- */


.base { position: relative;
                width: 480px; 
                height: 600px;
                margin-left: 5px; 
                }


/* --------------- IMMAGINE ------------------ */
.immi {
               position: relative;  
               width: 200px; 
               height: 738px;
               background-image: url(https://i.imgur.com/LUhJuP4.png); border: 1px solid #000000;}

/* --------------- TESTI --------------- */


.box1 { position: relative;  z-index: 3; overflow:  hidden;
  width: 230px;
  height: 500px;
  margin-left: 210px; 
  margin-top: -714px;  
  border: 1px solid #000000;
  padding: 3px; 
  transition: all ease-out 1.5s; 
}


.testo { position: absolute; z-index: 2; float: left; overflow: auto;
  width: 220px;
  height: 490px;
  padding: 5px;
  background-color: #000000; 
  text-align: justify; 
  color: #3d3d3d; 
  font-family: "Titillium Web", sans-serif; 
  font-size: 10.5px; 
  line-height:11px; 
  letter-spacing: 1px; 
  font-weight: normal!important;
}


/* ------------------- NOME GRANDE ------------------------------ */
.frase { z-index: 4;
	            position: relative;
	            margin-left: 30px;
              margin-top: -150px;
              font-size: 50px;
              width: 370px;
	            color: #6a6b4f;
	            font-family: "Anton", sans-serif;
	            transition: 5s;
              letter-spacing:-4px;
              text-shadow: 1px 1px 1px #000000; }

.frase1 { position:relative; margin-top: -10px; margin-left: 20px; width:390px; color:#000000; font-family: "Titillium Web", sans-serif; background-color: rgba(50,56,63, .5); font-weight:bold;letter-spacing:2px; text-transform:uppercase; z-index: 4; font-size:8px;text-align:center;text-shadow:1px 1px 1px #000;}
   

/* ---------------- GIF ----------------------- */

.gif1 { z-index: 3;
        position: relative;
        margin-top: -105px;
        margin-left: 260px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/97WpqvG.gif);
        outline: 4px double #000000; filter: brightness(80%)grayscale(80%); }

.gif2 { z-index: 3;
        position: relative;
        margin-top: -67px;
        margin-left: 351px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/VKw1QyX.gif); outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}

.gif3 { z-index: 2;
        position: relative;
        margin-top: -4px;
        margin-left: 246px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/SmXRjvD.gif); outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}

.gif4 { z-index: 3;
        position: relative;
        margin-top: -67px;
        margin-left: 338px;
        width:80px;
        height:80px;
        transform: rotate(8deg);
        background-image: url(https://i.imgur.com/NezJVOX.gif); 
        outline: 4px double #000000;
     filter: brightness(80%)grayscale(80%);}


 /* --------------- STYLE SCRITTE --------------- */


a {
     text-decoration:none!important;
}

d {
     color: #b5b054; font-family: georgia; font-size: 9px; line-height: 9px;font-style: italic; font-weight: bold;
}

f {
     font-family: calibri; 
     color: #6a6b4f;
     text-transform: uppercase;
     letter-spacing: 1px;
     font-weight: bold;
     font-size: 8px;
     line-height: 9px!important;
     letter-spacing: 2px; 
}

h {
     font-family: georgia; 
     text-transform: uppercase;
     font-size: 7px;
     line-height: 9px!important;
     letter-spacing: 2px; 
     color: #505f3b;
     opacity: 0.7;
     text-shadow: 1px 1px 0px #111; 
} 

w {
     text-transform: uppercase;
     font-size: 8px;
     line-height: 9px!important;
     letter-spacing: 2px; 
     color: #000000; 
     background: rgb(106, 107, 79, 0.5); 
     padding-left:7px;
     padding-right:7px;
} 


/* ------------------------------ B - I - U - S ------------------------------ */
a {
            color: #555;
            font-size: 10px;
            -webkit-transition: all 1.5s ease-in-out;
    -o-transition: all 1.5s ease-in-out;
    transition: all 1.5s ease-in-out;
     -webkit-backface-visibility: hidden;
        }

        a:hover {
            color: rgba(72,61,139, 0.747);
            -webkit-transition: all 1.5s ease-in-out;
    -o-transition: all 1.5s ease-in-out;
    transition: all 1.5s ease-in-out;
     -webkit-backface-visibility: hidden;
        }

b, i, u, s {
     color: #444;
}


u {
     text-decoration: underline dashed #7b8a9d; 
     line-height: 9px;
}

</style>


<div class="base">
<div class="immi"></div>

<div class="frase">Tobias Elijah Creed</div><div class="frase1">La più grande libertà è quella che ti tiene in catene</div>

<div class="gif1"></div>
<div class="gif2"></div>
<div class="gif3"></div>
<div class="gif4"></div>


<div class="box1"><div class="testo">E' il <w>frutto perfetto</w> della brutalità di un mondo stravolto dai Cordyceps. Nato il 9 gennaio 2010 nel degrado periferico di una città implosa sotto la pandemia, ha visto la sua famiglia sgretolarsi -pezzo dopo pezzo- tra fame, violenza e tradimento. Quando la FEDRA ha militarizzato la città trasformandola in un bastione della sopravvivenza, ha capito che <h>l'umanità è un lusso per chi può permetterselo</h>. || <f>Sometimes human places, create inhuman monsters</f> || Durante l'addestramento base mostra una naturale inclinazione alla <f>spietatezza</f>. Dove gli altri cedono, lui stringe i denti. Dove molti vengono spezzati, lui resta in piedi. Viene indirizzato, per questo, verso un settore dove talento e crudeltà si fondono: <w>interrogatorio e tortura psicologica</w>. La sua fama interna cresce nel silenzio. E' temuto per ciò che dice, non solo per quello che fa. || <f>L’uomo guardò il condannato e chiese all’ufficiale: lui conosce la sua condanna? No – disse l’ufficiale – la conoscerà sul suo stesso corpo.</f> || Tobias agisce con logica glaciale e la sua crudeltà non nasce dall’ira ma da una <d>disciplina spietata</d>. Il suo corpo non è un tempio, <h>ma uno strumento da dominare</h>. La sofferenza è parte dell’equazione. Prevista. Misurata. Tollerata. Non teme il dolore perché l’ha trasformato in metodo. Non teme la morte perché la maneggia ogni giorno sugli altri, ma anche – e soprattutto – su sé stesso. || <f>Al mondo non importa se muori. Non ascolterà le tue urla. Non importa che tu sia ferito. Se SANGUINI a terra, la terra berrà il tuo sangue.</f> || L'arrivo a Boston non viene accompagnato da specifiche particolari ma i fedeli del Generale Boeing lo accolgono come un'opera d'arte. Un <w>veleno a lento rilascio</w> che si infiltra nella QZ scavandone il tessuto sociale. I suoi sono incarichi sporchi, al limite dell'umano. E' la lama dietro al sorriso dei funzionari. Il carceriere che fa parlare anche chi ha già smesso di credere in qualcosa. || <f>E se Dio ha creato un mondo di tale meraviglia per condirlo di mostri, la ragione è una sola</f>: <w>NON L’HA FATTO PER NOI</w>.

   </div></div>



</div>