section {
    padding-top: 115px;
}
.container {
    max-width: 1180px;
}
header {
    height: 115px;
    display: flex;
    align-items: center;
    width: 100%;
}
header .container {
    width: 100%;
}
header .header_right .hr_right .point-menu {
    padding: 10px 0 0 0;
}
header .header_right .hr_right .header_profile.active {
    background: url(../images/arrow_up_white.png) no-repeat right center;
}
header .header_right .hr_right .point-menu a {
    font-size: 12px;
    font-family: "Graphik-Bold";
    line-height: 20px;
    background-position: -2px 2px;
    display: block;
    padding: 0 0 0 30px;
}
.point-menu {
    padding-bottom: 20px;
    margin-bottom: 20px;
}
header .header_right .hr_right .header_profile {
    position: relative;
    top: 0px;
}
header .header_right .hr_right .header_profile span {
    font-size: 14px;
}
header .header_right .hr_right .point-menu a span {
    font-family: "Graphik";
    display: inline-block;
    margin-left: 10px;
}
.point-menu a {
    position: relative;
    margin-bottom: 5px;
    text-transform: none;
}
.point-menu a:before {
    width: 20px;
    height: 20px;
    content: "";
    position: absolute;
    border-radius: 100px;
    border: solid 1px #fff;
    left: 0;
    top: 0;
}
.point-menu a.icon_cml_point:before {
    background: url(../images/purple/icon_cml_point.svg) no-repeat top left;
    background-size: 20px;
}
.point-menu a.icon_cml_purple:before {
    background: url(../images/icon_option.png) no-repeat top left;
    background-size: 20px;
}
header .header_right .hr_right .profile_menu {
    top: 78px;
}
section .section_get_rewards {
    background: #FFD527;
    min-height: 809px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.section_get_rewards_home .container {
    padding: 0;
}
.centering {
    width: 100%;
}
.section_get_rewards .container {
    width: 100%;
}
section .section_howto {
    background:url(../images/bg-pattern.jpg) no-repeat;
    background-size: cover;
    background-position: 100% 0%;
    min-height: 809px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
/* .section_music_concert {
    min-height: 883px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.section_forum {
    min-height: 947px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.section_studio_new {
    min-height: 1027px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
} */
section .section_get_rewards .sgr_bot .reward_box .reward_desc h4 a {
    font-size: 20px;
}
section .section_get_rewards.redeem {
    background: #FFD527;
}
section .section_upload.yellow_bg{
    background:url(../images/bg-pattern.jpg) no-repeat;
    background-size: cover;
    background-position: center;
    padding: 20px 0;
}
section .section_upload .section_step{
    background: transparent;
}
section .section_upload .container{
    background: transparent;
    box-shadow:none;
}
section
    .section_get_rewards
    .sgr_bot
    .reward_box
    .reward_desc
    span.price-purple,
section
    .section_get_rewards.redeem
    .sgr_bot
    .reward_box
    .reward_desc
    span.price {
    color: #000;
}
section .section_get_rewards .sgr_top h2 {
    font-family: "Graphik-Bold";
    color:#000000;
}
section .section_get_rewards .sgr_top span{
    color:#000000;
}
#reward_details_price span.purple {
    font-family: "Graphik-Bold";
    color: #a517a8;
    font-size: 30px;
}
.point-type{
    color: #000000;
    font-family: "Camel-Bold";
    font-size: 20px;
}
#reward_details_price span {
    color: #FFD527;
    font-family: "Camel-Bold";
    font-size: 20px;
}
#reward_details_price span.option,
#reward_details_price span.cml{
    font-size: 30px;
}
#reward_details_price span + br + span{
    color:#000;
}
#reward_details_img {
    width: 100%;
}
.popup_wrapper .popup_box#popup_prize .prize_desc .btn-yellow-primary{
    position: absolute;
    bottom: 60px;
    left: 45px;
}
section .section_get_rewards .sgr_bot .reward_box {
    margin: 0 10px;
    margin-bottom: 50px;
}
section .section_get_rewards.section_get_rewards_home .rewards_wrapper {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}
section .section_get_rewards.redeem .sgr_bot .reward_box {
    margin: 0 10px;
    margin-bottom: 50px;
}
section .section_get_rewards .sgr_bot .reward_box .reward_desc.no-desc {
    height: 190px;
}
section .section_get_rewards .sgr_bot .reward_box .reward_desc.no-desc:before {
    height: 190px;
}
section .section_get_rewards.redeem .sgr_bot .reward_box .reward_desc,
section .section_get_rewards.redeem .sgr_bot .reward_box .reward_desc:before {
    height: 365px;
}
.message-box {
    min-height: 150px;
    display: flex;
    align-items: center;
}
.message-box .container {
    width: 100%;
}
.box-purple {
    background-color: #a517a8;
    color: #fff;
    border-bottom: solid 7px #00a3e0;
}
.box-purple strong {
    font-family: "Graphik-Bold";
}

