
/*
CSS by Stephan Kern.  Copyright 2014-present.
Only for use on the theadultgrid.com and beta.theadultgrid.com


Use anywhere else, either in part or in whole, is forbidden.
please contact admin@theadultgrid.com if you wish to use any portions.
*/
 /*background-color: #3C3C3C; background-image: url(../images/index_bkgrnd.png); background-repeat: repeat-x;*/
html{height: auto; width: 100%; min-height: 100%;}
body {background-attachment: fixed; background: #2B2B2B; color: #000000; font-family: Arial; font-size: 16px; margin: 0; text-align: center; width: 100%;}
h3{font-weight: normal;}
h4{text-align: center; margin: 0px; font-size: 1.3em;}
h4.failure{color: red;}
h5{text-align: left; font-size: 5.0em; font-weight: bold; font-family: Arial; margin: 10px 0px 0px 15px;}
h6{text-align: left; font-size: 1.8em; font-weight: bold; font-family: Arial; margin: 10px 0px 0px 63px;}
h7{display: block; text-align: left; font-size: 0.95em; font-weight: normal; padding-left: 12px;}
a:visited{color: #8a228f;}
#processing {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100vh;
  width: 100%;
  background: rgba(0,0,0,.5);
  padding-top: 200px;
  font-size: 100px;
  color: red;
}
#banner{
  position: relative;
  min-width: 100%;
  color: white;
  background-image: url(/files/pictures/main/bannerBack.png);
  overflow: hidden;
  background-position: 50% 50%, 0 0;
  background-size: 100%;
  background-repeat: no-repeat;
}
#banner:before {
  padding-top: 25%;
  content: "";
  display: block;
}
#beta{
  pointer-events: none;
  font-size: 5.0em;
  font-weight: bold;
  color: red;
  position: absolute;
  top: 1em;
  left: 150px;
  transform: rotate(30deg);
  z-index: 501;
  border: 10px outset red;
  border-radius: 60px;
  padding: 10px;
}
#bannerImage{
  position: absolute;
  right: 5px;
  top: 5px;
  height: 40%;
}
#bannerText{
  position: absolute;
  top: 2em;
  left:5px;
  z-index: 499;
  text-shadow: 2px 2px 3px #000000;
}
#copyright{position: absolute; bottom: 20px; width: 100%; text-align: center; color: #ffffff;}
#mainContainer {padding: 0 0 50px 0; position: relative; background-color: #ABABAB; min-width: 850px; max-width: 1350px; min-height: calc(100vh - 30px); margin: auto; width: 90%;}
#joinNow{
  text-decoration: none;
  position: absolute;
  bottom: 1em;
  left: 4em;
  font-size: 2.0em;
  background-color: #9999aa;
  font-family: Lucida;
  font-weight: bold;
  border-radius: 15px;
  box-shadow: 0px 0px 5px 2px black;
}
#joinNow:hover{background-color: #aaaaff;}
#joinNow:active{background-color: #000000;}
#pusher{width: 100%; height: 40px; clear: both;}
#contentArea{}
#rightBox{float: right; text-align: left; margin: 0 4px 0 0; width: calc(100% - 250px); padding: 0 5px;}
#leftMenu{
  float: left;
  margin: 6px 0px 0px 3px;
  padding: 5px;
  text-align: left;
  width: 220px;
  border:1px solid black;
  box-shadow: 0px 0px 5px 1px black;
}
#leftMenu a{text-decoration: none;}
#rightBox section{padding: 15px;}
/*This CCS controls the formatting and behaviour of the menus.
Copyright Stephan Kern 2014-present.  This CSS and associated HTML
is only for use on theadultgrid.com and beta.theadultgrid.com*/
nav {
  border-collapse: collapse;
  font-weight: bold;
  width: 100%;
  height: 1.2em;
  border-bottom: 1px solid #634271;
  border-top: 1px solid #634271;
  background: linear-gradient(#634271, #ABABAB, #634271);
}
#menu{
  margin: 0 auto;
  height: 100%;
  position:relative;
  list-style: none;
  padding: 0px;
}
#menu a {color: inherit; padding: 0px; text-decoration: none;}
#menu a:visited {color: inherit;}

#menu button{margin-top: 4px; width: 6.8em; height: 30px; border-radius: 8px; font-size: .95em; color: white;}
#menu li.top{
  width: 7em;
  color: white;
  display: block;
  float: left;
  height: 100%;
  border-right: 1px solid #634271;
  vertical-align: middle;
}
#menu li.top:hover{
  background: linear-gradient(#ABABAB, #634271, #ABABAB);
}
#menu li.Right{
  float: right;
  border-left: 1px solid #634271;
}
#menu li:hover{position: relative; z-index: 500;}

