@media only screen and (min-width: 810px) {

#menu_gorne {
    top: 0;
    left: 0;
    width: 100%;
    position: fixed;
    height: 30px;
    background-color: black;
    overflow: hidden;
    margin: auto;
    z-index:1;

} 

#menu_gorne_content{
  width: 1068px;
  height: 30px;
  margin: 0 auto;
}




#menu_gorne_ul {
  list-style: none;
  width:90%;
  height: 100%;
  margin: 0 auto;
  font-size: small;
  padding-top: 5px;
}



#menu_gorne_ul_left{
  float:left;
  width:12%;
  height: 100%;
}


#menu_gorne_ul_left > a > img {
  float:left;
  padding: 0px 10px;
  -webkit-filter: brightness(0.6);
  -moz-filter: brightness(0.6);
  -o-filter: brightness(0.6);
  -ms-filter: brightness(0.6);
  filter: brightness(0.6);
}

#menu_gorne_ul_left > a > img:hover {
  -webkit-filter: brightness(1);
  -moz-filter: brightness(1);
  -o-filter: brightness(1);
  -ms-filter: brightness(1);
   filter: brightness(1);
}

#menu_gorne_ul_middle{
    width:62%;
    height: 100%;
    float:left;
}


#menu_gorne_ul_right{
  float:left;
  width:25%;
  height: 100%;
}

#menu_gorne_ul_right > div > a > img {
  float:right;
  padding: 0px 10px;
  -webkit-filter: brightness(0.6);
  -moz-filter: brightness(0.6);
  -o-filter: brightness(0.6);
  -ms-filter: brightness(0.6);  
  filter: brightness(0.6);
}

#menu_gorne_ul_right > div > a > img:hover {
  -webkit-filter: brightness(1);
  -moz-filter: brightness(1);
  -o-filter: brightness(1);
  -ms-filter: brightness(1);
    filter: brightness(1);
}





#menu_gorne_ul > li {
  display: block;
  float: left; 
  text-align: center;
}

#menu_gorne_ul >li > a {
  text-decoration: none;
  color: white;
}

#menu_gorne_ul > li:first-child {
  width: 17%;
  border-right: 1px solid silver;

}

#menu_gorne_ul > li:first-child + li {
  width: 17%;
    border-right: 1px solid silver;

}

#menu_gorne_ul > li:first-child + li + li{
  width: 20%;
    border-right: 1px solid silver;

}

#menu_gorne_ul > li:first-child + li + li + li{
  width: 24%;
    border-right: 1px solid silver;

}

#menu_gorne_ul > li:last-child {
  width: 20%;
}


#menu_articles:hover > ul >li{
  visibility: visible;
}


#menu_articles > div {
    visibility: hidden;
    -webkit-transform:scaleY(0);
    -webkit-transform-origin:50% 0;
    -webkit-transition-duration:1000ms;    
    transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms;
    
}


#menu_articles:hover > div  {
    -webkit-transform:scaleY(1);
    transform:scaleY(1);
    visibility: visible;

}



#pod_menu_articles  {
   position: fixed;
   height: 30px;
   top:30px;
   left: 0;
   width: 100%;
   background-color: silver;
/*   visibility: hidden;*/
   z-index:1;

  
}

#pod_menu_articles_content  {
  width:1068px;
  height: 100%;
  margin: 0 auto;
  background-image: url(img/tlo_menu_kreski.png)

}


#pod_menu_articles_content > ul  {
  position:relative;
  list-style: none;
  height: 22px;
  width:60%;
  margin: 0 auto;
  padding-top: 8px;
  background-color: silver;

}

#pod_menu_articles_content > ul > li {
  display: block;
  float: left;
  text-align: center;
 }


#pod_menu_articles_content > ul > li:first-child {
  width: 9%;
  border-right: 1px solid black;
}

#pod_menu_articles_content > ul > li:first-child + li  {
  width: 12%;
  border-right: 1px solid black;
}

#pod_menu_articles_content > ul > li:first-child + li + li  {
  width: 28%;
  border-right: 1px solid black;
}

#pod_menu_articles_content > ul > li:first-child + li + li +li {
  width: 23%;
  border-right: 1px solid black;
}

