/*
███████  ██████  ███    ██
██      ██    ██ ████   ██
█████   ██    ██ ██ ██  ██
██      ██    ██ ██  ██ ██
██       ██████  ██   ████
*/


@font-face {
  font-family: "Ubuntu";
  src: url("../../_/fon/Ubuntu-Light.ttf");
  font-weight: 300;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../../_/fon/Ubuntu-Regular.ttf");
  font-weight: 400;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../../_/fon/Ubuntu-Medium.ttf");
  font-weight: 500;
}

@font-face {
  font-family: "Ubuntu";
  src: url("../../_/fon/Ubuntu-Bold.ttf");
  font-weight: 700;
}

/* @font-face {
  font-family: "yo";
  src: url("../../_/fon/AndaleMono.ttf");
  font-weight: 700;
} */

* {
  font-family: Ubuntu;
}





/*
██████   ██████
██   ██ ██
██████  ██   ███
██   ██ ██    ██
██████   ██████
*/



b > a {
  background-color:#eee;
  border:1px #ccc solid;
  border-radius:6px;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, .5);
}

.red {
  border: 2px red solid !important;
}

.cyan {
  border: 2px cyan solid !important;
}



.bg_0 { background-color: hsl(135, 80%, 75%); }
.bg_1 { background-color: hsl(315, 80%, 75%); }
.bg_2 { background-color: hsl(225, 80%, 75%); }
.bg_3 { background-color: hsl(45, 80%, 75%); }



.alfa22 {
  opacity: 0.22;
}

.hid {
  display: none;
}

.hiid {
  display: none !important;
}

.brr {
  height:22em;
  width:100%;
}

table {
  border-spacing : 0;
  border-collapse : collapse;
}

.plaTabl {
  margin-left:2em;
  margin-right:2em;
  color:#fff;
}

.plaTabl td {
  display:table-cell;
  margin-bottom:-1em;
  font-size:1em;
  cursor: pointer;
  text-shadow: 0px 0px 2px #000;
}

.gLink {
  position:absolute;
  top:-11px;
}

#menuPlanets {
  width:100%;
  background-color:#777;
  position:fixed;
  top:0px;
  box-shadow: 0px 0px 15px #000;
  padding:10px 0;
  border-bottom:#666 solid 1px;
  z-index:3333;
  display:flex;
}

#planetLine {
  width:50%;
  display: flex;
  justify-content: center;
}
.groupPlanetVisibility {
  width:45%;
  display: flex;
  justify-content: center;
  margin-top:12px;
}

#staticPlanetViz {
  display: flex;
  justify-content: center;
}


/*
██████  ██       █████  ███    ██ ███████ ████████ ██      ██ ███    ██ ███████
██   ██ ██      ██   ██ ████   ██ ██         ██    ██      ██ ████   ██ ██
██████  ██      ███████ ██ ██  ██ █████      ██    ██      ██ ██ ██  ██ █████
██      ██      ██   ██ ██  ██ ██ ██         ██    ██      ██ ██  ██ ██ ██
██      ███████ ██   ██ ██   ████ ███████    ██    ███████ ██ ██   ████ ███████
*/

#planetList {
  width: 228px;
  margin: 4px 0 9px 10px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}


.planetLine {
  height: 31px !important;
  display: flex;
  z-index: 1;
  position:relative;
}

.planetLine .front,
.planetLine .froont {
  height: 29px;
  position: absolute;
  content: '';
  display: block;
  z-index: 999;
}

.planetLine .front {
  width: 226px;
  border: 1px #666 solid;
  cursor: pointer;
  opacity: 0;
}

.planetLine .front:hover {
  opacity: 1;
}

.planetLine .froont {
  width: 0;
  border: 0px red solid;
}

.planetLine256 {
  display:flex;
}

.planetLineEnd {
  display:flex;
  margin-left:6px;
}

.pln {
  text-transform: capitalize;
  text-align: center;
  width: 45px;
  font-weight: 700;
  color: #333;
  font-size: 22px;
  padding-top:2px;
  user-select:none;
}

.shrt {
  width: 31px;
  color: #fff;
  border:1px solid #fff;
  font-size:22px;
  user-select:none;
}

