A Pen by Isaac

Thumbnail
This awesome code was written by --MEMER--, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright --MEMER-- ©

Technologies

  • HTML
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  Isaac</title>
  
  
  
  
  
</head>

<body>

  <html>

<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
  </script>
  <style>
    body {
      background: linear-gradient(#FF6600,
      #F56B0D,
      #EB701A,
      #E07526,
      #D67A33,
      #CC8040,
      #C2854C,
      #B88A59,
      #AD8F66,
      #A39473,
      #999980,
      #8F9E8C,
      #85A399,
      #7AA8A6,
      #70ADB2,
      #66B2BF,
      #5CB8CC,
      #52BDD9,
      #47C2E6,
      #3DC7F2,
      #33CCFF);
      background-repeat: no-repeat;
      height: 1200px;
    }
  </style>
</head>

<body>
  <div class="container">
    <div class="jumbotron" style="background:linear-gradient(#00FFCC,
 	  #0DF6C6,
 	  #1AEEC0,
 	  #26E5B9,
 	  #33DCB3,
 	  #40D3AD,
 	  #4CCAA7,
 	  #59C2A1,
 	  #66B99A,
 	  #73B094,
 	  #80A88E,
 	  #8C9F88,
 	  #999682,
 	  #A68D7B,
 	  #B28475,
 	  #BF7C6F,
 	  #CC7369,
 	  #D96A63,
 	  #E6625C,
 	  #F25956,
  #FF5050);">
      <h1>Other important things</h1>
    </div>
    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <a class="navbar-brand">Black holes& wormholes</a>
        </div>
        <ul class="nav navbar-nav">
          <li><a href="https://s.codepen.io/--MEMER--/debug/mXzzzz/bYAdyGaKxXjk">Home</a></li>
          <li><a href="https://s.codepen.io/--MEMER--/debug/rJqojo/YvAgOPqKVwJA">Black holes</a></li>
          <li><a href="https://s.codepen.io/--MEMER--/debug/mXooaL/xnrabdXaWgnA">Wormholes</a></li>
          <li><a href="https://s.codepen.io/--MEMER--/debug/XZwMxM/yokZEQwZOOWA">Other</a></li>
        </ul>
      </div>
    </nav>
<div class="well well-lg" style="background:linear-gradient(#FF5050,
 	  #F25956,
 	  #E6625C,
 	  #D96A63,
 	  #CC7369,
 	  #BF7C6F,
 	  #B28475,
 	  #A68D7B,
 	  #999682,
 	  #8C9F88,
 	  #80A88E,
 	  #73B094,
 	  #66B99A,
 	  #59C2A1,
 	  #4DCAA7,
 	  #40D3AD,
 	  #33DCB3,
 	  #26E5B9,
 	  #19EEC0,
 	  #0DF6C6,
  #00FFCC);">
  <h3>What else is there to talk about?</h3>
  <p>Well the mass that is the black hole is called the singularity and because it is focus in one small point with such a large density it rips a hole in the space and time where what goes into it time and space has no effect on it. Exotic matter is a type of matter that a negative density so if you apply any force to it, it goes in the opposite direction. Exotic matter in theory could provide an infinte power source. </p>
    </div>
    <div class="row">
  <div class="col-sm-6" style="background:linear-gradient(#FF5050,
 	  #F25956,
 	  #E6625C,
 	  #D96A63,
 	  #CC7369,
 	  #BF7C6F,
 	  #B28475,
 	  #A68D7B,
 	  #999682,
 	  #8C9F88,
 	  #80A88E,
 	  #73B094,
 	  #66B99A,
 	  #59C2A1,
 	  #4DCAA7,
 	  #40D3AD,
 	  #33DCB3,
 	  #26E5B9,
 	  #19EEC0,
 	  #0DF6C6,
                               #00FFCC);"><h4>Wormholes</h4>
    <ul>
      <li>Somewhat safer than a black hole</li>
      <li>Is more alike to a black hole than it is different.</li>
      <li> very easy way to travel through the cosmos</li>
    </ul>
      </div>
  <div class="col-sm-6" style="background:linear-gradient(#00FFCC,
 	  #0DF6C6,
 	  #1AEEC0,
 	  #26E5B9,
 	  #33DCB3,
 	  #40D3AD,
 	  #4CCAA7,
 	  #59C2A1,
 	  #66B99A,
 	  #73B094,
 	  #80A88E,
 	  #8C9F88,
 	  #999682,
 	  #A68D7B,
 	  #B28475,
 	  #BF7C6F,
 	  #CC7369,
 	  #D96A63,
 	  #E6625C,
 	  #F25956,
                               #FF5050);"><h4>black holes</h4>
    <ul>
      <li>Will kill you instantly before witnessing anything weird</li>
      <li>Has an extremly high density than anything else in the universe</li>
      <li>Don't know what to expect at the end of the journey</li>
    </ul>
      </div>
</div>

     <div id="myCarousel" class="carousel slide" data-ride="carousel">
      <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
        <li data-target="#myCarousel" data-slide-to="3">
        </li>
      </ol>

      <div class="carousel-inner">
        <div class="item active">
          <img src="https://d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/b4Ru9OE/blue-exotic-matter-in-a-dark-background_rx1ts7zt__F0000.png" width="1000">
        </div>

        <div class="item">
          <img src="http://www.physicsoftheuniverse.com/images/blackholes_accretion.jpg" width="650">
        </div>

        <div class="item">
          <img src="https://1.bp.blogspot.com/-QowYXuocwJw/VGJpufnEhyI/AAAAAAAAFlU/WOzUZnYMv_k/s640/blackhole.jpg" width="1000">
        </div>
        <div class="item">
          <img src="https://img00.deviantart.net/a3a3/i/2010/043/b/d/wormhole_by_lairis77.jpg">
        </div>
      </div>
      <a class="left carousel-control" href="#myCarousel" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
    <span class="sr-only">Previous</span>
  </a>
      <a class="right carousel-control" href="#myCarousel" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
    <span class="sr-only">Next</span>
  </a>
    </div>
</body>

</html>
  
  

</body>

</html>

Comments