409 lines
33 KiB
HTML
409 lines
33 KiB
HTML
|
<!doctype html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Cyberpunk-2077-theme-css</title>
|
||
|
|
<meta name="description" content="This is a theme in CSS3 to simulate the interfaxes of the game CyberPunk 2077.">
|
||
|
|
<meta name="viewport" content="width=device-width,minimum-scale=1">
|
||
|
|
<link href="https://fonts.googleapis.com/css2?family=Advent+Pro:wght@400;700&family=VT323&display=swap" rel="stylesheet">
|
||
|
|
<link href="/css/cyberpunk-2077.css" rel="stylesheet">
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<header style="background-color: #000; height: 50px;"><a href="https://github.com/gwannon/Cyberpunk-2077-theme-css" style="color: #f9f002; font-size: 2rem;">Github</a></header>
|
||
|
|
<section class="cyberpunk">
|
||
|
|
<a class="cyberpunk">Link red_</a>
|
||
|
|
<button class="cyberpunk green">Button green_</button>
|
||
|
|
<a class="cyberpunk purple">Link purple_</a>
|
||
|
|
<button class="cyberpunk blue">Button blue_</button>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black both">
|
||
|
|
<h1 class="cyberpunk">H1 title</h1>
|
||
|
|
<h1 class="cyberpunk glitched">H1 title glitched</h1>
|
||
|
|
<h2 class="cyberpunk">H2 title</h2>
|
||
|
|
<h2 class="cyberpunk glitched">H2 title glitched</h2>
|
||
|
|
<h3 class="cyberpunk">H3 title</h3>
|
||
|
|
<h3 class="cyberpunk glitched">H3 title glitched</h3>
|
||
|
|
<h4 class="cyberpunk">H4 title</h4>
|
||
|
|
<h4 class="cyberpunk glitched">H4 title glitched</h4>
|
||
|
|
<hr class="cyberpunk" />
|
||
|
|
<hr class="cyberpunk glitched" />
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk both">
|
||
|
|
<form style="max-width: 500px">
|
||
|
|
<input class="cyberpunk" type="text" />
|
||
|
|
<input class="cyberpunk" type="date" />
|
||
|
|
<input class="cyberpunk" type="time" />
|
||
|
|
<input class="cyberpunk" type="file" />
|
||
|
|
<input class="cyberpunk" type="phone" />
|
||
|
|
<input class="cyberpunk" type="number" />
|
||
|
|
<input class="cyberpunk" type="password" />
|
||
|
|
<textarea class="cyberpunk"></textarea>
|
||
|
|
<select class="cyberpunk">
|
||
|
|
<option>Item 1</option>
|
||
|
|
<option>Item 2</option>
|
||
|
|
<option>Item 3</option>
|
||
|
|
</select><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" name="test" type="radio" /> RADIO BUTTON Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" name="test" type="radio" checked="checked" /> RADIO BUTTON Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" type="checkbox" /> CHECKBOX Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" type="checkbox" checked="checked" /> CHECKBOX Lorem ipsum sid amet.</label><br/>
|
||
|
|
<button type="submit" class="cyberpunk red">Submit_</button>
|
||
|
|
</form>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black">
|
||
|
|
<img class="cyberpunk" src="https://dummyimage.com/600x400/ff00ff/fff" alt="" />
|
||
|
|
<img class="cyberpunk dotted" src="https://dummyimage.com/600x400/ff00ff/fff" alt="" />
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk">
|
||
|
|
<h1 class="cyberpunk">H1 title</h1>
|
||
|
|
<h1 class="cyberpunk glitched">H1 title glitched</h1>
|
||
|
|
<h2 class="cyberpunk">H2 title</h2>
|
||
|
|
<h2 class="cyberpunk glitched">H2 title glitched</h2>
|
||
|
|
<h3 class="cyberpunk">H3 title</h3>
|
||
|
|
<h3 class="cyberpunk glitched">H3 title glitched</h3>
|
||
|
|
<h4 class="cyberpunk">H4 title</h4>
|
||
|
|
<h4 class="cyberpunk glitched">H4 title glitched</h4>
|
||
|
|
<hr class="cyberpunk" />
|
||
|
|
<hr class="cyberpunk glitched" />
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black">
|
||
|
|
<p class="cyberpunk">Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<ul class="cyberpunk">
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li class="glitched">featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li>featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
</ul>
|
||
|
|
<p class="cyberpunk inverse scannedv">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk inverse dotted scannedh">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<ol class="cyberpunk">
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li>featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li class="glitched">and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li>featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
</ol>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk">
|
||
|
|
<p class="cyberpunk">Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk scannedh">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk scannedv">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<ul class="cyberpunk">
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li class="glitched">featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li>featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
</ul>
|
||
|
|
<p class="cyberpunk inverse">Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk inverse scannedh">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk inverse scannedv">Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<p class="cyberpunk inverse dotted">Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"[1] featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.[2] Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology, and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</p>
|
||
|
|
<ol class="cyberpunk">
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian <a href="#">futuristic setting that</a> tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li>featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li >Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
<li>Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"</li>
|
||
|
|
<li class="glitched">featuring advanced technological and scientific achievements, such as artificial intelligence and cybernetics, juxtaposed with a degree of breakdown or radical change in the social order.</li>
|
||
|
|
<li>Much of cyberpunk is rooted in the New Wave science fiction movement of the 1960s and 1970s, when writers like Philip K. Dick, Roger Zelazny, John Brunner, J. G. Ballard, Philip José Farmer and Harlan Ellison examined the impact of drug culture, technology,</li>
|
||
|
|
<li>and the sexual revolution while avoiding the utopian tendencies of earlier science fiction.</li>
|
||
|
|
</ol>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black">
|
||
|
|
<form style="max-width: 500px">
|
||
|
|
<input class="cyberpunk" type="text" />
|
||
|
|
<input class="cyberpunk" type="date" />
|
||
|
|
<input class="cyberpunk" type="time" />
|
||
|
|
<input class="cyberpunk" type="file" />
|
||
|
|
<input class="cyberpunk" type="phone" />
|
||
|
|
<input class="cyberpunk" type="number" />
|
||
|
|
<input class="cyberpunk" type="password" />
|
||
|
|
<textarea class="cyberpunk"></textarea>
|
||
|
|
<select class="cyberpunk">
|
||
|
|
<option>Item 1</option>
|
||
|
|
<option>Item 2</option>
|
||
|
|
<option>Item 3</option>
|
||
|
|
</select><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" name="test2" type="radio" /> RADIO BUTTON Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" name="test2" type="radio" checked="checked" /> RADIO BUTTON Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" type="checkbox" /> CHECKBOX Lorem ipsum sid amet.</label><br/>
|
||
|
|
<label class="cyberpunk"><input class="cyberpunk" type="checkbox" checked="checked" /> CHECKBOX Lorem ipsum sid amet.</label><br/>
|
||
|
|
<button type="submit" class="cyberpunk2077 blue">Submit_</button>
|
||
|
|
</form>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk">
|
||
|
|
<img class="cyberpunk" src="https://dummyimage.com/600x400/ff00ff/fff" alt="" />
|
||
|
|
<img class="cyberpunk dotted" src="https://dummyimage.com/600x400/ff00ff/fff" alt="" />
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black both">
|
||
|
|
<div class="boxtree">
|
||
|
|
<div class="resolved children2 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children0 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk both">
|
||
|
|
<div class="boxtree">
|
||
|
|
<div class="resolved children2 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width3">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children2 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width2" style="--resolved-text: '';">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="children1 width2">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="resolved children1 width1" style="--resolved-text: 'FINISHED';">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children1 width1">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
<div class="pending children0 width1" style="--pending-text: 'FORBIDDEN';">
|
||
|
|
<h2>Lorem ipsum sid amet.</h2>
|
||
|
|
Cyberpunk is a subgenre of science fiction in a dystopian futuristic setting that tends to focus on a "combination of low-life and high tech"
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk black">
|
||
|
|
<ul class="steps">
|
||
|
|
<li>Text 1</li>
|
||
|
|
<li>Text extra extra large 2</li>
|
||
|
|
<li>Texto 3</li>
|
||
|
|
<li>Text extra extra large 4 </li>
|
||
|
|
<li>Text 5<br/>new line<br/>new line</li>
|
||
|
|
<li>Text large 6</li>
|
||
|
|
<li class="current">Text 7</li>
|
||
|
|
<li>Text 8</li>
|
||
|
|
<li>Text 9</li>
|
||
|
|
<li>Text 10</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
<section class="cyberpunk">
|
||
|
|
<ul class="steps">
|
||
|
|
<li>Text 1</li>
|
||
|
|
<li>Text extra extra large 2</li>
|
||
|
|
<li>Texto 3</li>
|
||
|
|
<li class="current">Text extra extra large 4 </li>
|
||
|
|
<li>Text 5<br/>new line<br/>new line</li>
|
||
|
|
<li>Text large 6</li>
|
||
|
|
<li>Text 7</li>
|
||
|
|
<li>Text 8</li>
|
||
|
|
<li>Text 9</li>
|
||
|
|
<li>Text 10</li>
|
||
|
|
</ul>
|
||
|
|
</section>
|
||
|
|
<aside class="cyberpunk">
|
||
|
|
<ul>
|
||
|
|
<li><a href="#">☠ 555 555 555</a></li>
|
||
|
|
<li><a href="#">☢ Contact us</a></li>
|
||
|
|
<li><a href="#">♻ Location in the map</a></li>
|
||
|
|
</ul>
|
||
|
|
</aside>
|
||
|
|
<footer style="background-color: #000; height: 50px;"></footer>
|
||
|
|
</body>
|
||
|
|
</html>
|