@import url('grid.css');
@import url('pro_pages_style.css');

body {
    margin: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #455560;
}

h1 {
    margin-left: 10px;
    margin-top: 15px;
    line-height: 20px;
    font-size: 14px;
    margin-bottom: 0;
}

input[type="submit"] {
    cursor: pointer;
}

    input[type="submit"]:disabled {
        cursor: default;
    }

.container960 {
    margin: 0px auto;
    width: 960px;
    height: auto;
    border: 3px solid #f1f3f3;
    border-top: 5px solid #006cb6;
    background-color: #fafafa;
    padding-bottom: 10px;
}

#header {
    margin: 0px auto;
    height: 148px;
}

.logoPlacement {
    position: relative;
    top: 50px;
    left: 55px;
    height: 57px;
}

#buttonsRow {
    min-height: 30px;
    height: 30px;
    background: url(../img/bg_grad_butonlar.png) repeat-x;
    padding-right: 3px;
}

.btn {
    margin: 0 5px;
    padding: 0 10px;
    height: 30px;
    border-left: #e6e6e6 solid 1px;
    border-top: #e6e6e6 solid 1px;
    border-right: #e6e6e6 solid 1px;
    border-bottom: 2px solid rgba(0,108,182,.5);
    border-radius: 5px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: #fafafa;
    text-align: center;
    line-height: 30px;
    font-size: 14px;
    color: #455560;
    cursor: pointer;
}


.btnDisabled {
    margin: 0 5px;
    padding: 0 10px;
    height: 30px;
    border-left: #C6CCCD solid 1px;
    border-top: #C6CCCD solid 1px;
    border-right: #C6CCCD solid 1px;
    border-bottom: 2px solid rgba(0,108,182,.5);
    border-radius: 5px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    background-color: #fafafa;
    text-align: center;
    line-height: 30px;
    font-size: 14px;
    color: #89a8be;
    cursor: pointer;
}

.multiadmin_button {
    margin: 10px 10px;
    padding: 10px 30px;
    border: 1px solid #b0d5e5;
    border-radius: 10px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: #455560;
    background-color: #c0ecff;
    float: right;
}

    .multiadmin_button:hover {
        background-color: #d6f3ff;
    }

    .multiadmin_button:disabled {
        border: 1px solid #808080;
        color: #666666;
        background-color: #EBEBEB;
    }

.btn:hover {
    background: url(../img/bg_grad_blue_butonlar.png) repeat-x;
    border-bottom: 3px solid rgba(0,108,182,1);
    cursor: pointer;
}

.admin_page_button {
    margin: 10px 10px;
    padding: 10px 30px;
    border: 1px solid #808080;
    border-radius: 10px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: #455560;
    background-color: #FFFFE1;
}

    .admin_page_button:hover {
        background-color: #FFFFB9;
    }

    .admin_page_button:disabled {
        border: 1px solid #808080;
        color: #666666;
        background-color: #EBEBEB;
    }

.button, .buttonDisabled {
    display: block;
    text-decoration: none !important;
    padding: 6px 12px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    box-shadow: inset 0px 0px 2px #fff;
    -o-box-shadow: inset 0px 0px 2px #fff;
    -webkit-box-shadow: inset 0px 0px 2px #fff;
    -moz-box-shadow: inset 0px 0px 2px #fff;
}

    .button:active {
        box-shadow: inset 0px 0px 3px #999;
        -o-box-shadow: inset 0px 0px 3px #999;
        -webkit-box-shadow: inset 0px 0px 3px #999;
        -moz-box-shadow: inset 0px 0px 3px #999;
    }

.grey {
    color: #455560;
    border: 1px solid #d0d0d0;
    background-image: -moz-linear-gradient(#ededed, #e1e1e1);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#e1e1e1), to(#ededed));
    background-image: -webkit-linear-gradient(#ededed, #e1e1e1);
    background-image: -o-linear-gradient(#ededed, #e1e1e1);
    text-shadow: 1px 1px 1px #fff;
    background-color: #e1e1e1;
}

    .grey:hover {
        border: 1px solid #b0b0b0;
        background-image: -moz-linear-gradient(#e1e1e1, #ededed);
        background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ededed), to(#e1e1e1));
        background-image: -webkit-linear-gradient(#e1e1e1, #ededed);
        background-image: -o-linear-gradient(#e1e1e1, #ededed);
        background-color: #ededed;
    }

.greyDisabled {
    border: 1px solid #C6CCCD;
    cursor: auto;
    color: #89a8be;
    background-color: #f1f3f3;
}


.floatLeft {
    float: left;
}

.floatRight {
    float: right;
}

#mainContent {
    width: 100%;
    height: auto;
    margin: 0 auto;
}

#mainContent_Left {
    float: left;
    margin-bottom: 8px;
}

    #mainContent_Left #menu_Left {
        margin-top: 0px;
        margin-bottom: 8px;
        padding-bottom: 10px;
        background-color: #ffffff;
        border-radius: 5px;
        border: #e2e5e6 solid 1px;
    }

    #mainContent_Left h2 {
        margin-left: 10px;
        margin-top: 15px;
        line-height: 20px;
        text-align: center;
        color: #455560;
        font-size: 14px;
    }

#mainContent_Right {
    width: 250px;
    float: right;
    margin-bottom: 8px;
}

    #mainContent_Right a {
        text-decoration: none;
        text-align: left;
        font-size: 14px;
        color: #006cb6;
    }

    #mainContent_Right p {
        font-size: 14px;
        margin: 10px;
    }

    #mainContent_Right #puan {
        background-color: #fff;
        border-radius: 5px;
        border: #e2e5e6 solid 1px;
        padding: 10px 0;
        margin-bottom: 8px;
    }

    #mainContent_Right #feedbackBox {
        background-color: #fff;
        border-radius: 5px;
        padding-top: 0px;
        border: #e2e5e6 solid 1px;
        padding-bottom: 10px;
        margin-bottom: 8px;
    }

    #mainContent_Right #trainingDesc {
        background-color: #fff;
        border-radius: 5px;
        padding-top: 10px;
        border: #e2e5e6 solid 1px;
        padding-bottom: 10px;
        margin-bottom: 8px;
    }

    #mainContent_Right #trainingSocialMedia {
        background-color: #fff;
        border-radius: 5px;
        padding-top: 10px;
        border: #e2e5e6 solid 1px;
        padding-bottom: 10px;
        margin-bottom: 8px;
    }

    #mainContent_Right #addContent {
        background-color: #fff;
        border-radius: 5px;
        padding-top: 0px;
        border: #e2e5e6 solid 1px;
        padding-bottom: 10px;
        margin-bottom: 8px;
    }

