a{
  text-decoration: none;
  margin: 0 auto;
}

.mes-wrap{
  background-color: rgba(216, 216, 216, 0.2);
}

.mes-header-background{
 width: 100%;
 background-image: url("/sites/thechannelco/files/mes-images/MES-header-blue2.svg");
 background-repeat: none;
 background-size: cover;
 background-position: center;
 max-height: 211px;
 border-bottom: 10px solid #ed1c24;
}

.mes-header{
  width: 100%;
  max-width: 1024px;
  text-align: center;
  margin:auto;
}

.mes-header img{
  margin: 59px auto 20px;
  max-width: 510px;
  width: 100%
}

.mes-header h1{
  font-size: 20px;
  font-weight: bold;
  font-style: italic;
  text-align: center;
  color: #333333;
  text-shadow: 0 1px 7px #ffffff;
  margin: 0px auto 50px;
  max-width: 424px;
  line-height: 1.3;
  padding:0;
  vertical-align: baseline;

}

.mes-events{
  display: flex;
  flex-wrap:wrap;
  width: 100%;
  max-width: 1024px;
  margin: auto;
}

.mes-event{
  width: 341px;
  text-align: center;
  display: flex;
  flex-wrap:wrap;
}

.spring{
  background-image: url("/sites/thechannelco/files/mes-images/rays.png");
  background-position: center;
  position: relative;
}

.spring:before{
  content: "";
  left:0;
  bottom: 0;
  position: absolute;
  border-style:solid;
  border-width: 100px 0 0 100px;
  border-color: transparent transparent transparent #e98b15;
  margin: 0;
  padding: 0;
}

.security{
  background-image: url("/sites/thechannelco/files/mes-images/MES_security.png");
  background-position: right;
  margin: 0;
  padding: 0;
}

.fall{
  background-image: url("/sites/thechannelco/files/mes-images/MES-fall-background.png");
  background-position: 43%;
  margin: 0;
  padding: 0;

}

.mes-event-info{
  margin:0 auto;

}

.mes-event-title, .mes-event-title h1, .mes-event-title h2, .mes-event-info h2, .mes-event-info h3, .mes-event-info h4{
  text-align: center;
  color: #2b368f;
  min-width: 250px;
  margin:0 auto;
}

.security .mes-event-title h1, .security .mes-event-title h2{
  text-align: center;
  color: #50aeb5;
}

.mes-event-title h1, .security .mes-event-title h1{
  font-size: 36px;
  font-weight: bold;
  line-height: 1.14;
  margin-top: 22px;
  padding: 0;
  }

.mes-event-title h2, .security .mes-event-title h2{
  font-size: 24px;
  margin-bottom: 18px;
}

.mes-event-info h2{
  margin-bottom: 4px;
  font-size: 24px;
}

.mes-event-info h2{
  font-weight: bold;
}

.mes-event-info h3{
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 5px;

}

.mes-event-info h4{
  font-size: 20px;
  padding:0 25px;
  max-width: 300px;
}

.security .mes-event-info h2, .security .mes-event-info h3, .security .mes-event-info h4{
  color: #3a4562;
  text-shadow: 2px 2px 5px #fff;
}

.mes-btn{
  width: 148px;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.88);
  border: solid 2px #2b368f;
  font-size: 16px;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  color: #2b368f;
  padding:18px 0px;
  text-decoration: none;
  margin:40px auto 30px;
}

.mes-btn:hover {
    background-color: rgba(43, 54, 143, 0.8);
    color: #fff;
    -o-transition:.3s;
  -ms-transition:.3s;
  -moz-transition:.3s;
  -webkit-transition:.3s;
  transition:.3s;
  cursor:pointer;
}

.mes-clear{
  background-color: transparent;
  border-color: #fff;
  color:#fff;
}

.mes-clear:hover{
  background-color: rgba(255, 255, 255, 0.8);
    color: #2b368f;
    -o-transition:.7s;
  -ms-transition:.7s;
  -moz-transition:.7s;
  -webkit-transition:.7s;
  transition:.7s;
  cursor:pointer;
}

.mes-events-ctas{
  width: 100%;
  display: block;
  padding-bottom: 10px;

}

.mes-newsletter-btn{
  width: 100%;
  max-width: 600px;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.9);
  border: solid 2px #2b368f;
  font-size: 18px;
  line-height: 1.56;
  text-align: center;
  color: #2b368f;
  padding:15px;
  margin: 35px auto;

}

.mes-newsletter-btn:hover{
  color: #ed1c24;
  transition:0.2s;
  border: solid 2px #ed1c24;
}


.mes-newsletter-btn h4{
  font-weight: bold;
  color: #ed1c24;
  margin: 0;
  padding: 0;
  font-size: 18px;
}

.mes-newsletter-btn span{
  font-size: 18px;
}




@media (max-width: 1027px) and (min-width: 725px){

  .mes-event{
  min-width: auto;
  width: 100%;
  display: flex;
  flex-wrap:nowrap;
  justify-content:space-around;
  align-items:center;
  }

  .fall{
    background-position: 80% 0%;
  }

  .mes-event-title{
    min-width: auto;
  }

  .mes-event-title, .mes-event-info h2, .mes-event-info h3, .mes-event-info h4{
    margin: 10px 0px;
  }

  .mes-event-info{
    margin: 0;
  }

  a{
    margin: 0;
  }

  .spring:before{
  content: "";
  left:0;
  bottom: 0;
  position: absolute;
  border-style: none;
  border-width: 0px 0 0 0px;
  border-color: transparent transparent transparent #e98b15;
}

}

@media (max-width: 725px){
  .mes-event{
    width: 100%;
    display: block;
  }

  .mes-newsletter-btn{
    max-width: 331px;

  }

  .mes-header img{
    width: 90%;
  }

  .mes-btn{
    margin: 40px auto 30px;
  }
}