#pod_menu_articles_content > ul > li:first-child + li + li +li+li {
  width: 8%;
  border-right: 1px solid black; 
}


#pod_menu_articles_content > ul > li:last-child {
  width: 15%;
}


#pod_menu_articles_content > ul > li > a{
  text-decoration: none;
  color: black;
}




#pod_menu_merchandising {
  background-color: silver;
  list-style: none;
  font-size: x-small;
  position: absolute;
  visibility: hidden;
  z-index:1;
    -webkit-transform:scaleY(0);
    -webkit-transform-origin:50% 0;
    -webkit-transition-duration:1000ms;  
       transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; 

}


#menu_merchandising:hover > ul {
      -webkit-transform:scaleY(1);
      transform:scaleY(1);
    visibility: visible;
}



#pod_menu_merchandising > li {
  padding-top:10px;
  padding-bottom: 5px;
  padding-right: 50px;
  text-align: left;
}

#pod_menu_merchandising > li > a{
  text-decoration: none;
  color: black;
}




#menu_merchandising:hover > a {
  color: red;
}




#pod_menu_cd {
  background-color: silver;
  list-style: none;
  font-size: x-small;
  position: absolute;
  visibility: hidden;
  z-index:1;
      -webkit-transform:scaleY(0);
    -webkit-transform-origin:50% 0;
    -webkit-transition-duration:1000ms;
       transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; 

}


#pod_menu_articles_cd:hover > ul {
      -webkit-transform:scaleY(1);
      transform:scaleY(1);
    visibility: visible;
}



#pod_menu_cd > li {
  padding-top:10px;
  padding-bottom: 5px;
  padding-right: 50px;
  text-align: left;
}

#pod_menu_cd > li > a{
  text-decoration: none;
  color: black;
}

#pod_menu_cd > li:hover > a {
  color: red;
}






#pod_menu_vinyl {
  background-color: silver;
  list-style: none;
  font-size: x-small;
  position: absolute;
  visibility: hidden;
  z-index:1;
      -webkit-transform:scaleY(0);
    -webkit-transform-origin:50% 0;
    -webkit-transition-duration:1000ms;
       transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; 

}


#pod_menu_articles_vinyl:hover > ul {
      -webkit-transform:scaleY(1);      
      transform:scaleY(1);
    visibility: visible;
}



#pod_menu_vinyl > li {
  padding-top:10px;
  padding-bottom: 5px;
  padding-right: 50px;
  text-align: left;
}

#pod_menu_vinyl > li > a{
  text-decoration: none;
  color: black;
}

#pod_menu_vinyl > li:hover > a {
  color: red;
}








#menu_gorne_ul > div {
	  height:0;
  	background-color:silver;
  	-webkit-transition-duration:250ms;
    transition-duration:250ms;
}


#menu_news:hover > a {
  color: red;
}

#menu_recently_added:hover > a {
  color: red;
}

#menu_preorders:hover > a {
  color: red;
}

#menu_about:hover > a {
  color: red;
}

#menu_articles:hover > a {
  color: red;

}


#pod_menu_articles_cd:hover > a {
  color: red;

}

#pod_menu_articles_vinyl:hover > a {
  color: red;

}


#pod_menu_articles_dvd:hover > a {
  color: red;

}

#pod_menu_articles_mcs:hover > a {
  color: red;

}


#pod_menu_articles_discount:hover > a {
  color: red;

}

#pod_menu_merchandising > li:hover > a {
  color: red;

}

#menu_mobile
{
  display: none;
}

} /* styl dla laptopow */




/* ####################################################################################################### */

@media only screen and (max-width:800px) {

#menu_gorne {
    top: 0;
    left: 0;
    width: 100%;
 /*   position: fixed;*/
/*    height: 30px;*/
    background-color: black;
    overflow: hidden;
    margin: auto;
    ;

} 

#menu_gorne_content{
 /* width: 1068px;*/
 /* height: 30px;*/
  margin: 0 auto;
  display: flex;
  flex-flow: wrap;
}




#menu_gorne_ul {
  list-style: none;
  /*width:100%;*/
  height: 100%;
  margin: 0 auto;
  font-size: small;
  padding-left: 0px;
}



