/*@font-face {
    font-family: 'Montserrat-ExtraBold';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Montserrat/Montserrat-ExtraBold.ttf') format('truetype');
    font-display: swap;
}*/

/*@font-face {
    font-family: 'Montserrat-Bold';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Montserrat/Montserrat-Bold.ttf') format('truetype');
    font-display: swap;
}*/

@font-face {
    font-family: Inter-Bold;
    /*src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Inter-VariableFont_slnt,wght.ttf') format('truetype');*/
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Inter_28pt-Bold.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: Inter;
    /*src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Inter-VariableFont_slnt,wght.ttf') format('truetype');*/
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Inter_28pt-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Khand-SemiBold';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Khand-SemiBold.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: Inter-SemiBold;
    src: url('/fonts/Inter/Inter_18pt-SemiBold.ttf') format('truetype');
    font-display: swap;
}
/*@font-face {
    font-family: 'Raleway-Regular';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Raleway/Raleway-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'RobotoMono';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Roboto_Mono/static/RobotoMono-Light.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'RobotoMono-Bold';
    src: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/fonts/Roboto_Mono/static/RobotoMono-Bold.ttf') format('truetype');
    font-display: swap;
}*/

body, html {
    overflow-x: hidden !important;
    font-family: Inter !important;
}

body {
    margin: 0px !important;
    padding: 0px !important;
    color: #fff !important;
    background: #181818;
    overflow-x: hidden !important;
}

.sidenav li a {
    font-family: Inter;
    font-weight: 400;
}
h1, h2, h3, h4, h5 {
    font-weight:800;
    font-family: Inter-Bold;
}
h5{
    font-size:14px !important;
    line-height:35px;
    text-transform:uppercase;
}
p{
    font-size:1.3rem;
}
/*body {
    background-image: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/images/backgroundBKN.jpg');
    background-repeat: no-repeat;
    height: 100%;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #000;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    overflow-x:hidden !important;
}*/

/*body {
    font-family: Montserrat-Regular;
    background-color: #c0c0c0;
    background-image: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/images/bgSF.jpg');
    background-repeat: no-repeat;
    height: 100%;
    background-repeat: repeat;
    background-position:center center;
    background-attachment:fixed;
}*/
.tng-blue {
    background-color: #0064FF;
}
.tng-blue-text {
    color: #0064FF;
}
.tng-blue-btn {
    border-radius: 22px !important;
    background-color: #0064FF;
    color: #fff;
    border: 1px solid #0064FF;
    box-shadow: none;
    padding-left: 25px;
    padding-right: 25px;
    margin-bottom: 10px;
}
    .tng-blue-btn:hover {
        background-color: #fff;
        color: #0064FF;
        border: 1px solid #fff;
    }
.tng-white-btn {
    border-radius: 22px !important;
    background-color: #fff;
    color: #000;
    border: 1px solid #000;
    box-shadow: none;
    padding-left: 25px;
    padding-right: 25px;
    margin-bottom: 10px;
}
    .tng-white-btn:hover {
        background-color: #000;
        color: #fff;
        border: 1px solid #000;
    }
.tng-black-btn {
    border-radius: 22px !important;
    background-color: #df0055;
    color: #fff;
    font-weight:bold;
    border: 1px solid #000;
    box-shadow: none;
    padding-left: 25px;
    padding-right: 25px;
    margin-bottom: 10px;
}

    .tng-black-btn:hover {
        background-color: #fff;
        color: #000;
        border: 1px solid #000;
    }
.tng-green-btn {
    border-radius: 22px !important;
    background-color: #0d8040;
    color: #fff;
    border: 1px solid #0d8040;
    box-shadow: none;
    padding-left: 25px;
    padding-right: 25px;
    margin-bottom: 10px;
}

    .tng-green-btn:hover {
        background-color: #fff;
        color: #0d8040;
        border: 1px solid #0d8040;
    }

