/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
}

/* The New iPad (iPad 3) ----------- */
@media only screen
and (min-device-width: 1536px)
and (max-device-width: 2048px)
and (-webkit-min-device-pixel-ratio: 2) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}


@font-face{ 
	font-family: 'promocyja';
	src: url('promocyja-webfont.woff') format('woff');  
}

@font-face{ 
	font-family: 'lmroman10-bold-webfont';
	src: url('lmroman10-bold-webfont.woff') format('woff');  
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}


body {
      background-image: url("font de page_982x600.JPG");
      margin:0;
      background-repeat: no-repeat;
      background-attachment: fixed;
      background-color: #000000;
      background-position: center top; 
}

.audioplayer {
    width: 220px;
    height: 15px;
    margin-top: 25px ;
    margin: 55px;
    position: relative;
    left: 995px;
    top: 380px;
    -webkit-transition:all 0.5s linear;
    -moz-transition:all 0.5s linear;
    -o-transition:all 0.5s linear;
    transition:all 0.5s linear;
    -moz-box-shadow: 2px 2px 4px 0px #83855d;
    -webkit-box-shadow:  2px 2px 4px 0px #83855d;
    box-shadow: 2px 2px 4px 0px #83855d;
    -moz-border-radius:7px 7px 7px 7px ;
    -webkit-border-radius:7px 7px 7px 7px ;
    border-radius:7px 7px 7px 7px ;
    background: #ffeaa4;
    animation : fadein 18s;
}


.timeline {
    width: 180px;
    height: 4px;
    margin-top: 4px;
    float: left;
    border-radius: 15px;
    background: #b4d3f0;
}


.playbutton {
    height: 25px;
    width: 25px;
    margin-top: -6px;
    border: none;
    float: left;
    outline: none;
}

.play {
    background: url("play_b.png");
}

.pause {
    background: url("pause_b.png");
}

.play,.pause {
    background-size: 50% 50%;
    background-repeat: no-repeat;
    background-position: center;
}

.playhead {
    width: 8px;
    height: 6px;
    border-radius: 50%;
    margin-top: -1px;
    background: #000000;
    cursor: pointer;
}
h1 {
    display: block;
    font-family: 'promocyja';
    font-size: 3.10em;
    color: #e5af1c;
    margin-top: 0.67em;
    margin-bottom: 0.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight:normal;
    position: fixed;
    bottom: 330;
    left: 420;
    animation : fadein 6s;
} 

h2 {
    display: block;
    font-family: 'promocyja';
    font-size: 1.0em;
    color: #e9b663;
    margin-top: 0.67em;
    margin-bottom: 0.67em;
    margin-left: 0;
    margin-right: 0;
    font-weight: bold;
    position: fixed;
    top: 10;
    left: 420;
    animation : fadein 10s;
}

h3 {
    display: block;
    font-family: 'promocyja';
    font-size: 1em;
    text-align: center;
    color: #e9b663;
    #margin-top: 0.67em;
    #margin-bottom: 0.67em;
    #margin-left: 0;
    #margin-right: 0;
    font-weight: normal;
    position: fixed;
    top: 450;
    left: 1125;
    animation : fadein 10s;
}

h4 {
    display: block;
    font-family: 'promocyja';
    font-size: 1em;
    text-align: center;
    color: #e9b663;
    #margin-top: 0.67em;
    #margin-bottom: 0.67em;
    #margin-left: 0;
    #margin-right: 0;
    font-weight: normal;
    position: fixed;
    top: 520;
    left: 1110;
    animation : fadein 10s;
}
nav {
      width: 100%;
      height: 35px;
      position: fixed;
      bottom: 330;
      left: 370;
      animation: fadein 8s;
      
}
      

#top-ul {height: 25px; margin:0;}

li {

    float:left;

    padding-right:32px;

    list-style-type:none;
   
    height: 855px;
    
}

a {

    font-family: "lmroman10-bold-webfont", serif;

    font-size: 0.65em;

    font-style: normal;

    font-weight: normal;

    color: #ffeaa4;

    text-decoration:none;

    animation : fadein 2s;

    
    
}

.sub {

    position:absolute;

    display:none;

    background-color: transparent;

    top: 38px;

    padding-left: 2px;

    font-family: deja-vu; sans-serif;

    font-size: 10pt;

    border-radius:2px;
    
    float:left;
}

#//.sub a {
    
#//    color: black;

}

#.sub a:hover {

    
#    background-color: black;

}

.sub li {

    padding-right: 30px;
  
}

.image1
{
width:124px;
height:115px;
}

.image2, .image3,.image4, .image5,.image6, .image7,.image8, .image9, .image10, .image11
{
width:115px;
height:115px;
}


.main {
     margin-top:5px;
     height:35px;


}


.main:hover > ul {
    
    display:block;

}