@font-face {
	font-family: 'BP mono';
  	src: 
  		url('../fonts/BPmono/BPmono.eot?#iefix') format('embedded-opentype'),  
  		url('../fonts/BPmono/BPmono.otf')  format('opentype'),
  		url('../fonts/BPmono/BPmono.woff') format('woff'), 
  		url('../fonts/BPmono/BPmono.ttf')  format('truetype'), 
  		url('../fonts/BPmono/BPmono.svg#BPmono') format('svg');
	font-weight: normal;
	font-style: normal;
}
* {
    margin: 0;
    padding: 0;
    border: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
::selection {
	background: #000;
	color: #fff;
}
::-moz-selection {
	background: #000;
	color: #fff;
}

html {
	font-size: 62.5%;
}
html, body {
	font-family: 'BP mono', Arial, sans-serif;
	font-family: courier, monospace;
	height: 100%;
}
body {
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0;
    font-size: 1.3rem;
    line-height: 1.6rem;
    letter-spacing: 0.04rem;
    font-weight: normal;
    color: rgba(48, 255, 18, 1);
    background: #000000;
}
h1, h2, h3 {
	font-size: 1.7rem;
	font-weight: normal;
}
a {
	color: #1c3eed;
	text-decoration: none;
}
a:focus, a:visited {
	color: #1c3eed;
	text-decoration: none;
}
a:hover {
	color: #1c3eed;
	text-decoration: underline;
}

.main {
	padding: 2rem;
	height: 100%;
	width: 100%;
	display: -ms-flexbox;
	display: flex;
}
.main p {
	margin-bottom: 2rem;
}
.terminal-wrap {
    display: flex;
    flex-direction: column;
}
.terminal-line {
    margin-top: auto;
    white-space: pre;
}
.terminal-line p {
    margin-bottom: 0;
}
.terminal-line .cursor {
    background: rgba(48, 255, 18, 1);
    width: 10px;
    height: 1.5rem;
    display: inline-block;
    position: relative;
    top: 2px;
    -webkit-animation: blink 1s step-end infinite;
    animation: blink 1s step-end infinite;
}


@media (min-width: 2000px) {
	html {
        font-size: 75%;
    }
}
@media (max-width: 768px) {
    html {
        font-size: 57.5%;
    }
}
@media (max-width: 640px) {
    html {
        font-size: 52.5%;
    }
}



@-webkit-keyframes blink {
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}

@keyframes blink {
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}