#feedbackBox a {
    text-decoration: underline;
}

#addContent a {
    text-decoration: underline;
}

.data_table {
    text-decoration: none;
    font-size: 14px;
}

    .data_table td p {
        font-size: 14px;
        float: left;
        margin-top: 28px;
    }

.mainContent_WhiteBG .data_table .title {
    padding: 4px;
    text-align: right;
    color: #324d60;
}

.data_table .title {
    padding: 4px;
    text-align: right;
    color: #324d60;
}

.data_table .data {
    padding: 4px;
    text-align: left;
    color: #455560;
}

.table_Summary {
    text-decoration: none;
    margin: 10px;
    font-size: 18px;
}

    .table_Summary .title {
        padding: 4px;
        text-align: left;
        color: #324d60;
    }

    .table_Summary .data {
        padding: 4px;
        text-align: left;
        color: #455560;
    }

.line_blue {
    margin: 0 10px;
    height: 3px;
    background-color: #006cb6;
}

.btn_Square {
    width: 100px;
    height: 100px;
    min-height: 100px;
    vertical-align: middle;
    max-width: 100px;
    text-align: center;
    text-wrap: normal;
    margin: 10px 5px;
    color: #455560;
    background: buttonface url(../img/bg_grad_leftbut.png) repeat-x;
    border: 1px solid #C6CCCD;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer;
    -webkit-transition: background .3s linear;
    -moz-transition: background .3s linear;
    -o-transition: background .3s linear;
    -ms-transition: background .3s linear;
    transition: background .3s linear;
}

.btn_SquareDisabled {
    width: 100px;
    height: 100px;
    min-height: 100px;
    vertical-align: middle;
    max-width: 100px;
    text-align: center;
    text-wrap: normal;
    margin: 10px 5px;
    border: 1px solid #C6CCCD;
    border-radius: 5px;
    font-size: 14px;
    cursor: auto;
    color: #89a8be;
    background-color: #f1f3f3;
}


.btn_Square:hover {
    background: buttonface url(../img/bg_grad_blue_leftbut.png) repeat-x;
    border: 1px solid #8F9D9E;
    color: #006cb6;
    text-decoration: none;
    cursor: pointer;
}

.btn_Square a:link, .btn_Square a:visited {
    text-decoration: none;
    color: #455560;
    cursor: pointer;
}


#mainContent_Middle .btn_Square {
    width: 95px;
    height: 95px;
    min-height: 95px;
    vertical-align: middle;
    text-align: center;
    margin: 10px auto 10px -5px;
    color: #455560;
    background: buttonface url(../img/bg_grad_leftbut.png) repeat-x;
    border: 1px solid #C6CCCD;
    border-radius: 5px;
    font-size: 14px;
    cursor: pointer;
}

    #mainContent_Middle .btn_Square:hover {
        -webkit-transition: background 0.1s linear;
        -moz-transition: background 0.1s linear;
        -o-transition: background 0.1s linear;
        -ms-transition: background 0.1s linear;
        transition: background 0.1s linear;
        background: buttonface url(../img/bg_grad_blue_leftbut.png) repeat-x;
        color: #006cb6;
        border: 1px solid #8F9D9E;
        text-decoration: none;
        cursor: pointer;
    }

    #mainContent_Middle .btn_Square a:link, #mainContent_Middle .btn_Square a:visited {
        text-decoration: none;
        color: #455560;
        cursor: pointer;
    }


#mainContent .mainContent_Table {
    width: 100%;
    padding: 0px;
    margin: 0px;
}

#mainContent .column_Left {
    width: 114px;
    vertical-align: top;
    padding: 8px 8px 0 8px;
}

#mainContent .column_Middle {
    vertical-align: top;
    padding: 8px 0px 0 0;
}

#mainContent .column_Right {
    width: 220px;
    vertical-align: top;
    padding: 8px 8px 0 8px;
}

#mainContent td.column_Right div#mainContent_Right div.line_blue {
    margin-bottom: 10px;
}

.mainContent_WhiteBG {
    width: 100%;
    float: left;
    background-color: #ffffff;
    border-radius: 5px;
    border: #e2e5e6 solid 1px;
    height: auto;
    margin-bottom: 8px;
}

    .mainContent_WhiteBG p, .mainContent_WhiteBG table p {
        margin: 10px;
        font-size: 14px;
        color: #455560;
    }

    .mainContent_WhiteBG li {
        font-size: 14px;
        color: #455560;
    }


.coloredBox {
    height: 30px;
    width: 25px;
    float: left;
    margin-left: 5px;
    line-height: 30px;
    text-align: center;
    border: #000 solid 1px;
    color: #000;
}

.box_Red {
    background-color: #ff0000;
}

.box_Yellow {
    background-color: #ffc000;
}

.box_Green {
    background-color: #92d050;
}

#footer {
    width: 100%;
    height: 50px;
    text-align: center;
    font-size: 10px;
}

    #footer .reseller {
        margin-top: 10px;
        text-wrap: none;
        text-align: center;
    }

