﻿@charset "UTF-8";
/*
    Traveling Frog Web Styles (C)
*/
/**************************************************************************************************     Generic primitives */
body {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1200px;
  background-color: #FDF4E8;
}
a:link {
  color: #1E8C00;
  text-decoration: none;
}
a:visited {
  color: #1E8C00;
  text-decoration: none;
}
a:hover {
  color: #DD0000;
  text-decoration: underline;
}
h1,
h2,
h3,
h4 {
  font-family: Oswald, sans-serif;
  font-weight: normal;
  text-transform: none;
  color: #a85706;
}
p {
  margin: 0;
  padding-bottom: 0.5em;
  text-indent: 1.5em;
  font: normal 11.5pt 'Open Sans', sans-serif;
  text-align: justify;
}
ul {
  list-style: none;
  clear: both;
  font: normal 10pt 'Open Sans', sans-serif;
}
ul li p {
  text-indent: 0;
}
ul.dialog > li {
  padding-bottom: 0.3em;
}
ul.dialog > li:before {
  content: "—";
  margin-right: 0.5em;
  font: inherit !important;
}
ul.bullet > li {
  background: url('/images/bullet_sq.png') left 0.6em no-repeat;
  margin-bottom: 0.7em;
  padding-left: 1em;
}
ul.bullet > li:before {
  background: url('/images/bullet_sq.png') 0px 0.4em no-repeat;
}
ul.bullet > li > i {
  font-size: 80%;
  margin-right: 6px;
  color: #666;
}
figure {
  display: table;
  clear: both;
  padding: 10px;
  margin: 2em auto 4em auto;
  background-color: white;
  border: solid 1px #ccc;
  position: relative;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
}
figure:before,
figure:after {
  content: "";
  position: absolute;
  z-index: -2;
}
figure > img {
  height: auto;
  display: table-row;
  margin: 0 auto;
  width: 100%;
  max-width: 800px;
}
figure figcaption {
  display: table-caption;
  caption-side: bottom;
}
figure > figcaption,
div.caption {
  text-align: center;
  padding: 0.5em 0 0 0;
}
figure > figcaption > h3,
div.caption > h3 {
  font: normal 12.5pt 'Oswald', sans-serif;
  letter-spacing: 1px;
  margin: 0 auto;
  width: 80%;
  color: #444;
}
figure > figcaption > h4,
div.caption > h4 {
  font: normal 10.5pt 'Cuprum', sans-serif;
  margin: 0.25em auto 0.75em auto;
  width: 80%;
  color: #444;
}
figure > figcaption > p,
div.caption > p {
  font-size: 9pt;
  line-height: 14pt;
  text-indent: 0;
  text-align: center;
  letter-spacing: 1px;
  margin: 0.5em auto 0.75em auto;
  width: 80%;
  color: #666;
}
section {
  display: block;
  clear: both;
  margin: 2em 0 3em 0;
  overflow: auto;
}
section > h2 {
  font: normal 17pt 'Oswald', sans-serif;
  font-variant: small-caps;
  text-align: left;
  letter-spacing: 3px;
  padding: 0;
  margin: 0.25em 0 0.75em 0;
}
section > h3 {
  font: normal 11pt Cuprum, sans-serif;
  letter-spacing: 1px;
  text-align: left;
  padding: 0;
  margin: 0.25em 0 1em 0;
  color: #444;
}
section > div.epigraph {
  display: block;
  margin: 0 0em 4em auto;
  color: #854500;
  width: 40%;
}
section > div.epigraph a {
  white-space: nowrap;
}
section > div.epigraph p {
  font-style: italic;
  font-size: 90%;
}
section .google-map {
  float: left;
  margin: 0 2em 1em 0;
}
section img.map {
  /*raster map image*/
  float: right;
  clear: both;
  padding: 0.25em;
  margin: 0 0 1em 2em;
  border: #888 1px solid;
}
section figure.map {
  display: table;
  clear: both;
  padding: 10px;
  margin: 2em auto;
  background-color: white;
  border: solid 1px #ccc;
  position: relative;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
}
section figure.map:before,
section figure.map:after {
  content: "";
  position: absolute;
  z-index: -2;
}
section figure.map.float-left {
  float: left;
  margin: 1em 2em 1em 1.5em;
}
section figure.map > img {
  display: table-row;
  margin: 0 auto;
  width: 100%;
  /*border: solid 1px @color-border-default;*/
}
section p {
  margin: 0.25em 1.5em 1em 1.5em;
}
section ul {
  margin: 0 0 2em 3em;
}
section div.references {
  margin: 0.25em 1.5em 0 4em;
}
section div.references h2 {
  font-size: 90%;
}
section div.references ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  gap: 2px 14px;
  /* row-gap column gap */
  font-size: 80%;
}
/**************************************************************************************************     ELEMENTS */
.draft {
  color: #DD0000;
}
a.up {
  display: inline-block;
  float: right;
  width: 20px;
  height: 20px;
  background: url(/images/nav-up.png) center center no-repeat;
}
div.article-dates {
  display: flex;
  justify-content: flex-end;
  font: italic 10pt Cuprum;
  letter-spacing: 1px;
  text-align: right;
  margin-bottom: 3em;
  color: #666;
}
div.article-dates span {
  margin-left: 1em;
}
div.article-dates span:after {
  content: ';';
}
div.article-dates .created:before {
  content: 'Записано: ';
}
div.article-dates .modified:before {
  content: 'Обновлено: ';
}
div.article-dates .published:before {
  content: 'Опубликовано: ';
}
div.axis {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-end;
  margin: 20px auto 10px auto;
}
div.axis a.nav {
  position: relative;
  font: normal 11pt cuprum, 'Roboto condensed', arial;
  padding: 3px;
}
div.axis a.nav:after {
  content: '';
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
}
div.axis a.nav:hover {
  text-decoration: none;
  color: #1E8C00;
}
div.axis a.nav.prev {
  margin-right: 10px;
  background: linear-gradient(270deg, #FDF4E8 40%, #E5C9AA 95%);
  margin-right: auto;
}
div.axis a.nav.prev:after {
  left: -9px;
  border-right: 10px solid #E5C9AA;
}
div.axis a.nav.next {
  margin-left: 10px;
  background: linear-gradient(90deg, #FDF4E8 40%, #E5C9AA 95%);
}
div.axis a.nav.next:after {
  right: -9px;
  border-left: 10px solid #E5C9AA;
}
div.axis a.nav.next:hover {
  background: linear-gradient(90deg, #FDF4E8 40%, #FF901F 95%);
}
div.axis a.nav.next:hover:after {
  border-left: 10px solid #FF901F;
}
div.axis a.nav .subtitle {
  font: italic 85% Cuprum, 'Roboto condensed', Verdana !important;
  color: #666;
  clear: both;
  display: block;
  padding: 3px 0 0 10px;
  letter-spacing: 1px;
}
div.axis.continue {
  justify-content: flex-end;
}
div.axis.continue a.nav:before {
  content: "Читать дальше: ";
}
div.breadcrumbs {
  display: flex;
  font: normal 10pt 'Cuprum', 'Century Gothic', 'Helvetica Neue', 'Times New Roman';
  letter-spacing: 3px;
  text-transform: uppercase;
}
div.breadcrumbs > .crumb {
  margin-right: 10px;
  border-bottom: solid 2px transparent;
}
div.breadcrumbs > a:hover {
  text-decoration: none;
  border-bottom: solid 2px #E5C9AA;
}
div.google-map {
  display: inline-block;
}
div.google-map > a.index {
  display: block;
  text-align: right;
  font: normal 9pt verdana;
  letter-spacing: 1px;
}
div.google-map > div.scene {
  margin: 0 auto;
  position: relative;
  width: 280px;
  height: 200px;
  border: solid 1px #888;
}
div.google-map > div.scene .map-info-window {
  width: 280px;
  font-family: 'Open Sans', sans-serif;
}
div.google-map > div.scene .map-info-window img {
  padding: 2px 10px 4px 0;
  max-width: 150px;
  float: left;
}
div.google-map > div.scene .map-info-window h2 {
  display: block;
  font: normal 12pt 'Oswald', sans-serif;
  letter-spacing: 2px;
  padding: 0;
  margin: 0 0 0.25em 0;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
div.google-map > div.scene .map-info-window h3 {
  display: block;
  font: normal 10pt Cuprum, sans-serif;
  letter-spacing: 1px;
  padding: 0;
  margin: 0.25em 0;
}
div.google-map > div.scene .map-info-window > span {
  display: block;
  clear: both;
}
div.google-map > div.scene .map-info-window a.open {
  display: block;
  clear: both;
  margin-top: 0.25em;
  text-align: right;
}
div.google-map div.pin {
  display: none;
}
.map-index {
  flex-basis: 100%;
  margin: 2em 1em 1em 0em;
}
.map-index div.google-map {
  float: none;
  display: block;
  margin: 0 auto;
  width: 99%;
}
.map-index div.google-map > div.scene {
  position: relative;
  margin: 0 auto;
  width: 100%;
  min-width: 640px;
  min-height: 480px;
}
.map-index div.google-map div.pin {
  display: none;
  /*display: inline-block;
			border: dotted 1px #a00;
			font: normal 9pt Verdana !important;*/
  /*			&:before {
				content: attr(title) ' to ' attr(url);
			}*/
}
div.references {
  display: block;
  clear: both;
  margin-top: 3em;
}
div.references h2 {
  font: normal 13pt 'Oswald', sans-serif;
  font-variant: small-caps;
  letter-spacing: 3px;
  margin: 0;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
div.references ul {
  font: normal 10pt 'Open Sans', sans-serif;
  padding: 0;
  margin: 0.5em 0 1em 2em;
}
div.references ul li {
  background: url('/images/bullet_sq.png') 0px 7px no-repeat;
  padding-bottom: 0.3em;
  padding-left: 1em;
}
#menu {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
  gap: 2px 14px;
  /* row-gap column gap */
  max-width: 860px;
  padding: 0;
  margin: 0 auto 2em auto;
  margin: 6em 1.5em 0 0;
}
#menu a {
  font: normal 11pt Cuprum, sans-serif;
  letter-spacing: 5px;
  text-transform: uppercase;
  text-decoration: none;
  color: #444;
  cursor: pointer;
  padding: 0;
  margin: 0;
  outline: none;
  border-bottom: solid 2px transparent;
}
#menu a:hover {
  color: #FF901F;
  border-bottom: solid 2px #e5c9aa;
}
table#header {
  border-collapse: collapse;
  margin: 0 auto;
  width: 1054px;
}
table#header h2 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  display: block;
  position: absolute;
  top: 10px;
  left: 10px;
  letter-spacing: 5px;
  margin: 0 !important;
}
table#header div.navigation-bar {
  display: block;
  position: relative;
  float: right;
  top: 2em;
  right: 2em;
}
div#bread-crums {
  display: none;
  position: absolute;
  bottom: 0;
  right: 0;
}
div#footer {
  display: block;
  margin: auto 6em;
  padding: 1em 0;
  text-align: center;
  color: #a85706;
  font: italic 10pt Arial;
  letter-spacing: 2px;
}
div#toc {
  float: right;
  min-width: 240px;
  max-width: 20%;
  margin: 0 0 1em 1em;
}
div#toc h2 {
  font: normal 12pt 'Oswald', sans-serif;
  font-variant: small-caps;
  letter-spacing: 3px;
  margin: 0 0 0.5em 0;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