.btn {
    border-radius: 22px !important;
}
.mainLogo{
    max-height:40px;
}
.logo {
    height: 40px;
    width: auto;
}
.vs-img{
    height:15px;
}
.Sigri Solution Sdn BhdLogo{
    max-height:30px;
    float:right;
    margin-top:20px;
    margin-right:25px;
}
.order-history-logo {
    max-height: 60px;
    padding-bottom: 10px;
    margin-bottom:20px;
    margin-top:20px;
}
.bolaLogo{
    max-height:80px;
    float:right;
    padding-bottom:10px;
}
.sp-error{
    text-align:center;
    /*margin-left:50px;*/
    margin-top:-10px;
    padding:10px;
}
.sp-neg-margin-top-10 {
    margin-top: -10px !important;
}
.sp-margin-top-10 {
    margin-top: 10px !important;
}
.sp-margin-top-20{
    margin-top:20px !important;
}
.sp-bottom-border{
    border-bottom:1px solid #fff;
}
.sp-padding-5{
    padding: 5px !important;
}
.sp-padding-10 {
    padding: 10px !important;
}
.sp-padding-left-20{
    padding-left:20px;
}
sp-padding-bottom-10{
    padding-bottom:40px !important;
}
.sp-margin-right-10 {
    margin-right: 10px !important;
}
.sp-padding-top-10{
    padding-top:10px !important;
}
.sp-padding-top-20 {
    padding-top: 20px !important;
}
.seriesTitle {
    background: #004CA1;
    /*background:#333;*/
    color: #fff;
    margin-top: 0px;
    /*padding:8px;*/
    margin-bottom:0px !important;
}
    .seriesTitle .sp-title {
        font-size: 14px;
        line-height: 60px;
        font-weight: 500;
        text-transform: uppercase;
    }

.seriesTitle h4{
    text-transform:uppercase;
    /*margin-left:25px;*/
    /*text-shadow: 1px 1px 5px #222;*/
}
.sp-upper{
    text-transform:uppercase;
}
.series-logo {
    height: 60px;
}
.prefix {
    color: rgba(0,0,0,0.6);
}
.prefix.active{
    color:#333 !important;
}
input {
    color: #fff;
    border-bottom: 1px solid #fff !important;
    -webkit-box-shadow: 0 1px 0 0 #fff !important;
    -moz-box-shadow: 0 1px 0 0 #fff !important;
    box-shadow: 0 1px 0 0 #fff !important;
}
input + label{
    color:#fff !important;
}
    input:focus {
        border-bottom: 1px solid #fff !important;
        -webkit-box-shadow: 0 1px 0 0 #fff !important;
        -moz-box-shadow: 0 1px 0 0 #fff !important;
        box-shadow: 0 1px 0 0 #fff !important;
    }
input:focus + label{
    color:#fff !important;
}
    input[type="submit"] {
        border: 0px none #fff !important;
        box-shadow: 0 0px 0 0 #fff !important;
        color:#fff !important;
    }
[type="checkbox"] + label::before, [type="checkbox"]:not(.filled-in) + label::after {
    border: 2px solid #c5c5c5;
}
.prefix{
    color: #fff;
}
.prefix .active{
    color:#fff !important;
}