.poweredBy {
    text-wrap: none;
    float: right;
    text-align: center;
    font-size: 8px;
    margin: -26px 10px 0px 0px;
}

    .poweredBy a {
        text-decoration: none;
        color: #006cb6;
    }

    .poweredBy img {
        border: none;
        color: #006cb6;
    }

.SSLBy {
    text-wrap: none;
    float: left;
    text-align: left;
    font-size: 8px;
    margin: -28px 0px 0px 10px;
}

    .SSLBy a {
        text-decoration: none;
        color: #006cb6;
    }

    .SSLBy img {
        border: none;
        color: #006cb6;
    }

#mainContent_Middle {
    background-color: #fff;
    border-radius: 5px;
    margin: 10px auto 20px auto;
    border: #e2e5e6 solid 1px;
}

    #mainContent_Middle h2 {
        margin: 15px 0 0 10px;
        line-height: 20px;
        font-size: 14px;
    }

        #mainContent_Middle h2 span#lbHosgeldin {
            display: block;
            text-align: left;
        }

    #mainContent_Middle p {
        margin: 15px 0 10px 10px;
        font-size: 14px;
        text-align: left;
    }

    #mainContent_Middle .cntr {
        margin: 20px 10px 10px 50px;
        text-align: center;
        font-size: 14px;
    }


#mainContent_Middle2 {
    background-color: #fff;
    border-radius: 5px;
    margin: 10px auto 20px auto;
    border: #e2e5e6 solid 1px;
}

    #mainContent_Middle2 h2 {
        margin: 15px 0 0 10px;
        line-height: 20px;
        font-size: 14px;
    }

        #mainContent_Middle2 h2 span#lbLeaderboard {
            display: block;
            text-align: left;
        }

    #mainContent_Middle2 p {
        margin: 15px 0 10px 10px;
        font-size: 14px;
        text-align: left;
    }

    #mainContent_Middle2 .cntr {
        margin: 20px 10px 10px 50px;
        text-align: center;
        font-size: 14px;
    }


    #mainContent_Middle2 .btn_Square {
        width: 95px;
        height: 95px;
        min-height: 95px;
        vertical-align: middle;
        text-align: center;
        margin: 10px auto 10px -5px;
        color: #455560;
        background: buttonface url(../img/bg_grad_leftbut.png) repeat-x;
        border: 1px solid #C6CCCD;
        border-radius: 5px;
        font-size: 14px;
        cursor: pointer;
    }

        #mainContent_Middle2 .btn_Square:hover {
            -webkit-transition: background 0.1s linear;
            -moz-transition: background 0.1s linear;
            -o-transition: background 0.1s linear;
            -ms-transition: background 0.1s linear;
            transition: background 0.1s linear;
            background: buttonface url(../img/bg_grad_blue_leftbut.png) repeat-x;
            color: #006cb6;
            border: 1px solid #8F9D9E;
            text-decoration: none;
            cursor: pointer;
        }

        #mainContent_Middle2 .btn_Square a:link, #mainContent_Middle .btn_Square a:visited {
            text-decoration: none;
            color: #455560;
            cursor: pointer;
        }

    #mainContent_Middle2 .errorMessages p {
        margin: 5px 0;
        text-align: center;
    }

.text_Center {
    text-align: center;
    font-size: 10px;
}

.table_Admin {
    padding-left: 10px;
}

.btn_100 {
    width: 100px;
    cursor: pointer;
}

.btn_adminTopMenu {
    font-size: 14px;
    padding: 5px 15px;
    margin: 0 2px;
    background: rgb(221,221,221);
    border-radius: 3px;
    transition: all .2s ease;
    border: 1px solid #C6CCCD;
    color: #455560;
}

    .btn_adminTopMenu:hover {
        border: 1px solid #006cb6;
        color: #006cb6;
    }

#topAdminMenu {
    margin: 30px 0 15px 0;
}

.btn_adminTopMenuDisabled {
    padding: 5px 15px;
    cursor: auto;
    border-radius: 3px;
    border-width: thin;
    color: #89a8be;
    background-color: #f1f3f3;
    margin: 0 2px;
    font-size: 14px;
}

.btn_adminTopMenuSelected {
    padding: 5px 15px;
    border: 1px solid #C6CCCD;
    border-radius: 3px;
    color: #455560;
    background-color: #97abb9;
    font-size: 14px;
}

.margins10 {
    margin: 10px;
}

.marginLeft10 {
    margin-left: 10px;
}

.marginLeft20 {
    margin-left: 20px;
}

.marginLeft30 {
    margin-left: 30px;
}

.marginRight10 {
    margin-right: 10px;
}

.marginRight20 {
    margin-right: 20px;
}

.marginRight30 {
    margin-right: 30px;
}

.paddings10 {
    padding: 10px;
}

.paddingLeft10 {
    padding-left: 10px;
}

.paddingLeft20 {
    padding-left: 20px;
}

.paddingLeft30 {
    padding-left: 30px;
}

.paddingRight10 {
    padding-right: 10px;
}

.paddingRight20 {
    padding-right: 20px;
}

.paddingRight30 {
    padding-right: 30px;
}

.center {
    text-align: center;
}

.alignRight {
    text-align: right;
}

.alignLeft {
    text-align: left;
}

#metin {
    width: 944px;
    text-align: center;
    font-size: 12px;
}

.training_list_item {
    width: 540px;
    height: 120px;
    margin: 10px;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
    vertical-align: middle;
}


    .training_list_item .training_logo {
        margin: 10px;
        width: 100px;
        height: auto;
        float: left;
    }

.trainingBox .training_logo {
    margin: 10px;
    width: 100px;
    height: auto;
    float: left;
    margin-right: 25px;
}

