.cards {
  display: flex;
  justify-content: center;
}


.card {
  position: relative;
  width: 30%;
  cursor: pointer;
}

.card img {
  float: left;
  width: 100%;
  height: auto;
  transition: .3s opacity ease-in;
}

.card img:last-child {
  position: absolute;
  z-index: -1;
}

.tickets {
  position: relative;
  max-width: 700px;
  width: calc(100% - 44px);
  margin: auto;
}

.tickets img {
  width: 100%;
  height: auto;
  transition: .3s opacity ease-in;
  cursor: pointer;
}

.tickets img:last-child {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
}

.ticket-botton {
  position: relative;
  top: -3em;
  display: inline-block;
  color: #008ace;
  border-bottom: 1px dotted rgba(0, 138, 206, 0.3);
  cursor: pointer;
}

.note-comment {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  background: url(krasnodar-ticket.png);
  background-size: cover;
  transition: .3s opacity ease-in;
  pointer-events: none;
}

#comment1,
#comment2 {
  position: absolute;
  width: 13em;
}

 #comment1 {
  bottom: 66%;
  left: 8%;
  color:  #fff;
 }

 #comment2 {
  top: 53%;
  left: 100.5%;
  max-width: 23%;
 }

 @media(max-width: 990px) {
  .note-comment { display: none; }
 }