#menu_gorne_ul_left{
  float:right;
 /* width:12%;*/
  height: 30px;
  order: 2;
  width:100%;
  padding-top: 8px;
  left:23px;
  position: fixed;
  background-color: black;
  z-index: 6;
}


#menu_gorne_ul_left > a > img {
  float:none;
  /*padding: 0px 10px;*/
  height: 100%;
  -webkit-filter: brightness(0.6);
  -moz-filter: brightness(0.6);
  -o-filter: brightness(0.6);
  -ms-filter: brightness(0.6);
  filter: brightness(0.6);
}

#menu_gorne_ul_left > a > img:hover {
  -webkit-filter: brightness(1);
  -moz-filter: brightness(1);
  -o-filter: brightness(1);
  -ms-filter: brightness(1);
   filter: brightness(1);
}

#menu_gorne_ul_middle{
 /*   width:62%;*/
    height: 100%;
    float:none;
    order:5;
    width: 100%;
    display: none;
 

    transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; 

 
}

#menu_mobile
{
 /* font-size: 31px;*/
  display:block;
  order:1;
  font-weight: bolder;
  position: fixed;
  z-index: 7;
  background-color: black;
  overflow: hidden;
  background-color: black;
  height: 30px;
  padding-top: 8px;
}


#menu_mobile > a
{
  color:gray;
}


#logoMobile
{
  display:block;
  background-color: black;
  height:200px;
  order: 4;
  margin: 0 auto;


}

#logoMobile > img
{
  /*max-width: 80%;*/
  height: 80%;
  margin-top:8%;
}

#menu_gorne_ul_right{
  float:right;
/*  width:25%;*/
  height: 30px;
  order: 3;
  width:70%;
  padding-top: 8px;
  margin-left: 110px;
  position: fixed;
  z-index: 8;
  background-color: black;

}

#menu_gorne_ul_right > div > a > img {
  float:right;
  padding: 0px 5px;
  -webkit-filter: brightness(0.6);
  -moz-filter: brightness(0.6);
  -o-filter: brightness(0.6);
  -ms-filter: brightness(0.6);  
  filter: brightness(0.6);
}

#menu_gorne_ul_right > div > a > img:hover {
  -webkit-filter: brightness(1);
  -moz-filter: brightness(1);
  -o-filter: brightness(1);
  -ms-filter: brightness(1);
    filter: brightness(1);
}

#menu_gorne_ul_right > div
{

}



#menu_gorne_ul > li {
  display: block;
 /* float: left; */
 float:none;
  text-align: left;
 border-bottom: 3px solid silver;
  /* padding-top: 5px;*/
  padding-bottom: 5px;

}

#menu_gorne_ul >li > a {
  text-decoration: none;
  color: white;
 padding-left: 10px; 
}

#menu_gorne_ul > li:first-child {
  width: 100%;

/*  border-right: 1px solid silver;*/

}

#menu_gorne_ul > li:first-child + li {
  width: 100%;
    /*border-right: 1px solid silver;*/

}

#menu_gorne_ul > li:first-child + li + li{
  width: 100%;
 /*   border-right: 1px solid silver;*/

}

#menu_gorne_ul > li:first-child + li + li + li{
  width: 100%;
/*   border-right: 1px solid silver;*/

}

#menu_gorne_ul > li:last-child {
  width: 100%;
}




#menu_articles > div {
/*    transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; */
}


/*#menu_articles:hover > div  {
 /*   transform:scaleY(1);
    display: block;
}*/




#pod_menu_articles  {
 /*  position: fixed;
   height: 30px;
   top:30px;*/
    width: 100%;
/*   visibility: hidden;
   z-index:1;*/
display: none;
background-color: gray;
padding-left: 0px;  
}

#pod_menu_articles_content  {
 /* width:1068px;*/
 display: block;
  height: 100%;
  /*margin: 0 auto;*/
 /* background-image: url(img/tlo_menu_kreski.png)*/

}


#pod_menu_articles_content > ul  {
  position:relative;
  list-style: none;
/*  height: 22px;*/
  width:100%;
  /*margin: 0 auto;
  padding-top: 8px;*/
  padding-left:10px;
}