.training_list_item .training_title {
    width: 350px;
    margin: 15px 15px 15px 115px;
    height: 60px;
    vertical-align: middle;
    font-size: 18px;
}

.training_list_item .training_button {
    float: right;
    margin: -50px 10px 0 5px;
}

.training_list_item .training_completion {
    margin: 15px 15px 15px 0px;
    height: 20px;
    vertical-align: middle;
    font-size: 18px;
}

div.training_button a {
    display: inline-block;
    height: 28px;
    border: solid 1px transparent;
    padding: 0 10px;
    outline: 0;
    font-weight: 500;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
    word-wrap: normal;
    line-height: 28px;
    vertical-align: middle;
    cursor: pointer;
    border-radius: 2px;
    box-shadow: 0 1px 0 rgba(0,0,0,0.05);
    border-color: #167ac6;
    background: #167ac6;
    color: #fff;
    transition: all linear .1s;
}

    div.training_button a:hover {
        box-shadow: 0 0 5px #167ac6;
    }
/*div.training_button a.grey {
        border-color: #8F9D9E;
    background: rgb(221,221,221);
    color: #455560;
    }
        div.training_button a.grey:hover{
            box-shadow:0 0px 5px #8F9D9E;
        }*/

.report_o_bg_green {
    background: #92D050;
}

.report_o_bg_red {
    background: #FF0000;
}

.report_o_bg_yellow {
    background: #FFC000;
}

.setDIVHeight {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}

.red {
    color: #ff0000;
}

.green {
    color: #009933;
}

.yellow {
    color: #FF9900;
}

.trainingOpBox {
    margin: 25px;
}

.Box {
    width: 600px;
    margin: 10px auto;
    padding: 20px 0;
    background-color: #fff;
    border-radius: 5px;
    border: #e2e5e6 solid 1px;
    text-align: center;
    margin-top: 20px;
}


.btnClassic {
    width: 100px;
    height: 30px;
}

.btn_H30 {
    height: 30px;
}

.Box2 {
    width: 600px;
    margin: 0px auto;
    padding: 20px 0;
    margin-bottom: 20px;
}


.classicBox {
    width: 600px;
    margin: 20px auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e2e5e6;
}

.trainingBox {
    width: 550px;
    margin: 10px auto;
    padding: 20px;
    background-color: #fafafa;
    border-radius: 5px;
    border: 1px solid #e2e5e6;
}

    .trainingBox h3 {
        margin: 0;
        margin-bottom: 10px;
        padding: 0;
    }


img.floatLeft {
    float: left;
    border-radius: 5px;
}


.reportUserBox {
    margin-bottom: 0;
}

.SETWidth {
    width: 120px;
    margin: 0;
    padding: 0;
}

.SETWidthTxt {
    width: 116px;
    margin: 0;
    padding: 0;
}

#DropDownListSellerFirm.SETWidth, #DropDownListClientFirm.SETWidth, #DropDownListSoldProduct.SETWidth, #DropDownListTrainings.SETWidth {
    width: auto;
}

#DropDownListTrainings.SETWidth {
    width: auto;
    max-width: 260px;
}

.licenseTable {
    background-color: #fafafa;
    margin-top: 20px;
    padding: 20px 0;
    border-radius: 5px;
}

.bold {
    font-weight: bold;
}


.SETWidthTxt_30 {
    width: 30px;
    text-align: center;
}

.fixedDiv {
    margin: 20px 0 0 50px;
}

    .fixedDiv .SETWidth {
        margin-right: 10px;
    }

table#table_AddEditDelete {
    border-collapse: separate;
    width: 100%;
    border-spacing: 0;
    border: 1px solid #C6CCCD;
    border-radius: 5px;
}

    table#table_AddEditDelete tr:last-child td:first-child {
        -webkit-border-bottom-left-radius: 5px;
        border-bottom-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    table#table_AddEditDelete tr:last-child td:last-child {
        -webkit-border-bottom-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    table#table_AddEditDelete tr:first-child th:first-child {
        -webkit-border-top-left-radius: 5px;
        border-top-left-radius: 5px;
    }

    table#table_AddEditDelete tr:first-child th:last-child {
        -webkit-border-top-right-radius: 5px;
        border-top-right-radius: 5px;
    }

    table#table_AddEditDelete tr:nth-child(odd) {
        background-color: rgba(224,224,224,.5);
    }

    table#table_AddEditDelete tr:nth-child(even) {
        background-color: #fafafa;
    }

    table#table_AddEditDelete td.bold {
        font-weight: 700;
    }

    table#table_AddEditDelete td {
        width: 120px;
        text-align: center;
        padding: 5px;
    }

    table#table_AddEditDelete th {
        background-color: #006CB6;
        color: #fafafa;
        padding: 7px;
        font-weight: bold;
        text-transform: uppercase;
    }

    table#table_AddEditDelete tr {
        height: 28px;
    }


.incomeSharing {
    width: 500px;
    margin: 20px auto;
    padding: 20px;
    border-radius: 10px;
    background-color: rgba(224,224,224,.4);
    border: 1px solid #C6CCCD;
}

.alignMiddle {
    display: inline-table;
    margin-top: -10px;
}

.mini_button {
    float: left;
    margin-top: -5px;
    margin-left: 10px;
}

