/* Nexon Game Card Web Form Styles */

/* Import fonts */

/* Import fonts */

/* Nexon Game Card Web Form Styles */
@font-face
{
    font-family: 'KKR';
    src: url('font/kk-regular.eot');
    src: url('font/kk-regular.eot?#iefix') format('embedded-opentype'),url('font/kk-regular.woff') format('woff'),url('font/kk-regular.ttf') format('truetype');
}

@font-face
{
    font-family: 'KKB';
    src: url('font/kk-bold.eot');
    src: url('font/kk-bold.eot?#iefix') format('embedded-opentype'),url('font/kk-bold.woff') format('woff'),url('font/kk-bold.ttf') format('truetype');
}
/* Less variables */
/* Mixins */

.kkr
{
    font-family: KKR, Arial, sans-serif;
}

.kkb
{
    font-family: KKB, Arial, sans-serif;
}

.ti
{
    text-indent: -9999px;
}

.capitalize
{
    text-transform: uppercase;
}

.ls
{
    letter-spacing: 0 /*1.1px*/;
}

.clearfix:after
{
    height: 0;
    content: '';
    visibility: hidden;
    clear: both;
    display: block;
}

.shadow-text
{
    text-shadow: 2px 2px 3px black;
}

.button
{
    width: 89px;
    height: 44px;
    font-family: KKB, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 2px 2px 3px black;
    background: #85004b;
    line-height: 46px;
    position: absolute;
    right: 34px;
    bottom: 46px;
    display: block;
}

.dn
{
    display: none;
}
/* Override default browser styles */

body,
p,
ul,
li,
table,
td,
td,
a,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
figcaption
{
    margin: 0;
    padding: 0;
}
/* Set HTML5 as display block instead of display inline */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section
{
    display: block;
}

body
{
    font: 13px/18px Arial, Verdana, Sans-serif;
    color: black;
    background: white;
}

a
{
    text-decoration: none;
    outline: none;
}



ul
{
    list-style: none;
}

img,
input,
textarea,
select,
button
{
    border: none;
}

table
{
    border-collapse: collapse;
}

a:link,
a:visited
{
    color: #dddddd;
}

a:hover,
a:active
{
    color: #dddddd;
    background-color: #0a3255;
}
/* Main wrapper styles */

#kk-payment
{
    width: 650px;
    height: 480px;
    margin: -240px 0 0 -325px;
    background: white;
    border: 9px solid #1b1c1c;
    position: absolute;
    top: 50%;
    left: 50%;
}

    #kk-payment h1
    {
        width: 237px;
        height: 65px;
        margin: 29px 0 0 34px;
        background: transparent url(../Images/sprites-new.png) -672px -15px no-repeat;
        text-indent: -9999px;
    }

    #kk-payment.add-kk #purchase-summary
    {
    }
/* Third party banner */

#banner
{
    width: 650px;
    height: 90px;
    background: #000;
}

#outsidebanner
{
    width: 650px;
    height: 90px;
    position: relative;
    /*border-bottom: 5px solid #b4e114;*/
}

div.bannerlinks
{
    color: #b4b4b4;
}

    div.bannerlinks ul
    {
        padding: 0;
        position: absolute;
        top: 5px;
        right: 14px;
    }

.bannerlinks li:first-child
{
    border-left-style: none;
}

div.bannerlinks ul li
{
    border-left: 2px solid #333333;
    display: inline;
    list-style-type: none;
    padding: 0 4px 0 8px;
}

div.bannerlinks li
{
    color: #b4b4b4;
    font-size: 12px;
    display: block;
}

    div.bannerlinks li a
    {
        color: white;
        text-decoration: none;
        line-height: 24px;
       
        font-size: 13px;
    }

        div.bannerlinks li a:hover
        {
            color: #dddddd;
            text-decoration:underline
        }



div.footerlinks
{
    color: #b4b4b4;
}

    div.footerlinks ul
    {
        padding: 0;
        position: absolute;
        bottom:1px;
        right: 14px;
    }

.footerlinks li:first-child
{
    border-left-style: none;
}

div.footerlinks ul li
{
    border-left: 2px solid #333333;
    display: inline;
    list-style-type: none;
    padding: 0 4px 0 8px;
}

div.footerlinks li
{
    color: #b4b4b4;
    font-size: 12px;
    display: block;
}

    div.footerlinks li a
    {
        color:  #0054a3;
        text-decoration: none;
        line-height: 46px;
    
        font-size: 13px;
    }

        div.footerlinks li a:hover
        {
            color: #dddddd;
             text-decoration:underline
        }

a.combinecards
{
    width: 100px;
    line-height: 46px;
    position: absolute;
    right: 10px;
    top: 4px;
    display: block;
    font-weight: bold;
    color: #b4b4b4;
}



a.support
{
    width: 170px;
    line-height: 46px;
    position: absolute;
    right: 90px;
    top: 4px;
    display: block;
    font-weight: bold;
    color: #b4b4b4;
}

a.backshop
{
    line-height: 46px;
    position: absolute;
    right: 14px;
    bottom: 1px;
    display: block;
    color: #b4b4b4;
    font-weight: bold;
    font-size: 13px;
}

    a.combinecards:hover, a.support:hover, a.backshop:hover
    {
        color: #dddddd;
    }






/* Content contains pin form, purchase summary/information and success/fail messages */