.cnv {
  text-align: left;
}
.cnv svg{
  filter: drop-shadow(0px 0px 2px rgba(0, 0, 0, 0.5));
}
.cnvv {
  text-align: center !important;
}

#tagCloud {
  padding:12px 12px 0;
  display: flex;
  flex-wrap: wrap;
  margin: 20px auto 0;
  justify-content: center;
  color:#ddd;
  max-width:1200px;
}

#tagCloud a {
  text-decoration:none;
  color:#aaa;
  padding:5px;
  font-size:.8em;
  font-weight:900;
  font-style:normal;
}

#tagCloud a:hover {
  color:#444;
}

.listAll {
  cursor: pointer;
  display:none;
}
.listAll:hover {
  color:#555;
}

#tag1,
#tag2,
#tag3{
  font-size:55px;
  background-color:#777;
  box-shadow: 4px 4px 6px #000;
  text-shadow: 1px 1px 2px #000;
  padding: 5px 15px 12px;
  display:inline-block;
  margin:12px;
  border-radius:13px;
  color:#fff;
}
#confirmChangeTag p {
  font-size:33px;
}

#tagz {
  margin-left:10px;
  position:relative;
}

#activeLabel {
  display:none;
  float: left;
  width: 100%;
}

#activeLabel p {
  color: #000;
  font-size: 26px;
  margin: 15px 0 -17px;
  font-weight: 900;
}

#console {
  font-weight: 900;
  font-size: 14px;
  text-align: left;
  margin: 40px auto 0;
  position: relative;
  max-width:1200px;
}
#console h3 {
  text-align: center;
}
.cookieTable a {
  cursor: pointer;
  padding: 0 5px 0;
  display: block;
}
.cookieTable tr {
  color:#555;
}
.cookieTable .activ {
  color:#fff!important;
  background-color: #aaa;
}
.cookieTable tr:nth-child(odd) .activ {
  color:#fff!important;
  background-color: #999;
}
.cookieTable tr:hover .activ {
  background-color: #555;
}
.cookieTable tr:nth-child(odd) {
  background-color: #eee;
}
.cookieTable tr:hover {
  color:#fff;
  background-color: #555;
}
.cookieTable td{
  text-align:left;
  font-size: 1em;
  font-weight:900;
  margin: 0 10px 0;
}


#kilAll {
  text-align: center;
}

#kilAll h3 {
  text-align: center;
  color: #e00;
  margin-bottom: -10px;
}

#kilAll p {
  background-color: #f00;
  width: 46px;
  font-size: 38px;
  text-align: center;
  display: inline-block;
  color: #fff;
  cursor: pointer;
  border-radius: 25px;
  height: 44px;
}

#kilAll p:hover {
  background-color: #f00;
  color: #000;
}

#kilAll p:active,
#kilAll p:checked {
  background-color: #000;
  color: #f00;
}

#kilAll h6 {
  margin-top: 0;
}

h1 {
  float: left;
  font-size: 34px;
  font-weight: 300;
  color: #999;
  margin-bottom:0px;
  margin-top:75px;
}

h1 > a {
  float: right;
  font-weight: 900;
  color: #999;
  text-decoration:none;
  margin-right:15px;
}

h1 > a:hover {
  color: #333;
}

#tumbnails > h1 {
  width: 100%;
  text-align: center;
  margin: 10px;
  margin-top: 20px;
  border-top: 1px solid #ddd;
  padding-top: 10px;
}

.svgGroup > h1 {
  background-color: #eee;
}

h2 {
  float: left;
  font-size: 20px;
  font-weight: 100;
  margin: 0 10px;
  color: #ccc;
  text-align: center;
  letter-spacing: 10.7px;
}

h2.var {
  letter-spacing: 9px;
}

h3 {
  text-transform: capitalize;
  text-align: right;
}

h4 {
  margin:1em;
  text-align: center;
  font-size: 3em;
  font-weight: 300;
  color:#888;
}

h5 {
  margin:1em;
  text-align: center;
  font-size: 1em;
  font-weight: 600;
  color:#aaa;
  /* margin-top:2em; */
}

html {
  padding: 0;
  margin: 0;
}