.box-yellow {
    background-color: #00AF66;
    color: #ffd93c;
    border-bottom: solid 7px #ffd93c;
}
.box-yellow strong {
    font-family: "Graphik-Bold";
}

.box-yellow .container p{
    font-size: 20px;
    line-height: 25px;
}

section .cml_points {
    display: flex;
    align-items: center;
}
section .cml_points .flex {
    width: 100%;
    display: flex;
    align-items: center;
}
section .cml_points .default_btn {
    position: relative;
    right: auto;
    top: auto;
    width: auto;
    transform: none;
    min-width: 100px;
    box-shadow: -7px 7px 0 0 #00a3e0;
}
section .cml_points .cml_points_box.purple_points {
    background: url(../images/icon_option.png) no-repeat left center/50px;
}
section .cml_points .cml_points_box {
    margin-right: 30px;
}
section .section-purple {
    background-color: #C63663;
    min-height: 120px;
    display: flex;
    align-items: center;
}
section .section-purple .container {
    width: 100%;
    color:#fff;
}
.loader {
    display: flex;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
}
.loader.hide {
    display: none !important;
}
.lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
}
.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #ccc;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #ccc transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}
.default_btn.custom-disabled,
.default_btn.disabled {
    background: #e3e3e3;
    box-shadow: -7px 7px 0px #3e3e3e;
    color: #515151;
    cursor: auto;
    border: none;
}
#popup-banner{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    overflow: auto;
    z-index: 1000;
    display: none;
}
#popup-banner .overlay{
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.7);
}
#popup-banner .flex-center .popup_box{
    position: relative;
    margin: 0;
    left: auto;
    top: auto;
    padding: 30px;
    transform: none;
}
#popup-banner img{
    width: 100%;
    height: 100%;
}
#popup-banner .popup_box{
    width: 100%;
    height: 625px;
    padding: 100px 400px 100px 200px;
    max-width: 1140px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    color: #fff;
    line-height: 25px;
    font-size: 15px;
    display: none;
}
#popup-banner .close_btn{
    width: 24px;
    height: 24px;
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
    background: url(../images/icon_close.png) no-repeat center;
    text-indent: -9999px;
}
.popup_wrapper .popup_box#popup_prize .prize_desc .blue_color {
    margin-bottom: 40px;
}
.popup_wrapper .popup_box#popup_prize .prize_desc p {
    font-size: 18px;
}
.section_howto .container {
    width: 100%;
}
.section_howto .row {
    margin: 0 -15px;
    width: 100%;
    display: flex;
}
.section_howto .col2 {
    width: 20%;
}
.section_howto .how-box {
    padding: 10px;
}
.how-image {
    position: relative;
}
.btn_click_here img {
    width: 100%;
}
.btn_click_here {
    position: absolute;
    bottom: 44px;
    left: 50%;
    display: block;
    width: 100px;
    margin: 0 0 0 -50px;
}
.btn_click_here:hover {
    opacity: 0.8;
}
.how-box h4 {
    margin: 0;
    color: #fff;
    text-align: center;
    font-family: "Graphik";
    font-size: 14px;
}
.how-image img {
    width: 100%;
    max-width: 250px;
    margin: 0 auto;
}
section .section_howto .sgr_top h2 {
    font-size: 35px;
    margin-bottom: 20px;
    font-family: "Graphik-Bold";
    color: #000000;
    line-height: 35px;
}
section .section_howto .sgr_top {
    color: #000000;
    margin-bottom: 80px;
}
section .section_has_slider .studio_slider .slick-next {
    background: url(../images/arrow_right_yellow.png) no-repeat center;
    width: 24px;
    height: 24px;
    right: 10px;
    z-index: 10;
}
section .section_has_slider .studio_slider .slick-prev {
    background: url(../images/arrow_left_yellow.png) no-repeat center;
    width: 24px;
    height: 24px;
    left: 10px;
    z-index: 10;
}
section .section_has_slider .studio_slider .slick-next:before,
section .section_has_slider .studio_slider .slick-prev:before {
    display: none;
}
.how-mobile {
    display: none !important;
}
section .section_get_rewards.redeem .sgr_top {
    color: #fff;
}
@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.popup_wrapper .popup_box#redeem_no_success,
.popup_wrapper .popup_box#redeem_success {
    background: url('../images/background-popup-redeem.jpg');
    background-size: cover;
    background-position: center;
    color: #000;
}
.popup_wrapper .popup_box#redeem_no_success.gradient,
.popup_wrapper .popup_box#redeem_success.gradient {
    background-color: #FFD527;
    background-image: -webkit-linear-gradient(150deg, #FFD527 35%, #61266f 35%);
    color: #fff;
}
.popup_wrapper .popup_box#redeem_no_success h3,
.popup_wrapper .popup_box#redeem_success h3 {
    color: #000;
}
#popup-welcome img {
    width: 100%;
    height: 100%;
}
.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
}
.flex-center .popup_box {
    position: relative;
    margin: 0;
    left: auto;
    top: auto;
    padding: 30px;
    transform: none;
}
section .section_upload.tnc_redeem .section_tnc ol li strong{
    color:#000000;
}