.btnUp {
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    border-top: 1px solid #cccccc;
    border-bottom: 1px solid #b3b3b3;
    display: inline-block;
    padding: 4px 12px;
    margin-bottom: 0;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    color: #333333;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    background-color: #f5f5f5;
    background-repeat: repeat-x;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 2px rgba(0, 0, 0, .05);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
}

    .btnUp:hover, .btnUp:focus {
        color: #333333;
        text-decoration: none;
        background-position: 0 -15px;
        -webkit-transition: background-position 0.1s linear;
        -moz-transition: background-position 0.1s linear;
        -o-transition: background-position 0.1s linear;
        transition: background-position 0.1s linear;
    }

    .btnUp:focus {
        outline: thin dotted #333;
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

    .btnUp.active, .btnUp:active {
        background-image: none;
        outline: 0;
        -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
        -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
        box-shadow: inset 0 2px 4px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.05);
    }

    .btnUp.disabled, .btnUp[disabled] {
        cursor: default;
        background-image: none;
        opacity: 0.65;
        filter: alpha(opacity=65);
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }


.btn-primary {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #006dcc;
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, #0088cc, #0044cc);
    border-left-color: #0044cc;
    border-right-color: #0044cc;
    border-top-color: #0044cc;
    border-bottom-color: #002a80;
}

    .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary[disabled] {
        color: #ffffff;
        background-color: #0044cc;
    }

    .btn-primary:active, .btn-primary.active {
        background-color: #003399;
    }

.btn-red {
    color: #FFFFFF;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #811e22;
    background-repeat: repeat-x;
    background-image: linear-gradient(to bottom, #fa3434, #811e22);
    border-left-color: #811e22;
    border-right-color: #811e22;
    border-top-color: #811e22;
    border-bottom-color: #811e22;
}

    .btn-red:hover, .btn-red:focus, .btn-red:active, .btn-red[disabled] {
        color: #fff;
        background-color: #791b1f;
    }

.contactFilterBox {
    width: 500px;
    background-color: #fff;
    margin: 0px auto;
    padding: 20px 40px;
    border: 1px solid #e2e5e6;
    border-radius: 5px;
    margin-bottom: 10px;
}



.firmAddBox {
    width: 600px;
    margin: 20px auto;
    background-color: #fff;
    padding: 20px;
    border: 1px solid #e2e5e6;
    border-radius: 5px;
}

.container {
    width: 430px;
    margin: 20px auto;
    background-color: rgba(224,224,224,.4);
    border-radius: 5px;
    border: 1px solid #C6CCCD;
    padding: 20px;
}

    .container .fixedDiv {
        width: 100%;
        margin: 20px auto;
        margin-bottom: 0;
    }

        .container .fixedDiv .floatLeft {
            margin-left: 55px;
        }

.firmAdminBox {
    width: 400px;
    margin: 20px auto;
    border-radius: 5px;
    border: 1px solid #e2e5e6;
    padding: 20px;
    background-color: #fff;
}

.table_Mail {
    width: 1100px;
    margin: 20px auto;
}

.button_Row {
    margin-left: 60px;
}

.mailBox p {
    margin: 15px 0 10px 10px;
}

.SetMargin p {
    margin: 0 0 10px 10px;
}

.SetMargin {
    margin: 0 -7px;
}
/*user_edit page*/
.container_24 .grid_16 {
    padding: 0 5px;
}

    .container_24 .grid_16 .SetMargin {
        margin: 20px 12px 0 12px;
    }
/*end*/


.sendMailBox div table td:first-child {
    text-align: left;
}

.adminHomepageBox {
    width: 450px;
}

.loginBox {
    width: 450px;
    margin: 0 auto;
    padding: 0 10px;
}

.table_Login {
    margin: 20px;
}

#mainContent_Middle .errorMessages p {
    margin: 5px 0;
    text-align: center;
}

