:root {
  
  --col1: #d65555;
  --col2: #cc52ad;
  --col3: #1d9b7e;
  --col4: #1a7848;
  --col5: #fff200;
  --col6: #1f997a;
  --col7: #ffcc33;
  
  --bg: #202020;  
  --bg-bright: #fffcf2;

  --bg: hsl(220, 13%, 18%);
  --bg1: hsl(220, 13%, 18%);
  --bg2: hsl(220,  9%, 55%);
  --bg3: hsl(220, 10%, 40%);
  --fg1: hsl(220, 14%, 71%);
  --fg2: hsl(220, 0%, 100%);
}

* {
	margin:0; padding:0; box-sizing:border-box; font: 13px / 20px  monospace;
}

body { 
	background:var(--bg);
	color:var(--col1);
	margin:10px; 
}

textarea {
	background:var(--bg);
	color:var(--bg-bright);
	display: block;
  resize: both;
  line-height: 20px;  
  outline: none;
  border: none;
  position: absolute;
  left:14px; right:10px; bottom:40px; top:50px;
}
input[type=file] {
	color:var(--col7);	
}

input[type=url] {
	outline: none; 
	border: none;
	border-bottom:1px solid var(--col4);
	position: absolute;
	padding:2px 10px;
	background:var(--bg);
	color:var(--col7);	
	line-height: 20px;  
	left:14px; right:10px; bottom:10px;
}

input[type=submit] {
	padding:2px 10px;
	background:#000;
	color:var(--col3);
	border:2px solid #000;
}


a, .button {
	user-select: none;
	background:var(--col4);
	color:#fff;
	text-decoration: none;
	padding:2px 10px;
	margin:4px;
	display:inline-block;
	text-transform: uppercase;
	cursor: pointer;	
	
}

a.link {
	margin-left:-4px;	
	background:var(--col3);
}

.button {
	background:var(--col1);
}

a:hover, .button:hover {
	color: var(--bg);
	background:var(--col5);
}

menu {
	margin-bottom:10px;
}

menu a {
	background:var(--col1);
}

.dontbreak {
	white-space: nowrap;
}

.mark a:first-child {
	background:var(--col7);
	color:var(--bg);
}

.mark a:first-child:hover {
	background:var(--col5);
}

.hidden { display:none; }