@font-face {
   font-family:CascadiaMono;
   src:url("/fnt/CascadiaMono.ttf");
}
@font-face {
   font-family:Quicksand;
   src:url("/fnt/Quicksand.woff");
}
@font-face {
   font-family:SourceCodePro;
   src:url("/fnt/SourceCodePro.woff");
}
@font-face {
   font-family:SourceCodeBold;
   src:url("/fnt/SourceCodeBold.woff");
}
@font-face {
   font-family: AB;
   src:url("/fnt/AB.ttf");
}
@font-face {
   font-family: NSR;
   src:url("/fnt/NSR.ttf");
}
@font-face {
   font-family: TrebuchetMS;
   src:url("/fnt/trebuc.ttf");
}
#user {
   font-family: AB;
   position: relative;
   top: -0.06cm;
   font-size: 6mm;
   cursor: pointer;
   max-width: 10ch;
   display: inline-block;
   overflow: hidden;
   text-overflow: ellipsis;
}
* {
   font-family: NSR;
   font-size: 4mm;
}
.inlBlk {
   display: inline-block;
}
#jackmail {
   color: rgb(96,96,256);
}
body {
   margin: 1px;
   /* display: inline; */
}
header {
   width: fit-content;
   height: fit-content;
   z-index: 10;
   position: fixed;
   bottom: 10mm;
   left:0;
   background-color: rgba(0,0,0,0.6);
   backdrop-filter: blur(3px);
   -webkit-backdrop-filter: blur(3px);
   padding: 1mm;
   padding-bottom: 3mm;
   border-top-right-radius: 2mm;
   border-bottom-right-radius: 2mm;
}
.noBlur header {
   background-color: rgb(0,0,0);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}
header input {
   font-size: 4mm;
   margin: 1px;
}
#logo {
   height: 1cm;
   padding-right: 0.1cm;
   border-radius: 1px;
   /* position: relative; */
   cursor: pointer;
}
#logo.big {
   height: 7cm;
}
#logo.small {
   height: 1cm;
}
#logoDiv {
   /* position: relative; */
   width: 1cm;
   text-align:center;
}
#logoDiv.if {
   position:fixed;
   z-index:11;
   width: calc(100vw - 1px);
   height: calc(100vh - 1px);
   top:0px;
   left:0px;
   background-color: black;
   text-align: left;
   /* display: flex; */
   /* justify-content: center; */
   /* align-items: center; */
}
#logoDiv.if #logo {
   position: relative;
   height: 9cm;
   top: 45vh;
   left: 50vw;
   padding: 0mm;
   transform: translate(-50%,-50%);
   border-radius: 7mm;
}
#gglSn {
   transform: scale(1.6);
   width: 6mm;
   position: relative;
   bottom: 1mm;
   margin-right: 1mm;
}
#gglSnB {
   margin-top: 4mm;
   margin-bottom: 4mm;
}
#tgtUsrLgHldr {
   font-family: AB;
   font-size: 8mm;
   cursor: pointer;
   margin-left: 2mm;
}
footer.if {
   position: fixed;
   bottom: 2mm;
   left: 2mm;
   margin: 0mm;
   z-index: 11; 
}
#lock {
   height: 0.8cm;
   width: 0.8cm;
   cursor: pointer;
}
#unlock {
   height: 0.8cm;
   width: 0.8cm;
   /* vertical-align: middle; */
   cursor: pointer;
}
#owlOnPerch {
   width: 1cm;
   position: relative;
   top:1mm;
   cursor: pointer;
}
#username {
   width: 5cm;
}
#email {
   display:block;
   width: 5cm;
}
#passwords1 {
   display:block;
   width: 5cm;
}
#passwords2 {
   display:block;
   width: 5cm;
}
#Password1L {
   display:inline-block;
}
#Password2L {
   display:inline-block;
}
#Consent {
   position: relative;
   bottom: 0.5mm;
}
#ConsentL {
   margin-top: 2mm;
   margin-bottom: 2mm;
}
#ConsentT, #ConsentT:visited {
   color: rgb(128,128,255);
}
#ConsentImg{
   width: 0.6cm;
   position: relative;
   top: 0.14cm;
}
#Captcha {
   width: 5cm;
}
#CaptchaImg {
   width: 5.2cm;
   margin-top: 3px;
   margin-left: 1px;
}
#signupSpan {
   
}
#signupdiv {
}
#password {
   width: 5cm;
}
#usermenu {
}
#Desc {
   position: relative;
   top: -0.06cm;
   float: right;
   padding-left: 1mm;
}
#Log {
   position: sticky;
   top: 0.2cm;
   left: 0.2cm;
   width: fit-content;
   max-height: 80vh;
   overflow:auto;
   background-color: rgba(0,0,0,0.3);
   backdrop-filter: blur(2mm);
   -webkit-backdrop-filter: blur(2mm);
   border-radius: 1mm;
   z-index:11;
   text-align:left;
}
.noBlur Log {
   background-color: rgb(0,0,0);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}