[type="radio"].with-gap + label:before {
    border-radius: 50%;
    border: 2px solid #c5c5c5;
}
[type="radio"].with-gap:checked + label:before {
    border-radius: 50%;
    border: 2px solid #c5c5c5;
}
[type="radio"].with-gap:checked + label:after {
    border-radius: 50%;
    border: 2px solid #c5c5c5;
    background-color: #c5c5c5;
    z-index: 0;
    -webkit-transform: scale(.5);
    -moz-transform: scale(.5);
    -ms-transform: scale(.5);
    -o-transform: scale(.5);
    transform: scale(.5);
}
input:disabled{
    background-color:#c5c5c5 !important;
    color:#333 !important;
    padding-left:5px !important;
}
::placeholder{
    color:rgba(0,0,0,0.6);
}
:-ms-input-placeholder {
    color: rgba(0,0,0,0.6);
}
::-ms-input-placeholder {
    color: rgba(0,0,0,0.6);
}
@media screen and (min-width:1024px) {
    header {
        background-color: rgba(0,0,0,0.8) !important;
        color: #0d8040;
        padding: 20px 100px;
        text-align: left;
        z-index: 99;
        -webkit-box-shadow: 0 -2px 25px 5px #010511;
        box-shadow: 0 2px 25px 5px #010511;
    }
    footer{
        color:#fff;
        padding:20px 100px;
        text-align:left;
    }

    .ticket-game-holder{
        -webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        padding:3% !important;
        /*background-color:rgba(255,255,255,1);*/
        -webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
        box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
    }
    .sp-margin-left-50-force {
        margin-left: 50% !important;
    }
}
@media screen and (max-width:1024px){
    header {
        background-color: #363636 !important;
        color: #0d8040;
        padding-top: 10px;
        padding-bottom: 10px;
        text-align: center;
        z-index: 99;
    }
    footer{
        /*background-color:#041849;*/
        color:#fff;
        padding-top:10px;
        padding-bottom:10px;
        text-align:center;
        /*-webkit-box-shadow: 0 -2px 25px 5px #010511;
        box-shadow: 0 2px 25px 5px #010511;*/
    }

    .ticket-game-holder {
        /*-webkit-border-radius: 10px 10px 10px 10px;
        border-radius: 10px 10px 10px 10px;
        width:100%;
        padding:1%;*/
        margin-top: 10px;
        background-color: rgba(255,255,255,0.3);
        /*-webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
        box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);*/
    }
    .sp-margin-left-50-force {
        /*margin-left: 50% !important;*/
    }
}
.gameHolder {
    /*border: 2px solid #333;*/
    color:#000 !important;
    width: 100%;
    background-image: url('https://static.sigrisolution.com/supergtmalaysia/tickets/images/images/game-holder-background.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    margin-top: 20px;
    -webkit-border-radius: 10px 10px 10px 10px !important;
    border-radius: 10px 10px 10px 10px !important;
    -webkit-box-shadow: 3px 3px 5px 1px #333;
    box-shadow: 3px 3px 5px 1px #333;
}

    .gameHolder .series-logo {
        height: 120px;
        margin: auto !important;
        margin-top: 5px !important;
    }

.teamHolder {
    width: 100%;
}

    .teamHolder tr td {
        padding: 8px;
        text-align: center !important;
    }

    .teamHolder .leftTeam {
        width: 45%;
        text-align: center;
        border-right: 0px none #000 !important;
    }

        .teamHolder .leftTeam img {
            height: 80px;
        }

    .teamHolder .vs {
        border-right: 0px none #000 !important;
        border-left: 0px none #000 !important;
    }

        .teamHolder .vs img {
            height: 20px;
        }

    .teamHolder .rightTeam {
        width: 45%;
        text-align: center;
        border-left: 0px none #000 !important;
    }

        .teamHolder .rightTeam img {
            height: 80px;
        }

.gameHolder table tr:first-child td {
    border-top: 0;
}

.gameHolder table tr:last-child td {
    border-bottom: 0;
}

.gameHolder table tr td:last-child {
    border-right: 0;
    border-left: 0;
}

.gameHolder table tr td:first-child {
    border-left: 0;
}

.gameHolder table tr td {
    border-right: 2px solid #000;
    /*border-bottom: 2px solid #fff;*/
}

.gameHolder table tr td {
    border-collapse: collapse;
}
.subprice{
    font-size: 11px;
    color: #fff;
    padding: 0px;
    margin: 0px;
    margin-right: 20px;
    padding-bottom: 20px;
}
.ticket-tandc-holder {
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
    /*width:98% !important;*/
    /*margin-left:1% !important;*/
    padding: 3% !important;
    background-color:rgba(255,255,255,1) !important;
    -webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
    box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
}
.sp-ticket {
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 20px;
    padding-bottom: 40px;
    border: 1px solid rgba(0,0,0,0.05);
    -webkit-border-radius: 20px 20px 20px 20px;
    border-radius: 20px 20px 20px 20px;
    -webkit-box-shadow: 1px 1px 10px 2px rgba(0,0,0,0.05);
    box-shadow: 1px 1px 10px 2px rgba(0,0,0,0.05);
}
.sp-ticket-header {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
    align-items: center;
    border-bottom: 3px solid #333;
}
.ticket-category-holder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    text-align: center;
    align-items: center;
    text-transform:uppercase;  
}
.ticket-cat-detail {
    background-color: black;
    color: #fff;
    padding: 10px;
    font-weight: bold !important;
}
.ticket-cat-detail:first-child{
    margin-right:5px;
}
.sp-margin-bottom-10 {
    margin-bottom: 10px !important;
}
.sp-margin-top-20 {
    margin-top: 20px !important;
}
.sp-bold {
    font-weight: bold;
}
.sp-ticket {
    width: 100%;
    background-color: #fff;
    margin-top: 20px;
    margin-bottom: 20px;
    page-break-after: always !important;
}
.sp-ticket-tandc-holder img {
    width: 90% !important;
    /*margin:auto !important;*/
}
.sp-ticket-seat tr td{
    width:33%;
    text-align:center;
}
.sp-ticket-seat tr:last-child td{
    border: 1px solid #000; 
    color:#333;
    font-weight:bold;
}
.sp-barcode{
    max-width:200px !important;
}
.sp-justify {
    text-align: justify !important;
}
.sp-extra-spacing-li li{
    margin-bottom:10px !important;
}
.game-row-holder {
    display: flex;
    flex-wrap: wrap;
}
#bodyHolder_pnlGames{
    padding-left:0px !important;
    padding-right:0px !important;
}
    #bodyHolder_pnlGames .col {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }
    .game-card {
    }

    .game-card .game-card-header {
        background-color: #363636;
        display: flex;
        width: 100%;
        height: 100px;
    }

        .game-card .game-card-header .game-card-date {
            width: 180px;
            padding: 0px !important;
            margin-left: 10px;
            float: left;
        }

            .game-card .game-card-header .game-card-date .date-part {
                float: left;
            }

                .game-card .game-card-header .game-card-date .date-part h4 {
                    /*font-family: Montserrat-Black;*/
                    font-family: 'Inter';
                    font-size: 50px;
                    text-transform: uppercase;
                }

            .game-card .game-card-header .game-card-date .month-part {
                /*font-family: Montserrat-Black;*/
                font-family: 'Inter';
                text-transform:uppercase;
                float: left;
                text-align: center;
                font-weight: bold;
                margin-left: 6px;
                margin-top: 25px;
                letter-spacing: 2px;
            }

        .game-card .game-card-header .game-card-link {
            width: 50%;
            padding-top: 30px;
            margin-right: 10px;
            margin-left: auto;
            order: 2;
            text-align: center;
        }

        .game-card .game-card-header .game-card-message {
            width: auto;
            position: relative;
            top: -20px;
            color: #fff;
            background-color: #f00;
            padding: 5px;
            float: left;
            border: 1px solid #c5c5c5;
        }

    .game-card .game-card-body {
        background-color: #fff;
    }