div#toc div {
  display: flex;
  flex-flow: column wrap;
  margin-left: 0.75em;
  padding-left: 0.75em;
  border-left: 1px solid #E5C9AA;
}
div#toc div > a {
  font: normal 10pt 'Roboto condensed', Verdana;
  letter-spacing: 1px;
  padding: 0 0 0.25em 1em;
  background: url(/images/bullet_sq.png) left 5px no-repeat;
}
div#social-bar {
  position: absolute;
  bottom: 8px;
  right: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  clear: both;
  padding: 0 0.25em;
}
div#social-bar a {
  font: normal 11pt Cuprum;
  letter-spacing: 1px;
  line-height: 28px;
  height: 24px;
  margin: 0 0 0 0.75em;
  padding-left: 28px;
}
div#social-bar a.ref-lj {
  background: url('/images/lj_24.png') left center no-repeat;
}
div#social-bar a.ref-fb {
  background: url('/images/fb_24.png') left center no-repeat;
}
div#social-bar .fb-like {
  margin-top: 8px;
}
/**************************************************************************************************     PAGE LAYOUT */
div#page {
  max-width: 860px;
  background-color: #f9f4ec !important;
  background: url(/images/frogg_05.png) no-repeat bottom right;
  margin: 1em auto;
  padding: 1em 3em 14em 3em;
  overflow-y: auto;
  min-height: 400px;
  border: 1px solid #E5C9AA;
  position: relative;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
}
div#page:before,
div#page:after {
  content: "";
  position: absolute;
  z-index: -2;
}
div#page .navigation-bar {
  position: absolute;
  bottom: 35px;
  width: 87%;
  clear: both;
  display: block;
  margin: 0.7em auto;
  padding: 0.5em 1em;
  background-color: #FDF4E8;
  border: solid 1px #E5C9AA;
}
div#page > .header {
  margin: 0 auto 4em auto;
}
div#page > .header h1,
div#page > .header h2,
div#page > .header h3,
div#page > .header h4,
div#page > .header h5 {
  text-align: center;
  margin: 0 auto;
  width: 60%;
}
div#page > .header h1 {
  font-family: Montserrat, sans-serif;
  font-size: 200%;
  letter-spacing: 6px;
  margin: 2.5em auto 1em auto;
}
div#page > .header h2.subtitle,
div#page > .header h2.date {
  font: italic 100% Cuprum, sans-serif;
  letter-spacing: 1px;
  margin-bottom: 0.25em;
}
div#page > .header h3 {
  letter-spacing: 3px;
  font-size: 100%;
}
div#page > .header a.story {
  display: block;
  font-family: Cuprum, 'Roboto condensed', Verdana !important;
  letter-spacing: 1px;
  margin: 2em auto 0 auto;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