td {
  text-align: center;
  padding: 0;
  font-size: 20px;
  font-weight: 500;
  margin-bottom: -5px;
  position: relative;
  bottom: 2px;
}



thead tr td {
  text-align: center;
  font-weight: bold;
}

body table {
  width: 100%;
}

body {
  margin: 0;
  padding: 0;
}

.clearBoth {
  clear: both;
  width: 100%;
  height: 2px;
  background-color: #fff;
}





/*
 ██  ██
████████
 ██  ██
████████
 ██  ██
*/

#social {
  position:absolute;
  left:10px;
  top:10px;
}

.socPng {
  width:45px;
  height:auto;
  opacity:20%;
  cursor: pointer;
}
.socPng:hover {
  opacity:60%;
}
.socPng:active {
  opacity:100%;
}

#slidr {
  display:flex;
  width:55px;
  background-color: #ccc;
  margin:0 5px 8px 15px;
  border-radius:3px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 3px 5px;
}
.slidBtn {
  width: 100%;
  background-color: #eee;
  color:#666;
  flex: 1;
  margin: 2px 0;
  font-size: 12px;
  border:0;
  cursor: pointer;
  border-radius:3px;
  user-select: none;
}
.slidBtn:hover,
.slidBtn:active {
  background-color: #666;
  color:#fff;
}

#hideAtBoot{
  display:none;
}

#casParticulier{
  margin-top:1em;
  margin-bottom:0px;
}

#header {
  width: 140px;
  margin: 30px;
  position: absolute;
  top: 0;
  display:none;
}

#containerLogo {
  transform: scale(0.7);
  margin: -30px;
  float: left;
}

#ultraContainer {
  width: 100%;
  text-align: center;
}

#containerBig {
  margin: 0 auto 20px;
  width: 777px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#subGroup {
  display: inline-flex;
  position:relative;
}

h1.huge {
  font-size: 111px;
  margin: 20px 0;
  color: #ddd;
  letter-spacing: 4px;
}



#containerMap {
  float: left;
  position: relative;
}

.buu {
  background-color: #fff;
  width: 18px;
  height: 18px;
  margin: 0 14px 0 22px;
  position: relative;
  bottom: -2px;
  border: 2px solid #ccc;
  border-radius: 11px;
}

.pu {
  background-color: #888;
  width: 14px;
  height: 14px;
  margin: 2px;
  border-radius: 7px;
}

#dtBox {
  margin-left: 8px;
  margin-right: 8px;
}


/* -------------------------------------- */
/* -------------------------------------- */
/* -------------------------------------- */



#dtBoox {
  display:flex;
  height:315px;
}
#selectDate {
  display:flex;
  flex-direction: column;
  justify-content:space-between;
}
.selDate {
  display:flex;
  position:relative;
}
.dropTabDiv {
  background-color:#888;
  display:none;
  box-shadow: 0px 0px 22px rgba(0, 0, 0, .7);
  z-index:99;
  position:absolute;
  top:0;
  right:-30px;
  border-radius:3px;
}
.dropTabDiv.grid {
  display:grid;
}
.dropTab {
  background-color:#eee;
  width:auto;
  border-radius:0 0 3px 3px;
}
.dropTab td {
  padding:7px;
  cursor: pointer;
  font-size:30px;
}
.dropTit {
  display:flex;
  justify-content:space-between;
}
.dropTit h2 {
  color:#fff;
  letter-spacing:0;
  margin:5px 7px;
  font-weight:500;
  font-size:1.5em;
}
.dropTitOne {
}
.dropTitTwo {
  cursor: pointer;
}
.dropTitTwo:hover {
  color:#333;
}
.ddd {
  color:#666;
  margin:0;
  font-weight:600;
  display:flex;
}


.d1,.d2 {
  height:45px;
  cursor: pointer;
}

.d1 {
  font-size:18px;
  background-color:#eee;
  width:45px;
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  justify-content:center;
  border-radius: 3px 0 0 3px;
  user-select:none;
}
.d1:hover {
  background-color:#666;
  color:#fff;
}

.d2 {
  font-size:22px;
  background-color:#999;
  color:#fff;
  width:45px;
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  justify-content:center;
  border-radius: 0 3px 3px 0;
  user-select: none;
}
.d2:hover {
  background-color:#666;
}