.sp-light-grey {
    background-color: #fff !important;
    color: #fff !important;
}

.game-card .game-card-body .card-series-logo {
    width: 40px !important;
    margin-top: 10px;
}

.game-card .game-card-body .team-logo img {
    height: 60px !important;
    margin-top:10px;
    /*margin:auto !important;*/
}

.game-card .game-card-body .card-game-time {
}

    .game-card .game-card-body .card-game-time span {
        padding: 0px !important;
        margin: 0px !important;
        font-size: 10px;
        color: #A7A9AC;
    }

    .game-card .game-card-body .card-game-time h4 {
        /*font-family: Heathergreen;*/
        font-family: 'Khand-SemiBold';
        font-size: 22px;
        font-weight:600;
        padding: 0px !important;
        margin: 0px !important;
        line-height: 30px;
    }

        .game-card .game-card-body .card-game-time h4:first-line {
            /*font-family: Heathergreen;*/
            font-family: 'Khand-SemiBold';
            font-size: 40px;
            padding: 0px !important;
            margin: 0px !important;
            line-height: 50px;
        }

    .game-card .game-card-body .card-game-time span {
        font-size: 10px;
        color: #A7A9AC;
    }

.game-card .game-card-body .team-name {
    margin-top: -15px;
    font-size: 11px;
    width: 95%;
    margin-left: auto;
    margin-right: auto;
}

    .game-card .game-card-body .team-name span {
        font-size: 11px;
        /*color: #A7A9AC;*/
        text-transform: uppercase;
        color: #333;
    }
    .game-card .game-card-body .team-name span:last-child{
        font-size:9px;
    }