/* Slide-down */
.pro_slide-down-box {
    position: relative;
    z-index: 101;
    margin: 0;
}

    .pro_slide-down-box dt {
        display: block;
        border: 1px solid #DDD;
        border-radius: 3px;
        text-shadow: 0 1px 1px white;
        box-shadow: 0 1px 1px #fff;
        font: bold 11px Sans-Serif;
        padding: 6px 10px;
        white-space: nowrap;
        vertical-align: middle;
        color: #666;
        background: transparent;
        cursor: pointer;
        border-color: #ddd;
        background: #E0E0E0;
        /* IE9 SVG, needs conditional override of 'filter' to 'none' */
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlMGUwZTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        filter: none;
        background: -webkit-linear-gradient(top, white, #E0E0E0);
        background: -moz-linear-gradient(top, white, #E0E0E0);
        background: -ms-linear-gradient(top, white, #E0E0E0);
        background: -o-linear-gradient(top, white, #E0E0E0);
        background: linear-gradient(top, white, #E0E0E0);
        -pie-background: linear-gradient(top, white, #E0E0E0);
        box-shadow: 0 1px 2px rgba(0,0,0,0.25), inset 0 0 3px #fff;
    }

        .pro_slide-down-box dt:hover {
            box-shadow: inset 0 0 3px #fff;
            border-color: #999;
            text-decoration: none;
        }

        .pro_slide-down-box dt.active {
            border: 1px solid #AAA;
            border-bottom-color: #CCC;
            border-top-color: #999;
            box-shadow: inset 0 1px 2px #aaa;
            background: #E6E6E6;
            /* IE9 SVG, needs conditional override of 'filter' to 'none' */
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkY2RjZGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
            filter: none;
            background: -webkit-linear-gradient(top, #E6E6E6, gainsboro);
            background: -moz-linear-gradient(top, #E6E6E6, gainsboro);
            background: -ms-linear-gradient(top, #E6E6E6, gainsboro);
            background: -o-linear-gradient(top, #E6E6E6, gainsboro);
            /* IE9 SVG, needs conditional override of 'filter' to 'none' */
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNkY2RjZGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
            filter: none;
        }

        .pro_slide-down-box dt span {
            display: inline-block;
            width: 11px;
            height: 11px;
            background: url(../img/pro_images/misc-plus.png) 0 0 no-repeat;
            margin: 2px 6px 0 0;
        }

        .pro_slide-down-box dt.active span {
            background: url(../img/pro_images/misc-minus.png) 0 0 no-repeat;
        }

    .pro_slide-down-box dd {
        display: none;
        padding: 0;
        margin: 3px 0 0 0;
        background: #fff;
        border-radius: 5px;
        position: relative;
        box-shadow: inset 0 1px 1px rgba(170,170,170,.8);
        border: 1px solid #AAA;
        border-bottom-color: #CCC;
        border-top-color: #999;
    }

.slide-down-content {
    padding: 10px 0;
}

    .slide-down-content ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }

        .slide-down-content ul li span {
            font-weight: bold;
            display: block;
            width: 307px;
            background-color: #006CB6;
            padding: 5px 0px 5px 10px;
            text-transform: uppercase;
            color: #fff;
            margin: 10px auto;
            border-radius: 5px;
            border: 1px solid #C6CCCD;
        }

        .slide-down-content ul.sub li {
            display: block;
            width: 290px;
            margin: 0 auto;
            padding: 2px 0 2px 30px;
            font-weight: normal;
            background: url(../img/arrow-right-v2.png) no-repeat 3% center;
        }

#content ul li span {
    margin: 0;
}

#content ul li ul li {
    padding-left: 10px;
    margin-bottom: 5px;
}

    #content ul li ul li:first-child {
        margin-top: 10px;
    }

    #content ul li ul li:last-child {
        margin-bottom: 10px;
    }

.btnAdmin {
    width: 80px;
}

.btnAdminAdd {
    margin: 10px 0;
}

.btnAdminDelete.btnAdmin {
    margin-left: 10px;
}

.btn-danger {
    color: #ffffff;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
    background-color: #da4f49;
    background-repeat: repeat-x;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    background-image: linear-gradient(to bottom, #ee5f5b, #bd362f);
    border-left-color: #bd362f;
    border-right-color: #bd362f;
    border-top-color: #bd362f;
    border-bottom-color: #802420;
}

    .btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .btn-danger.disabled, .btn-danger[disabled] {
        color: #ffffff;
        background-color: #bd362f;
        *background-color: #a9302a;
    }

.disabledDelete {
    display: inline-table;
    width: 32px;
    height: 32px;
    background-image: url(../img/delete.png);
    opacity: .7;
}

#contacts .mini_button, #servers .mini_button {
    margin-top: -8px;
}

table#slide-down dl.grid_10 {
    width: 387px;
}

#maintenanceMessages {
    width: 450px;
    margin: 0 auto;
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #e2e5e6;
    padding: 10px;
    margin-bottom: 10px;
}

    #maintenanceMessages p.message {
        margin: 10px 0 0 4px;
    }

    #maintenanceMessages .messageBox {
        margin-bottom: 30px;
    }

    #maintenanceMessages .last {
        margin: 0;
    }

#btnEdit {
    display: inline-block;
    background-color: #0f0;
    opacity: 0;
    margin: -30px 0 0 0px;
}

#btnFile {
    display: block;
    background-color: #0f0;
    height: 22px;
    width: 238px;
    opacity: 0;
    margin: -24px 0 0 2px;
}

#user_uploadlist.SetMargin p {
    margin: 0 0 10px 10px;
}

#maviflowusage.SetMargin p {
    margin: 0 0 10px 10px;
}

#training #filterBox, #training #actionBox, #training #notesBox {
    height: 220px;
}

#filterBox, #actionBox, #notesBox {
    /*margin: 15px 10px 0 10px;*/
}

    #filterBox table#filterTable, #actionBox, #notesBox table#actionTable {
        /*padding: 5px 10px 0 10px;*/
    }

    #filterBox .btnClassic {
        margin: 10px 0;
    }

#report #filterBox .btnClassic {
    margin: 0;
}

#report #filterBox table#table_filter {
    margin: 0 auto 10px auto;
    padding: 0;
}

#contact #filterBox, #contact #actionBox, #contact #notesBox,
#mail #filterBox, #mail #actionBox, #mail #notesBox,
#report #filterBox, #report #actionBox, #report #notesBox,
#license #purchaseBox, #license #saleBox {
    height: 165px;
}

#contact div.line_blue,
#mail div.line_blue,
#report div.line_blue,
#license div.line_blue,
#training div.line_blue {
    margin-bottom: 5px;
}

.textAreaResize {
    min-width: 170px;
    max-width: 170px;
    max-height: 150px;
    min-height: 80px;
}

.alignment {
    display: inline-block;
    background-color: #0f0;
    opacity: 0;
    margin: -30px 0 0 0;
}

.msgError {
    color: red;
    margin-left: 10px;
}

a#btnisAdmin.alignment {
    width: 13px;
    height: 13px;
    position: absolute;
    top: 33px;
    left: 4px;
}

a#btnUserHasGameData.alignment {
    width: 100px;
    height: 30px;
    position: absolute;
    top: 30px;
    left: 104px;
    z-index: 1;
}

a#btnEditUserTooltip.alignment {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 40px;
    left: 74px;
}

a#btnDeleteUserTooltip.alignment {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 40px;
    right: 74px;
}

a#btnEnableDisableUserTooltip.alignment {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 40px;
    left: 185px;
}

a#btnMandatoryChangeTooltip.alignment {
    height: 16px;
    width: 411px;
    position: absolute;
    top: 33px;
    left: 4px;
}

#btnSelect {
    margin: 0 0 10px 10px;
}

.selectFirmSpan {
    padding: 10px 0 0 10px;
}

#choose.selectFirmSpan {
    padding: 10px 10px;
}

.btnSq {
    display: inline-block;
    width: 100px;
    height: 100px;
    opacity: 0;
    background-color: #0f0;
    margin: -110px 0 0 342px;
}

#btnAssignTraining {
    margin: 0 auto;
}