div#page > .header div.story {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-evenly;
  margin: 1em 1em 0 0;
}
div#page > .header div.story .leaf {
  position: relative;
  max-width: 300px;
  min-height: 28px;
  padding: 2px 8px 2px 4px;
  margin-left: 12px;
  margin-bottom: 0.4em;
  border-radius: 3px;
  background: linear-gradient(90deg, #FDF4E8 40%, #E5C9AA 95%);
}
div#page > .header div.story .leaf:after {
  content: '';
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  right: -12px;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
}
div#page > .header div.story .leaf:not(.current):after {
  border-left: 12px solid #E5C9AA;
}
div#page > .header div.story .leaf > a {
  font: normal 11pt 'Roboto condensed', sans-serif;
  letter-spacing: 1px;
  padding-left: 22px;
  cursor: pointer;
  background: url(/images/signpost3.png) left center no-repeat;
}
div#page > .header div.story .leaf.current {
  background: none;
  border-radius: 0px;
  border-bottom: 2px solid #FF901F;
}
div#page > .header div.story .leaf.current > a {
  color: #930;
  background: url(/images/signpost2.png) left center no-repeat;
}
div#page > .header div.story .leaf.current > a:hover {
  cursor: default;
  text-decoration: none;
}
div#page > .header div.story .leaf.current:after {
  border-left: none;
}
div#page > .header div.story .leaf .subtitle {
  font: italic 80% Cuprum, 'Roboto condensed', Verdana !important;
  color: #666;
  clear: both;
  display: block;
  padding-left: 2em;
  letter-spacing: 1px;
}
div#page > .google-map {
  float: right;
  margin: 0 0 2em 0;
}
div#page > .up {
  float: left;
  clear: both;
}
div#tabpage .ui-tabs-nav {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-evenly;
  gap: 2px 14px;
  /* row-gap column gap */
  max-width: 860px;
  padding: 0;
  margin: 0 auto 2em auto;
}
div#tabpage .ui-tabs-nav li {
  font: normal 11pt Cuprum, sans-serif;
  letter-spacing: 5px;
  text-transform: uppercase;
  text-decoration: none;
  color: #444;
  cursor: pointer;
  padding: 0;
  margin: 0;
  outline: none;
  border-bottom: solid 2px transparent;
}
div#tabpage .ui-tabs-nav li a {
  padding: 0;
  margin: 0;
  color: #666;
  text-decoration: none;
}
div#tabpage .ui-tabs-nav li:hover a,
div#tabpage .ui-tabs-nav li.ui-tabs-active a {
  color: #FF901F;
  border-bottom: solid 2px #e5c9aa;
}
div#tabpage .content {
  max-width: 860px;
  background-color: #f9f4ec !important;
  background: url(/images/frogg_05.png) no-repeat bottom right;
  margin: 1em auto;
  padding: 1em 3em 14em 3em;
  overflow-y: auto;
  min-height: 400px;
  border: 1px solid #E5C9AA;
  position: relative;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  padding: 0 0 7em 0;
}
div#tabpage .content:before,
div#tabpage .content:after {
  content: "";
  position: absolute;
  z-index: -2;
}
div#tabpage .content .collection {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
  flex-basis: 100%;
  gap: 10px 20px;
  /* row-gap column gap */
  margin: 1em;
  padding: 0 0 0 2em;
}
div#tabpage .content .collection div.leaf {
  display: inline-block;
  font-size: 85%;
  width: 30%;
  min-width: 200px;
  /*border: 1px dotted gray;*/
}
div#tabpage .content .collection div.leaf a {
  border-bottom: none;
  font: normal 9pt Verdana !important;
  padding-left: 10px;
  letter-spacing: 0px;
}
div#tabpage .content .collection div.leaf span.st {
  font: italic 8pt Verdana;
  color: #444;
  clear: both;
  display: block;
  padding-left: 1.5em;
}
div#tabpage .content .collection div.leaf.ready a {
  background: url(/images/bullet_sq.png) left center no-repeat;
}
div#tabpage .content .collection div.leaf.new a {
  background: url(/images/bullet_sq_orange.png) left center no-repeat;
}
div#tabpage .content .collection div.leaf.not-ready a {
  color: #888;
  background: url(/images/bullet_sq_gray.png) left center no-repeat;
}
div#tabpage .content .collection div.leaf.not-ready span.st {
  color: #888;
}
div#tabpage .content .collection p {
  text-indent: 0;
  font-size: 80%;
  flex-basis: 100%;
  margin: 0 3em 0 0em;
}
div#tabpage .content .collection > p:last-of-type {
  margin-bottom: 0.75em;
}
div#tabpage .content .collection > h2 {
  flex-basis: 100%;
  margin-left: -1em;
}
div#tabpage .content .collection .collection {
  padding: 0 0 0 1em;
  margin: 1em 0 2em 0em;
}
div#tabpage .content .collection .collection h3 {
  flex-basis: 100%;
  font-weight: normal;
  text-transform: none;
  font-size: 110%;
  font-family: 'Oswald', sans-serif;
  font-variant: small-caps;
  letter-spacing: 4px;
  padding-bottom: 4px;
  margin: 0 0 0.25em -1em;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