.dropTab td:hover {
  background-color:#666;
  color:#fff;
  box-shadow: 6px 6px 12px rgba(0, 0, 0, .5);
}

#showTime {
  background-color:#fff;
  font-size:28px;
  font-weight:500;
  color:#999;
  text-align:center;
  display:flex;
  justify-content:space-between;
  margin:-5px 12% 0 12%;
  width:76%;
}




/* -------------------------------------- */
/* -------------------------------------- */
/* -------------------------------------- */




#listStored {
  width: 200px;
  text-align: right;
  margin: 30px;
  position: absolute;
  top: 0;
  right: 0;
}

#export {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 60px auto;
  width: 777px;
  text-align: justify;
}

#export h3 {
  margin: 0 20px 0;
  color: #888;
  z-index: 777;
  text-align: center;
}

#export p {
  margin: 0 20px -5px;
  color: #999;
  z-index: 777;
  text-align: center;
  font-size: 15px;
}

#imporTubs {
  display: none;
}

.buk {
  text-align: center;
  border-radius: 3px;
  border: 0;
  margin: 20px 20px 0;
  font-size: 21px;
  font-weight: 500;
  color: #999;
  padding: 5px 11px 0;
  height: 33px;
  float: left;
  background-color: #eee;
  cursor: pointer;
}

.buk:hover {
  background-color: #999;
  color: #fff;
}

.buk:active,
.buk:checked {
  background-color: #777;
  color: #fff;
}

label {
  float: left;
  font-size: 1.2em;
}

form {
  float: left;
}

.bu {
  text-align: center;
  border-radius: 0;
  border: 0;
  margin: 20px;
  margin-left: 12px;
  font-size: 21px;
  font-weight: 500;
  color: #999;
  padding: 5px 11px 0;
  height: 33px;
  background-color: #eee;
  cursor: pointer;
  border-radius:3px;
  user-select:none;
}

.bu:hover {
  background-color: #888;
  color: #fff;
}

.bu:active,
.bu:checked {
  background-color: #777;
  color: #fff;
}

.svgGroupMain {
  width:320px;
  margin-right:5px;
  margin-left:-3px;
}

.subGroupSvg {
  display: flex;
}

.buhuLine {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.buhuLine > .buhu {
  margin:5px 11px;
}

.buhu {
  text-align: center;
  border-radius: 3px;
  border: 0;
  margin: 0 6px;
  font-size: 15px;
  font-weight: 500;
  padding: 5px 11px 0;
  height: 23px;
  float: left;
  cursor: pointer;
  background-color: #999;
  color: #fff;
  user-select:none;
}

.buhu:hover {
  background-color: #666;
}

.buhu:active,
.buhu:checked {
  background-color: #777;
  color: #fff;
}


/*
████████ ██    ██ ███    ███ ██████
   ██    ██    ██ ████  ████ ██   ██
   ██    ██    ██ ██ ████ ██ ██████
   ██    ██    ██ ██  ██  ██ ██   ██
   ██     ██████  ██      ██ ██████
*/


#tumbnails {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 20px auto;
}

#tumbnails div {
  width: 115px;
  height: 150px;
  text-align: center;
  border: 1px solid #fff;
  padding: 0;
}

#tumbnails .bg {
  background-color: #efefef;
}

#tumbnails div svg {
  transform: scale(.3);
  float: left;
  margin: -111px;
  border: 2px solid #fff;
  border: 8px #fff solid;
  margin-bottom: -121px;
}

#tagz .atub svg {
  transform: scale(.26);
  float: left;
  margin: -118px;
  border: 2px solid #fff;
  border: 8px #fff solid;
  margin-bottom: -121px;
}

.atubScreen {
  width:100px;
  height:100px;
  background-color:red;
  position:absolute;
  z-index:9;
  cursor: pointer;
  opacity:0;
}

#tumbnails .activ svg {
  border-color: #666;
}