.btnTrainingAsgn {
    display: inline-block;
    width: 185px;
    height: 30px;
    opacity: 0;
    background-color: #0f0;
    margin: -30px 0px 0 122px;
}

.MailSend {
    display: block;
    width: 100px;
    height: 100px;
    opacity: 0;
    background-color: #0f0;
    margin: -110px 0 0 222px;
}

.mailToSelected {
    display: block;
    width: 92px;
    height: 46px;
    opacity: 0;
    background-color: #0f0;
    margin: -48px 0 0 2px;
}

#dateChanging1 {
    position: absolute;
    top: 33%;
    left: 77%;
}

#dateChanging2 {
    position: absolute;
    top: 61%;
    left: 77%;
}

#mailtypeChanging {
    position: absolute;
    top: -5px;
    left: -40px;
}


.modalBackground {
    background-color: Black;
    filter: alpha(opacity=90);
    opacity: 0.8;
}

#clientChanging {
    position: absolute;
    top: 17%;
    left: 59%;
}

.detailsTable tr td {
    padding: 5px;
}

.detailsTable tr:nth-child(even) {
    background-color: #e2e5e6;
}

.detailsTable tr:first-child td {
    font-weight: bold;
}
/* Crumbs CSS*/
#crumbs {
    text-align: left;
}

    #crumbs ul {
        list-style: none;
        display: inline-table;
        padding-left: 30px;
    }

        #crumbs ul li {
            display: inline;
        }

            #crumbs ul li a {
                display: block;
                float: left;
                height: 15px;
                background: #ddd;
                text-align: center;
                padding: 7px 15px 8px 25px;
                position: relative;
                margin: 0 10px 0 0;
                cursor: default;
                font-size: 14px;
                text-decoration: none;
                color: #455560;
                transition: all .3s ease-in-out;
            }

                #crumbs ul li a:after {
                    content: "";
                    transition: all .3s ease-in-out;
                    border-top: 15px solid transparent;
                    border-bottom: 15px solid transparent;
                    border-left: 15px solid #ddd;
                    position: absolute;
                    right: -15px;
                    top: 0;
                    z-index: 1;
                }

                #crumbs ul li a:before {
                    content: "";
                    transition: all .3s ease-in-out;
                    border-top: 15px solid transparent;
                    border-bottom: 15px solid transparent;
                    border-left: 15px solid #fff;
                    position: absolute;
                    left: 0;
                    top: 0;
                }

            #crumbs ul li:first-child a {
                border-top-left-radius: 3px;
                border-bottom-left-radius: 3px;
            }

                #crumbs ul li:first-child a:before {
                    display: none;
                }

            #crumbs ul li:last-child a {
                padding-right: 25px;
                border-top-right-radius: 3px;
                border-bottom-right-radius: 3px;
            }

                #crumbs ul li:last-child a:after {
                    display: none;
                }

            #crumbs ul li a[href]:hover {
                background: #c7c7c7;
                cursor: pointer;
                color: #586670;
            }

                #crumbs ul li a[href]:hover:after {
                    border-left-color: #c7c7c7;
                }

            #crumbs ul li a.currentCrumb {
                background: #c7c7c7;
                color: #586670;
                display: block;
                float: left;
                height: 15px;
                text-align: center;
                padding: 7px 15px 8px 25px;
                position: relative;
                margin: 0 10px 0 0;
                cursor: default;
                font-size: 14px;
                text-decoration: none;
                transition: all .3s ease-in-out;
            }

                #crumbs ul li a.currentCrumb:after {
                    border-left-color: #c7c7c7;
                }

.rightCrumb {
    display: block;
    float: right;
    height: 15px;
    background: #ddd;
    text-align: center;
    padding: 7px 15px 8px 15px;
    position: relative;
    margin: 14px 30px 0 0;
    cursor: default;
    font-size: 14px;
    border-radius: 3px;
    text-decoration: none;
    color: #455560;
    transition: all .3s ease-in-out;
}

    .rightCrumb:hover {
        background: #c7c7c7;
        cursor: pointer;
        color: #586670;
    }
/* Crumbs End*/

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fade-in {
    opacity: 0; /* make things invisible upon start */
    -webkit-animation: fadeIn ease-in 1; /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
    -moz-animation: fadeIn ease-in 1;
    animation: fadeIn ease-in 1;
    -webkit-animation-fill-mode: forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
}

.ddl {
    margin: 10px 0 0 10px;
    width: 96%;
}

#certificates {
    background-color: #fff;
    border-radius: 5px;
    padding-bottom: 5px;
    border: #e2e5e6 solid 1px;
}

.cert {
    text-align: center;
    position: relative;
    border: 1px solid #e2e5e6;
    border-radius: 5px;
    margin: 10px 10px 6px 10px;
    transition: all linear .1s;
}

    .cert:hover {
        background: #fafafa;
        box-shadow: 0px 0px 10px #c9cccd;
    }

.certLogo {
}

.certTitle {
    width: 200px;
    display: inline-block;
}

#certDetails {
    margin: 5px -150px 9px 0px;
}


