html, body
{
  min-height:99%;
  height:99.4%;
  font-size:106%;
}
h1.vibes, h1.vibes a {
  font-family: "Great Vibes", cursive;
  font-weight: 400;
  text-shadow: 2px 2px #ccc;
  font-size: 1.7em;
  margin:2px;  
  color: #440000;
}
.marck {
  font-family: "Marck Script", cursive;
  font-weight: 400;
}

.rainbow {  
  background-image: linear-gradient(to right, #7f0, #f0f);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-weight: bold;
}
a:hover span.rainbow, a:hover span.master {
      filter: brightness(150%)
}

a:hover img {
      filter: brightness(115%)
}

a 
{
    text-decoration:none;
    display: contents;
}

@media screen and (max-resolution: 100dpi) {
  font-size: 104%;
}
.header {
  width:100%; 
  display:flex; 
  justify-content:center;
}
.header>div {  
  width:100%; 
  max-width:1620px; 
  text-align:center; 
  background-image: 
  url(/images/background.jpg); 
  background-size:auto 100%; 
  background-repeat: no-repeat; 
  background-position: left; 
  border-bottom:1px solid black; 
  background-color: rgba(255, 255, 255, 0.7); 
  color:#440000;
}
.header>div>div {
  padding:2px 8px 0px 8px;
  width:100%;
}

@media screen and (min-width: 1340px) {
  .header>div>div {
    background-position: right; 
    background-repeat: no-repeat; 
    background-image: url(/images/bugsbunnyo.png);
    background-size:13%;
  }
}

a:hover
{
  color: #DD9966 !important;
}

table.main {
  height:82%; 
  width:100%;
  max-width:1620px
}

table.main td {
  text-align:center; 
  vertical-align:middle;
}

table.main td.leftImage {
  vertical-align:bottom;
}

table.main td.leftImage img {
  height:600px; 
  width:296px;
}

tr.content {
  vertical-align:top;
}
tr.yaBottom td{
  padding-top:20px;
}

body, .ui-widget {
  font-family:Tahoma, Verdana, Arial, system-ui; 
}

h2 {
    font-family: cursive, Arial, sans-serif, system-ui;
}

p {
    margin: 10px 10px 10px 10px;
    text-align: center;
}

.about p:nth-child(even) {
    margin: 20px 14px 10px 10px;
    text-align: justify;
}
.about p:nth-child(odd) {
    margin: 20px 10px 10px 14px;
    text-align: justify;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted brown; /* If you want dots under the hoverable text */
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
/*  width: 120px;*/
  background-color: #87d;
  color: #fff;
  text-align: center;
  padding: 4px;
  border-radius: 6px;

  font-size:0.84em;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 1.8s;  
}

/* Tooltip arrow */
.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 0.96;
}

#accordion {
  margin: 25px 40px 25px 5px;
  max-width: 730px;
  width: 96%;
  max-height: fit-content;  
}

h2.ui-accordion-header, div.ui-accordion-content{
  width: 100%;
}
td:has(div#accordion) {
  text-align: center;
  justify-content: center;
  display: flex;
  align-items: center;
  height: 100%;
  flex-flow: column;  
}

#accordion p {
  margin-top:15px;
}

#accordion>div {
  overflow-y:hidden;
}

div.leftioniccolumn, div.rightioniccolumn {
  background-image: url(/images/columnionic.png);
  background-repeat: no-repeat; 
  padding:0 !important;
}

div.leftioniccolumn, div.rightioniccolumn {
  background-size: auto 100%;
}  

div.rightioniccolumn {
  background-position: right top; padding:0;
}

div.matte {
  background-color:#ffffff60; 
  width:99%; 
  height:100%
}

.organic_section {
    width:100%;
    height:100%;
    background-image: url(/images/lotus3.png);
    background-repeat: no-repeat;
    background-position: bottom left;
    background-size: 36%;
    min-height: 230px;
}

.ui-accordion .ui-accordion-content {
    padding-bottom: 0px;
}

.bigScreen {
    visibility:hidden;
    display:none;	
}

@media screen and (min-width: 800px) {
    .bigScreen {
        visibility:unset;
	display:unset;	
    }    
}

.yaBottom {
  vertical-align:bottom;
}

.yandex_rtb {
  bottom:0px;
}

@media screen and (min-resolution: 180dpi) {

  #accordion p {
    margin-top:25px;
  }

  body, .ui-widget{
        font-size:130%;
  }
}

h1 a, a h1 {
  font-size:2.25em;
  text-decoration:none;
  margin-left:15px;
}

h1 img {
    position: relative;
    bottom: -6px;
}

h1 a span:nth-child(even) {
    
    font-family:cursive;
    color: #dd0;
    font-size: 1.2em;
    position: relative;
    bottom: -4px;
}

h1 a span:last-child {
    
    font-size:0.4em;
    position:relative;
    bottom:-4px;
    color: #205;
}
.about table {
    font-size: 15px;
    margin-top:25px;
}

#rightBar {
    width:27%;
    vertical-align:bottom;
}

.VContainer {    
    padding:15px 15px 2px 0;
    width:400px;
    overflow:hidden;
    min-height: 220px;
    height: 220px;
    max-height: 220px;
}

div.content {
    max-width:780px; 
    width:100%; 
    font-size:18px; 
    display:inline-block; 
    text-align:center;
}


tr.labels span {
  background-color: rgba(255, 255, 255, 0.5);
}

/*                        v Rollup counter v                        */
.counter-wrapper {
    display: inline-flex;
    height: 1.2em;
    line-height: 1.2em;
    overflow: hidden;
    font-family: monospace;
    font-size: 24px;
    font-weight: bold;
}
.digit-strip {
    display: flex;
    flex-direction: column;
    transition: transform 2s cubic-bezier(0.45, 0.05, 0.55, 0.95); 

}
.digit-strip span {
    display: block;
    height: 1.2em;
    text-align: center;
}        
/*                        ^ Rollup counter ^                        */

/*                        v Мастер обоев v                          */

#balloon {
  width: 200px;
  height: 25px;
  background-color: rgba(255, 192, 0, 0.5);
  border: 1px solid #000;
  border-radius: 10px;
  padding: 4px;
  position: absolute;
  bottom: 10px;
  right: 10px;
  cursor: move;
  text-shadow: 1px 1px white;
}
#urlPopup, #menu {
  display: none;
  background-color: #fff;
  border: 1px solid #000;
  border-radius: 10px;  
  position: absolute;
}

#urlPopup {
  padding: 30px 10px 30px 10px;
}

#menu {
  padding: 10px;
}

.image-option {
  display: flex;
  align-items: center;
  margin: 5px 0;
}
/*                        ^ Мастер обоев ^                          */