html{
  scroll-behavior:smooth;
  overscroll-behavior:contain;
}
:root{
  --color-body-bg:#DDD;
  --color-border:#888;
  --color-black:#000;
  --color-white:#FFF;
  --color-danger:#FE0B01;
  --color-success:#0C0;
  --color-warning-border:#F0C36D;
  --color-warning-bg:#FFF7E6;
  --color-neutral-100:#F2F2F2;
  --color-neutral-150:#E9E9ED;
  --color-neutral-200:#E0F7FA;
  --color-neutral-300:#DDD;
  --color-neutral-400:#D0D0D7;
  --color-neutral-500:#CCC;
  --color-neutral-600:#ABABAB;
  --color-neutral-700:#777;
  --color-highlight:#FF0;
  --radius-md:10px;
  --hrvisible:none;
  --logowidth:100%;
  --imgwidth:200px;
  --contactwidth:20em;
  --selectwidth:90%;
  --menuwidth:120px;
  --timewidth:80px;
  --menufont:10px;
  --tabletopmargin:15px;
}
body{
  background-color:var(--color-body-bg);
  transition:filter .3s ease;
}
body.age-locked{
  overflow:hidden;
}
body.age-locked .age-gate{
  display:flex;
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(15px);
  -webkit-backdrop-filter:blur(15px);
}
.container,
fieldset,
input,
th,
td{
  text-align:center;
}
.status-banner{
  padding:10px 12px;
  border:1px solid var(--color-warning-border);
  background:var(--color-warning-bg);
  border-radius:var(--radius-md);
  margin:10px 0;
  font-size:14px;
}
.noscriptmsg{
  position:relative;
  top:50%;
  left:50%;
  margin-right:-50%;
  transform:translate(-50%,-50%);
  z-index:100;
  background-color:#F00;
  font-size:250%;
}
h3,
.text,
.message,
.message-text,
.bio{
  overflow-wrap:anywhere;
}

.logo,
legend,
.profileimg,
.allprofile,
.allusersimg,
table,
.statistics{
  margin-inline:auto;
}

.logo{
  height:120px;
}

.users td:not(.bio){
  width:100px;
}

