.box {
    padding: 0.1em 0.1em 0.1em;
    color: white;
    background-color: #819de0;
    border: 6px;
    border-style: solid solid solid solid;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
    text-align:left;
    /* align-self:center; */
}

a, .clickable {
    color: rgb(0, 98, 255);
}

p { 
    color: #4b5a83;
}

a:hover, .clickable:hover {
    color: rgb(107, 218, 255);
}

.gr_head, footer {
    font-family: msdos;
    background-color: #819de0;
    padding: 1em 0.1em 1em, 0.1em;
    color: white;
    background-color: #819de0;
    border: 6px;
    border-style: solid none solid none;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
}

.box_bar {
    background: #819de0;
    color: white;
}



.box_bar + div {
/* margin: auto; */
  color: #4b5a83;
  background-color: #a5bfff;
  border-width: 4px;
  border-style: inset solid solid inset;
  border-color: #819de0 #8ea6e3 #819de0 #819de0;
  text-align: left;
  padding-top: 0.5em;
  /* padding: 1em 1em 1em; */
}

input {
    border-style: inset solid solid inset;
    border-color: #819de0 #8ea6e3 #819de0 #819de0;
    background-color: #a5bfff;
}

body {
    background: url("/images/tile.webp");
    align-content: center;
    text-align: center;
    overflow-x: hidden;
    font-family: msdos !important;
}

input {
    font-family: msdos !important;
    color: white;
    background: #819de0;
}

.attribute {
    height: 35px;
}


.box_content {
    background-color: #819de0 !important;
    border-style: none !important;
    padding-top: 0px !important;
}

.layerDisplay, #previewContent {
    aspect-ratio: 1/1;
}
#previewContent, .ownedTokenImage {
    
    border: 6px;
    border-style: solid solid solid solid;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
    text-align:left;
}


/* .assetName {
    color: rgb(0, 98, 255);
} */

/*
download button styling
*/

#mobileDownload, #desktopDownload, #randomButton, #randomMemeButton {
	width: 100%;
	text-align: center;
	margin-left: 0;
	color: white;
	font-weight: bold;
	padding: 10px 0px;
    background-color: #819de0;
    border: 6px;
    border-style: solid solid solid solid;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
    align-self:center;
    margin-right: 0;
}


#randomButton {
	margin-right: 1em;
	width: auto;
	padding: 0px;
	/* padding-top: 4px; */
	grid-column: 12/14;
}

#randomMemeButton {
	width: auto;
	grid-column: span 2/ span 2;
	margin-left: 0.5em;
    margin-right: 0.5em;
}


#longConnectWalletText {
    white-space: break-spaces;
}

#addressBlock {
    max-width: 13em;
}

#enterIDFlexContainer {
	grid-column: 7/12;
}

#enterAndConnect {
    padding-top: 0;
}
  

#listingWindowConnected .box {
    border-width: 0px;
    padding: 0px;
}

.optional::before {
	background-position: bottom -1.4px right 0px;
}


#walletSelectWrapper {
	position: relative;
	max-width: 400px;
	margin: auto;
	top: 20%;
	font-family: msdos;
    padding: 0.1em 0.1em 0.1em;
    color: white;
    background: #819de0;
    border: 6px;
    border-style: solid solid solid solid;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
    
}


#walletSelectionTitle {
    font-family: msdos;
    background: none;
    border: none;
	color: white;
	margin-top: 0.001em;
	margin-bottom: 0.001em;
	padding-left: 0.25em;
	font-size: 1.1em;

	text-align: left;
	/* letter-spacing: 8px; */
}

#walletSelectList {
	height: auto;
	z-index: 30;
	list-style: none;
	padding-left: 0;
    padding-top: 0.5em;
	margin: auto;

    color: #4b5a83;
    background-color: #a5bfff;
    border-width: 4px;
    border-style: inset solid solid inset;
    border-color: #819de0 #8ea6e3 #819de0 #819de0;
    text-align: left;
}

#walletSelectList li {
	width: 90%;
	margin: 1em auto;
	text-align: center;
	color: white;
	font-weight: bold;
    background-color: #819de0;
    border: 6px;
    border-style: solid solid solid solid;
    border-color: #a5beff #4b5a83 #4b5a83 #8ea6e3;
    align-self:center;
}


#progressBar {
    background-color: #819de0;
}

#progress {
    background-color: #a5bfff;
}