body
{
min-width: 835px;
max-width: 1000px;
height: 101%;
width: 100%;
color: #FFFFFF;
font-family: Arial;
font-size: 11pt;
background-image: url(img/hintgr.jpg);
background-size: 100%;
margin: auto;
overflow-y: scroll;
}

p
{

float: left;
text-align: center;
width: 20px;
line-height: 21px;
margin-right: -32%;
margin-left: 32%;
}
 
p:first-letter
{
color: #3399cc;
font-family: kunst;
margin-right: 1px;
margin-left: 10px;
font-size: 23pt;
float: left;

}
#head
{
margin-top: 0px;
float: left;
margin-left: 10%;
width: 80%;
height: 25px;
text-align: center;
max-width: 800px; 
   
}
   


 @keyframes cf3FadeInOut {
  0% {
  opacity:0;
  
}
30% {
opacity: 0;
width: 7%;    
}

45% {
opacity:0.1;
width: 7%;
}
55% {
opacity:1;  
color: #FF0000;
width: 7%;
}
90%{
opacity:0.5;

    
}

100% {
opacity:1;
width: 6%;
}
}

#head img {
width: 6%;
height: auto;
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: 1;
animation-duration: 3s;
animation-direction: alternate;
}

#header
{
margin-top: 8px;
margin-bottom: 10px;
float: left;
margin-left: 10%;
width: 80%;
height: auto;
max-height: 294px;
    
}
#header img
{
width: 100%;
height: auto;
margin-left: 0px;    
}

#nav
{
float: left;
margin-top: 10px;
margin-left: 10%;
width: 80%;
display: block;
font-size: 20px;
text-align: center;
min-height: 20px;
height: auto;
max-height: 40px;
background-color: rgba(51, 153, 204, 0.0);
text-align: center;
border-top : solid 2px ;
border-top-color: rgba(51, 153, 204, 1.0);
border-bottom: solid 2px ;
border-bottom-color:rgba(255, 255, 255, 1.0) ;
border-radius:8px;
}
#navbutton
{
margin-left: 27px;
float: left;
width: 19%;
text-align: center;    
}

.navimg
{
margin-top: 0.4px;
margin-bottom: 1px;
margin-left: 1px;
float:  left;
height: auto;
width: 40px;
opacity: 0.6;
}
.navimg:hover 
{
display: block;
opacity: 2.0;
}
#nav:hover 
{
background-color: rgba(51, 153, 204, 0.15);
    
}

#content
{
margin-top: 10px;
float: left;
margin-left: 10%;
width: 80%;
background-color: #CFCFCF;
min-height: 100px;
height: auto;
position:  static;
padding-bottom: 20px;   

}



.conunt
{

margin-top: 20px;
margin-bottom: 20px;
float: left;
margin-left: 0px;
width: 100%;
height: 20px;   
}
.imguntzu
{
margin-top: 15px;
width: 30px;
height: 20px;
float: left;    
margin-left: 5px;
}
.imguntre
{
margin-top: -24px;
width: 30px;
height: 20px;
float: right;
margin-right: 5px;   
}

#footer
{
margin-top: 2px;
float: left;
height: 25px;
width: 80%;
margin-left: 10%;
text-align: center;
line-height: 40px;
margin-bottom: 30px;
}
#footer img
{
width: 6%;
height: auto;
animation-name: cf3FadeInOut;
animation-timing-function: ease-in-out;
animation-iteration-count: 1;
animation-duration: 3s;
animation-direction: alternate;
}
p
{
text-align: center;
width: auto;
height: auto;
}

hr
{
margin-left: 11%;
float: left;
margin-top: 0px;
margin-bottom: 10px;
width: 78%;
color: #808080;  
}
a
{
color: #FFFFFF; 
text-decoration: none;   
}

a:hover 
{
color: #808080;
cursor: url(cursor.cur), auto;    
}
img
{
margin-top:8px ;
margin-left: 1%;
float: left;
width: 32%;
height: auto;
    
}
.img2
{ 
float: left;
margin-left: 10%;
width: 80%;
height: auto;
   
}

a img:hover
{
opacity: 0.75;    
}
 
h1
{

display: inline-block;
margin-top: 4px;
margin-bottom: 0px;
text-align: center;
color: #FFFFFF;
font-family: Arial; 
font-size: 20pt;
font-weight: lighter;
text-shadow: 0 0 2px #000000;
}

h2
{
text-align: center;
color: #000000;
font-family: Arial;
font-size: 16pt;    
}
h2 a 
{
color: #000000;    
}

h3  
{
line-height: 10px;
margin-bottom: 5px;
text-align: center;
color: #FFFFFF;
font-family: Arial;
font-size: 18pt;    
text-shadow: 0 0 3px #000000;
}

h4 
{
color: #3399cc;
font-family: Arial;
font-size: 24pt;    
text-align: center;
}

h1:hover 
{
color:#3399cc  ;    
}

h3 a    
{
color: #FFFFFF;
margin-left: -30px;   
}
h3 a:hover
{
color: #3399cc;    
}

h4 a 
{
color: #3399cc;    
}

td
{
color: #000000;
text-align: center;
font-family: Arial;
border: none;
font-size: 14pt;    
}
td img
{
margin-left: 1px;
width: 100%;
height: auto;    
}

h1:first-letter
{
color: #3399cc;
text-align: center;
font-size: 22pt;
text-shadow:  none;
}

h1:hover:first-letter 
{
color: #FFFFFF;
font-size: 22pt;
}
   


@font-face {        
    font-family: kunst; 
    src: url(kunstler.TTF); 
    src: url('kunstler-webfont.eot'),
    src: url('kunstler-webfont.eot?#iefix') format('embedded-opentype'),
         url('kunstler-webfont.woff2') format('woff2'),
         url('kunstler-webfont.woff') format('woff') ,
         url('kunstler-webfont.svg#svgFontName') format('svg');
    }