#konyv {
    padding: 0; 
    height: 180px;
    color: #FFFFFF;
    padding-left:10px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin: auto;
}

#konyv a,
#konyv a:visited,
#konyv a:hover,
#konyv a:active {
    color: #FFFFFF;
}

#konyv_logo {
    clear: both;
    float: left;
}

.animation {
  height:60px;
  font-size: 40px;
  margin-top: 30px;
}

.animation > div > div {
  padding: 4px 12px;
  height:60px;
  margin-bottom:50px;
  clear: both;
  float: left;
}

.first div {
  background: linear-gradient(75deg, #FFFFFF 25%, #9666a3 35%);
  text-align: center;
  border-radius: 0px 10px 0px 0px;
  font-weight: bold;
}
.second div {
  background: linear-gradient(90deg, #FFFFFF 25%, #57b487 35%);    
  text-align: center;
}
.third div {
  background: linear-gradient(105deg, #FFFFFF 25%, #0b4573 35%);    
  text-align: center;
  border-radius: 0px 0px 10px 0px;
}

@media screen and (max-width: 1200px) {
   .first div {
  background: linear-gradient(75deg, #FFFFFF 28%, #9666a3 35%);
}
.second div {
  background: linear-gradient(90deg, #FFFFFF 28%, #57b487 35%);    
}
.third div {
  background: linear-gradient(105deg, #FFFFFF 28%, #0b4573 35%);    
} 
}

@media screen and (max-width: 995px) {
   #konyv_logo {
    width: 180px;
}
   .animation {
  height:60px;
  font-size: 30px;
  margin-top: 30px;
}
    
   .first div {
  background: linear-gradient(75deg, #FFFFFF 28%, #9666a3 35%);
}
.second div {
  background: linear-gradient(90deg, #FFFFFF 28%, #57b487 35%);    
}
.third div {
  background: linear-gradient(105deg, #FFFFFF 28%, #0b4573 35%);    
} 
}

@media screen and (max-width: 675px) {
   #konyv_logo {
    width: 150px;
}
   .animation {
  height:60px;
  font-size: 20px;
  margin-top: 30px;
}
    
   .first div {
  background: linear-gradient(75deg, #FFFFFF 28%, #9666a3 35%);
}
.second div {
  background: linear-gradient(90deg, #FFFFFF 28%, #57b487 35%);    
}
.third div {
  background: linear-gradient(105deg, #FFFFFF 28%, #0b4573 35%);    
} 
}