.onof {
  position:absolute;
  right:-5px;
  bottom:-5px;
  font-size:1em;
  background-color:#fff;
  border:1px #ddd solid;
  border-radius:3px;
  height:15px;
  width:15px;
  cursor: pointer;
}
.onof.of {
  background-color:#eee;
  border-color:#eee;
}
.bg:has(> .of) > a > svg {
  opacity:0;
}
.bg:has(> .of) {
  background-color:#fff !important;
}
.kro.of {
  /* display:none; */
  opacity:0;
}
.onofAll,
.onofNone {
  font-size:1em;
  font-weight:900;
  cursor: pointer;
  color:#999;
}
.onofAll:hover,
.onofNone:hover {
  color:#333;
}
.onofAll:active,
.onofNone:active {
  color:#999;
}

svg .onof.of {
  display:none;
}







.krono {
  width: 100% !important;
  /* height: 100px !important; */
  position:relative;
  background-color:#f2f2f2;
  margin-bottom:5px;
}
.kronTop {
  width: 100% !important;
  height: 20px !important;
  position:absolute;
  top:-2.1em;
  text-align:right;
}
.kronTopLk {
  font-weight:400;
  font-size:1.2em;
  color:#bbb;
  text-decoration:none;
  cursor: pointer;
  margin: 4px 8px 4px 0 !important;
}
.kronTopLk:hover {
  color:#666;
}
.kronTopLk.accent {
  color:#666;
  cursor: default;
}
.kronBot {
  /* width: 100% !important; */
  position:absolute;
  top:0em;
  z-index:7;
  display:contents;
}
.kronCen {
  /* width: 100% !important; */
  height: 20px !important;
  position:absolute;
  top:-.1em;
  background-color:#fafafa;
  display:contents;
}
.kronCen p {
  position:absolute;
  font-weight:900;
  font-size:.9em;
  color:#bbb;
}
.kro,
.kroo {
  width:12px;
  border-radius:3px;
}
.kro {
  margin-top:0px;
  position:absolute;
  cursor: pointer;
}
.kroo {
  border:1px solid #666;
}
.kro.hover,
.kro:hover{
  box-shadow: 3px 3px 7px #000;
  z-index:3;
  opacity:1;
}

.kroBg {
  display:block;
  padding-left:60px;
  margin-top:20px;
}
.kroBgg {
  display:block;
  width:100%;
}

.kbg_0 { background-color: hsl(135, 70%, 85%); }
.kbg_1 { background-color: hsl(315, 70%, 85%); }
.kbg_2 { background-color: hsl(225, 70%, 85%); }
.kbg_3 { background-color: hsl(45, 70%, 85%); }

.bg__0 { background-color: hsl(135, 100%, 65%); }
.bg__1 { background-color: hsl(315, 100%, 65%); }
.bg__2 { background-color: hsl(225, 100%, 65%); }
.bg__3 { background-color: hsl(45, 100%, 65%); }

.kroMx {
  position:absolute;
  top:20px;
  left:0px;
  cursor: pointer;
}
.kroMxx {
  display:flex;
}
.kroMxxx {
  display:flex;
  z-index:3;
  opacity:.4;
}
.kroMxxx:hover{
  box-shadow: 3px 3px 7px #000;
  z-index:7;
  opacity:1;
}
.kroMxxx:active{
  box-shadow: 0 0 0 #000;
}


.svgGroup {
  transform-origin: top center;
  width: auto !important;
  border: 0px !important;
  display: flex;
  flex-direction: column;
  position:relative;
}

.svgGroup .bg {
  background-color:#eee;
  width:100px;
  height: 150px;
  margin-top: 4px;
  margin-right: 8px;
  margin-bottom: 4px;
  text-align:left;
  font-size:.66em;
  font-weight:900;
  color:#666;
  float:left;
  border:1px solid #eee;
  position:relative;
  border-radius:3px;
}
.svgGroup .bg.hover,
.svgGroup .bg:hover {
  box-shadow: 2px 2px 5px #000;
  border:1px solid #bbb;
}

.svgGroup p {
  margin: 4px;
  display: inline-block;
  line-height:1.1;
}

/* --------------------------------------- */


.ediTag {
  position:absolute;
  top:71px;
  left:0;
  z-index: 2222;
  width:98%;
  background-color:#888;
  box-shadow: 2px 2px 5px #000;
  border-radius:3px;
  padding:3px;
  display:flex;
  align-items:center;
}