#content
{
    width: 650px;
    height: 379px;
    padding-top: 1px;
    background: white url(../Images/sprites-new.png) 0 0 no-repeat;
    position: relative;
}

    #content form
    {
        width: 427px;
        margin: 30px auto 0;
        margin-left: 30px;
    }



        #content form h2
        {
            margin-bottom: 8px;
            font-family: KKR, Arial, sans-serif;
            font-size: 16px;
            text-align: center;
            text-transform: uppercase;
            letter-spacing: 0 /*1.1px*/;
            cursor: default;
        }

        #content form p
        {
            border: 10px solid rgba(0, 84, 163, 0.15);
        }

            #content form p:after
            {
                height: 0;
                content: '';
                visibility: hidden;
                clear: both;
                display: block;
            }

        #content form label
        {
            display: none;
        }

        #content form input
        {
            width: 318px;
            height: 44px;
            padding: 0 11px;
            font-size: 15px;
            color: black;
            background: #eeeeee;
            float: left;
        }

            #content form input::-webkit-input-placeholder
            {
                color: #4d4d4d;
            }

            #content form input:-moz-placeholder
            {
                color: #4d4d4d;
            }

            #content form input::-moz-placeholder
            {
                color: #4d4d4d;
            }

            #content form input:-ms-input-placeholder
            {
                color: #4d4d4d;
            }

            #content form input:focus
            {
                background-color: #ffffff;
            }

        #content form button
        {
            width: 67px;
            height: 44px;
            font-family: KKB, Arial, sans-serif;
            font-size: 12px;
            font-weight: bold;
            color: white;
            text-transform: uppercase;
            text-shadow: 2px 2px 3px black;
            background: #85004b;
            position: relative;
            float: left;
            cursor: pointer;
        }

        #content form button, a span
        {
            width: 8px;
            height: 14px;
            margin-top: -7px;
            text-indent: -9999px;
            background: transparent url(../Images/sprites-new.png) -816px -213px no-repeat;
            position: absolute;
            top: 50%;
            left: -8px;
            display: block;
        }

            #content form button:hover
            {
                background-color: #ad0062;
            }

                #content form button:hover span
                {
                    background-position: -765px -162px;
                }
/* Error message for pin validation */

#error-msg
{
    width: 427px;
    height: 18px;
    margin: 14px auto;
    font-size: 15px;
    color: black;
    text-align: left;
    padding-bottom: 20px;
}

/* Purchase summary and payment information */

#purchase-summary,
#payment-info,
#confirmation-summary
{
    width: 255px;
}




    #purchase-summary h4,
    #payment-info h4,
    #confirmation-summary h4
    {
        margin-bottom: 8px;
        font-family: KKR, Arial, sans-serif;
        font-size: 15px;
        text-transform: uppercase;
        letter-spacing: 0 /*1.1px*/;
    }

    #purchase-summary table,
    #payment-info table,
    #confirmation-summary table
    {
        width: 100%;
        font-size: 14px;
    }

        #purchase-summary table td,
        #payment-info table td,
        #confirmation-summary table td
        {
            padding-bottom: 5px;
        }

.width-adjust
{
    width: 49px;
}

#payment-info
{
    margin-bottom: 46px;
}
/* Target purchase overview window */

#pov #payment-info
{
    margin-top: 45px;
}
/* Style currency in tables */

.format-currency
{
    padding-right: 5px;
    text-align: right;
}

    .format-currency span
    {
        margin-right: 5px;
    }
/* Buttons found on purchase, success, and fail windows */


/* Messages outputted to users */

.backbutton-class
{
    width: 89px;
    height: 44px;
    font-family: KKB, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 2px 2px 3px black;
    background: #85004b;
    line-height: 46px;
    position: absolute;
    right: 114px;
    bottom: 46px;
    display: block;
}

.purchasebutton-class
{
    width: 89px;
    height: 44px;
    font-family: KKB, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 2px 2px 3px black;
    background: #85004b;
    line-height: 46px;
    position: absolute;
    right: 14px;
    bottom: 46px;
    display: block;
}

.replacebutton-class
{
    width: 120px;
    height: 44px;
    font-family: KKB, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    text-shadow: 2px 2px 3px black;
    background: #85004b;
    line-height: 46px;
    position: absolute;
    right: 14px;
    bottom: 46px;
    display: block;
    text-transform: uppercase;
}

    .purchasebutton-class:hover, .backbutton-class:hover
    {
        background-color: #0a3255;
    }


#success-msg, #fail-msg, #sesison-msg, #postback-msg
{
    width: 386px;
    font-size: 15px;
    text-align: left;
    cursor: default;
}


    #success-msg span, #fail-msg span, #sesison-msg span,#postback-msg span
    {
        font-size: 20px;
        font-weight: bold;
    }
/* Close button located on top right of the window */

#top-close-btn
{
    width: 27px;
    height: 27px;
    background: #1b1c1c url(../Images/sprites-new.png) -706px -108px no-repeat;
    text-indent: -9999px;
    display: block;
    position: absolute;
    top: -9px;
    right: -9px;
}

.truncate
{
    width: 150px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    vertical-align: inherit;
}
/* Test */

.submitbtn
{
    width: 67px;
    height: 44px;
    font-family: KKB, Arial, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: white;
    text-transform: uppercase;
    text-shadow: 2px 2px 3px black;
    background: #0054a3;
    position: relative;
    float: left;
    cursor: pointer;
    line-height: 46px;
    text-align: center;
}


#content .small
{
    display: block;
    padding-top: 5px;
    font-size: 12px;
    font-style: italic;
    color: black;
    margin-bottom: 15px;
    margin-top: 15px;
}

#content .clickonce
{
    display: block;
    font-size: 12px;
    font-style: italic;
    line-height: 120px;
    color: #dddddd;
}