.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

body{
	background-image: url(/elements/BG.png);
	background-size: 240px;
	image-rendering: pixelated;
	color:white;
	background-color:#0c0b17;
	font-family:"Kode Mono", monospace;
}

p{
  margin:0;
  padding-top:0;
}

.animBorder{
  border:2px dotted #ff7b00;
}

.modelColor{
  border-color:#23ffb4;
}

.animColor{
  border-color:#ffd254;
}

.artColor{
  border-color:#cf66fc;
}

.musicColor{
  border-color:#ff549b;
}

.separator{
  border-width:2px;
  border-top-style:dashed;
  margin:20px;
  margin-top:20px;
  margin-bottom:20px;
}
.about{
  padding:18px;
  border-width:2px;
  border-style:solid;
  border-radius:10px;
  font-size:18px;
}

.rounded{
  border-radius: 12px;
}

.border{
  border-color:#e9e3ff;
  border-style:solid;
  border-width:2px;
}

.home-container {
	display: grid;
	grid-template-columns: repeat(100, [col-start] 1fr);
}
.home-container > *{
	grid-template-columns: col-start / span 100;
	grid-column: span 100;
}

@media (max-width: 1000px){
	.links div:first-child{
		border-bottom-right-radius:60px; 
	}
}

@media (min-width: 800px){
	
	.stamps-container{
		grid-column: span 100;
	}
	
	.content{
		grid-column: span 80;
	}
	
	.links{
		grid-column: span 20;
		min-width: 200px;
	}

}

@media (min-width: 1000px){
	
	.stamps-container{
		grid-column: span 20;
	}
	
	.content{
		grid-column: span 60;
		border-top-left-radius:0px;
		border-top-right-radius:0px;
		border-top:none; 
	}
	
	.links{
		grid-column: span 20;
		min-width: 200px;
	}

	.links div:first-child{
		border-top-right-radius:60px; 
	}
	
	.stamps-containerT{
		grid-column: span 20;
		grid-row: span 100;
	}
	
	.contentT{
		grid-column: span 60;
		grid-row: span 100;
		border-top-left-radius:0px;
		border-top-right-radius:0px;
		border-top:none; 
	}
	
	.linksT{
		grid-column: span 20;
		grid-row: span 100;
		min-width: 200px;
	}

	.linksT div:first-child{
		border-top-right-radius:60px; 
	}
}

.navBar{
	text-align:center;
	font-size:32px;
	font-weight: bold;
	background-color:black;
	display:grid;
	grid-template-columns: repeat(100, [col-start] 1fr);
	grid-template-columns: col-start / span 100;
}

.navBar a{
	margin:auto;
		grid-column: span 25;
}

.blinkies{
	height:20px;
	image-rendering: pixelated;
	object-fit: contain;
	margin:2px;
}

.stamps{
	width:99px;
	image-rendering: pixelated;
	object-fit: contain;
	margin:1%;
}

.buttons{
	width:88px;
	image-rendering: pixelated;
	object-fit: contain;
	padding:2px;
}

.test{
	text-align: center;
	color:red;
	font-family: "Kode Mono", monospace;
	font-size: 100px;
}

.defFont{
	color:white;
	font-family: "Kode Mono", monospace;
}

.center{
	text-align:center;
}

.centerMargin{
	margin:auto;
	left:0;
	right:0;
}

.centerImage{
	margin:auto;
	display:block;
}

.navStuff{
	vertical-align: middle;
	font-weight: bold;
	margin: auto;
	text-align: center;
	font-size: calc(12px + .8vw);
	display:inline-block;
}

.artFrameNone{
	object-fit: contain;
	image-rendering: pixelated;
}

.artFrame1{
	border-color: #9d94d1;
	border-width: 2px;
	background-color: #181726;
	border-radius: 8px;
	border-style: solid;
	object-fit: contain;
	image-rendering: pixelated;
}

.artBox1{
	padding:20px;
	padding-top:10px;
	padding-bottom:10px;
	border-color: #ff2e7e;
	border-width: 4px;
	background-color: #111021;
	border-radius: 8px;
	border-style: solid;
}

.artBox2{
	padding:20px;
	padding-top:10px;
	padding-bottom:10px;
	border-color: #ff47bf;
	border-width: 4px;
	background-color: #111021;
	border-radius: 8px;
	border-style: solid;
}

.artBox3{
	padding:20px;
	padding-top:10px;
	padding-bottom:10px;
	border-color: #ff47bf;
	border-width: 4px;
	background-color: #111021;
	border-radius: 8px;
	border-style: solid;
}

.artBox4{
	padding:20px;
	padding-top:10px;
	padding-bottom:10px;
	border-color: #66f9f8;
	border-width: 4px;
	background-color: #111021;
	border-radius: 8px;
	border-style: solid;
}

.box1{
	padding:10px;
	border-color: #cf91ff;
	border-width: 2px;
	background-color: #050117;
	border-radius: 8px;
	border-style: solid;
}

.border1{
	padding:10px;
	border-color: #ff2e7e;
	border-width: 4px;
	border-radius: 8px;
	border-style: solid;
}

.border2{
	padding:10px;
	border-color: #ffd56d;
	border-width: 4px;
	border-radius: 8px;
	border-style: solid;
}

.border3{
	padding:10px;
	border-color: #66f9f8;
	border-width: 4px;
	border-radius: 8px;
	border-style: solid;
}

.textColor1{
	color:white;
}

.textColor2{
	color:#cf91ff;
}

.textColorInactive{
	color:#6d7180;
}

.linkColor{
	color:#cf91ff;
	text-decoration:none;
}

.bgColor1{
	background-color:#1c1130;
}

.bgColor2{
  background-color:#070514;
}

.colorful1{
	color:#ff2e7e;
	background-color:#ff2e7e;
}

.colorful2{
	color:#cf66fc;
	background-color:#cf66fc;
}


.colorful3{
	color:#66f9f8;
	background-color:#66f9f8;
}

.colorful4{
	color:#23ffb4;
	background-color:#23ffb4;
}

.dividerGraphic{
	pointer-events: none;
	height: calc(48px + 4vw);
	image-rendering: pixelated;
}

.container-flex{
        display: flex;
        justify-content: center;
        align-items: center;
        border:none;
    }

.container-grid {
    display: grid;
    height: 200px;
    border: 1px solid #ccc;
}