.sp-rounded-holder {
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
    /*width: 48% !important;*/
    /*margin-left: 1% !important;*/
    padding: 3% !important;
    background-color: rgba(255,255,255,1);
    -webkit-box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
    box-shadow: 2px 2px 10px 2px rgba(0,0,0,0.3);
}
/*Rev2*/
.top-holder-cover {
    position: relative;
    /*height: 677px;*/
    background-color: #4c0026;
}

.top-holder-background {
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: #000;
    z-index: -6 !important;
    width: 100%;
    height: 677px;
    background-position: center;
    background-size: cover;
}

.top-holder {
    color: #fff;
    /*background-color: #000;
    background-image: url("/images/banner/banner_football.jpg");
    background-size: cover;
    background-position: center;
    overflow-x: hidden;*/
}

.top-holder-menu {
    position: relative;
    z-index: 99;
}

    .top-holder-menu a {
        color: #fff;
        font-family: 'Khand-SemiBold';
        font-size: 20px;
        text-transform: uppercase;
        letter-spacing: 1.2px;
        padding: 5px;
        float: right !important;
        margin-right: 20px;
        -webkit-transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        transition: all 500ms ease;
    }

        .top-holder-menu a:first-child {
            margin-right: 0px !important;
        }

        .top-holder-menu a:hover {
            color: #ff6a00;
        }
.event-card-holder {
    position: relative;
    padding: 5px 5px 5px 5px;
    overflow: hidden;
    color: #fff;
    font-size: 0.8rem;
    font-weight: bold;
    line-height: 18px;
    letter-spacing: 0.05rem;
    width: 100%;
    text-align: right;
    box-shadow: 0px 0 5px 1px rgba(0,0,0,0.1);
}

    .event-card-holder:after {
        content: '';
        position: absolute;
        top: 0;
        left: 15%;
        width: 85%;
        height: 100%;
        background: #333;
        -webkit-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
        transform-origin: 0 100%;
        -webkit-transform: skew(-45deg);
        -ms-transform: skew(-45deg);
        transform: skew(-45deg);
        z-index: -1;
    }

    .event-card-holder .event-title {
        padding: 20px 0px 0px 0px;
        /*font-size:1.2rem !important;*/
    }

footer{
    margin-top:20px !important;
}
.sp-add-message {
    max-height: 50px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-left:1px;
    padding-right:1px;
}
.game-details-holder {
    text-align: center !important;
}
    .game-details-holder span:last-child{
        font-size:10px;
    }
    .game-details-holder:first-child {
        border-right: 1px solid #333;
    }
