league

.ggbox_league hr {
    margin: 5px 0;
}

.league_title {
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    color: #ffffff;
}

.leagueimg_T {
    width: 42px;
}

.ggtxtlevel {
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    color: #ffffff;
}

.txtlevel4 {
    font-size: 13px !important;
}

.ggtxtlevelimg {
    width: 25px;
}

.txtgift {
    animation: scletxtgift 4s infinite;
    font-size: 19px;
    font-weight: bold;
    text-align: center;
    color: #ffffff;
}

.ggbox_league1B,
.ggbox_league2B,
.ggbox_league3B,
.ggbox_league4B {
    height: 360px;
    padding: 5px 15px;
}

.ggbox_league1A {
    border: #a407ff 2px solid;
    animation: borderggbox_league1A 4s infinite;
    padding: 0;
    margin: 0;
    border-radius: 7px;
    background: linear-gradient(to bottom, #8a2387, #e94057, #f27121);
}

.ggbox_league1B {

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 100%;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}



.txt-free{
    animation: txt_free 1s infinite;
    color: #e94057;
    font-size: 22px;
    font-weight: bold;
}

@keyframes txt_free {

    5%,
    50% {
        color: #a540e9
    }

    10% {
        color: #fd00b1
    }

    15% {
        color: #f12711
    }

    20%,
    70% {
        color: #a540e9
    }

    25% {
        color: #fd00b1
    }

    30%,
    100% {
        color: #f12711
    }

}

.bg-free{
    animation: regis-free 2s infinite;
    background: #e94057;
    color: #ffffff;
}

@keyframes regis-free {

    5%,
    50% {
        background: #e94057
    }

    10% {
        background: #21ed8e
    }

    15% {
        background: #f12711
    }

    20%,
    70% {
        background: #21ed8e
    }

    25% {
        background: #ed213a
    }

    30%,
    100% {
        background: #f12711
    }

}


@keyframes borderggbox_league1A {

    5%,
    50% {
        border: #a407ff 2px solid;
        background: linear-gradient(to bottom, #8a2387, #e94057, #f27121);
    }

    10% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f27121, #e94057, #8a2387);
    }

    15% {
        border: #a407ff 2px solid;
        background: linear-gradient(to bottom, #8a2387, #f27121, #e94057);
    }

    20% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #e94057, #8a2387, #f27121);
    }

    25% {
        border: #a407ff 2px solid;
        background: linear-gradient(to bottom, #f27121, #e94057, #8a2387);
    }

    30% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #8a2387, #f27121, #e94057);
    }

    35% {
        border: #a407ff 2px solid;
        background: linear-gradient(to bottom, #e94057, #8a2387, #f27121);
    }

    40% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f27121, #e94057, #8a2387);
    }
}


@keyframes scletxtgift {

    5%,
    50% {
        transform: scale(1);
    }

    10% {
        transform: scale(0.7);
    }

    15% {
        transform: scale(1);
    }

    20% {
        transform: scale(1);
    }

    25% {
        transform: scale(1);
    }

    30% {
        transform: scale(0.8);
    }

    35% {
        transform: scale(1);
    }

    40% {
        transform: scale(1);
    }
}




.ggbox_league2A {
    border: #f57c19 2px solid;
    animation: borderggbox_league2A 4s infinite;
    padding: 0;
    margin: 0;
    border-radius: 7px;
    background: linear-gradient(to bottom, #f12711, #f5af19);
}

.ggbox_league2B {

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 100%;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

@keyframes borderggbox_league2A {

    1%,
    100% {
        border: #f57c19 2px solid;
        background: linear-gradient(to bottom, #f12711, #f5af19);
    }

    12% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f5af19, #f12711);
    }

    19% {
        border: #f57c19 2px solid;
        background: linear-gradient(to bottom, #f12711, #f5af19);
    }

    23% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f5af19, #f12711);
    }

    28% {
        border: #f57c19 2px solid;
        background: linear-gradient(to bottom, #f12711, #f5af19);
    }

    32% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f5af19, #f12711);
    }

    39% {
        border: #f57c19 2px solid;
        background: linear-gradient(to bottom, #f12711, #f5af19);
    }

    45% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #f12711, #f5af19);
    }
}



.ggbox_league3A {
    border: #93291e 2px solid;
    animation: borderggbox_league3A 4s infinite;
    padding: 0;
    margin: 0;
    border-radius: 7px;
    background: linear-gradient(to bottom, #ed213a, #93291e, #880414);
}

.ggbox_league3B {

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 100%;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

@keyframes borderggbox_league3A {

    5%,
    65% {
        border: #93291e 2px solid;
        background: linear-gradient(to bottom, #ed213a, #93291e, #880414);
    }

    7% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #880414, #ed213a, #93291e);
    }

    10% {
        border: #93291e 2px solid;
        background: linear-gradient(to bottom, #93291e, #880414, #ed213a);
    }

    15% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #ed213a, #93291e, #880414);
    }

    28% {
        border: #93291e 2px solid;
        background: linear-gradient(to bottom, #880414, #ed213a, #93291e);
    }

    30% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #93291e, #880414, #ed213a);
    }

    40% {
        border: #93291e 2px solid;
        background: linear-gradient(to bottom, #93291e, #880414, #ed213a);
    }

    70% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #ed213a, #93291e, #880414);
    }
}



.ggbox_league4A {
    border: #004e92 2px solid;
    animation: borderggbox_league4A 4s infinite;
    padding: 0;
    margin: 0;
    border-radius: 7px;
    background: linear-gradient(to bottom, #000428, #004e92);
}

.ggbox_league4B {

    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    width: 100%;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15) !important;
}

@keyframes borderggbox_league4A {

    5%,
    80% {
        border: #004e92 2px solid;
        background: linear-gradient(to bottom, #000428, #004e92);
    }

    10% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #004e92, #000428);
    }

    15% {
        border: #004e92 2px solid;
        background: linear-gradient(to bottom, #000428, #004e92);
    }

    20% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #004e92, #000428);
    }

    25% {
        border: #004e92 2px solid;
        background: linear-gradient(to bottom, #000428, #004e92);
    }

    30% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #004e92, #000428);
    }

    35% {
        border: #004e92 2px solid;
        background: linear-gradient(to bottom, #000428, #004e92);
    }

    40% {
        border: #ffffff 2px solid;
        background: linear-gradient(to bottom, #000428, #004e92);
    }
}



.rotate-vert-right {
    -webkit-animation: rotate-vert-right 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
    animation: rotate-vert-right 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
}

@-webkit-keyframes rotate-vert-right {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0);
        -webkit-transform-origin: right;
        transform-origin: right;
    }

    100% {
        -webkit-transform: rotateY(360deg);
        transform: rotateY(360deg);
        -webkit-transform-origin: right;
        transform-origin: right;
    }
}

@keyframes rotate-vert-right {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0);
        -webkit-transform-origin: right;
        transform-origin: right;
    }

    100% {
        -webkit-transform: rotateY(360deg);
        transform: rotateY(360deg);
        -webkit-transform-origin: right;
        transform-origin: right;
    }
}



.rotate-vert-left {
    -webkit-animation: rotate-vert-left 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
    animation: rotate-vert-left 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
}

@-webkit-keyframes rotate-vert-left {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0);
        -webkit-transform-origin: left;
        transform-origin: left;
    }

    100% {
        -webkit-transform: rotateY(360deg);
        transform: rotateY(360deg);
        -webkit-transform-origin: left;
        transform-origin: left;
    }
}

@keyframes rotate-vert-left {
    0% {
        -webkit-transform: rotateY(0);
        transform: rotateY(0);
        -webkit-transform-origin: left;
        transform-origin: left;
    }

    100% {
        -webkit-transform: rotateY(360deg);
        transform: rotateY(360deg);
        -webkit-transform-origin: left;
        transform-origin: left;
    }
}




.rotate-hor-bottom {
    -webkit-animation: rotate-hor-bottom 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
    animation: rotate-hor-bottom 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
}


@-webkit-keyframes rotate-hor-bottom {
    0% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }

    100% {
        -webkit-transform: rotateX(360deg);
        transform: rotateX(360deg);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }
}