.ediStart {
  font-size:.5em;
  font-weight:900;
  color:#fff;
  padding-left:15px;
  cursor: pointer;
  z-index:1111;
  position:relative;
}
.ediStart:hover {
  color:#999;
}

.ediTx {
  border: 0;
  height:54px;
  background-color:#fff;
  border-radius:3px;
  font-size:1.2em;
  padding-left:10px;
  color:#555;
  font-weight:900;
  outline: none;
  width:50%;
}

.ediTx:focus {
  outline: none;
}

.ediBu {
  font-size:1.1em;
  font-weight:900;
  color:#fff;
  padding:0 20px;
  cursor: pointer;
}
.ediBu:hover {
  color:#444;
}

.kilSave {
  display:flex;
  justify-content:space-between;
  width:100%;
}

/* --------------------------------------- */

.G_sub {
  float:left;
}

.shado {
  filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.5));
  cursor: pointer;
}

#tumbnails p {
  text-decoration: none;
  color: #999;
  font-weight: 900;
  font-size: 10px;
  display: inline-block;
  user-select: none;
}

#tumbnails a:hover {
  color: #555;
}


/*
███████  ██████  ██████  ███    ███
██      ██    ██ ██   ██ ████  ████
█████   ██    ██ ██████  ██ ████ ██
██      ██    ██ ██   ██ ██  ██  ██
██       ██████  ██   ██ ██      ██
*/


div#containForm {
  /* margin: 0 20px; */
  margin: 0 auto;
  max-width:900px;
}

#inputform {
  margin-bottom: 30px;
  width: 80%;
  justify-content: center;
  display: flex;
  flex-wrap: wrap;
}

.inTx {
  border: 1px dotted #bbb;
  background-color: #f9f9f9;
  padding: 4px 0;
  color: #777;
  font-size: 1.3em;
  font-weight: 900;
  text-align: center;
  border-radius:3px;
  margin-bottom: 10px;
  width:80%;
}

.inTx:focus {
  border: 1px #777 solid;
  outline: none;
}

.inTx::placeholder {
  color: #ccc;
  font-weight: 900;
}

#inTx34 {
  display:flex;
  width: 80%;
}
#inTx3,
#inTx4 {
  background-repeat: no-repeat;
  background-size:contain;

}
#inTx3 {
  margin-right:5px;
  background-position-x: right;
}
#inTx4 {
  margin-left:5px;
  background-position-x: left;
}
#inTx3.on,
#inTx4.on {
  background-image: url('check_yes_177_777.png');
}
#inTx3.of,
#inTx4.of {
  background-image: url('check_not_177_ccc.png');
}

#buForm {
  display:flex;
  justify-content:center;
}

#txForm {
  justify-content: center;
  display: flex;
  width: auto;
  flex-direction: column;
  align-items: center;
}

.hlp,
.hlp:active {
  font-size:1.3em;
  font-weight:600;
  color:#666;
  background-color:#eee;
  height:24px;
  width:45px;
  text-align:center;
  margin:3px 3px 0;
  border-radius:30px;
  padding-top:2px;
  border:1px dotted #aaa;
  cursor: pointer;
}

.hlp:hover{
  color:#eee;
  background-color:#333;
  /* box-shadow: 4px 4px 6px #000; */
  border:1px dotted #000;
}
#helpForm{
  width: 100%;
  display: flex;
  justify-content: center;
}
.helpForm{
  position: absolute;
  top: 290px;
  z-index: 999;
  background-color: #fff;
  border:1px dotted #666;
  border-radius: 3px;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  box-shadow: 12px 12px 24px #000000cc;
  width:78%;
}
.helpFormSub{
  text-align: center;
  font-size: 1.4em;
  margin: 0;
  padding: 30px;
  border-radius: 5px;
  color: #444;
  width:33%;
}
.helpFormSub > b{
  font-size: 1.2em;
  margin:0;
  display: block;
}
.helpFormSub > i{
  font-size: 1em;
  font-weight:900;
  color:#aaa;
  font-style:normal;
}
.hlpClose{
  /* font-family: yo; */
  color:#fff;
  position: absolute;
  margin:0;
  top:3px;
  right:3px;
  font-size: 1.2em;
  background-color: #444;
  padding: 0 5px 0;
  border-radius: 3px;
  font-weight:900;
  cursor: pointer;
}
.hlpClose:hover{
  background-color: #aaa;
  color:#333;
}

