g<style>
body{

font-family: courier new;
color:#00FF00;
background-image:url("https://i.postimg.cc/j2x1M4y0/cool-background.png");
background-color:color(srgb 0.73 0.837 0.825);
}


.terminal{
  margin-left:433px;
  margin-top:150px;
  height:500px;
  width:750px;
}
/*-------------makes it horizontal- + buttons at stop light - close now----------*/

.header{
  background:#F5F5F5;
  height:50px;
  border-radius: 8.2px;
  border: 2px solid #F5F5F5;
}
ul >li {
  display: inline-block;
}


.header ul > li {
  width:18px;
height: 18.3px;
border-radius: 10px;
margin-bottom:30px;
  text-align: center;
  left: -30px;
  position: relative;
  color: #white;
}

.header ul > li:nth-child(1){
  
  
  background:#D32F2F;
}


.header ul > li:nth-child(2){
  
  
  background:#FFC107;
}

.header ul > li:nth-child(3){
  
  
  background:#388E3C;
}



/*-------------Enter inside the terminal zone ----------*/

.insideterminal{
  background: #202020;
  height:500px;
  border: 1px solid #333;
  padding-left:5px;

}


/*--------title on top of the terminal?---------*/
#terminaltext{
  position:fixed;
  transform: translate(0%, -50%);
  margin-left:140px;
  margin-top:-525px;
  width:600px;
  height:auto;
  background-color: transparent;
  font-family: helvetica;
  text-transform: uppercase;
  color:3000;
  font-size:25px;
  letter-spacing: 5px;
  text-align: left;
}
/*---------------------------type for user to input some text---------------------------*/

input[type=text] {
  border:none;
  background-color:#212121;
  color:#00FF00;
  font-family: courier new;
  font-size: 15px;
  outline: 0;
  width: 500px;
  word-wrap:normal;
  height:40px;
  
}

input[type=text]:focus {
  border:none;
  width:500px;
  height:30px;
  outline:0;
  background-color:#212121;}
  
  
  /*---------------Here type some text for me will you please?------------------*/
  
  .css-typing p{
    border-right: .15em #39951c;
    white-space: nowrap;
    overflow: hidden;
  }
  
  
  
  .css-typing p:nth-child(1) {
  width: 22.3em;
    opacity: 0;
    -webkit-animation: type2 10.2s steps(50, en
    d);
    animation: type2 10.2s steps(50, end);
  
    -webkit-animation-delay: 2s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
  
  .css-typing p:nth-child(2) {
    width: 38.3em;
    opacity: 0;
    -webkit-animation: type2 8.3s steps(50, en
    d);
    animation: type2 8.3s steps(50, end);
  
    -webkit-animation-delay: 13s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
  }
  
  
  
  
  @keyframes type {
    0% {
    width: 0;
    }
    99.9% {
    border-right: .15em solid orange;
    }
    100% {
    border: none;
    }
  }
  
  @-webkit-keyframes type {
    0% {
    width: 0;
    }
    99.9% {
    border-right: .15em solid orange;
    }
    100% {
    border: none;
    }
  }
  
  @keyframes type2 {
    0% {
    width: 0;
    }
    1% {
    opacity: 1;
    }
    99.9% {
    border-right: .15em solid orange;
    }
    100% {
    opacity: 1;
    border: none;
    }
  }
  
  @-webkit-keyframes type2 {
    0% {
    width: 0;
    }
    1% {
    opacity: 1;
    }
    99.9% {
    border-right: .15em solid orange;
    }
    100% {
    opacity: 1;
    border: none;
    }
  }
  
  @keyframes type3 {
    0% {
    width: 0;
    }
    1% {
    opacity: 1;
    }
    100% {
    opacity: 1;
    }
  }
  
  .command{
    caret-color: green;
  }
  
  /*--------May I have a quote please?---------*/
  
  .rightquotestrip{
    top:50;
    left:1230px;
    z-index: -1;
    width:400px;
    height:160%;
  }
  /*--------title me quote?---------*/
  
  .title{
    top:0px;
    width:153px;
    background:#000;
    padding:40 15 40 15;
    font: 10pt georgia;
    color:#aaa;
    text-transform: uppercase;
    line-height: :0px;
  }
  
  .title b {
    font: bold italic 24pt georgia;
    color: #ccc;
    text-transform: lowercase;
  }
  .title i {
    font: 18pt copperplate gothic;
    color: #bbb;
    text-transform: none;
    line-height: 20px;
  }
  
  
  /*--------may I have an image on the side please?---------*/
  #sideimage{
    position: fixed;
    top:208px;
    height:310px;
    transform: translate(0%, - 50%);
    margin-top:-45px;
    border: 10 #black;
    margin-left:-358px;
    background-color: transparent;
  }
  
  #sideimage img{
    width:320px;
    height:310px;
  }

/*--------may I have some text underneath the image please?---------*/


#sidetext{
  position: fixed;
  top:655px;
transform: translate(0%, - 50%);
margin-top: -170px;
margin-left:-358px;
width:300px;
font-size:14px;
border: 10 #black;
height:270px;
background: #202020;
padding:10px;
font-family: pill gothic;
color:#e7e6e6;
text-align: left;
overflow:auto;

}