@keyframes rotate-hor-bottom {
    0% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }

    100% {
        -webkit-transform: rotateX(360deg);
        transform: rotateX(360deg);
        -webkit-transform-origin: bottom;
        transform-origin: bottom;
    }
}


.rotate-hor-top {
    -webkit-animation: rotate-hor-top 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
    animation: rotate-hor-top 0.5s cubic-bezier(0.645, 0.045, 0.355, 1.000) both;
}


@-webkit-keyframes rotate-hor-top {
    0% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: top;
        transform-origin: top;
    }

    100% {
        -webkit-transform: rotateX(360deg);
        transform: rotateX(360deg);
        -webkit-transform-origin: top;
        transform-origin: top;
    }
}

@keyframes rotate-hor-top {
    0% {
        -webkit-transform: rotateX(0);
        transform: rotateX(0);
        -webkit-transform-origin: top;
        transform-origin: top;
    }

    100% {
        -webkit-transform: rotateX(360deg);
        transform: rotateX(360deg);
        -webkit-transform-origin: top;
        transform-origin: top;
    }
}


.ggbox_league1A .alert,
.ggbox_league2A .alert,
.ggbox_league3A .alert,
.ggbox_league4A .alert {
    margin-bottom: 0px !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    height: 150px;
}


.ggbox_league1A,
.ggbox_league2A,
.ggbox_league3A,
.ggbox_league4A {
    transition: all .5s ease-in-out;
}

.ggbox_league1A:hover,
.ggbox_league2A:hover,
.ggbox_league3A:hover,
.ggbox_league4A:hover {
    box-shadow: 0px -10px 25px rgba(158, 89, 172, 0.658) !important;
    transform: scale(1.1);
}