/* Clear floats after the columns */
#wierszHeader:after {
  content: "";
  display: table;
  width:100%;  
}

header{
  position:fixed;
  overflow:visible;
  
  width:100%;
  background: rgba(255,255,255,0);

  height:160px;
  margin-top: 0px;
 
  border:0px solid black;
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  -ms-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s;
  z-index:1;
}

hr.krecha{
  background-color: rgb(255, 255, 255);
  width: 95%;
  height:1px;
  border:0px;  
  box-shadow: 1px 1px 1px black;
}

header.smaller{
  position:fixed;
  overflow:visible;
  float:left;
  width:100%;
  background: rgba(255,255,255,0.9);

  height:200px;

  /* box-shadow: 2px 2px 1px rgba(0,0,0,0.3); */
  

  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  -ms-transition: height 0.3s;
  -o-transition: height 0.3s;
  transition: height 0.3s;
    z-index:10;
}

@media (width >= 971px){

#headerLogo{
    background: url(../img/logoGora.png) top no-repeat;
    background-position: center;
    opacity: 1;

    width:260px;    
    height:157px;
    font-size:20px;

     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
    

     padding: 0px;
     float: left;
    margin-top:0px;
    margin-left:80px; 
    /* border: 1px solid black; */
    /* filter: drop-shadow(2px 2px rgba(255, 255, 255, 0.8)); */
    cursor: pointer;
}



header.smaller #headerLogo{
    background: url(../img/logoGora-small.png) top no-repeat;
      
    width:260px;
    height:157px;
    /* min-width:173px; */
        
    float:left;

    margin-top:20px;
    
   
    
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
       
     cursor: pointer;
     border:0px solid black;
}

}

@media (width <= 970px){
  #headerLogo{
    background: url(../img/logoGora970px.png) top no-repeat;
    
    opacity: 1;
    min-width:200px;
    width:auto;
    height: 130px;
    font-size:20px;

     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;

     
     padding: 0px;
     float: left;
    margin-top:0px;
    margin-left:50px; 
    border: 0px solid black;
    /* filter: drop-shadow(2px 2px rgba(255, 255, 255, 0.8)); */
    cursor: pointer;
  }

  header.smaller #headerLogo{
    background: url(../img/logoGora-small970px.png) top no-repeat;
      
    height:80px;
    /* min-width:173px; */
    width:auto;
    font-size:15px;
    float:left;
    overflow:hidden;
    margin-top:10px;
    padding-left:10px;
    
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
       
     cursor: pointer;
     border: 0px solid black;
}
}

@media (width <= 770px){
  #headerLogo{
    background: url(../img/logoGora770px.png) top no-repeat;
    
    opacity: 1;
    min-width:200px;
    width:auto;
    height: 100px;
    font-size:20px;

     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;

     
     padding: 0px;
     float: left;
    margin-top:0px;
    margin-left:0px; 
    border: 0px solid black;
    /* filter: drop-shadow(2px 2px rgba(255, 255, 255, 0.8)); */
    cursor: pointer;
  }

  header.smaller #headerLogo{
    background: url(../img/logoGora-small770px.png) top no-repeat;
      
    height:80px;
    /* min-width:173px; */
    width:auto;
    font-size:15px;
    float:left;
    overflow:hidden;
    margin-top:10px;
    padding-left:10px;
    
     -webkit-transition: all 0.3s;
     -moz-transition: all 0.3s;
     -ms-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
       
     cursor: pointer;
     border: 0px solid black;
}
}