.button-container{
    position: relative;
    min-height: 125px;
}

.register-on-this-distance{
    display: inline-block; 
    width: 330px; 
    color: white !important;
    text-align: center;
    font-size: 28px !important;
    font-weight: 700;
    padding-top: 5px;
    z-index: 10;
    position: absolute;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    
}

.register-on-this-distance-oposite-color{
    display: inline-block; 
    width: 330px; 
    color: white !important;
    text-align: center;
    font-size: 28px !important;
    font-weight: 700;
    padding-top: 5px;
    z-index: 10;
    position: absolute;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    
}

.register-on-this-distance-background{
    width: 330px; 
    display: inline-block; 
    height: 0px;
    background-color: #A9E048;
    position: absolute;
    /*left: 15px;*/
    z-index: 3;
    transition: height 1s;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance-background2{
    width: 330px; 
    height: 90px;
    display: inline-block; 
    background-color: #333;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance-background-oposite-color{
    width: 330px; 
    display: inline-block; 
    height: 0px;
    background-color: #333;
    position: absolute;
    /*left: 15px;*/
    z-index: 3;
    transition: height 1s;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance-background2-oposite-color{
    width: 330px; 
    height: 90px;
    display: inline-block; 
    background-color: #A9E048;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance:hover ~.register-on-this-distance-background {
    /*background-color: blue;*/
    height: 90px;
    transition: height 0.8s;
}

.register-on-this-distance:hover{
    color: white !important;
    text-decoration: none !important;
}

.register-on-this-distance-oposite-color:hover ~.register-on-this-distance-background-oposite-color{
    /*background-color: blue;*/
    height: 90px;
    transition: height 0.8s;
}

.register-on-this-distance-oposite-color:hover{
    color: white !important;
    text-decoration: none !important;
}

.three-images{
    width: 31.3%;
    float: none !important;
}


@media screen and (max-width: 1200px) {
    .three-images{
        width: 31.3%;
    }
}

@media screen and (max-width: 992px) {
    .three-images{
        width: 30.7%;
    }
}

@media screen and (max-width: 768px) {
    .three-images{
        width: 92%;
        margin-left: 4% !important;
    }
}

/* ultra maraton bieszczadzki */

.register-on-this-distance-background3{
    width: 330px; 
    height: 95px;
    display: inline-block; 
    background-color: #C53A37;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance-background4{
    width: 330px; 
    height: 0px;
    display: inline-block; 
    background-color: #F7931E;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    transition: height 1s;
}

.register-on-this-distance:hover ~.register-on-this-distance-background4 {
    /*background-color: blue;*/
    height: 95px;
    transition: height 0.8s;
}


.register-on-this-distance-background3-oposite-color{
    width: 330px; 
    height: 95px;
    display: inline-block; 
    background-color: #F7931E;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

.register-on-this-distance-background4-oposite-color{
    width: 330px; 
    height: 0px;
    display: inline-block; 
    background-color: #C53A37;
    position: absolute;
    /*left: 15px;*/
    z-index: 1;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    transition: height 1s;
}

.register-on-this-distance-oposite-color:hover ~.register-on-this-distance-background4-oposite-color {
    height: 95px;
    transition: height 0.8s;
}

.client-standard-button-style {
  background: #488eba;
  background-image: -webkit-linear-gradient(top, #488eba, #0080b3);
  background-image: -moz-linear-gradient(top, #488eba, #0080b3);
  background-image: -ms-linear-gradient(top, #488eba, #0080b3);
  background-image: -o-linear-gradient(top, #488eba, #0080b3);
  background-image: linear-gradient(to bottom, #488eba, #0080b3);
  -webkit-border-radius: 6;
  -moz-border-radius: 6;
  border-radius: 6px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  border: solid #0080b3 0px;
  text-decoration: none;
}

.client-standard-button-style:hover {
  background: #3cb0fd;
  background-image: -webkit-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -moz-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -ms-linear-gradient(top, #3cb0fd, #3498db);
  background-image: -o-linear-gradient(top, #3cb0fd, #3498db);
  background-image: linear-gradient(to bottom, #3cb0fd, #3498db);
  text-decoration: none;
}

.gliwice-registration-buttons{
    text-decoration: none; 
    padding-top: 15px; 
    color: white !important; 
    font-size: 20px !important; 
    display: inline-block; 
    width: 280px; 
    height: 100px; 
    background-color: rgb(0, 86, 122); 
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
    max-width: 100%;
      -webkit-transition: background-color, font-size 0.3s;
    -moz-transition: background-color, font-size 0.3s;
    -o-transition: background-color, font-size 0.3s;
    transition: background-color, font-size 0.3s;
}

.gliwice-registration-buttons:hover{
    background-color: rgb(53, 148, 190);
    text-decoration: none !important; 
    font-size: 22px !important;
    font-weight: 600 !important;
}