/*
██████  ██  ██████
██   ██ ██ ██
██████  ██ ██   ███
██   ██ ██ ██    ██
██   ██ ██  ██████
*/


#righter {
  width: 100%;
  display: flex;
  justify-content: center;
  display:none;
}

#righter div {
  width: 68px;
  height: 34px;
  display: flex;
}

#righter p {
  float: right;
}

#righter img {
  padding: 3px;
  border: 2px #fff solid;
  cursor: pointer;
  background-color: #fff;
}

#righter img:hover {
  background-color: #eee;
}

#righter .on {
  border: 2px #bbb solid;
}


/*
██   ██ ███████ ██      ██████
██   ██ ██      ██      ██   ██
███████ █████   ██      ██████
██   ██ ██      ██      ██
██   ██ ███████ ███████ ██
*/


#helper {
  position: fixed;
  top: 0px;
  right: 0px;
  width: 100%;
  height:150px;
  font-size: 13px;
  text-align: justify;
  color: #555;
  background-color:#fff;
  z-index:999;
  display:none;
}

#helper b {
  color: #555;
}

#helper p {
  text-align: justify;
  text-align: left;
  font-size: 17px;
  font-weight: 300;
  padding:0 20px;
}
#helper h3 {
  text-align: left;
  font-size: 17px;
  font-weight: 600;
  padding:0 20px;
}

#buHelp {
  background-color: #fff;
  width: 40px;
  height: 40px;
  font-size: 34px;
  text-align: center;
  border-radius: 21px;
  position: fixed;
  top: 6px;
  left: 6px;
  color: #888;
  border: 1px solid #eee;
  cursor: pointer;
  margin: 0;
  display:none;
}

#buHelp:hover,
#buHelp.helpActivated {
  background-color: #999;
  color: #fff;
  border-color: #999;
}

#buHelp:checked,
#buHelp:active {
  background-color: #666;
  color: #fff;
}

.helpedElement {
  box-shadow: 4px 4px 9px rgba(0, 0, 0, .5);
  z-index: 999;
}

.smalHelp {
  width:100%;
  height:100px;
  background-color: orange;
}


/*
 ██████  ██████  ███    ██ ███████ ██ ██████  ███    ███
██      ██    ██ ████   ██ ██      ██ ██   ██ ████  ████
██      ██    ██ ██ ██  ██ █████   ██ ██████  ██ ████ ██
██      ██    ██ ██  ██ ██ ██      ██ ██   ██ ██  ██  ██
 ██████  ██████  ██   ████ ██      ██ ██   ██ ██      ██
*/

.confirm {
  width: 100%;
  height: 100%;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
}
.confirm p {
  font-size: 44px;
  color: #fff;
  text-align: center;
  margin: 0;
  padding: 20px;
}
.confirm b {
  font-size: 66px;
  font-weight: 300;
}
.buj {
  text-align: center;
  margin: 30px;
  font-size: 41px;
  font-weight: 500;
  color: #999;
  padding: 30px 0px;
  width: 110px;
  height:47px;
  background-color: #fff;
  cursor: pointer;
  border-radius:73px;
}
.buj:hover {
  color: #fff;
  background-color: #999;
}
.buj:active,
.buj:checked {
  color: #fff;
  background-color: #777;
}














/* ================================================================================ */
/* ================================================================================ */
/* ================================================================================ */
/*
 █████   ██████   ██████
██   ██ ██  ████ ██  ████
 ██████ ██ ██ ██ ██ ██ ██
     ██ ████  ██ ████  ██
 █████   ██████   ██████
*/
/* ================================================================================ */
/* ================================================================================ */
/* ================================================================================ */