table.users tr>th,
table.sessions tr th,
table.orgasms tr>th,
table.links tr>th{
  position:sticky;
  top:0;
  background-color:var(--color-body-bg);
}
fieldset{
  border:0;
  margin:20px auto 10px;
}
fieldset.users{
  width:90%;
}
legend{
  font-size:190%;
}
th,
td{
	/*border:1px solid var(--color-border);*/
  border-color:var(--color-border);
}
#log td,
#reg td,
.form td,
.profile td{
	border:1px solid var(--color-border);
}
table{
  border-collapse:separate;
  border-spacing:2px;
}
.statistics{
  border:0 solid var(--color-black);
  border-collapse:separate;
}
table.statistics th,
table.statistics td{
  text-align:center;
}
table.sessions,
table.livesession,
table.orgasms,
table.profile,
table.links{
  margin-inline:auto;
  border:1px solid var(--color-black);
  border-collapse:separate;
  border-spacing:2px;
  border-color:var(--color-border);
}
table.sessions th,
table.sessions td,
table.livesession th,
table.livesession td,
table.orgasms th,
table.orgasms td,
table.profile th,
table.profile td,
table.links th,
table.links td{
  border:1px solid var(--color-black);
  border-color:var(--color-border);
  text-align:center;
}
table.sessions,
table.livesession,
table.links{
  margin-top:20px;
}
table.orgasms{
  margin-top:10px;
}
table.profile{
  margin-top:30px;
}
.extended,
.hideses,
.hideorg,
#top{
  display:none;
}
.profile{
  display:inline-flex;
  flex-direction:row;
  justify-content:center;
  align-content:center;
}
.profilesym,
.like,
.del,
.quote{
  cursor:pointer;
}
.profilesym,
.chat-img{
  border:1px solid var(--color-black);
}
.profilesym{
  margin-left:3px;
}
.highlight{
  background-color:var(--color-highlight);
}
form[name="reg"]{
  margin-top:30px;
}
ul#menu{
  font-family:Verdana,sans-serif;
  font-size:11px;
  width:100%;
  display:table;
  text-align:center;
  padding:0;
  list-style:none;
}
ul#menu li{
  background-color:var(--color-danger);
  border-bottom:5px solid var(--color-neutral-600);
  display:inline-block;
  float:none;
  width:140px;
  height:30px;
  margin:2px;
}
ul#menu li a{
  color:var(--color-white);
  display:inline-block;
  font-weight:bold;
  line-height:30px;
  text-decoration:none;
  width:130px;
  height:30px;
  text-align:center;
  white-space:nowrap;
}
ul#menu li.active,
ul#menu li:hover{
  background-color:var(--color-neutral-600);
  border-bottom:5px solid var(--color-danger);
}
.hr{
  width:50%;
}
ol{
  counter-reset:section;
  list-style-type:none;
  list-style-position:outside;
}
ol li:not(.unstyled){
  counter-increment:section;
}
ol li:not(.unstyled):before{
  content:counters(section, ".")") ";
}
ol li ul li:before{
  content:" ";
}
ol li ul li{
  counter-increment:none;
}
li.change:not(:last-child){
  margin-bottom:15px;
  list-style-position:outside;
}
.terms{
  list-style-type:disc;
}
.nodisc{
  list-style-type:none;
}
fieldset.messages-box{
  width:55%;
  display:flex;
  flex-direction:row;
  justify-content:center;
}
.chatlist{
  list-style-type:none;
  padding-left:0;
  width:max-content;
}
.chatlist li{
  margin-bottom:5px;
  width:max-content;
}
li.review{
  padding-left:0;
  list-style-position:inside;
}
li.index{
  margin-bottom:4px;
}
ul.review{
  padding:0;
}
.profileimg{
  object-fit:contain;
  width:300px;
}
.allprofile,
.allusersimg{
  object-fit:contain;
  height:100px;
}
.contact{
  height:10em;
  width:40em;
}
.show{
  height:40em;
  width:40em;
}
.edit{
  height:20em;
  width:40em;
}
.list{
  float:left;
  margin:0 auto;
}
.column{
  text-align:left;
  overflow-y:scroll;
  height:fit-content;
	max-height:365px;
  width:max-content;
  flex-shrink:0;
}
.message-box,
.chat-box,
.chat-container,
.chat-containerq,
.message{
  border:1px solid var(--color-neutral-500);
}
.message-box{
  width:80%;
  max-height:400px;
  min-width:400px;
  overflow:auto;
  margin-bottom:3px;
  display:flex;
  flex-direction:column-reverse;
  align-self:center;
}
.messages{
  margin-bottom:3px;
  display:flex;
  flex-direction:column;
}
.new{
  background-color:#0F0 !important;
}
.message{
  padding:7px;
  margin:3px;
  word-wrap:break-word;
}
.sender{
  text-align:right;
  background-color:var(--color-neutral-100);
  position:relative;
}
.receiver{
  text-align:left;
  background-color:var(--color-neutral-200);
}
.messagedate{
  font-size:12px;
  color:gray;
}
.nick{
  font-size:13px;
}
.text{
  padding-left:30px;
}
.new-message{
  width:90%;
  margin-left:10%;
}
.send{
  display:table-cell;
  vertical-align:middle;
}
.delete:not(.history-entry){
  position:absolute;
  top:54%;
  transform:translate(0,-50%);
}
.delete img{
  height:30px;
}
.nicklist{
  color:blue;
}
.nicklist a:visited{
  text-decoration:none;
}
.icon{
  height:40px;
}
.mdot,
.cdot,
.gdot{
  height:15px;
  width:15px;
  background-color:var(--color-success);
  border-radius:50%;
  display:inline-block;
  vertical-align:middle;
}
.chat-box{
  height:500px;
  overflow:auto;
  margin-bottom:3px;
  display:flex;
  flex-direction:column-reverse;
  align-self:center;
}
#myInput,
.search,
#filtermsgs{
  background-image:url('logos/search.svg');
  background-repeat:no-repeat;
  border:1px solid var(--color-neutral-300);
}
#myInput{
  background-position:10px 12px;
  background-size:21px;
  font-size:16px;
  padding:12px 20px 12px 40px;
}
#filtermsgs{
  background-position:5px 6px;
  background-size:15px;
  padding:6px 10px 6px 20px;
}
.search{
  background-position:10px 12px;
  background-size:21px;
  padding:12px 20px 12px 12px;
  margin-bottom:12px;
  width:200px;
}
fieldset.chat{
  width:40%;
}
#emojiselector{
  position:absolute;
  z-index:1;
  left:50%;
  transform:translate(-50%,0);
}
.top{
  height:14px;
}
.chat-input{
  display:inline-block;
  width:100%;
  align-self:center;
}
#chat-input{
  width:99%;
  float:left;
  resize:vertical;
}
.chat-container,
.chat-containerq{
  display:flex;
  flex-direction:row;
  align-items:flex-start;
}
.chat-container{
  margin:3px 3px 10px;
}
.profile-image{
  flex:0 0 auto;
  margin:0 10px 0 3px;
  text-align:left;
  margin-top:auto;
  margin-bottom:auto;
  width:34px;
}
.profile-image img{
  max-height:35px;
  max-width:43px;
}
.chat-img{
  height:40px;
}
.message-text{
  flex:1 1 auto;
  text-align:justify;
}
.message-time{
  flex:0 0 auto;
  margin-left:10px;
  margin-right:3px;
  text-align:center;
}
.message-input{
  display:inline-block;
  width:80%;
  padding-bottom:15px;
  align-self:center;
}
#message-input{
  width:100%;
  height:35px;
  float:left;
  resize:vertical;
}
.bio{
  overflow:auto;
  max-width:200px;
  display:inline-block;
  align-items:center;
}
.collapsiblesess,
.collapsibleorg{
  margin-top:10px;
  background-color:var(--color-neutral-700);
  cursor:pointer;
  padding:18px;
  width:100%;
  border:none;
  text-align:center;
  outline:none;
  font-size:15px;
  color:var(--color-white);
}
.activesess,
.activeorg,
.collapsiblesess:hover,
.collapsibleorg:hover{
  background-color:var(--color-neutral-500);
  color:var(--color-black);
}
.contentsess,
.contentorg{
  padding:0 18px;
  max-height:0;
  overflow:hidden;
  transition:max-height .2s ease-out;
}
.contentorg{
  margin-bottom:50px;
}
.collapsiblesess:after,
.collapsibleorg:after{
  content:'\02795';
  font-size:13px;
  color:var(--color-white);
  float:right;
  margin-left:5px;
}
.activesess:after,
.activeorg:after{
  content:"\2796";
}
.pprofile{
  margin:auto;
  width:90%;
}
#top,
#close{
  position:fixed;
  bottom:10px;
  border:none;
  background-color:red;
  color:var(--color-white);
  cursor:pointer;
  padding:15px;
  border-radius:var(--radius-md);
  font-size:18px;
  opacity:.5;
  z-index:1;
}
#top{
  right:10px;
}
#close{
  display:block;
}
.accept,
.decline,
.greenbutton,
.redbutton,
.bicolorbutton,
.greybutton{
  text-decoration:none;
  display:inline-block;
}
.accept,
.decline{
  border:none;
  color:var(--color-white);
  font-size:15px;
  margin:4px 2px;
  cursor:pointer;
  width:80px;
}
.accept{
  background-color:var(--color-success);
  margin-right:15px;
}
.decline{
  background-color:var(--color-danger);
}
.greenbutton{
  background-color:var(--color-success);
  color:var(--color-white);
  text-align:center;
}
.redbutton{
  background-color:var(--color-danger);
  color:var(--color-white);
  text-align:center;
}
.bicolorbutton{
  background:linear-gradient(-90deg,var(--color-danger) 50%,var(--color-success) 50%);
  color:var(--color-white);
  text-align:center;
}
.greybutton{
  background-color:var(--color-neutral-150);
  border:1px solid var(--color-black);
  border-color:var(--color-neutral-400);
  color:var(--color-black);
  font-size:15px;
  text-align:center;
  margin:2px;
  cursor:pointer;
}
.greybutton:hover:not(.disabled){
  background-color:var(--color-neutral-400);
  border-color:var(--color-neutral-150);
}
.like,
.del{
  height:15px;
}
.quote{
  height:18px;
}
.notvisible{
  visibility:collapse;
}
.visible{
  visibility:visible;
}
.sliderspan{
  vertical-align:middle;
}
.switch{
  position:relative;
  display:inline-block;
  width:44px;
  height:25px;
}
.switch input{
  opacity:0;
  width:0;
  height:0;
}
.slider{
  position:absolute;
  cursor:pointer;
  inset:0;
  background-color:var(--color-danger);
  -webkit-transition:.4s;
  transition:.4s;
}
.slider:before{
  position:absolute;
  content:"";
  height:17px;
  width:18px;
  left:4px;
  bottom:4px;
  background-color:var(--color-white);
  -webkit-transition:.4s;
  transition:.4s;
}
input:checked + .slider{
  background-color:var(--color-success);
}
input:focus + .slider{
  box-shadow:0 0 1px #2196F3;
}
input:checked + .slider:before{
  -webkit-transform:translateX(18px);
  -ms-transform:translateX(18px);
  transform:translateX(18px);
}
.slider.round{
  border-radius:18px;
}
.slider.round:before{
  border-radius:50%;
}
/* Shared responsive rules */
@media all and (max-width:1300px){
  .logo{
    width:var(--logowidth);
    height:auto;
  }
  ul#menu{
    font-size:var(--menufont);
  }
  ul#menu li,
  ul#menu li a{
    width:var(--menuwidth);
  }
  #timezones{
    width:var(--selectwidth);
  }
  .hr{
    display:var(--hrvisible);
  }
  #time{
    width:var(--timewidth);
  }
  .profileimg{
    width:var(--imgwidth);
  }
}
@media all and (max-width:1300px) and (min-width:801px),
       all and (max-width:768px) and (min-width:321px),
       all and (max-width:320px){
  .statistics{
    margin-inline:auto;
    border-collapse:collapse;
    margin-bottom:var(--tabletopmargin);
  }
  .statistics tr{
    border-top:thin solid;
  }
}
@media all and (max-width:1300px) and (min-width:960px){
  table.sessions{
    font-size-adjust:.4;
  }
  fieldset.chat{
    width:70%;
  }
  .img-chat{
    width:8%;
  }
  .chat-text{
    width:67%;
  }
  .chat-time{
    width:25%;
    text-align:center;
  }
}
@media all and (min-width:801px) and (max-width:959px){
  .contact{
    height:10em;
    width:var(--contactwidth);
  }
  .show{
    height:35em;
    width:21em;
  }
  .column{
    margin:auto;
    text-align:center;
  }
  .message-box{
    width:80%;
    max-height:400px;
    margin:0 auto 3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
  }
  fieldset.chat{
    width:80%;
  }
  .img-chat{
    width:9%;
  }
  .chat-text{
    width:76%;
  }
  .chat-time{
    width:15%;
    text-align:center;
  }
}
@media all and (min-width:769px) and (max-width:800px){
  .statistics{
    margin-inline:auto;
    border-collapse:separate;
    margin-bottom:var(--tabletopmargin);
  }
  .column{
    margin:auto;
    text-align:center;
  }
  .message-box{
    max-height:400px;
    margin:0 auto 3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
  }
  fieldset.chat{
    width:auto;
  }
  .img-chat{
    width:8%;
  }
  .chat-text{
    width:76%;
  }
  .chat-time{
    width:16%;
    text-align:center;
  }
}
@media all and (min-width:569px) and (max-width:768px){
  .show{
    height:25em;
    width:30em;
  }
  .column{
    margin:auto;
    height:350px;
  }
  .message-box{
    max-height:400px;
    margin:0 auto 3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
  }
  .chat-box{
    width:530px;
  }
  .img-chat{
    width:11%;
  }
  .chat-text{
    width:73%;
  }
  .chat-time{
    width:16%;
    text-align:center;
  }
  .pprofile{
    margin:0;
  }
}
@media all and (min-width:481px) and (max-width:568px){
  .profile{
    flex-direction:column;
  }
  .contact{
    height:10em;
    width:var(--contactwidth);
  }
  .show{
    height:35em;
    width:23em;
  }
  table.sessions{
    font-size-adjust:.4;
  }
  .column{
    margin:auto;
    text-align:center;
  }
  .message-box{
    width:90%;
    max-height:400px;
    margin-bottom:3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
    flex-direction:column;
  }
  #top,
  #close{
    font-size:15px;
  }
  fieldset.chat{
    width:auto;
  }
  .chat-box{
    width:440px;
  }
  .img-chat{
    width:10%;
  }
  .chat-text{
    width:73%;
  }
  .chat-time{
    width:17%;
    text-align:center;
  }
  #autoscroll{
    height:25px;
  }
  .pprofile{
    margin:0;
  }
}
@media all and (min-width:321px) and (max-width:480px){
  .profile{
    flex-direction:column;
  }
  .statistics{
    font-size:14px;
  }
  .time{
    width:var(--timewidth);
  }
  .contact{
    height:10em;
    width:var(--contactwidth);
  }
  .show{
    height:35em;
    width:23em;
  }
  table.sessions{
    font-size-adjust:.4;
  }
  .column{
    margin:auto;
    text-align:center;
  }
  .message-box{
    width:85%;
    max-height:400px;
    min-width:auto;
    margin-bottom:3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
    flex-direction:column;
  }
  fieldset.users{
    font-size:14px;
  }
  #top,
  #close{
    font-size:15px;
  }
  fieldset.chat{
    width:auto;
  }
  .chat-box{
    width:350px;
  }
  .img-chat{
    width:10%;
  }
  .chat-text{
    width:74%;
  }
  .chat-time{
    width:16%;
    text-align:center;
  }
  .chat-input{
    width:100%;
  }
  #autoscroll{
    height:25px;
  }
  .pprofile{
    margin:0;
  }
}
@media all and (max-width:320px){
  .profile{
    flex-direction:column;
  }
  .statistics{
    font-size:190%;
  }
  .time{
    width:var(--timewidth);
  }
  .contact{
    height:10em;
    width:var(--contactwidth);
  }
  .show{
    height:35em;
    width:21em;
  }
  table.sessions{
    font-size-adjust:.4;
  }
  .column{
    margin:auto;
    text-align:center;
  }
  .message-box{
    width:95%;
    max-height:400px;
    min-width:auto;
    margin-bottom:3px;
  }
  .new-message{
    width:90%;
    margin-left:0;
  }
  fieldset.messages-box{
    width:100%;
  }
  fieldset.users{
    font-size:14px;
  }
  #top,
  #close{
    font-size:15px;
  }
  fieldset.chat{
    width:100%;
  }
  .chat-box{
    width:300px;
  }
  .img-chat{
    width:10%;
  }
  .chat-text{
    width:74%;
  }
  .chat-time{
    width:16%;
    text-align:center;
  }
  #autoscroll{
    height:25px;
  }
  .pprofile{
    margin:0;
  }
}