/* RIBBON */
/*.box {
  width: 200px; height: 300px;
  position: relative;
  border: 1px solid #BBB;
  background: #EEE;
}*/
.ribbon {
    position: absolute;
    right: -5px;
    top: -5px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right;
}

    .ribbon span {
        font-size: 10px;
        font-weight: bold;
        color: #FFF;
        text-transform: uppercase;
        text-align: center;
        line-height: 20px;
        transform: rotate(45deg);
        width: 100px;
        display: block;
        background: #79A70A;
        background: linear-gradient(#2989d8 0%, #1e5799 100%);
        box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
        position: absolute;
        top: 19px;
        right: -21px;
    }

        .ribbon span::before {
            content: "";
            position: absolute;
            left: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid #1e5799;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #1e5799;
        }


        .ribbon span::after {
            content: "";
            position: absolute;
            right: 0px;
            top: 100%;
            z-index: -1;
            border-left: 3px solid transparent;
            border-right: 3px solid #1e5799;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #1e5799;
        }

    .ribbon.orange span {
        background: #f2825b; /* Old browsers */
        background: -moz-linear-gradient(top, #f2825b 0%, #e55b2b 50%, #f07146 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2825b), color-stop(50%,#e55b2b), color-stop(100%,#f07146)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #f2825b 0%,#e55b2b 50%,#f07146 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #f2825b 0%,#e55b2b 50%,#f07146 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #f2825b 0%,#e55b2b 50%,#f07146 100%); /* IE10+ */
        background: linear-gradient(to bottom, #f2825b 0%,#e55b2b 50%,#f07146 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2825b', endColorstr='#f07146',GradientType=0 ); /* IE6-9 */
    }

        .ribbon.orange span::before {
            border-left: 3px solid #f07146;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #f07146;
        }

        .ribbon.orange span::after {
            border-left: 3px solid transparent;
            border-right: 3px solid #f07146;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #f07146;
        }

    .ribbon.green span {
        background: #006e2e; /* Old browsers */
        background: -moz-linear-gradient(top, #006e2e 0%, #006e2e 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#006e2e), color-stop(100%,#006e2e)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top, #006e2e 0%,#006e2e 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top, #006e2e 0%,#006e2e 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top, #006e2e 0%,#006e2e 100%); /* IE10+ */
        background: linear-gradient(to bottom, #006e2e 0%,#006e2e 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006e2e', endColorstr='#006e2e',GradientType=0 ); /* IE6-9 */
    }

        .ribbon.green span::before {
            border-left: 3px solid #006e2e;
            border-right: 3px solid transparent;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #006e2e;
        }

        .ribbon.green span::after {
            border-left: 3px solid transparent;
            border-right: 3px solid #006e2e;
            border-bottom: 3px solid transparent;
            border-top: 3px solid #006e2e;
        }

    .ribbon.left {
        left: -5px;
        top: -5px;
    }

        .ribbon.left span {
            transform: rotate(-45deg);
            top: 19px;
            left: -21px;
        }
/* RIBBON END */
div#tableWrapper table {
    margin: 0 auto 15px auto;
    border-collapse: collapse;
    text-align: center;
}

    div#tableWrapper table tr:nth-child(2n) {
        color: #333;
        background-color: #f7f6f3;
        border: 1px solid #808080;
    }

    div#tableWrapper table tr:nth-child(2n+1) {
        color: #284775;
        background-color: white;
        border: 1px solid #808080;
    }

    div#tableWrapper table tr:first-child {
        color: white;
        background-color: #5d7b9d;
        font-weight: bold;
        border: 1px solid #808080;
        padding: 5px 0;
    }

div#tableWrapper p {
    text-align: center;
}

.fail {
    display: inline-block;
    background-image: url(../img/error.png);
    width: 40px;
    background-repeat: no-repeat;
    height: 44px;
    background-size: auto 32px;
    background-position-y: 9px;
}

.success {
    display: inline-block;
    background-image: url(../img/tick.png);
    width: 40px;
    background-repeat: no-repeat;
    height: 44px;
    background-size: auto 32px;
    background-position-y: 9px;
}

.templateDynamicFieldButton {
    margin: 5px 10px 5px 10px;
    border: 1px solid #CCCCCC;
    padding: 5px 20px 5px 20px;
    color: #000000;
    line-height: 40px;
    text-align: center;
    background-color: #EEEEEE;
    vertical-align: middle;
    white-space: nowrap;
    cursor: copy;
}

.templateDynamicFieldButtonMandatoryMissing {
    background-color: #FFAAAA;
}

.templateDynamicFieldButtonMandatoryOK {
    background-color: #AAFFAA;
}

.templateDynamicFieldShow {
    float: left;
    margin: 5px 10px 5px 10px;
    border: 1px solid #CCCCCC;
    padding: 5px 20px 5px 20px;
    color: #000000;
    text-align: center;
    background-color: #FFFFEA;
    vertical-align: middle;
    visibility: hidden;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 999;
}

.stillSendingEmail {
    float: right;
    margin: 5px 10px 5px 10px;
    border: 1px solid #CCCCCC;
    padding: 5px 20px 5px 20px;
    color: #000000;
    text-align: center;
    background-color: #FFFFEA;
    vertical-align: middle;
    visibility: visible;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 999;
}


.leaderboardTitle {
    margin: 10px 5px 0px 10px;
    padding: 10px;
    color: #000000;
    font-size: 10pt;
    border: 1px solid gray;
    background-color: #b0d5e5;
}

.leaderboardItem {
    margin: 10px 5px 0px 10px;
    padding: 10px;
    color: #000000;
    font-size: 14pt;
}

.leaderboardItemOdd {
    border: 1px solid gray;
    background-color: #cccccc;
}

.leaderboardItemEven {
    border: 1px solid gray;
    background-color: #eeeeee;
}

.leaderboardItemUser {
    border: 1px solid red;
    background-color: #ffd4b2;
}
.twitter-share-button {
    position: relative;
    height: 20px;
    box-sizing: border-box;
    padding: 1px 8px 1px 6px;
    background-color: #1b95e0;
    color: #fff;
    border-radius: 3px;
    font-weight: 500;
    cursor: pointer;
}
    .twitter-share-button i {
        position: relative;
        top: 2px;
        display: inline-block;
        width: 14px;
        height: 14px;
        background: transparent 0 0 no-repeat;
        background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg…-.038-1.693%202.558-1.847%204.778-4.15%206.532-6.774z%22%2F%3E%3C%2Fsvg%3E);
    }
    .twitter-share-button .label {
        margin-left: 3px;
        white-space: nowrap;
    }