#Log div:not(#about) {
   background-color: yellow;
   color: black;
   width: fit-content;
   border-radius: 3px;
   padding-left: 1mm;
   padding-right: 1mm;   
}
#Log.visible div {
   background-color: inherit;
   color: inherit;
   width: inherit;
   border-radius: inherit;
   padding-left: inherit;
   padding-right: inherit;
}
#Log.visible div.hidden {
   display: revert;
}
#Log div.dim:not(#about) {
   background-color: inherit;
   color: inherit;
}

a {
   color: #8888ff;
}
.hilit a {
   color:#0000ff
}
#Log #about a {
   color: #8888ff;
}
#Log #about a.plain {
   color: azure;
   text-decoration: none;
   font-size: 3mm;
}
#Log.about {
   display: revert;
}
#Log.about #about, #Log.if #about {
   display: revert;
}
#Log #about #jack a.plain {
   font-style: italic;
   font-size: 4mm;
   padding-left: 4mm;
}
#Log.about #jack {
   display: revert;
}
#searchBar {
   width: 100%;
   height: 1cm;
}
#searchTool {
   width:0.5292cm; /*20px on iphone 12 mini*/
   height:0.7cm;
   padding-left:0px;
   padding-right:0px;
   border-radius:0px;
   position:relative;
   margin-left:0.08cm;
}
#mouth {
   height: 0.83cm;
   border-width:0px;
   line-height: 0.8cm;
   resize: none;
   /* position: relative; */
   font-family:TrebuchetMS;
   font-size:0.72cm;
   /* font-weight: 600; */
   margin:0px;
   padding:0;
   padding-left:2px;
   width:6.7cm;
   caret-color: #4444ff;
}
.inptTxtBx {
   color: rgb(192,192,192);
}
.inptTxtBx:focus {
   outline:none;
   color: rgb(192,192,192);
}
.inptTxtBx.typing:focus {
   outline:none;
   color: black;
}
.inptTxtBx.typing:blur {
   color: black;
}
#LockBloc {
   width: 1cm;
   text-align: center;
}
body.signed #LockBlock, body.signed #Credentials, body.signed #signupdiv {
   display: none;
}
body.signed #usermenu, body.signed #UserActions, body.signed #owlOnPerch {
   display: revert;
}
inptTxtBx.typing {
   color: black;
}
#lips {
   position: relative;
   height: .2cm;
   top: 0.8cm;
   border-left: 1px solid black;
   border-right: 1px solid black;
   border-bottom: 1px solid black;
   border-bottom-left-radius:3px;
   border-bottom-right-radius:3px;
   -webkit-border-bottom-left-radius:3px;
   -webkit-border-bottom-right-radius:3px;
   display: inline-block;
}

#mouthPad {
   padding-left:2px;
   padding-right:0px;
   display:inline-block;
   top:-0.7cm;
   position:relative;
   font-size:0px;
}
#searchTools {
   position:relative;
   dislpaly: inline-block;
   height: 1cm;
}
#UserActions {
   padding-left: 1mm;
}
#AddThing {
   text-align: center;
   vertical-align: middle;
   border: none;
   cursor: pointer;
   padding: 0px;
   background-color: transparent;
}
#AddThingSVG {
   width: 1cm;
   height: 1cm;
   vertical-align: middle;
   fill: #77ff77;
}
#Things {
}
#Thing {
   padding: 2mm;
   border-radius: 1mm;
}
#Thing input[type=button] {
   border: 0px;
   vertical-align: middle;
   text-align: center;
   background-color: rgba(255,255,255,0.3);
   backdrop-filter: blur(1mm);
   -webkit-backdrop-filter: blur(1mm);
   color: rgb(0,0,128);
}
.noBlur #Thing input[type=button] {
   background-color: rgba(180,180,180);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}

#thnBtm {
   position: absolute;
   z-index: 2;
   background-color: rgba(0, 0, 0, 0.5);
   backdrop-filter: blur(3px);
   -webkit-backdrop-filter: blur(3px);
   border-radius: 2mm;
   padding: 1mm;
}
.noBlur #thnBtm {
   background-color: rgb(0,0,0);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}

