@charset "utf-8";
/* CSS Document */

body {
	background:#F9EAFD;
	margin: 0;
	padding: 0;
	color: #000;
}

ul, ol, dl {
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
}
a img {
	border: none;
}

a:link {
	color:#414958;
	text-decoration: underline;
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}
.Header {
	width: 97%;
	margin-right: auto;
	margin-left: auto;
}
.container {
	width: 97%;
	background: #7eb3cc;
	margin: 0 auto;
}
.navigate{
	background-color:#F5F9BD;
	margin-top:14px;
	}
.sidebar {
    height: 550px;
    background: linear-gradient(45deg, #0FFFFF, #A632E4, #E1D92F);
    border-radius: 25px;
    padding-top: 25px;
    width: 15%;
    float: left;
}
.readAndNav{
	border: 1px solid #1DCEE2;margin-left: auto;margin-right: auto; width: 56%;text-align: center; border-radius: 77px;
	padding: 0px;margin-top: 0px;animation-name: konti;animation-duration: 7s;animation-iteration-count: infinite;
}
@keyframes konti { 0%{color:#46F7EE; color:#BF00BF;} 50%{color:#BF00BF; color:#46F7EE;100%{color:#46F7EE; color:#BF00BF;}}
}
#titleBegin{
	width: 56%;margin-left: auto;margin-right: auto;border: solid 2px blue;border-radius: 71px;text-align:center; background-color:#A5F5FB;
}
#readBegin{
	text-align:center; width: 50%;margin-right: auto;margin-left: auto;
}
#laveVide{
	background-color: #3300FF;
	float: left; margin-right:2px;border:7px double #abccdb;
	height: 460px; margin-top:20px;
	width: 25%; opacity:.5; border-radius:36px;
}
#anim{ border-radius:24px; text-align: center; border:#9daca7 2px solid; border-radius:24px;padding-top: 17px;padding-bottom: 3px;
	animation-name:trej; animation-duration:7s; animation-iteration-count:infinite;margin-top: 24px;position: inherit;
	}
		@keyframes trej {
    0%   {background-color:red;}
    25%  {background-color:yellow; color:#B548CC;}
    50%  {background-color:blue; color:#CCFF33;}
    75%  {background-color:green; color:#FFD7FF;}
    100% {background-color:red; color:#FFFFC6;}
}
.content {
	padding: 10px 0;
}

.content ul, .content ol {
	padding: 0 15px 15px 40px;
}


	@font-face {
   font-family: Avena;
   src: url(../../webfonts/theReal/theReal.woff);
}
* {
   font-family: Avena;
}
.teraz{
	 position: relative; background-color:#FFFFC6;
    display: inline-block;
    border-bottom: 1px dotted black;
}
.abracad  {
	visibility:hidden;
    width: 550px;
	background-color:#009D9D;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
     position: absolute;
    z-index: 1;
    top: 100%;
    left: 50%;
    margin-left: -259px;
}
.fltrt {
	float: right;
	margin-left: 8px;
}
.fltlft {
	float: left;
	margin-right: 8px;
}
.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.teraz:hover .abracad {
    visibility: visible;
}
button:hover{text-decoration:underline;}
#logBack{
	background-image: url(Photos/Layout/backLogo.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-color: #507EB2;
	padding-top: 4px;
}
#indication{
	text-align: center;
	margin: 0px;
	background-color: #9DFFFF;
	width: 77%;
	margin-right: auto;
	margin-left: auto;
	color: #721D8D;
	border-bottom-width: 3px;
	border-bottom-style: solid;
	border-bottom-color: #BE55A0;
	border-right-width: 3px;
	border-right-style: solid;
	border-right-color: #BE55A0;
	border-left-width: 3px;
	border-left-style: solid;
	border-left-color: #BE55A0;
	animation:inform 4s infinite;
}
@keyframes inform{
0%{color:#721D8D; background-color:#9DFFFF;}25%{color:#007CF9; background-color:#FFA;}50%{color:#F40000; background-color:#CAFFFF;}75%{color:#007CF9; background-color:#FFA;}100%{color:#721D8D; background-color:#9DFFFF;}
	}
input{color:#E800E8; text-align:center; background-color:#FFFFC1;}
#hratka{animation:inform 4s infinite;}
#readNav{
	background-color: #BE55A0;
	width: 87%;
	animation: navig;
	animation-duration: 7s;
	animation-iteration-count: infinite;
	border-radius: 21px;
	margin-right: auto;
	margin-left: auto;
	border-top-width: 1px;
	border-right-width: 4px;
	border-bottom-width: 1px;
	border-left-width: 4px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #662ECF;
	border-right-color: #9DFFFF;
	border-bottom-color: #662ECF;
	border-left-color: #9DFFFF;
}
@keyframes navig{
50%{background-color:#8152CF;}
	}
#justListen{
	width: 10%;float: left;background-color: #ffffff;padding: 2px;color: #7984ef;text-align: center;
}