#pod_menu_articles_content > ul > li {
  display: block;
  float: none;
 /* text-align: center;*/
 padding-top: 5px;
 padding-bottom: 5px;
 border-bottom: 2px solid black;
 }




#pod_menu_articles_content > ul > li:first-child {
  width: 100%;
  
}

#pod_menu_articles_content > ul > li:first-child + li  {
  width: 100%;
  
}

#pod_menu_articles_content > ul > li:first-child + li + li  {
    width: 100%;
  
}

#pod_menu_articles_content > ul > li:first-child + li + li +li {
    width: 100%;
  
}

#pod_menu_articles_content > ul > li:last-child {
  width: 100%;
  border-bottom: 0px;
}


#pod_menu_articles_content > ul > li > a{
  text-decoration: none;
  color: black;
  font-weight: lighter;
}



#menu_articles:hover > ul >li{
  visibility: visible;
}


#menu_merchandising:hover > a {
  color:red;
}


#pod_menu_merchandising {
  list-style: none;
  font-size: x-small;
  width:100%;
  padding-left:0px;
  display:none;
/*  transform:scaleY(0);
  transform-origin:50% 0;
  transition-duration:1000ms; */
}


/*#menu_merchandising:hover > ul {
  /*transform:scaleY(1);
  display: block;
}*/



#pod_menu_merchandising > li {
  padding-top:5px;
  padding-bottom: 5px;
  padding-left: 10px;
  border-bottom: 1px solid black;
  /*padding-right: 50px;
  text-align: left;*/
}

#pod_menu_merchandising > li:last-child {
  border-bottom: 0px solid black;
}


#pod_menu_merchandising > li > a {
  text-decoration: none;
  color: black;
  font-weight: lighter;
}


#menu_merchandising:hover > a {
  color: red;
}




#pod_menu_cd {
  
  list-style: none;
  padding-left: 10px;
  font-size: x-small;

/*  font-size: x-small;
  position: absolute;
  visibility: hidden;
  z-index:1;
       transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; */
    display:none;
}


/*#pod_menu_articles_cd:hover > ul {

    
    display:block;
}*/



#pod_menu_cd > li {
  padding-top:5px;
  padding-bottom: 5px;
  padding-left: 10px;
  border-bottom: 1px solid black;
}

#pod_menu_cd > li > a{
  text-decoration: none;
  color: black;
  font-weight: lighter;

}

#pod_menu_cd: > li:hover > a {
  color: red;
}

#pod_menu_cd > li:last-child {
  border-bottom: 0px solid black;
}




#pod_menu_vinyl {
  list-style: none;
  font-size: x-small;
  padding-left: 10px;
/*    transform:scaleY(0);
    transform-origin:50% 0;
    transition-duration:1000ms; 
    visibility: hidden;*/
    display: none;

}


/*#pod_menu_articles_vinyl:hover > ul {
    display:block;
 /*     transform:scaleY(1);
      
    visibility: visible;
}*/



#pod_menu_vinyl > li {
  padding-top:5px;
  padding-bottom: 5px;
  padding-left: 10px;
  border-bottom: 1px solid black;
}

#pod_menu_vinyl > li > a {
  text-decoration: none;
  color: black;
  font-weight: lighter;
}

#pod_menu_vinyl > li:hover > a {
  color: red;
}


#pod_menu_vinyl > li:last-child {
  border-bottom: 0px solid black;
}






#menu_gorne_ul > div {
    height:0;
    background-color:silver;
/*    transition-duration:250ms;*/
}


#menu_news:hover > a {
  color: red;
}

#menu_recently_added:hover > a {
  color: red;
}

#menu_preorders:hover > a {
  color: red;
}

#menu_about:hover > a {
  color: red;
}

#menu_articles:hover > a {
  color: red;

}


#pod_menu_articles_cd:hover > a {
  color: red;

}

#pod_menu_articles_vinyl:hover > a {
  color: red;

}


#pod_menu_articles_dvd:hover > a {
  color: red;

}

#pod_menu_articles_discount:hover > a {
  color: red;

}

#pod_menu_merchandising > li:hover > a {
  color: red;

}


} /* styl dla tel