#Thing.editMode #thnBtm {
   position: relative;
}
#showURLBtn {
   position: absolute;
   top: 1mm;
   right: 15mm;
}
#ThingEditBtn {
   display: none;
   position: absolute;
   top: 2mm;
   right: 2mm;
}
#Thing.mine #ThingEditBtn {
   display:block;
}
#Thing.mine #qSendDiv {
   display: none;
}
#Thing.active {
   /* scale: 1.2; */
   /* float: left; */
}
#Thing.active #ImgHldr {
   /* height: revert; */
}
#ImgsHldr {
   position: relative;
   margin-bottom: 0.1cm;
}
#NxtBtnHldr {
   position: absolute;
   font-size: 0.5cm;
   bottom:1mm;
   left: 1mm;
   margin:0.2cm;
}
.imgNxtBtns {
   width: 7mm;
}

#ThingNameBox {
   /* position: relative; */
}

body.signed #Thing.active #ThingDetails,
body.signed #Thing.active #lastModedD,
body.signed #Thing.active #msgdiv {
   display:revert;
}
#lastModedD {
   background-color: rgba(139,69,19,0.7);
   backdrop-filter: blur(2mm);
   border-radius: 1mm;
   margin-bottom: 1mm;
   padding-left: 1mm;
   padding-right: 1mm;
   font-size: 3.3mm;
}
.noBlur #lastModedD {
   background-color: rgb(139,69,19);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}
#ImgHldr {
   height: 5cm;
   height: fit-content;
}
#Imgs {
   width: fit-content;
}
svg.fixedSize, img.fixedSize {
   max-width: 9.5cm;
   min-width: 4cm;
   height: 5cm;
   background-color: rgb(64,64,64);
   border-radius: 2mm;
}

svg.plusSize, img.plusSize {
   height: 61.8vh;
}

svg.fixedSize {
   width: 4.5cm;
}

#NewThingImgs svg path {
   fill: rgb(128, 128, 128);
}

#NewThingImgs div input.editBtn {
   /* display: block; */
   /* width: 0.8cm; */
   /* height: 0.8cm; */
   top: -1cm;
   position: relative;
   /* background-image: url('/img/images/myIconSet.png'); */
   /* background-position: 0px -140px; */
   /* background-size: 938px; */
   /* filter: invert(1); */
   /* border-color: black; */
   /* border-left-width: 2px; */
   /* border-right-width: 2px; */
   /* border-top-width: 2px; */
   /* border-bottom-width: 2px; */
}
#I1 {
   
}
#ThingImg {
   display:block;
   max-width:90vw;
}
#Thing input {
   font-size: 4mm;
   border-radius: 1mm;
}
#Thing input[type=text]:focus {
   outline-width: 0mm;
}
#Thing input[type=text] {
   width: 38mm;
}
#Thing textarea {
   width: 38mm;
}

#Thing.editMode .edtHide {
   display:none;
}

#Thing.editMode #ThingEditBtn {
   position: relative;
   top: 0px;
   right: 0px;
   display: inline-block;
}

#ThingLocationPin, #LocationPin {
   display: inline-block;
   /* width: 0.5cm; */
   /* height: 0.48cm; */
   /* background-image: url('/img/images/myIconSet.png'); */
   /* background-position: -0.8cm -2.39cm; */
   /* background-size: 15.5cm; */
   /* filter: brightness(0) invert(1); */
   hover:pointer;
}

#ThingLocationPin #pin {
   position: relative;
   top: -0.8mm;
   left: 0.8mm;
}
#LocationDiv {
   display: block;
   position: fixed;
   top: 1mm;
   right: 1mm;
   z-index:11;
   background-color: rgba(0,0,0,0.3);
   backdrop-filter: blur(2mm);
   -webkit-backdrop-filter: blur(2mm);
   border-radius: 1mm;
}
.noBlur #LocationDiv {
   background-color: rgb(0,0,0);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}
/* #LocationPin { */
/*    top: 1.5mm; */
/* } */
#LocTxt {
   font-size: 4mm;
   position:relative;
   top: 0.4mm;
}
#ThingLocationPin:hover, #LocationPin:hover {
   cursor: pointer;
}

#ThingLocationPin #tin, #LocationPin #tin{
   display: none;
}
#ThingLocationPin.empty #pin, #LocationPin.empty #pin{
   /* background-position: -4.75cm -3.18cm */
   display: none;
}
#ThingLocationPin.empty #tin, #LocationPin.empty #tin{
   display: revert;
}
#LocationDDiv #LocationBox {
   width: 45mm;
   background:transparent;
}
#LocationDDiv.if {
   position: fixed;
   top: 50vh;
   left: calc(50vw - 25mm);
   /* transform: translate(-50%,0); */
   z-index: 11;
}

