:root 
{
  --light-yellow-bg: #ffffc2;
  --yellow-bg: #f9e28b;
  --yellow-on-black: #ffc759;
  --grey-bg: #1e2329;
  --grey-on-yellow: #1e2329;
}

/* elements */
.page-container
{
	height: 92vh;
	width: 65vw;
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

.header, .footer
{
	padding: 5px;
	padding-left: 15px;
	height: 10%;
	width: 100%;
	color: var(--yellow-on-black);
	background-color: var(--grey-bg);
	position: relative;
}

.header
{
	border-radius: 5px 5px 0px 0px;
}

.footer
{
	height: 5%;
	border-radius: 0px 0px 5px 5px;
}

.footer-content
{
	padding-right: 15px;
	position:absolute;
	bottom:0;
	right:0;
}

.content-container
{
	padding: 5px;
	padding-left: 15px;
	height: 80%;
	width: 100%;
	color: var(--grey-on-yellow);
	background-color: var(--yellow-bg);
	position: relative;
}

.content-container a{color: var(--grey-on-yellow) !important;}
.content-container a:hover {background:#f5a302;}

.search-input
{
	width: 200px;
}

.search-notification
{
	font-size: 10px;
}

.sresults-container, .repository-svg
{
	padding-left: 50px;
	padding-right: 50px;
	padding-top: 25px;
}

.image-container
{
  width: max-content;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.error-search-container
{
  width: max-content;
  position: absolute;
  left: 50%;
  top: 85%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.img-loading 
{
	width: 240px;
	height: 240px;
  margin:-60px 0 0 -60px;
  -webkit-animation:spin 4s linear infinite;
  -moz-animation:spin 4s linear infinite;
  animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

.loading-caption
{
	text-align: justify;
}

#browser
{
	font-size: 10px;
	letter-spacing: 1px;
}

html 
{
	background-image: url("../files/nodebg.png");
	background-repeat: repeat-y repeat-x;
}

a:link{color: #f4b301;}
a:visited{color: #fed154;}
a:hover {color: #f5a302; background:#3b4046;}

.svg-tspan
{
	fill: #000000;
}

.svg-url-tspan
{
	fill: #595f66;
	cursor: pointer;
}

.svg-url-tspan:hover
{
	fill: #0000ff;
	font-weight: bold;
}

.stat-text
{
	font-size: 10px;
}

*
{
	font-family: "Lucida Console", "Courier New", monospace;
	-webkit-user-select: none; /* Safari */        
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
}

.url-image
{
	cursor: pointer;
}

.graph-option:hover
{
	opacity: 0.9;
}



/* attributes */
.center 
{
  margin: auto;
  padding: 10px;
}

.img-center 
{
  display: block;
  margin: 0 auto;
}

.float-left
{
	float: left;
}

.float-right
{
	float: right;
}

.inline-elements
{
  display:inline-block;
}