#menu ul.down{
  text-indent: 0px;
  list-style: none;
  padding: 0px 5px;
  width: 120px;
  position: absolute;
  top: -700px;
  left: -3px;
  border: 1px solid #634271;
  background: #634271;
  box-shadow: 0px 0px 1px 1px black;
}
#menu ul.down li{padding: 5px 0px 0px 0px; height: 1.2em;}
#menu li:hover ul.down{position: absolute; top: 1em; left: 5px;}

#memberMenu{
  z-index: 99990;
  padding: 10px;
  list-style: none;
  margin: 5px auto;
  position: relative;
}
#memberMenu a{text-decoration: none;}
#memberMenu button{width: 200px; border-radius: 8px; font-size: 1.2em; height: 30px; margin: 0 auto; margin-bottom: 7px; display: block; color: white; background-color:#634271; }
#memberMenu ul.right {list-style: none; padding-right: 0px; position: absolute; top: -1000px; left: 200px;}
#memberMenu ul.right ul{list-style: none; padding-right: 0px; position: absolute; top: -800px; left: 200px;}
#memberMenu li:hover,
  #memberMenu li li:hover{
    position:relative;
  }
#memberMenu li:hover ul.right{
  position: absolute;
  top: 0px;
  left: 175px;
}
#memberMenu ul.right li:hover ul{
  position: absolute;
  top: 0px;
  left: 175px;
}
.green{color: green;}
.blue{color: blue;}
.red{color: red;}
.menuButton{width: 115px; height: 30px; margin-top: 2.5px; border-radius: 8px; font-size: 1.2em;}
/* formating for the login */
#login{}
#login input {width: 3.0em; float: right; padding: 0px;}
#login2{width: 100%;}
#login2 input {width: 12em; padding: 3px; margin: 5px auto; display: block;}
#login2 input#submit{width:100px; margin: 5px 55px;}
#loginBar{width: 220px; background-color: #9999aa; text-align: center; margin: 5px auto; color: #000000}
#gridStatus{width: 100%;line-height: 1.25;}
#gridStatus span{float: right; font-weight: bold;}
#failedLogin{color: #ff0000; text-align: center; display: block;}
#failedLogin p{font-size: .8em;}
#forgotPass div{width: 300px; height: 100px; top: calc(50vh - 50px);}
#forgotPass input{width: 98%;}
#forgotPass input::-moz-placeholder{text-align: center; font-weight: bold;}
#forgotPass input::-webkit-input-placeholder{text-align: center; font-weight: bold;}
#forgotPass input:-ms-input-placeholder{text-align: center; font-weight: bold;}
#offline{color: red; font-weight: bold;}
#online{color: #00ff00; font-weight: bold;}
#error{font-size: 1.2em; font-weight: bold; color: red;}
ol.la{list-style: lower-alpha;}
/*Pop In class*/
.popInWindow{
  color: black;
  z-index: 99997;
  background: rgba(0,0,0,.7);
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  pointer-events: none;
  transition: 1s opacity;
}
.popInWindow div{
  position: relative;
  z-index: 99999;
  padding: 20px;
  border-radius: 10px;
  margin: 0 auto;
  background: linear-gradient(white,grey);
}
.popInWindow #closeB{
  z-index: 99998;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
}
.popInWindow:target{
  opacity: 1;
  pointer-events: auto;
  transition: 1s opacity;
}
.popInWindow #close{
  color: black;
  font-weight: bold;
  text-decoration: none;
  background-color: red;
  border-radius: 10px;
  border: 5px groove red;
  text-align: center;
  position: absolute;
  top: 10px;
  right: 10px;
}
#joinPop div {
    width: 300px;
    height: 125px;
    margin: calc(50vh - 62.5px) auto;
}
#joinPop input {
  display: block;
  margin: 5px auto;
  width: 90%;
}
/* Friends list*/
#fList{
  text-align: left;
  padding: 5px;
  color: black;
  opacity: 0;
  position: absolute;
  top: 0px;
  left: 100%;
  background-color: white;
  pointer-events: none;
  border: 2px solid blue;
  border-radius: 7px;
  z-index: 99997;
}
#fList ul,
#fList ul li{
  list-style: none;
  padding: 0;
  text-indent: 0;
  margin: 0;
}
#friends{
  position: relative;
}
#friends h7{
  font-weight: bold;
}
#friends:hover #fList{
  opacity: 1;
}