.section-scan .container .scan-wrapper{
    background:#FFFFFF;
    padding: 30px 0px 30px 0px;
}
section .section_upload.section-scan .section_step{
    background: #FFD527;
}
.referral_box{
    text-align: center;
    width: 50%;
    display: block;
    margin: auto;
}

.referral_box p.referral-info{
    margin-top:10px;
    font-size: 14px;
}
.supload_btn.text-center{
    text-align: center!important;
}

.info_box{
    text-align:center;
    margin-bottom:50px;
}
.info_box h4.info-penting{
    margin-bottom: 15px;
    margin-top:30px;
    color: #003C71;
    font-size: 16px;
}

.info_box p{
    font-size:14px;
    margin-bottom:10px;
}
.section_studio_new .slick-track,
.section_banner.studio .slick-track{
    margin-left:0;
    margin-right:0;
}
section .section_banner.studio .sproject_box .sproject_desc .project_name.letter-spacing-1{
    letter-spacing: 1px;
}
@media only screen and (max-width: 767px) {
    section .section_get_rewards {
        min-height: 809px;
        display: block;
    }
    header {
        height: 60px;
    }
    section {
        padding-top: 60px;
    }
    .message-box.box-purple {
        padding: 0 20px;
        min-height: 100px;
    }
    .message-box.box-purple br {
        display: none;
    }
    .btn_click_here {
        bottom: 55px;
    }
    section .section_upload .supload_title h3 {
        font-size: 20px;
    }
    section .section_howto .sgr_top {
        padding: 30px;
        margin: 0 0 40px 0;
    }
    .how-desktop {
        display: none !important;
    }
    .how-mobile {
        display: block !important;
    }
    section .cml_points {
        display: block;
    }
    section .cml_points .cml_points_box {
        margin: 0 0 20px 0;
    }
    .small_container,
    .long_container {
        padding: 40px 0;
    }
    header .profile_menu_mobile a {
        font-size: 14px;
    }
    header .profile_menu_mobile a.icon_cml_point {
        background-size: 24px;
        font-family: "Graphik-Bold";
    }
    header .profile_menu_mobile a.icon_cml_purple {
        background-size: 24px;
        font-family: "Graphik-Bold";
    }
    header .profile_menu_mobile a.icon_cml_point span,
    header .profile_menu_mobile a.icon_cml_purple span {
        font-family: "Graphik";
    }
    section .cml_points {
        padding: 20px;
        display: flex;
        flex-direction: column;
    }

    .cml_points .flex {
        display: flex;
        width: 100%;
    }
    section .cml_points .cml_points_box,
    section .cml_points .cml_points_box.purple_points {
        background-size: 30px;
        padding-left: 40px;
        width: 50%;
        font-size: 11px;
        height: 40px;
    }
    section .cml_points .cml_points_box span {
        font-size: 18px;
    }
    section .cml_points .default_btn {
        margin-left: auto;
        width: 100%;
    }
    section .section_get_rewards.redeem {
        background: #FFD527;
        background-size: 100%;
        background-position: 0 0;
    }
    .section_howto .row {
        margin: 0 0;
        width: 100%;
        display: block;
    }
    .section_howto .col2 {
        width: 100%;
    }
    section .section_upload .section_step .sstep_box {
        min-height: 176px;
    }
    .studio_slider .slide-item {
        padding: 0 20px;
    }
    section .section_get_rewards .studio_slider .slick-next {
        right: 10px;
    }
    section .section_get_rewards .studio_slider .slick-prev {
        left: 10px;
    }
    section .section_get_rewards .container {
        padding: 0;
    }
    section .section_get_rewards_home .container {
        padding: 0 20px;
    }
    section .section_get_rewards .sgr_bot .reward_box,
    section .section_get_rewards.redeem .sgr_bot .reward_box {
        margin: 0 auto;
        padding-bottom: 20px;
    }
    .section_studio_new .slick-track,
    .section_banner.studio .slick-track{
        margin-left:auto;
        margin-right:auto;
    }
}
@media only screen and (max-width: 480px) {
    #popup-banner .flex-center .popup_box{
        top: 30%;
    }
    #popup-welcome img{
        height:auto;
    }
    section .section_upload .supload_wrapper .supload_btn .pink_color{
        display: block;
        margin-right:0px;
        margin-bottom: 15px;
    }
    .box-yellow .container p {
        font-size: 17px;
        padding-left: 15px;
    }
}