#LocationDDiv.if #LocationDiv {
   position: relative;
   top: 32mm;
   left: 0cm;
   backdrop-filter: blur(1px);
   -webkit-backdrop-filter: blur(1px);
}
.noBlur #LocationDDiv.if #LocationDiv {
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}

#ThingName {
   position:relative;
   top: -0.63mm;
   font-size: 4mm;
}
#ThingDetails {
   font-family: CascadiaMono.ttf;
   font-size: 3.6mm;
   background-color: rgb(40,40,40);
   border-radius: 1mm;
}
#picBrsr {
   position: absolute;
   top: 1mm;
   left: 1mm;
   z-index: 11;
   background: rgba(0,0,0,0.5);
   border-radius: 1mm;
   backdrop-filter: blur(1mm);
   -webkit-backdrop-filter: blur(1mm);
}
.noBlur #picBrsr {
   background-color: rgb(0,0,0);
   backdrop-filter: none;
   -webkit-backdrop-filter: none;
}

#mbox {
   overflow: scroll;
}
.reply {
   background-color: rgb(120,120,234);
   margin: 1mm;
   border-radius:1mm;
   width: fit-content;
}
#replyBtn, #msgBtn {
   display:block;
}
.query {
   margin:1px;
   border-radius:1mm;
   font-size: 3.7mm;
   background-color: rgb(96,96,234);
   width: fit-content;
}
#Thing #msgBtn, #Thing.editMode #ThingEditBtn, #Thing #cnclEdtBtn{
   background-color: rgb(200,200,200);
}
#chusPicBtn {
   top: 1mm;
   position: absolute;
   width: 22mm;
}
footer {
   /* position: relative; */
   /* bottom: 2mm; */
   /* left: 2mm; */
   margin: 2mm;
}
#beta {
   background-color: orange;
   border-radius: 1mm;
   color: black;
   font-size: 3mm;
   padding-left: 1mm;
   padding-right: 1mm;
   position: relative;
   /* left: 1mm; */
}
.transform2s3d {
   -webkit-transition: width 2s, height 2s, -webkit-transform 2s linear;
   -webkit-transform-style: preserve-3d;
   -moz-transition: width 2s, height 2s, -moz-transform 2s linear;
   -moz-transform-style: preserve-3d;
   transition: width 2s, height 2s, transform 2s linear;
   transform-style: preserve-3d;
}
/* @keyframes blink { */
/* 	0% { opacity:1 } 75% { opacity:1 } 76% { opacity:0 } 100% { opacity:0 } */
/* } */

/* blink, .blink-css { */
/* 	animation:blink 0.75s ease-in infinite alternate!important; */
/* } */
.middle {
   position: relative;
   display: block;
   text-align: center;
}
.center {
   text-align: center;
   vertical-align: middle;
   position: relative;
   display: block;
   margin: auto;
}
.invisible {
   opacity: 0;
   filter: alpha(opacity=0);
}
.inQ {
   background-color: gray;
}
.new {
   background-color: blue;
}
#land {
   width: 100%;
}
#compound-wall {
   padding-left:0px;
   padding-right:0px;
   display:inline-block;
   position:relative;
}
.highlight{
   background-color: yellow;
   color: black;
}
.thing {
   display: inline-block;
   margin-right: 1mm;
   position: relative;
   vertical-align: top;
}
/* .hidden { */
/*    position: absolute; */
/*    width: 0px; */
/*    height: 0px; */
/*    display: none; */
/*    padding: 0px; */
/*    border: 0px; */
/*    margin: 0px; */
/* } */
.hidden {
   display: none;
}
.mask {
   visibility: hidden;
}
#chin {
   height: 5cm;
}
#chin.big {
   height: 9cm;
}
.plot {
   position: relative;
   display: inline-block;
   width: 4cm;
   height: 4cm;
   border-width:1px;
   border-color:black;
   border-style:solid;
   vertical-align:top;
}
.fat.plot {
   width: 8cm;
   height: 4cm;
}
.tall.plot {
   width:  4cm;
   height: 8cm;
}
.jumbo.plot {
   width: 8cm;
   height: 8cm;
}
.plot .facade,
.plot .name {
   display:block;
   position:relative;
}
.plot .facade {
   height:75%;/*192px;*/
   border:0px;
   border-bottom-width:1px;
   border-color:black;
   border-style:solid;
}
.plot .name {
   height:25%;
}
/*.tall.plot .facade,
      .jumbo.plot .facade{
      height:384px;
      }
      .tall.plot .facade,
      .jumbo.plot .facade{
      height: 128px;
      }
      .tall.plot .facade,
      .jumbo.plot .facade{
      height:384px;
}*/