html{
    height: 100%;
}

* {
	color:inherit;
	margin:0px;
	padding:0px;
	
	
	}
	
body{
	display: none;
	flex-direction: column;
    height: 100%;
}

body, p, td {
    height: 100%;
    padding:0px 4px;
    font-weight:normal;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    --font-size:1.05em;

}

a {
	text-decoration: none;
	color:inherit;
}

a:hover {
color:black;
}

   
h1 {
	font-size: 3em;
	margin:0px auto;
	padding:5px 10px;
	font-family: 'Jura', Arial, Helvetica, sans-serif;
}
h2 {
	font-size:2.1em;
	margin:4px auto;
	font-family: 'Jura', Arial, Helvetica, sans-serif;
}
h3 {
	font-size:1.5em;
	margin:4px auto;
	font-family: 'Jura', Arial, Helvetica, sans-serif;
}

#header{
   /* 0 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 0 0 auto;
}
#content{
   /* 1 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 1 0 auto;
}
#footer{
   /* 0 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 0 0 auto;
   padding:8px 4px 2px 4px;
  
}

.noborder {
	border:1px inherit solid;
}

.next, .start, .sanimationid  {

width:140px;
text-align:center;
margin:10px;
padding:5px;
margin:5px auto;
right:0	;
cursor:pointer;
border-radius:10px;
font-size:1.1em;
--font-weight:bold;
border-width:4px;
	
}
.range {
	width:100%
}

.range td {
	width:32px;
	height:32px;
	border:inherit;
	cursor:pointer;
	margin:5px;
	vertical-align:middle;
}

.animal {
	margin:5px;

}

.animal img {
	width:inherit;
	box-shadow: 0 2px 4px rgba(0,0,0,0.4), 0 2px 4px rgba(0,0,0,0.4);

}
p {
	margin:2px 1px;
	--text-indent:1.0em;
}
.comment {
	width:100%;
	margin:10px auto 10px 0px;

}
.comment td:first {
box-shadow: 0 2px 5px rgba(0,0,0,0.2), 0 2px 4px rgba(0,0,0,0.2);
}

.comment span:first-child {
	font-size:1.1em;
	background-color:inherit;
}

.comment td:last-child {
	wwidth:50px;
	cursor:pointer;
}

.steps {
	display:none;
	opacity:0;
}

.keys {
	display:inline-block;
	padding:4px 8px;

}

hr {
	height:5px;
	margin:4px;
	border:none;
	width:90%
}

#header{
   /* 0 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 0 0 auto;
}
#content{
   /* 1 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 1 0 auto;
}
#footer{
   /* 0 flex-grow, 0 flex-shrink, auto flex-basis */
   flex: 0 0 auto;
   padding:8px 4px 2px 4px;
 
}

.anketa{
font-weight:bold;
font-size:1.1em;
}

.anketa input{
font-weight:inherit;
font-size:inherit;
}

.anketa img {
cursor:pointer;
padding:5px;	
}

.whiteborder {
	border-style:solid; border-width:1px; border-color : "white";
}

.footerstep {
display:none;clear:both;
}

.footerstep div:first {
font-size:1.2em;
}

.footerstepimg {
height:120px;
float:left;	
}


.present {
	border-radius:50%;
	padding:4px;
	visibility:hidden;
	position: absolute; 
	
}

.letterdiv2 {
	
	font-family:"Courier New", Courier, monospace;
	word-wrap:break-word;
	font-weight:bold;
	width:1px;
	position:absolute;
	display:inline-block;
	top:0px;
	border-width:2px;
	--visibility:hidden;

}

#letterdiv21 {
float:left;
}

#letterdiv22 {
float:left;
}
@keyframes present_animation {
0% {
transform : rotate(0deg)
}

100% {
transform : rotate(360deg);
  
}
	
}