@media screen and (max-width: 900px) {

  .helpForm{
    width:80%;
    top:477px;
  }

  .hlp{
    margin:8px 5px 0;
  }

  .helpFormSub{
    font-size: 1.3em;
    padding: 30px 0;
    width:auto;
  }
  .helpFormSub > b{
    font-size: 1em;
  }
  .helpFormSub > i{
    font-size: .9em;
  }

  .cookieTable a {
    padding: 0 11px 0;
  }

  .gLink {
    top:-77px;
  }

  #tagCloud {
    font-size:1.3em;
  }

  .ediTag{
    top:50px;
    width:98%;
  }

  #inTx3.on,
  #inTx4.on {
    background-image: url('check_yes_122_777.png');
  }
  #inTx3.of,
  #inTx4.of {
    background-image: url('check_not_122_ccc.png');
  }

  .onofAll,
  .onofNone {
    font-size:1.5em;
  }

  .svgGroupMain {
    transform: scale(0.75);
    transform-origin: top left;
    margin-right:-80px
  }

  #menuPlanets {
    display:flex;
    flex-direction:column;
  }
  #planetLine {
    /* width:80%; */
    width:100%;
  }
  .plaTabl {
    margin: 0 3em;
  }
  .groupPlanetVisibility {
    /* width:80%; */
    width:100%;
    /* justify-content:space-around; */
  }
  .scrolTo{
    /* right:40px;
    top:17px; */
  }
  .scrolTo a {
    font-size:2em;
  }

  .a1,.a2 {
    text-align:center;
  }

  #showTime {
    flex-direction:column;
    align-items:center;
    margin-top: 10px;
    margin-bottom: -20px;
  }

  #export {
    width: 100%;
  }

  #confirmDelete p {
    font-size: 33px;
    padding: 20px;
  }

  #confirmDelete b {
    font-size: 66px;
  }

  /* .buj {
    margin: 30px;
    font-size: 33px;
    padding: 30px 0px;
    width: 110px;
  } */

  .svgGroup .bg {
    transform: scale(.75);
    transform-origin: top center;
    margin-right: -20px;
    margin-bottom: -36px;
    font-size:.77em;
  }


  /* - - - - - - - - - - - - - - - - - - - - - - - */
  /* next 5 groups concerned about showing #header */


  #righter {
    margin: 0;
  }

  #header {
    margin-top: 120px;
    display: none; /*kill this to see header */
  }

  h1.huge {
    font-size: 43px;
    text-align: center;
    float: none;
    margin: 10px;
  }

  #righter {
    display: none; /*kill this to see original header */
  }

  .dtpicker-header {
    margin: -10px 0 10px;
  }


  /* last 5 groups concerned about showing #header */
  /* - - - - - - - - - - - - - - - - - - - - - - - */


  .dtpicker-components {
    position:relative;
    top:0px;
  }

  .dtpicker-components .dtpicker-comp {
    margin: 7px 0;
  }

  .dtpicker-bg {
    float: left;
  }

  .px360 {
    width: 360px;
  }

  .inTx {
    height: 35px;
    font-size: 17px;
  }

  #txForm {
    width: 100%;
  }

  #buForm {
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
  }

  .bu {
    padding: 12px 12px 0;
    margin: 10px;
    height: 34px;
    font-size: 18px;
  }

  .cnv {
    margin-right: 6px;
  }

  #containerMap {
    margin-top: 0px;
    width: 100%;
  }

  h1 {
    margin-top: 55px;
  }

  h2.var {
    margin-bottom: 95px;
  }

  #containerBig {
    width: auto;
    margin-bottom:0;
  }

  div#subGroup {
    transform: scale(0.8);
    margin: -20px 0;
  }

  form {
    display: inline-block;
    float: none;
    margin-top: 30px;
  }

  #inputform {
    margin-top: 30px;
    margin-bottom: 20px;
  }

  #planetList {
    width: 230px;
    margin-left:0;
  }

  #tumbnails {
    margin: 0px;
  }

  #tumbnails div {
    width: 115px;
    display: grid;
    transform: scale(.7);
    margin: -22px -17px;
  }
  #slidr {
    margin-right:0;
  }

  div#containForm {
    margin: 0;
  }

  #console {
    font-size: 12px;
  }

  #console a {
    line-height: 33px;
  }

  #console a:hover::before,
  #console .activ::before {
    margin-top: -.3em;
  }

  #tagCloud {
    line-height: 2;
}
}