div#tabpage .content > section {
  margin: 2em;
  padding: 0;
  overflow-y: auto;
}
div#tabpage .content > section section > h2 {
  flex-basis: 100%;
  font-weight: normal;
  text-transform: none;
  font-size: 110%;
  font-variant: small-caps;
  letter-spacing: 4px;
  padding-bottom: 4px;
  margin: 0 0 1em 0;
  border-bottom: solid 1px transparent;
  -moz-border-image: -moz-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  -webkit-border-image: -webkit-linear-gradient(left, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image: linear-gradient(to right, rgba(153, 51, 0, 0.4) 0%, transparent 70%);
  border-image-slice: 1;
}
/**************************************************************************************************     SERVICE */
.drop-shadow {
  position: relative;
  -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.06) inset;
}
.drop-shadow:before,
.drop-shadow:after {
  content: "";
  position: absolute;
  z-index: -2;
}
.noshadow {
  -moz-box-shadow: none;
  box-shadow: none;
}
.noshadow:before,
.noshadow:after {
  position: relative;
  z-index: auto;
}
/**************************************************************************************************     MEDIA SUPPORT */
@media only screen and (max-width: 1024px) {
  body {
    padding: 0;
  }
  div#page,
  div#tabpage .content {
    width: auto;
    margin: auto 0;
    border: none;
    background: transparent !important;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  div#page:before,
  div#tabpage .content:before,
  div#page:after,
  div#tabpage .content:after {
    position: relative;
    z-index: auto;
  }
}
@media only screen and (min-width: 640px) and (max-width: 959px) {
  div#page,
  div#tabpage .content {
    /*border: solid 1px blue;*/
  }
}
@media only screen and (max-width: 640px) {
  table#header {
    margin-bottom: 1em !important;
    border-bottom: solid 1px #E5C9AA;
  }
  table#header tr {
    height: 40px !important;
  }
  table#header td {
    width: auto !important;
    background: none !important;
  }
  table#header td:last-of-type,
  table#header td:first-of-type {
    display: none;
  }
  div#page,
  div#tabpage .content {
    min-width: 460px;
    /*border: solid 1px red;*/
  }
  #menu a {
    display: none;
  }
  div#tabpage .ui-tabs-nav {
    gap: 0px 6px;
    /* row-gap column gap */
  }
  div#tabpage .ui-tabs-nav a {
    font-size: 9pt;
    letter-spacing: 1px;
  }
}