#sidetext b, strong{
  font-weight: bold;
  color:color(srgb 0.065 0.065 0.065);
}

#sidetext i, em{
  font-weight: italic;
  color:#728292
  ;
}
#sidetext a{
padding-bottom: 1px;
border-bottom:0.5px solid color(srgb 0.36 0.356 0.356);
  color:#333333
  ;
}
#sidetext a:hover{
border-bottom:0.5px solid color(srgb 0.36 0.356 0.356);
  color:#333333
  ;
}

/*--------may I have some small circle navigation?---------*/

#sidecircles{
  height:60px;
  width:30px;
  margin-left:-396px;
  margin-top:110px;
  position:fixed;
  top:50%;
  transform: translate(0%, -50%);
}

#sidecircles a{
  width:27px;
  height:23px;
background-color:#556767;
border-radius: 100%;
margin-bottom:5px;
display: inline-block;

}



#sidecircles a:hover {
  background-color:#93baba;

}





 


.topbar {
  top: 0px;
  left: 0px;
  width: 100%;
  height: 50px;
  background-color: #000;
  z-index: 2;
}
.othertitle {
  top: 3px;
  left: 50px;
  padding: 0px;
  margin: 0px;
  background: none;
  color: #eee;
  font: 50px georgia;
  text-decoration: none;
  text-align: left;
  line-height: 50px;
  z-index: 3;
}
#welc, #lay, #res {
  padding: 0px;
  margin: 0px;
  background: none;
  font: 30px georgia;
  color:#eee;
  
  text-decoration: none;
  text-align: left;

  line-height: 30px;
  z-index: 3;
  height: 35px;
  width: auto;
  overflow: hidden;
}
#welc:hover, #lay:hover, #res:hover {
  height: auto;
}
#welc {
  top: 14px;
  left: 460px;
}
#lay {
  top: 14px;
  left: 660px;
}
#res {
  top: 14px;
  left: 830px;
}
#welc a, #lay a, #res a {
  padding: 3px;
  padding-left: 15px;
  margin: 0px;
  margin-top: 7px;
  display: block;
  background: #000;
  color: eee;
  font: 15px georgia;
  text-decoration: none;
  text-align: left;
  border-right: 10px solid #00A0B0;
}
#welc a:hover, #lay a:hover, #res a:hover {
  background: #00A0B0;
}
    #blackstrip, #smallstrip
{
  font-family:Helvetica;
  color:#fff;
  background:#111;
  
}
#blackstrip, #smallstrip, #blackstrip2, #whitestrip2, #smallstrip2,
#smallstrip3, #smallstrip4, #smallstrip5, #smallstrip6, #smallstrip7, #smallstrip8, #smallstrip9
{
  font-family:Helvetica;
  color:#fff;
  background:#111;
  
}

#blackstrip
{
  top:124px;
  font-size:37px;
  left:54px;
  letter-spacing:-5px;

  position:fixed;
  width:auto;



height:auto;
background-color:transparent;
font-family:helvetica;
text-transform:uppercase;
color:#000; /* main title color */
letter-spacing:5px;

}
#smallstrip 
{
  left:220px;
  letter-spacing:3px;
  text-transform:upcase;
  top:105px;
  position:fixed;

}
#smallstrip a {
left:220px;
letter-spacing:3px;
text-transform:upcase;
top:105px;
font-family:Helvetica;
color:#fff;
text-decoration: none;
background:#111;

position:fixed;}

#smallstrip a:hover {
left:220px;
letter-spacing:3px;
text-transform:upcase;
top:105px;
position:fixed;}
#blackstrip2
{
  top:70px;
  background:#111;
  
  font-size:42px;
  left:430px;
  letter-spacing:-4px;

  position:fixed;
  width:auto;

}

#whitestrip2
{
  left:440px;
  letter-spacing:3px;
  text-transform:upcase;
  top:110px;
  position:fixed;

}
#smallstrip2
{
  left:190px;
  letter-spacing:3px;
  text-transform:upcase;
  top:60px;
  position:fixed;

}
#smallstrip3
{
  left:20px;
  letter-spacing:3px;
  text-transform:upcase;
  top:60px;
  position:fixed;

}
#smallstrip4
{
  left:20px;
  letter-spacing:3px;
  text-transform:upcase;
  top:82px;
  position:fixed;
}
#smallstrip5
{
  left:83.5px;
  letter-spacing:3px;
  text-transform:upcase;
  top:85px;
  position:fixed;
}
#smallstrip6
{
  left:60px;
  letter-spacing:3px;
  text-transform:upcase;
  top:105px;
  position:fixed;
}
#smallstrip7
{
  left:14px;
  letter-spacing:3px;
  text-transform:upcase;
  top:125px;
  position:fixed;
}

#smallstrip8
{
  left:207px;
  letter-spacing:3px;
  text-transform:upcase;
  top:105px;
  position:fixed;
}


/*---------------------------here---------------------------*/