.sign-up-holder {
    margin: 50px auto;
    width: 100%;
    line-height: 50px;
    min-height: 50px;
    max-width: 470px;
    background-color: #000;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
    /*background: linear-gradient(135deg, #ff7400 0%,#ffa359 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

    .sign-up-holder a {
        color: rgb(239, 108, 0);
        -webkit-transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        transition: all 500ms ease;
    }

    .sign-up-holder:hover {
        color: rgb(239, 108, 0);
    }

        .sign-up-holder:hover a {
            color: #fff;
        }

.login-holder {
    background-color: #fff;
    border:1px solid rgba(0,0,0,0.1);
    border-radius: 15px;
    padding: 20px;
    margin: 0 auto;
    width: 100%;
    min-height: 300px;
    max-width: 450px;
    -moz-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -webkit-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -o-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -ms-transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    transform: scale(1) rotate(10deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
}

.login-holder-background {
    background-color: #fff;
    border-radius: 15px;
    margin: 50px auto;
    width: 100%;
    min-height: 300px;
    max-width: 470px;
    -moz-transform: scale(1) rotate(350deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -webkit-transform: scale(1) rotate(350deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -o-transform: scale(1) rotate(350deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    -ms-transform: scale(1) rotate(350deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
    transform: scale(1) rotate(350deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
       /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,1e150e+100 */
    background: linear-gradient(to bottom, #000000 0%,#1e150e 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.main-container {
    min-height:90vh;
}

.sp-nav-footer a {
    color: #fff;
    border-right: 1px solid #fff;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 20px;
    padding-left: 15px;
}

    .sp-nav-footer a:last-child {
        border: 0px none #000;
    }

    .sp-nav-footer a:hover {
        color: #ff6a00;
    }
.a-black-orange {
    color: #000;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
    .a-black-orange:hover {
        color: rgb(239, 108, 0);
    }

.a-orange-white {
    color: rgb(239, 108, 0);
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

    .a-orange-white:hover {
        color: #fff;
    }
.banner {
    border-top: 1px solid #4a4a4a;
    padding: 0px !important;
    margin: 0px !important;
    position: relative;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
}

.banner-cover {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&1+0,0+61 */
    /*background: linear-gradient(135deg, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 61%,rgba(0,0,0,0) 100%); 
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;*/
}

.content-block{
    color:#fff !important;
    text-align:right;
}
.sp-frow {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.sp-fcol {
    margin-bottom: 20px;
    background-color: #f5f5f5;
}

    .sp-fcol h4 s {
        font-size: 1.98rem;
    }

    @media(max-width:600px) {
        .logo {
            height: auto;
            width: 80%;
        }
        .banner {
            background-image: url('https://static.sigrisolution.com/ligax/images/top-banner-lg-nf.jpg');
            width: 100%;
        }
        .sp-barcode {
            width: 100%;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .banner .content-block {
            top: 140px;
            left: 5%;
            right: 5%;
            position: absolute;
        }

            .banner .content-block h2 {
                font-size: 2.56rem;
            }

            .banner .content-block h3 {
                font-size: 1.92rem;
            }

        .sp-nav-footer a {
            display: block;
            text-align: left;
            color: #fff;
            border: 0px none #000 !important;
            padding-top: 5px;
            padding-bottom: 5px;
            padding-right: 20px;
            padding-left: 15px;
        }

        .sp-br-red {
            border-top: 5px solid #f00;
        }

        .sp-br-yellow {
            border-top: 5px solid #f1c533;
        }

        .sp-br-green {
            border-top: 5px solid #0d8040;
        }

        .sp-fcol {
            width: 80%;
            padding: 3em 1em 3em 1em;
        }

            .sp-fcol h4 {
                font-size: 1.68rem;
            }
                .sp-fcol h4 s {
                    font-size: 1.28rem;
                }
    }

    @media(min-width:601px) {
        .banner {
            background-image: url('https://static.sigrisolution.com/ligax/images/banner_Ligax_lg_ngf.jpg');
            height: 540px !important;
            width: auto;
        }
        .sp-barcode {
            width: 90%;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .banner .content-block {
            top: 180px;
            left: 5%;
            right: 5%;
            position: absolute;
        }

        .sp-br-red {
            border-left: 5px solid #f00;
        }

        .sp-br-yellow {
            border-left: 5px solid #f1c533;
        }

        .sp-br-green {
            border-left: 5px solid #0d8040;
        }

        .sp-fcol {
            width: 30%;
            padding: 3em;
        }
    }

    .event-card-body-border-gs {
    background: linear-gradient(to bottom, #d72346 0%,#fc6985 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute !important;
    top: 0px;
    bottom: 0px;
    left: 0px;
    width: 5px;
}

.event-card-body-border-open-f {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f1c533+0,f8e7ad+100 */
    background: linear-gradient(to bottom, #f1c533 0%,#f8e7ad 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute !important;
    top: 0px;
    bottom: 0px;
    left: 0px;
    width: 5px;
}

.event-card-body-border-open-c {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8dc73e+0,ddf5bb+100 */
    background: linear-gradient(to bottom, #8dc73e 0%,#ddf5bb 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    position: absolute !important;
    top: 0px;
    bottom: 0px;
    left: 0px;
    width: 5px;
}

.responsive-cards {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    width: 100%;
}

.card {
    background-color: #f2f2f2;
    border-radius: 15px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-md */
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
    flex: 1;
    min-width: 300px;
}

    .card h2 {
        font-size: 1.25rem;
        font-weight: 600;
        color: #000;
        margin-bottom: 16px;
    }

    .card p {
        color: #000;
        margin-bottom: 16px;
    }

    .card button {
        background-color: #4299e1;
        color: #fff;
        font-weight: 700;
        padding: 8px 16px;
        border-radius: 5px;
        cursor: pointer;
        transition: background-color 0.3s ease;
        border: none;
    }

        .card button:hover {
            background-color: #2b6cb0;
        }

@media (max-width: 767px) {
    .responsive-cards {
        flex-direction: column;
        width: 100% !important;
    }

    .card {
        width: 100%;
        min-height: 400px !important;
    }

    .soc-med-logo-holder a {
        background-color: #fff;
        border-radius: 60px !important;
        margin: 10px !important;
        padding: 18px;
        font-size: 30px;
        display: block;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .mid-impact-title {
        font-style: italic;
        font-weight: bold;
        font-size: 3rem;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .responsive-cards {
        grid-template-columns: repeat(2, 1fr);
        width: 90% !important;
        margin-left: 5%;
    }

    .card {
        width: 100%;
    }

    .soc-med-logo-holder a {
        background-color: #fff;
        width: 80px;
        height: 80px;
        font-size: 30px;
        margin: 10px !important;
        padding: 18px;
        border-radius: 60px !important;
        display: block;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .mid-impact-title {
        font-style: italic;
        font-weight: bold;
        font-size: 6rem;
    }
}

@media (min-width: 1024px) {
    .responsive-cards {
        grid-template-columns: repeat(3, 1fr);
        width: 70%;
        margin-left: 15%;
    }

    .card {
        width: 100%;
    }

    .soc-med-logo-holder a {
        background-color: #fff;
        width: 80px;
        height: 80px;
        font-size: 30px;
        margin: 10px !important;
        padding: 18px;
        border-radius: 60px !important;
        display: block;
        display: inline-flex;
        justify-content: center;
        align-items: center;
    }

    .mid-impact-title {
        font-style: italic;
        font-weight: bold;
        font-size: 6rem;
    }
}

.card-top-container {
    background-color: #d2d5d6;
    border-radius: 15px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    width: 100%;
    height: 280px;
}

    .card-top-container .card-title {
        font-size: 1.2rem;
        color: #000;
        margin-top: 16px;
        margin-bottom: 16px;
        width: 90%;
        margin-left: 5%;
        padding: 15px;
        font-weight: bold;
        font-family: Inter-SemiBold;
        text-transform: uppercase;
        border-radius: 15px;
        position: relative;
        height: 150px;
        /*box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2), 0 2px 4px -1px rgba(0, 0, 0, 0.02);*/
    }

        .card-top-container .card-title .ticket-price {
            font-size: 1.5rem;
            color: #000;
            width: 90%;
            padding: 0px;
            font-weight: bold;
            font-family: Inter-Bold;
            text-transform: uppercase;
            position: absolute;
            bottom: 10px;
            text-align: right;
        }

            .card-top-container .card-title .ticket-price del {
                color: #000;
                font-size: 1.2rem;
                font-family: Inter;
                text-transform: uppercase;
                margin-right: 10px;
            }

.card-body {
    padding: 10px 24px 10px 24px;
    width: 100%;
    min-height: 280px;
}

    .card-body .card-description {
        font-size: 1rem;
        color: #000;
        margin-bottom: 16px;
    }

.rbtn {
    display: block;
    width: 90%;
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: 5%;
    padding: 12px 24px;
    border-radius: 25px !important;
    background-color: #df0055;
    color: white;
    font-size: 18px;
    font-weight: bold;
    border: none;
    cursor: pointer;
    transition: background-color 0.5s ease;
    font-family: Inter-Bold;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    text-align: center;
    text-transform: uppercase;
}

    .rbtn:hover {
        background-color: #ff0097;
        color: #fff;
    }

    .rbtn i {
        margin-right: 10px;
    }
.checkmark-list {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
    margin-top: 50px;
}

    .checkmark-list li {
        position: relative;
        padding-left: 28px;
        margin-bottom: 6px;
        line-height: 1.5;
        font-size: 18px;
        color: #000;
    }

        .checkmark-list li::before {
            content: '✓';
            position: absolute;
            left: 0;
            top: 0;
            color: #4CAF50;
            font-size: 24px;
            line-height: 1;
        }
.soc-med-logo-holder {
}

    .soc-med-logo-holder a {
        text-decoration: none;
        color: #000;
        -webkit-transition: all 500ms ease;
        -moz-transition: all 500ms ease;
        -ms-transition: all 500ms ease;
        -o-transition: all 500ms ease;
        transition: all 500ms ease;
    }

        .soc-med-logo-holder a:hover {
            opacity: 0.8;
        }

.soc-med-logo-holder {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}