@font-face {
	font-family: "RA"; /*a name to be used later*/
	src: url("/fonts/RomanAntique.ttf"); /*URL to font*/
}

* {
	position: relative;
	box-sizing:border-box;
	filter: grayscale(100%);
	font-family: RA;
}
a, a:visited {
	color: white;
}
img{
  pointer-events: none;
}
.imgtxt{
  height:1em;
  width:auto;
  vertical-align: middle;
}

body{
	padding: 6% 0;
	color: white;
	background-image: url("/bg/02.gif");
	background-color: black;
	text-align: center;
	overflow-x:visible;
}
main{
  background-image:url('bgs/01.gif');
  background-size:25% 25%;
  border:20px solid transparent;
  border-image:url('borders/01.png') 80 round;
  width:800px;
  height:600px;
  margin:0 auto;
  border-radius:15px;
  padding:0.8%;
}
footer{
  background-image:url('bgs/01.gif');
  background-size:25% 50%;
  border:20px solid transparent;
  border-image:url('borders/01.png') 80 round;
  width:1300px;
  height:350px;
  margin:0 auto;
  margin-top:15px;
  border-radius:15px;
  padding:1%;
}
aside{
  background-image:url('bgs/01.gif');
  background-size:40% 25%;
  border:20px solid transparent;
  border-image:url('borders/01.png') 80 round;
  width:250px;
  height:600px;
  margin:0 auto;
  border-radius:50px;
  padding:1.2%;
}
aside:nth-of-type(1){
  position:absolute;
  left:-280px;
  top:-15px;
}
aside:nth-of-type(2){
  position:absolute;
  right:-280px;
  top:-15px;
}
aside > div, footer > div{
  width:100%;
  height:100%;
  border:4px ridge white;
  border-radius:15px;
  padding:4.5%;
}
footer > div{
  padding:1%;
}
article.v1:nth-of-type(1){
  height:175px !important;
}
article.v1:nth-of-type(2){
  height:335px;
  width:100%;
}
article.v2:nth-of-type(1), article.v2:nth-of-type(3){
  height:200px;
  width:100%;
}
article.v2:nth-of-type(2){
 width:100%;
 height:100px;
}

#title{
  background: linear-gradient(0deg,rgba(0, 0, 0, 1) 0%, rgba(17, 17, 17, 1) 1%, rgba(255, 255, 255, 1) 58%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  display: inline-block;
  font-size:2.8em;
  white-space: nowrap;
}
#title2{
  filter:drop-shadow(1px 1px 0 black) drop-shadow(-1px 1px 0 white) drop-shadow(1px -1px 0 black) drop-shadow(-1px -1px 0 white) drop-shadow(4px 4px 0 black);
  position:absolute;
  top:-75px;
  left:50%;
  transform:translateX(-50%);
}
ul{
  list-style-image: url('/pixels/pixel056.gif');
  list-style-position: inside;
  padding-left:0px;
}
hr{
  width:100%;
  border:none;
  border-top:1px solid white;
}

.row{
  display:flex;
  width:100%;
  height:100%;
  border:4px ridge white;
  border-radius:15px;
}

section{
  height:100%;
  padding:2%;
}
section:nth-of-type(1){
  /*border-right:4px ridge white;*/
  width:70%;
}
section:nth-of-type(2){
  width:30%;
}

.center{
  text-align: center;
}

.scroll{
  width:100%;
  height:100%;
  overflow:auto;
  -ms-overflow-style: none;  
  scrollbar-width: none;
}
.scroll::-webkit-scrollbar{
  display: none;
}

article{
  border:10px solid transparent;
  border-image:url('borders/02.png') 8 round;
  width:100%;
  padding:2%;
  background-color: black;
}
article:nth-of-type(1){
  height:250px;
}
article:nth-of-type(2), article:nth-of-type(3){
  height:235px;
  width:49%;
  display:inline-block;
  margin-top:5px;
}
footer > div > article{
  height:98.5% !important;
  width:32.5% !important;
  display:inline-block;
}

.label{
  color:black;
  position:absolute;
  text-shadow:1px 1px 0 white, -1px 1px 0 white, 1px -1px 0 white, -1px -1px 0 white, 2px 2px 0 black, -2px 2px 0 black, 2px -2px 0 black, -2px -2px 0 black;
  top:-32px;
  left:50%;
  transform: translateX(-50%);
}

button{
  height:auto;
  width:100%;
  background: linear-gradient(to bottom, #4c4c4c 0%,#595959 12%,#666666 25%,#474747 39%,#2c2c2c 50%,#000000 51%,#111111 60%,#2b2b2b 76%,#1c1c1c 91%,#131313 100%);
  color:white;
  line-height: 1.25;
  margin-bottom:5px;
  border:1px ridge white;
}
button:hover{
  border:1px groove gray;
}
button p{
  margin:0;
}

#statuscafe {
    padding: .5em;
    background-color: azure;
    border: 1px solid midnightblue;
}
#statuscafe-username {
    margin-bottom: .5em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}

.short{
  height:100%;
  overflow:hidden;
}