“I’m Captain James T. Kirk of the Starship Enterprise.”
- “Mr. Vulcan. I am saying that you are rigid and inflexible…” 
Roads? Where we’re going, we don’t need road
“Sooner or later, everyone comes to Babylon 5.”
The universe doesn’t give signs” 
This town is my Kryptonite
Incoming message from the Big Giant Head!
E.T. was a movie, this is real...this is on our coffee-table!
Forged in fire, strong as steel.
“Your faith was going to bring peace. Here it is.
</style>
<div id="blackstrip">Justageek.me!</div>
<div id="smallstrip"><a href="https://network.justageek.me">My Site Collective</a>
  </div>
<div id="smallstrip2"></div>
<div id="smallstrip3">Incoming message from the big giant</div>
  <div id="smallstrip4">    head|</div>
    <div id="smallstrip5">   Sooner or later, everyone comes </div>
      <div id="smallstrip6">    to babylon 5.</div>
      <div id="smallstrip7">  and.</div>
      <div id="smallstrip8">   And
      
    
    
  
  </div>


<div id="blackstrip2">Doe's anyone remember when we were explorers?</div>
<div id="whitestrip2">Now start exploring this site!</div>

<div class="topbar" style="position:fixed;"></div>
<div class="othertitle" style="position: fixed;">
SPACE PORT</div>

<div id="welc" style="position: fixed;">
DIRECTORY<br>
<a href="https://justageek.me">Back home</a>

<a href="https://justageek.me/living.html">Living quarters</a>

<a href="https://justageek.me/adoptables.html">Adoptables</a>

<a href="https://justageek.me/results.html">Quiz Results</a>
<a href="https://justageek.me/notes.html">Random Thoughts</a>

<a href="http://users3.smartgb.com/g/g.php?a=s&i=g36-32941-4e


">Guestbook</a>



</div>
<div id="lay" style="position: fixed;">
NETWORK   <br>
<a href="https://network.justageek.me">Main network</a>
<a href="https://justaparadox.com">Personal blog</a>
<a href="https://thelearningnerd.com">learning blog</a>
<a href="https://thenerdnest.net">Nerd BLOG</a>
<a href="https://socialhideouts.com">General Forum</a>


</div>
<div id="res" style="position: fixed;">
FRIENDS!<br>
<a href="https://happycore.neocities.org/">happycore - Neon</a>
<a href="https://vencake.neocities.org
/">Vencake - Ven</a>

<a href="https://keysklubhouse.neocities.org/">keysklubhouse</a>


</div>
	<div class="terminal">	
		<header>	
			</header>
		<main>
			
			
      
			<div class="header">
				
				<ul>
					<li></li>
					<li></li>
					<li></li>
				</ul>
			</div>

			<div class="insideterminal">
				<div class="css-typing"><p>
				c:\>ping/www.justageek.me ~]# Julia --info<
				<p>
					Pinging www.justageek.me [172.217.3.4] with 32 bytes of data:
				</p>
				</div>
				<div class="input-field">
					[Julia@justageek.me ~]#
					<input type="text" class="command" autofocus>
					

				</div></div><div>

			</div>
      
     
			<div class="rightquotestrip" style="position: fixed;"><div class="title" style="position: ;">
      in ______<br><b>__ deep</b><br><i>space ____ </i><br><b>we </b><i>explore</i>
        <i><b>___</b></i><b>that</b><br><i>might</i> <b>be</b><b>  the most  </b><br>
 important things<br><b>to </b> <i>understand</I><br><b>__</b><b>about</b><br><i>humans</i><b>  it</b><br>
 <i>is</i>______<br><b>__</b><b>       the</b><br><i>Unknown  </i><b>that</b> defines<br>___________<br><i>our<b>_____</b><i><br><b>existence!</b><br>
 <i>~ Bejamin Sisko</i>
  
        
      </div></div>
      <div id="terminaltext">
      <!-----MAIN TITLE TEXT----->
Greetings Earthlings!     </div>
      <div id="sideimage">
          <!-----SIDEBAR IMAGE LINK----->
          <img src="https://hosting.photobucket.com/albums/g117/jmhoopstar/battlestarglatica2_zps74f965d7.jpg?width=1920&height=1080&fit=boundsg">
      </div>
      
      <div id="sidetext">
      <!-----SIDEBAR BOX TEXT----->
      Greetings and salutations!
      In deep space that I explore the the mysteries and unexplained answers in my life.<P>
      In that might be the most important thing to understand about me.
            It is the unknown that <b>defines</b> my existence. <p>
            
      I am constantly searching to try to understand the forces of daily life! <p>
       Not just for answers to my own questions, but for new questions. This <b>defines</b> my existence. 
       <P>I am an explorer. <p>
       <text align="center"><b>May the force be with you!</b>
      
      </div>
      
      
      				   <br> <i>retronaut webring</i><br>
									<a href='https://webring.dinhe.net/prev/https://www.justageek.me'>Previous</a>
<a href='https://webring.dinhe.net/next/https://www.justageek.me'>Next</a>

 
      
       </div>
		</main>
	</div>
</body>
</html>