/*sign up form*/
#joinForm{width: 375px; margin: 100px auto; line-height: 2.1em;}
#joinForm input{width: 100px; float: right;}
#joinForm input.overRight{float: right; height: 15px; width: 165px; margin: 2.5px 3px; padding: 0px 5px;}
#joinForm input.overRight:invalid{box-shadow: 0 0 3px 3px red;}
#joinForm::after{Content: 'Name must be at least 3 characters';}
#joinForm input.overRight:valid{box-shadow: 0 0 3px 3px green;}
#joinForm div{line-height: 110%; font-size: 0.7em; clear: right;}
/*force twitter formating*/
.twitter-timeline{margin-top: 2.5px; margin-bottom: 5px; height:500px;}
/*regions table*/
#regionsTable{background-color: #ffffff; border-radius: 20px; border: 6px inset #aaaabb; width: 95%; min-width: 500px; max-width: 800px; color: #000000; margin: 50px auto;}
#regionsTable tr.head{text-align: center; font-weight: bold; font-size: 2.0em;}
#regionsTable tr.titles{font-weight: bold;}
#regionsTable tr{background-color: #ccccdd; border: 0px solid #000000; padding: 3px; margin: 0px;}
#regionsTable tr.trAlt{background-color: #aaaabb;}
#regionsTable button{margin: 1px auto; display: block;}
#regionsTable td.center{text-align: center;}
#regionsTable table{width: 100%;}
/*currency exchange formatting*/
#currencyExchange {width: 100%; color: #000000; background-color: white; border: 2px inset #000000; border-collapse: collapse;}
#currencyExchange tr td{border-left: 3px inset #0000ff; padding: 4px;}
#currencyExchange th{text-align: center; border-bottom: 3px inset #0000ff;}
#currencyExchange td.start{border-left: 0px none;}
#currencyExchange tr.columnTitles{border-bottom: 3px inset #0000ff; text-align: center;}

#changePass{margin: 100px auto 0px auto; width: 500px; line-height: 1.5;}
#changePass input{float: right; margin: 0px;}

#currencyPurchase {margin: 100px auto 0px auto; width: 400px; line-height: 1.7em;}
#currencyPurchase input {float: right;}
#currencyPurchase span {clear: both; width: 100%; display: block; text-align: center; margin: 15px 0px;}
#orderCompleted{margin: 0 auto; background-color: #ffffff; color: #000000; border-collapse: collapse; border: 5px solid black; width: 500px; border-radius: 10px;}
#orderCompleted th{text-align: center;}
#orderCompleted tr{border: 1px solid black;}
#orderCompleted tr.altline{background-color: #444444;}

#ticketSubmit{width: 90%; min-width: 400px; max-width: 600px; margin: 50px auto 0 auto; color: white; line-height: 1.5;}
#ticketSubmit input{color: black; width: 240px; float: right; line-height: 1; margin: 0;}
#ticketSubmit select{color: black; width: 246px; float: right; line-height: 1; margin: 0;}
#ticketSubmit textarea{width: 100%; min-width: 400px; max-width: 600px; margin: 0 auto; height: 300px; color: black;}
#ticketSubmit input#submit{width: 100%;}

#ticketsTable{position: relative; margin: 20px auto; background-color: #ffffff; color: #000000; border: 5px inset #ccccff; min-width: 600px; width: 95%; border-radius: 15px;}
#ticketsTable td.heading{text-align: center; font-weight: bold; border: none;}
#ticketsTable table{width: 100%; border-spacing: 0px; margin: 0 auto;}
#ticketsTable td{border-bottom: 1px solid black; border-right: 1px solid black;}
#ticketsTable td.rightEdge{border-bottom: 1px solid black; border-right: 0px solid black;}
#ticketsTable td.rightEdgeLast{border-bottom: 0px solid black; border-right: 0px solid black;}
#ticketsTable td.last{border-bottom: 0px solid black; border-right: 1px solid black;}
#ticketsTable td#tickNum{width: 60px; text-align: center;}
#ticketsTable td#tickNum a{text-decoration: none;}
#ticketsTable td#tickType{width: 140px;}
#ticketsTable td#tickTime{width: 150px;}
#ticketsTable tr:hover{background-color: #ffff55;}

#readTickets {width: 98%; margin: 0 auto;}
#readTickets ul{clear: both; color: black; width: 100%; list-style: none; text-indent: none; padding: 0px;}
#readTickets ul li{float: left; border: 1px outset black; text-align: center; width: calc(20% - 4px); margin-right: 2px; background-color: #eeeeee; display: block; line-height: 1.2;}
#readTickets div#info{padding: 15px; border: 3px outset black; width: calc(100% - 37px); height: 200px; background-color: #eeeeee; display: block; color: black; clear: left; overflow-y: auto;}
#readTickets textarea{height: 150px;resize: none; clear: right; width: calc(100% - 40px); padding: 15px; display: block; border: 3px outset black; overflow-y: scroll;}
#readTickets select{font-size: .75em; padding: 0px;}
#readTickets input{font-size: .75em; padding: 0px;}
#replies{color: black; border: 3px outset black; width: calc(100% - 7px); overflow-y: scroll; height: 276px; background-color: white;}
#replies div.ticketData{padding: 15px; width: calc(100% - 30px); background-color: #f2f2ff; border-bottom: 1px solid black; border-top: 1px solid black;}
#replies div.ticketInfo{padding: 15px; width: calc(100% - 30px); background-color: white; min-height: 100px;}

.databaseDumps {
  border: 1px solid black;
  border-collapse: collapse;
}
.databaseDumps td,
.databaseDumps th {
  border: 1px solid black;
  padding: 0 0.5em;
}
