

.eventcon {
    padding: 0 20px;
    background: #3f3f91;
   
}
.eventcon .row {
    max-width: 1366px;
    margin: 0 auto;
}
.eventcon:before,
.eventcon:after {
    content: '';
    display: table;
    width: 100%;
}
.eventwrap { width: 33.3333%; display: inline-block; float: left; padding: 0 30px; text-align: center; clear: none; margin-bottom: 3em; }
.eventwrap img { max-width: 100%; }



/* ---effect--- */
.effectline-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 30px; }
.effectline { position: relative; width: 100%; height: 100%; display: inline-block; overflow: hidden; }
.eline { content: ''; background: rgba(255, 255, 255, 0.5); position: absolute; -webkit-transition: 0.3s; transition: 0.5s; }
.linelv { 
    width: 2px; height: 100%; left: 0; top: 0;
    -ms-transform: translateY(100%); -webkit-transform: translateY(100%); transform: translateY(100%);
}
.lineth { 
    width: 100%; height: 2px; left: 0; top: 0;
    -ms-transform: translateX(-100%); -webkit-transform: translateX(-100%); transform: translateX(-100%); 
}
.linebh { 
    width: 100%; height: 2px; right: 0; bottom: 0;
    -ms-transform: translateX(100%); -webkit-transform: translateX(100%); transform: translateX(100%); 
}
.linerv { 
    width: 2px; height: 100%; right: 0px; bottom: 0;
    -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); transform: translateY(-100%); 
}
.imgwrap { position: relative; }
.imgwrap.hover .linelv,
.imgwrap.hover .lineth,
.imgwrap.hover .linebh,
.imgwrap.hover .linerv { -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0); }
/*
  * Button style from Codrops
  * https://tympanus.net/codrops/
*/
.buttonStyle {
    font-size: 20px; font-weight: 700; color: #fff; text-transform: uppercase; letter-spacing: 0.05em;
    display: inline-block; background: none; outline: none; position: relative; overflow: hidden;
    padding: 0.5em 3em; margin: 30px auto 0; cursor: pointer;
    border: 3px solid #fff; border-radius: 50px; 
    -webkit-transition: all 0.3s; transition: all 0.3s;
}
.buttonStyle:after {
    content: ''; width: 100%; height: 0; background: #fff; opacity: 0;
    position: absolute; top: 50%; left: 50%; z-index: 0;
    -webkit-transition: all 0.3s; transition: all 0.3s;
    -webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    -ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
    transform: translateX(-50%) translateY(-50%) rotate(45deg);
}
.buttonStyle:hover { color: #3e3f91; }   
.buttonStyle:hover:after { height: 260%; opacity: 1; }

.buttonStyle span { z-index: 1; position: relative; }
/*
  * end
*/



.buttonStyle.btn-disable { border:3px solid #404040; background: #404040; cursor: auto; opacity: 0.6; }
.buttonStyle.btn-disable:after { content: none; }
.buttonStyle.btn-disable:hover { color: #fff; } 


.eventwrap h5 { text-transform: uppercase; color: #fff; font-size: 30px; line-height: 1; margin: 10px 0 0; }
.eventwrap.soldout { opacity: 0.6; }

@media (min-width: 992px) {
    .eventwrap:nth-of-type(3n+1) { clear: both; }
}
@media (max-width: 991.98px) { 
    .concert-con { padding-top: 80px; padding-bottom: 80px; }
    .buttonStyle { font-size: 15px; border: 2px solid #fff; margin: 30px auto 0; }

    .eventwrap { width: 100%; }
    .eventwrap h5 { font-size: 25px; }
}
@media (max-width: 575.98px) {
    .headerStyle{ padding: 10px 30px; }
    .concert-con { padding-top: 40px; padding-bottom: 40px; }
    .buttonStyle { font-size: 14px; border: 1px solid #fff; }

    .eventwrap h5 { font-size: 20px; }
}