@charset "UTF-8";

@font-face {
    font-family: "DBHelvethaicaX";
    src: url("../fonts/DB_HelvethaicaMon_X_v3_2.ttf") format("truetype");
}

@font-face {
    font-family: "DBHelvethaicaXMed";
    src: url("../fonts/DB_HelvethaicaMon_X_Med_v3_2.ttf") format("truetype");
}

@font-face {
    font-family: "DBHelvethaicaX";
    src: url("../fonts/DB_HelvethaicaMon_X_v3_2.ttf") format("truetype");
}

@font-face {
    font-family: "DBHelvethaicaXMed";
    src: url("../fonts/DB_HelvethaicaMon_X_Med_v3_2.ttf") format("truetype");
}

/*@font-face {
    font-family: "DBHelvethaicaXThin";
    src: url("../fonts/DB_HelvethaicaMon_X_Thin_v3_2.ttf") format("truetype");
}*/

@font-face {
    font-family: ITCFranklinGothicStd-Med;
    src: url("../fonts/ITCFranklinGothicStd-Med.otf");
}

@font-face {
    font-family: ITCFranklinGothicStd-Book;
    src: url("../fonts/ITCFranklinGothicStd-Book.otf");
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../fonts/glyphicons-halflings-regular.eot');
    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

@font-face {
    font-family: 'fontello';
    src: url("../fonts/fontello.eot?72401039");
    src: url("../fonts/fontello.eot?72401039#iefix") format("embedded-opentype"), url("../fonts/fontello.woff?72401039") format("woff"), url("../fonts/fontello.ttf?72401039") format("truetype"), url("../fonts/fontello.svg?72401039#fontello") format("svg");
    font-weight: normal;
    font-style: normal;
}

h2 {
    color: #ee2c32;
    font-size: 30px;
}

h3 {
    color: #233880;
    font-size: 22px;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
}

h4 {
    text-transform: uppercase;
    color: #676c7f;
    margin-top: 10px;
    margin-bottom: 10px;
}

body {
    padding: 0px;
    margin: 0px;
    font-family: ITCFranklinGothicStd-Book;
    /*font-family: ITCFranklinGothicStd-Book, DBHelvethaicaX;*/
    /*background: url(../images/backgrounds4.jpg) top center no-repeat;*/
    background-color: #F5F5F5;
    background-size: 100%;
}

/*.grayscale {
    -moz-filter: grayscale(90%);
    -webkit-filter: grayscale(90%);
    filter: gray; 
    filter: grayscale(90%);
}*/

.logo-mono-black {
    display: block;
    width: 54px;
}


.package-highlight-list {
    margin-top: 10px;
}

    .package-highlight-list li:before {
        /*font-family: fontello;*/
        content: '✓';
        position: absolute;
        color: #004b93;
        left: 130px;
    }

    .package-highlight-list li {
        list-style: none;
        text-align: left;
        margin: auto;
        margin-left: 100px;
    }

.member-highlight-list {
}

    .member-highlight-list li:before {
        font-weight: bolder;
        content: '✓';
        position: absolute;
        color: #004b93;
        left: 30px;
    }

    .member-highlight-list li {
        list-style: none;
        text-align: left;
        margin: auto;
    }

.header {
    position: relative;
    z-index: 4;
    overflow: hidden;
    border-bottom: 1px solid #F5F5F5;
    background: #fff;
    padding: 20px 0px 0px 0px;
    line-height: 28px;
}

    .header .content {
        background-color: #FFFFFF;
        margin: auto;
        box-shadow: none;
        border-radius: 0px;
    }

/* ---------------- Login Bag ---------------- */
.login-bag-title {
    font-size: 16px;
    color: rgb(24, 67, 151);
    text-align: center;
    font-weight: bold;
    padding-top: 20px;
}

.login-bag-content-rows {
    margin-bottom: 15px;
}

.login-bag-content-rows-left {
    margin-bottom: 15px;
    padding-right: 5px;
}

.login-bag-content-rows-right {
    margin-bottom: 15px;
    padding-left: 5px;
}

.login-bag-content-rows-left .btn-success {
    font-size: 12px;
}

.login-bag-content-rows-right .btn-primary {
    font-size: 12px;
    background-color: rgb(21,153,216);
    border-color: rgb(21,153,216);
}

.welcome-bag-title {
    background-color: rgb(235,235,235);
    padding-top: 20px;
    padding-left: 25px;
    padding-right: 25px;
}

.popover {
    border-radius: 0px;
}

.popover-content {
    padding: 0px 0px;
}
/* ---------------- Login Bag ---------------- */

.row {
    margin-right: auto;
    margin-left: auto;
}

.footer {
    background-color: #223880;
    color: #FFFFFF;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding: 30px;
}

.footer-link {
    float: left;
    font-size: 13px;
}

    .footer-link a {
        text-decoration: none;
        color: #fff;
    }

        .footer-link a:hover {
            text-decoration: none;
            color: #e9252b;
            text-shadow: 0.02em 0.02em 0.2em #C43D42;
        }

.footer-copyright {
    margin-top: 5px;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.5);
    float: right;
}

.bluebar {
    font-size: 16px;
    color: #FFF;
    text-align: center;
    line-height: 48px;
    background-color: #233880;
}

.planno {
    font-family: ITCFranklinGothicStd-Book;
    font-size: 13px !important;
    color: #FFF !important;
    width: 50px;
    line-height: 28px;
    background-color: #f81f22;
    position: absolute !important;
    z-index: 1;
    top: -10px;
}

.planmore {
    margin-top: -10px;
    margin-bottom: -10px;
    text-align: center;
    background-color: #FFF;
    color: #333;
    line-height: 30px;
    cursor: pointer;
}

    .planmore:hover {
        background-color: #243980;
        color: #FFF;
        font-weight: bold;
        line-height: 40px;
    }

    .planmore:active {
        background-color: #e90009;
    }

    .planmore:visited {
        background-color: #e90009;
    }

.logo {
    width: 260px;
}

.img-circle {
    width: 20px;
    height: 20px;
}

.img-member {
    width: 105px;
    text-align: center;
}

.font-ex1 {
    font-size: 12px;
    margin-top: 25px;
    margin-bottom: 5px;
    color: #9e9e9e;
}

.font-ex2 {
    color: #ee2c32;
    font-size: 30px;
}

.font-dropdown {
    color: #233880;
    font-size: 22px;
    line-height: 42px !important;
    height: 42px !important;
    position: relative;
}

.language {
    clear: both;
    margin-top: -35px;
    margin-bottom: 8px;
    margin-right: 15px;
}

.wrapper {
    margin-top: 20px;
    margin-bottom: 50px;
    padding-top: 20px;
}

.content {
    background-color: #FFFFFF;
    border-radius: 4px;
    box-shadow: 0px 20px 20px #344c69;
    max-width: 750px;
    margin: auto;
}

.content-input {
    background-color: #ebebeb;
    padding-top: 15px;
    padding-left: 15px;
    padding-right: 15px;
    padding-bottom: 15px;
}

.content-input-white {
    background-color: #FFFFFF;
    /*margin-left: 15px;
    margin-right: 15px;
    padding-bottom:15px;*/
}

.content-input-text {
    background-color: #FFFFFF;
    /*margin-left: 15px;
    margin-right: 15px;*/
    padding-bottom: 15px;
}

.content-input-button {
    padding-top: 15px;
    /*margin-left: 15px;
    margin-right: 15px;*/
}

.content-input-bottom-line {
    /*padding-top: 15px;
    padding-bottom:15px;*/
    margin-left: 15px;
    margin-right: 15px;
    margin-bottom: 15px;
    border-bottom: #ebebeb medium solid;
}

.content-text {
    text-align: center;
    align-items: center;
}

.content-text-bottom-line {
    border-bottom: thin solid #dddcdc;
    padding-top: 15px;
    padding-bottom: 15px;
}

.content-description {
    padding-top: 70px;
    padding-bottom: 80px;
    text-align: center;
    align-items: center;
    color: #676c7f;
}

.content-description-plan {
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
    align-items: center;
    color: #676c7f;
    padding-left: 15px;
    padding-right: 15px;
}

.content-description-bottom {
    border-top: 1px solid #e6e6e6;
    text-align: center;
    align-items: center;
    color: #9e9e9e;
    padding-left: 15px;
    padding-right: 15px;
    margin-left: 0px;
    margin-right: 0px;
}

.content-description-top-line {
    padding-top: 30px;
}

.content-description-bottom-line {
    border-bottom: 1px solid #9e9e9e;
    padding-bottom: 50px;
}

.content-description-price {
    text-align: center;
    align-items: center;
    color: #9e9e9e;
    margin-left: 0px;
    margin-right: 0px;
}

.content-description-thankyou {
    
}

.content-select {
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: solid #e6e6e6;
    border-bottom-width: 1px;
}

    .content-select:hover {
        border: 1px solid #bab7b7;
        transition-duration: 0.1s;
    }

.content-select-white {
    background-color: #FFFFFF;
    margin-left: 70px;
    margin-right: 70px;
}

.logotype {
    width: 234px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
}

.bar {
    padding-bottom: 10px;
    max-width: 220px;
    margin: auto;
    margin-top: 18px;
    margin-bottom: 18px;
}

.table-index {
    max-width: 100%;
    margin-left: auto;
}

.text-content-title {
    color: #9e9e9e;
    font-size: 14px;
    text-align: right;
    position: relative;
}

.text-content-description {
    color: #233880;
    font-size: 22px;
    text-align: left;
    position: relative;
    margin-top: -5px;
}

.text-content-price {
    color: #ee2c32;
    font-size: 22px;
    font-weight: bold;
    text-align: left;
    position: relative;
    margin-top: -5px;
}

.text-indent {
    text-indent: 3em;
}

.col-border {
    border: 1px solid #ebebeb;
    padding: 8px;
    vertical-align: baseline;
    height: 50px;
}

.col-border-text {
    padding-top: 5px;
}

.form-control-outline {
    outline: 0;
    border: 1px solid #FFFFFF;
    box-shadow: none;
    border-radius: 0px;
}

.btn-language {
    background-color: #FFFFFF;
    border: #cdcdcd thin solid;
    color: #000000;
}

    .btn-language:hover {
        background-color: #F00;
        color: #fff;
        border: none;
    }

.btn-primary {
    font-size: 16px;
    background-color: #243980;
    border-color: #243980;
}

    .btn-primary:hover {
        background-color: #d12333;
        border-color: #d12333;
    }

.btn-warning {
    font-size: 16px;
    color: #686868;
    background-color: #FFF;
    border-bottom: thin #999 solid !important;
    border-color: #d7d7d7 !important;
}

    .btn-warning:hover {
        color: #fff;
        background-color: #d8d8d8 !important;
        border-color: #d7d7d7 !important;
    }

.btn-success {
    font-size: 16px;
    color: #fff;
    background-color: #243980 !important;
    border-color: #243980 !important;
}

    .btn-success:hover {
        color: #fff;
        background-color: #d12333 !important;
        border-color: #d12333 !important;
    }

    .btn-success:active {
        color: #fff;
        background-color: #243980 !important;
        border-color: #243980 !important;
    }

    .btn-success:disabled {
        color: #000;
        background-color: #CECECE !important;
        border-color: #CECECE !important;
    }

.btn-info {
    font-size: 16px;
    color: #fff;
    background-color: #3490bd;
    border-color: #3490bd;
}

    .btn-info:hover {
        color: #333;
    }

.btn-link {
    color: #676c7f;
}

    .btn-link:hover {
        color: #ea0d16;
    }

.btn-member {
    font-size: 16px;
    color: #fff;
    background-color: #8B8B8B;
    border-bottom: thin #999 solid !important;
    border-color: #d7d7d7 !important;
}

    .btn-member:hover {
        color: #fff;
        background-color: #d12333 !important;
        border-color: #d12333 !important;
    }

    .btn-member:active {
        color: #fff;
        background-color: #243980 !important;
        border-color: #243980 !important;
    }

.btn-spouse {
    background-image: url(../images/spouse.png);
    background-size: 130px,60px;
    background-repeat: no-repeat;
    background-position: center;
    width: 130px;
    height: 45px;
}

    .btn-spouse:active {
        background-image: url(../images/spouse.png);
        background-size: 130px,60px;
        background-repeat: no-repeat;
        background-position: center;
    }

.btn-redbutton {
    background-image: url(../images/red_button.png);
    background-size: 30px,30px;
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(0deg);
    transition-duration: 0.3s;
    width: 30px;
    height: 30px;
    border: none;
}

    .btn-redbutton:hover {
        background-color: #FFFFFF;
        transform: rotate(180deg);
        transition-duration: 0.3s;
    }

    .btn-redbutton:active {
        background-image: url(../images/red_button.png);
        background-size: 30px,30px;
        background-repeat: no-repeat;
        background-position: center;
    }

.btn-redbutton-bg-gray {
    background-image: url(../images/red_button.png);
    background-color: #ebebeb;
    background-size: 30px,30px;
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(0deg);
    transition-duration: 0.3s;
    width: 30px;
    height: 30px;
    border: none;
}

    .btn-redbutton-bg-gray:hover {
        background-color: #ebebeb;
        transform: rotate(180deg);
        transition-duration: 0.3s;
    }

    .btn-redbutton-bg-gray:active {
        background-image: url(../images/red_button.png);
        background-color: #ebebeb;
        background-size: 30px,30px;
        background-repeat: no-repeat;
        background-position: center;
    }

.btn-male {
    background-image: url(../images/men_button.png);
    background-size: 100px,60px;
    background-repeat: no-repeat;
    background-position: center;
    width: 100px;
    height: 45px;
}

    .btn-male:active {
        background-image: url(../images/men_button.png);
        background-size: 100px,60px;
        background-repeat: no-repeat;
        background-position: center;
    }

.btn-female {
    background-image: url(../images/women_button.png);
    background-size: 100px,60px;
    background-repeat: no-repeat;
    background-position: center;
    width: 100px;
    height: 45px;
}

    .btn-female:active {
        background-image: url(../images/women_button.png);
        background-size: 100px,60px;
        background-repeat: no-repeat;
        background-position: center;
    }

.btn-plus {
    background-image: url(../images/add_button.png);
    background-size: 20px,20px;
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(0deg);
    transition-duration: 0.3s;
    border: none;
    width: 20px;
    height: 20px;
}

    .btn-plus:hover {
        background-color: #FFFFFF;
        transform: rotate(180deg);
        transition-duration: 0.3s;
    }

    .btn-plus:active {
        background-image: url(../images/add_button.png);
        background-size: 20px,20px;
        background-repeat: no-repeat;
        background-position: center;
        border: none;
    }

.btn-plus-bg-gray {
    background-image: url(../images/add_button.png);
    background-color: #ebebeb;
    background-size: 20px,20px;
    background-repeat: no-repeat;
    background-position: center;
    transform: rotate(0deg);
    transition-duration: 0.3s;
    border: none;
    width: 20px;
    height: 20px;
}

    .btn-plus-bg-gray:hover {
        background-color: #ebebeb;
        transform: rotate(180deg);
        transition-duration: 0.3s;
    }

    .btn-plus-bg-gray:active {
        background-image: url(../images/add_button.png);
        background-color: #ebebeb;
        background-size: 20px,20px;
        background-repeat: no-repeat;
        background-position: center;
        border: none;
    }

.btn-backgroundfacebook {
    background-color: #3E5F94;
    border-radius: 4px;
    height: 36px;
}

.btn-thankyou {
    width: 100%;
}

.img-loginfacebook {
    height: 36px;
    margin: auto;
    display: block;
    max-width: 100%;
}

.block-quote {
    padding: 5px 20px;
}

    .block-quote:hover {
        border-left: 5px solid #233880;
    }

    .block-quote p {
        font-size: 14px;
        font-weight: bold;
    }

    .block-quote footer {
        color: #000;
        font-size: 12px;
    }

        .block-quote footer:before {
            content: '\2012 \00A0';
        }

@media screen and (max-width: 991px) {
    .header {
        border-bottom: #005fd6 solid;
        margin-bottom: 10px;
    }

    .footer {
        height: 200px;
    }

    .wrapper {
        margin: auto;
        padding-top: 0px;
    }

    .container {
        padding-right: 0px;
        padding-left: 0px;
    }

    .content-select-white {
        margin-left: 0px;
        margin-right: 0px;
    }

    .content-description-plan {
        text-align: left;
    }

    .content-description-bottom {
        text-align: left;
    }

    .content-description-price {
        text-align: left;
    }
}

@media screen and (max-width:860px) {
    .header {
        border-bottom: #005fd6 solid;
        margin-bottom: 0px;
        padding: 10px 0px 10px 0px;
    }

    .logo {
        padding-left: 15px;
        width: 235px;
    }

    .footer {
        height: 200px;
    }

    .wrapper {
        margin: auto;
        padding-top: 0px;
    }

    .container {
        padding-right: 0px;
        padding-left: 0px;
    }

    .content-select-white {
        margin-left: 0px;
        margin-right: 0px;
    }

    .content-description-plan {
        text-align: left;
    }

    .content-description-bottom {
        text-align: left;
    }

    .content-description-price {
        text-align: left;
    }

    .text-content-title {
        font-size: 12px;
    }

    .text-content-description {
        font-size: 18px;
    }

    .text-content-price {
        font-size: 18px;
    }
}

@media screen and (max-width:767px) {
    .content-text-bottom-line {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .text-content-title {
        font-size: 12px;
        text-align: left;
    }

    .text-content-description {
        font-size: 18px;
        text-align: left;
        padding-top: 10px;
    }

    .text-content-price {
        font-size: 18px;
        text-align: left;
        padding-top: 10px;
    }

    .footer {
        padding: 10px;
    }

    .footer-link {
        font-size: 13px;
        float: none;
    }

        .footer-link a {
            text-decoration: none;
            color: #fff;
        }

            .footer-link a:hover {
                text-decoration: none;
                color: #e9252b;
                text-shadow: 0.02em 0.02em 0.2em #C43D42;
            }

    .footer-copyright {
        margin-top: 20px;
        font-size: 10px;
        color: rgba(255, 255, 255, 0.5);
        float: none;
    }
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #f00 !important;
    font-weight:normal;
}

.field-validation-valid {
    display: none !important;
}

.input-validation-error {
    border: 1px solid #f00 !important;
    background-color: #fee !important;
}

.validation-summary-errors {
    font-weight: bold !important;
    color: #f00 !important;
}

.validation-summary-valid {
    display: none !important;
}

.men-button {
    width: 100px;
    float: left;
    margin-right: 10px;
    cursor: pointer;
}

    .men-button img {
        border: #dfdfdf thin solid;
    }

.button-men-selector input {
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.img-male {
    background-image: url(../images/men_button.png);
}

.img-female {
    background-image: url(../images/women_button.png);
}

.button-men-selector input:active + .button-men-img {
    opacity: .9;
}

.button-men-selector input:checked + .button-men-img {
    border: #66afe9 thin solid;
    -webkit-filter: none;
    -moz-filter: none;
    filter: none;
}

.button-men-img {
    cursor: pointer;
    background-size: cover;
    background-repeat: no-repeat;
    border: #dfdfdf thin solid;
    display: inline-block;
    width: 100px;
    height: 40px;
    -webkit-transition: all 100ms ease-in;
    -moz-transition: all 100ms ease-in;
    transition: all 100ms ease-in;
    -webkit-filter: brightness(1) grayscale(1) opacity(0.8);
    -moz-filter: brightness(1) grayscale(1) opacity(0.8);
    filter: brightness(1) grayscale(1) opacity(0.8);
}

    .button-men-img:hover {
        -webkit-filter: brightness(1) grayscale(0.6) opacity(1);
        -moz-filter: brightness(1) grayscale(0.6) opacity(1);
        filter: brightness(1) grayscale(0.6) opacity(1);
    }

/*tablesaw*/
.tablesaw-nav-btn {
    font-size: 16px !important;
    color: #fff !important;
}

a.tablesaw-nav-btn.left {
    background: url(../images/controls.png) no-repeat 0 1px !important;
}

a.tablesaw-nav-btn.right {
    background: url(../images/controls.png) no-repeat -43px 1px !important;
}

.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.left:before {
    content: none !important;
}

.tablesaw-bar .tablesaw-advance a.tablesaw-nav-btn.right:before {
    content: none !important;
}

.tablesaw-advance .btn.btn-micro {
    border: none !important;
    padding: 16px 16px 16px 16px !important;
    margin-left: 10px !important;
}

.table-head {
    color: #FFF !important;
    background-color: #243980 !important;
    text-align: center !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
}

.table-body-head {
    color: #424242 !important;
    background-color: #D8D8D8 !important;
    border-left: none !important;
    border-right: none !important;
}

.table-body {
    color: #233880 !important;
    text-align: center !important;
}

/*.table-footer {
    color: #233880 !important;
    background-color: #FFE9E9 !important; 
    text-align: center !important; 
}*/

.table-footer {
    color: #233880 !important;
    font-weight: bold !important;
    background-color: #FFE9E9 !important;
    text-align: center !important;
}

/*styles for all CSS Checkboxes*/
.css-checkbox {
    position: absolute;
    overflow: hidden;
    clip: rect(0 0 0 0);
    height: 1px;
    width: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
}

.css-checkbox-question {
    position: inherit;
}


.css-checkbox label {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.css-checkbox + label.css-label {
    padding-left: 20px;
    height: 15px;
    display: inline-block;
    line-height: 15px;
    background-repeat: no-repeat;
    background-position: 0 0;
    font-size: 15px;
    vertical-align: middle;
    cursor: pointer;
}

.css-checkbox:checked + label.css-label {
    background-position: 0 -15px;
}

.css-checkbox + input[type=hidden] + .css-label {
    padding-left: 20px;
    height: 20px;
    display: inline-block;
    line-height: 20px;
    background-repeat: no-repeat;
    background-position: 0 0;
    font-size: 15px;
    vertical-align: middle;
    cursor: pointer;
}

.css-checkbox:checked + input[type=hidden] + .css-label {
    background-position: 0 -20px;
}

label.css-label + label {
    display: inline
}

.vlad {
    background-image: url(../images/vlad.png);
}

.vlad-blue {
    background-image: url(../images/vlad-blue.png);
}

.vlad-circle-blue {
    background-image: url(../images/vlad-circle-blue.png);
}

.css-checkbox.med + label.css-label.med {
    padding-left: 22px;
    height: 17px;
    display: inline-block;
    line-height: 17px;
    background-repeat: no-repeat;
    background-position: 0 0;
    font-size: 15px;
    vertical-align: middle;
    cursor: pointer;
}

.css-checkbox.med:checked + label.css-label.med {
    background-position: 0 -17px;
}

.css-checkbox.sme + label.css-label.sme {
    padding-left: 22px;
    height: 16px;
    display: inline-block;
    line-height: 16px;
    background-repeat: no-repeat;
    background-position: 0 0;
    font-size: 15px;
    vertical-align: middle;
    cursor: pointer;
}

.css-checkbox.sme:checked + label.css-label.sme {
    background-position: 0 -16px;
}

.css-checkbox.lrg + label.css-label.lrg {
    padding-left: 22px;
    height: 20px;
    display: inline-block;
    line-height: 20px;
    background-repeat: no-repeat;
    background-position: 0 0;
    font-size: 15px;
    vertical-align: middle;
    cursor: pointer;
}

.css-checkbox.lrg:checked + label.css-label.lrg {
    background-position: 0 -20px;
}

/* ------------------- Header ------------------- */
[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "fontello";
    font-style: normal;
    font-weight: normal;
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    margin-right: .2em;
    text-align: center;
    /* opacity: .8; */
    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;
    /* fix buttons height, for twitter bootstrap */
    line-height: 1em;
    /* Animation center compensation - margins should be symmetric */
    /* remove if not needed */
    margin-left: .2em;
    /* you can be more comfortable with increased icons size */
    /* font-size: 120%; */
    /* Font smoothing. That was taken from TWBS */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* Uncomment for 3D effect */
    /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-menu:before {
    content: '\e802';
}

.nav-mobile-button {
    float: right;
    font-size: 25px !important;
    margin-top: -5px;
    margin-right: 20px;
    color: #004b93;
    outline: none;
    background-color: transparent;
    border: 0 none;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
}

    .nav-mobile-button:active, .nav-mobile-button:hover, .nav-mobile-button:focus {
        outline: 0;
        color: #2486ff;
        text-decoration: none;
    }

.drawer-nav, .drawer-hamburger {
    z-index: 5 !important;
    position: absolute !important;
}

.drawer--right .drawer-nav {
    background: #2c3039 !important;
    right: -260px !important;
    width: 0px !important;
    text-decoration: none !important;
    color: #a9a9ac !important;
}

.drawer--right.drawer-open .drawer-nav {
    right: 0 !important;
    width: 260px !important;
}

.drawer--right.drawer-open .drawer-hamburger, .drawer--right.drawer-open .item {
    right: 260px !important;
}

.drawer-menu-icon {
    width: 16px;
    height: 16px;
}

.drawer-menu {
    padding: 0;
    margin: 0;
}

    .drawer-menu li {
        display: block;
        margin: 0;
        line-height: 48px;
        border-top: 1px solid #1a1a1a;
        border-bottom: 1px solid #353942;
    }

        .drawer-menu li .drawer-menu-icon {
            margin-right: 12px;
        }

        .drawer-menu li a {
            line-height: 48px;
            padding: 0 15px;
            display: block;
            text-decoration: none;
            color: #a9a9ac;
        }

.drawer-header {
    color: #e6e6e6;
}

.drawer-header-col {
    display: table;
    height: 128px;
}

.drawer-header-cell {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

.drawer-header-icon {
    margin-bottom: 8px;
}

.drawer-languages {
    border-top: 1px solid #a9a9ac;
    border-right: 1px solid #a9a9ac;
    border-bottom: 1px solid #a9a9ac;
    padding: 0px 0px;
    margin: 0px;
    float: left;
    width: 100%;
    list-style: none;
}

    .drawer-languages li {
        float: left;
        border-left: 1px solid #a9a9ac;
        padding: 0px;
        margin-right: 0px;
        width: 50%;
        text-align: center;
    }

        .drawer-languages li a {
            color: #a9a9ac;
            text-decoration: none;
            cursor: pointer;
        }

        .drawer-languages li.active {
            background: #273b7f;
        }

            .drawer-languages li.active a {
                color: #e6e6e6;
                text-decoration: none;
                cursor: pointer;
            }

/* ------------------- Header ------------------- */

.footer-bg {
    background-color: #223880;
    color: #FFFFFF;
    text-align: center;
}

.legal-notices {
    overflow: hidden;
    padding: 24px 0;
    text-align: center;
    background: #004b93;
    color: #d4daef;
    margin-top: 36px;
}


    .legal-notices .legal-notices-link:last-child {
        border-right: 0 none;
        padding: 0;
        margin: 0;
    }

    .legal-notices .legal-notices-link {
        color: #d4daef;
    }

.btn-home-Completed {
    border: 1px solid #959595;
    background-color: #fff;
    min-height: 50px;
    min-width: 235px;
    margin-bottom: 100px;
}

.bg-color-completed {
    background-color: #fff !important;
}

.text-completed {
    margin-top: 30px;
    margin-bottom: 30px;
}

.text-rejected {
    color: #233880;
}
.text-rejected:lang(en) {
    font-size: 16px;
}
    .text-rejected:lang(th) {
        font-size: 12px;
    }
/*
------------------------------------
    legal-exclusions
------------------------------------
*/
.btn-legal-exclusions {
    position: relative;
    display: inline-block;
    margin-bottom: 10px;
    padding-right: 20px;
    color: #00008f;
    transition: color 0.3s linear;
    cursor: pointer;
}

    .btn-legal-exclusions:focus,
    .btn-legal-exclusions:hover {
        text-decoration: none;
        color: #00005b;
    }

    .btn-legal-exclusions::after {
        content: '';
        position: absolute;
        top: 0;
        right: -9px;
        bottom: 0;
        margin: auto;
        width: 15px;
        height: 8px;
        background: url(../../Direct/images/ico-arrow-down.jpg) 0 0 no-repeat;
        background-size: 13px;
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg);
        transition: 0.2s ease all;
    }

    .btn-legal-exclusions.collapsed:after {
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    .btn-legal-exclusions .glyphicon {
        margin-right: 5px;
        font-size: 12px;
        color: #ff1821;
    }

.legal-exclusions-collaspe > * > .text-indent {
    text-indent: 1.5em;
}

.legal-exclusions-collaspe > * > .text-no {
    margin: 0;
}

    .legal-exclusions-collaspe > * > .text-no.last {
        margin-bottom: 10px;
    }


/* FORM GROUP */
.form-group {
    margin-bottom: 25px;
}

.form-group__label {
    vertical-align: top;
    margin-bottom: 3px;
    font-weight: 700;
    text-transform: uppercase;
}

    .form-group__label .label__title {
        display: block;
        overflow: hidden;
    }

    .form-group__label .label__optional {
        font-weight: 400;
        color: #888;
    }

        .form-group__label .label__optional:lang(th) {
            font-size: 16px;
        }

        .form-group__label .label__optional:lang(en) {
            font-size: 10px;
        }

.ui-accordion-header.ui-corner-top.ui-state-default.ui-accordion-icons.ui-accordion-header-active.ui-state-active::after {
    content: '';
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin: auto;
    width: 25px;
    height: 25px;
    background: url(../../base/images/iconAccordianDown.png) 0 0 no-repeat;
    background-size: 20px;
    transition: 0.2s ease all;
}

.ui-accordion-header.ui-corner-top.ui-state-default.ui-accordion-icons.ui-accordion-header-collapsed.ui-corner-all::after {
    content: '';
    position: absolute;
    top: 0;
    right: 10px;
    bottom: 0;
    margin: auto;
    width: 25px;
    height: 25px;
    background: url(../../base/images/iconAccordianUp.png) 0 0 no-repeat;
    background-size: 20px;
    transition: 0.2s ease all;
}

.product-banner {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.product-banner__image {
    display: block;
    max-width: 100%;
    height: auto;
}

.product-banner__image--mobile {
    width: 100%;
}

.product-banner__image--desktop {
    display: none;
}

@media only screen and (min-width : 768px) {
    .product-banner {
        height: 236px;
    }

    .product-banner__image--mobile {
        display: none;
    }

    .product-banner__image--desktop {
        display: block;
        position: absolute;
        top: 0;
        left: 50%;
        height: 100%;
        width: 1314px;
        max-width: none;
        margin-left: -657px;
        background-repeat: no-repeat;
        background-position: 0 0;
        background-size: auto;
    }
}

@media only screen and (min-width : 992px) {
    .product-banner {
        height: 314px;
    }

    .product-banner__image--desktop {
        width: 1736px;
        margin-left: -868px;
    }
}

@media only screen and (min-width : 1200px) {
    .product-banner {
        height: 327px;
    }

    .product-banner__image--desktop {
        width: 1920px;
        margin-left: -960px;
    }
}




/*------------------------------------*\
  BUTTON COMPONENTS
\*------------------------------------*/
.c-button {
    display: inline-block;
    position: relative;
    vertical-align: top;
    overflow: hidden;
    height: 40px;
    line-height: 40px;
    border-radius: 0;
    padding: 0 20px;
    color: #fff;
    background-color: #00008f;
    /* text-transform: uppercase;*/
    outline: none;
    z-index: 0;
    cursor: pointer;
    border: 0;
    font-weight: 600;
    transition: color 0.3s, background-color 0.3s;
    text-align: center;
    letter-spacing: 0.02em;
}

    .c-button:after {
        content: '';
        position: absolute;
        z-index: -1;
        transition: width 0.3s, opacity 0.3s;
        width: 0;
        height: 530px;
        top: 50%;
        left: 50%;
        opacity: 0;
        background: #00005b;
        -ms-transform: translate(-50%, -50%) rotate(45deg);
        transform: translate(-50%, -50%) rotate(45deg);
        transform: translate3d(-50%, -50%, 0) rotate(45deg);
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    .c-button:hover,
    .c-button:focus {
        color: #fff !important;
    }

        .c-button:hover:after {
            width: 120%;
            opacity: 1;
        }

/*.c-button:lang(th) {
        font-size: 20px;
    }

    .c-button:lang(en) {
        font-size: 14px;
    }*/

.c-button--sm,
.c-button--sm.c-button--icon:before {
    height: 30px;
    line-height: 30px;
}

    .c-button--sm:lang(th) {
        font-size: 18px;
    }

    .c-button--sm:lang(en) {
        font-size: 12px;
    }

.c-button--lg,
.c-button--lg.c-button--icon:before {
    height: 50px;
    line-height: 50px;
}

    .c-button--lg:lang(th) {
        font-size: 22px;
    }

    .c-button--lg:lang(en) {
        font-size: 16px;
    }

.c-button--full {
    width: 100%;
}

.c-button--danger {
    background-color: #f07662;
}

    .c-button--danger:after {
        background-color: #ec4d33;
    }

.c-button--success {
    background-color: #449d44;
}

    .c-button--success:after {
        background-color: #398439;
    }

.c-button--icon:before {
    float: right;
    margin-left: 15px;
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 38px;
    font-size: 14px;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.c-button--icon-left:before {
    float: left;
    margin: 0 15px 0 0;
}

.c-button--arrow-right:before {
    content: "\ea3c";
}

.c-button--download:before {
    content: "\e9c5";
}

.c-button--arrow-right:hover:before {
    -webkit-animation: animate-arrow-right 0.3s cubic-bezier(0.77, 0, 0.175, 1);
    animation: animate-arrow-right 0.3s cubic-bezier(0.77, 0, 0.175, 1);
}

.c-button--checkmark:before {
    content: "\ea10";
}

.c-button--size-md {
    min-width: 160px;
}

.c-button--secondary {
    color: #00008f;
    background-color: transparent;
    -webkit-box-shadow: inset 2px 2px 0px 0px #00008f, inset -2px -2px 0px 0px #00008f;
    -moz-box-shadow: inset 2px 2px 0px 0px #00008f, inset -2px -2px 0px 0px #00008f;
    box-shadow: inset 2px 2px 0px 0px #00008f, inset -2px -2px 0px 0px #00008f;
}

    .c-button--secondary:after {
        background-color: #00005b;
    }

    .c-button--secondary:hover {
        color: #fff;
        -webkit-box-shadow: inset 2px 2px 0px 0px #00005b, inset -2px -2px 0px 0px #00005b;
        -moz-box-shadow: inset 2px 2px 0px 0px #00005b, inset -2px -2px 0px 0px #00005b;
        box-shadow: inset 2px 2px 0px 0px #00005b, inset -2px -2px 0px 0px #00005b;
    }

.c-button-only-icon {
    height: 40px !important;
    padding: 0 18px;
    border-width: 1px;
}

.c-button-only-icon__icon:before {
    position: relative;
    top: 10px;
    font-size: 14px;
}
/*------------------------------------*\
  END BUTTON COMPONENTS
\*------------------------------------*/

/*------------------------------------*\
  HELPERS CLASS
\*------------------------------------*/

/* spacing */
@media only screen and (min-width : 320px) {
    /* margin-bottom */
    .mb-xs-0 {
        margin-bottom: 0;
    }

    .mb-xs-5 {
        margin-bottom: 5px;
    }

    .mb-xs-10 {
        margin-bottom: 10px;
    }

    .mb-xs-15 {
        margin-bottom: 15px;
    }

    .mb-xs-20 {
        margin-bottom: 20px;
    }

    .mb-xs-25 {
        margin-bottom: 25px;
    }

    .mb-xs-30 {
        margin-bottom: 30px;
    }

    .mb-xs-35 {
        margin-bottom: 35px;
    }

    .mb-xs-40 {
        margin-bottom: 40px;
    }

    .mb-xs-45 {
        margin-bottom: 45px;
    }

    .mb-xs-50 {
        margin-bottom: 50px;
    }

    /* margin-top */
    .mt-xs-0 {
        margin-top: 0;
    }

    .mt-xs-5 {
        margin-top: 5px;
    }

    .mt-xs-10 {
        margin-top: 10px;
    }

    .mt-xs-15 {
        margin-top: 15px;
    }

    .mt-xs-20 {
        margin-top: 20px;
    }

    .mt-xs-25 {
        margin-top: 25px;
    }

    .mt-xs-30 {
        margin-top: 30px;
    }

    .mt-xs-35 {
        margin-top: 35px;
    }

    .mt-xs-40 {
        margin-top: 40px;
    }

    .mt-xs-45 {
        margin-top: 45px;
    }

    .mt-xs-50 {
        margin-top: 50px;
    }
}

@media only screen and (min-width : 768px) {
    /* margin-bottom */
    .mb-sm-0 {
        margin-bottom: 0;
    }

    .mb-sm-5 {
        margin-bottom: 5px;
    }

    .mb-sm-10 {
        margin-bottom: 10px;
    }

    .mb-sm-15 {
        margin-bottom: 15px;
    }

    .mb-sm-20 {
        margin-bottom: 20px;
    }

    .mb-sm-25 {
        margin-bottom: 25px;
    }

    .mb-sm-30 {
        margin-bottom: 30px;
    }

    .mb-sm-35 {
        margin-bottom: 35px;
    }

    .mb-sm-40 {
        margin-bottom: 40px;
    }

    .mb-sm-45 {
        margin-bottom: 45px;
    }

    .mb-xs-50 {
        margin-bottom: 50px;
    }

    /* margin-top */
    .mt-sm-0 {
        margin-top: 0;
    }

    .mt-sm-5 {
        margin-top: 5px;
    }

    .mt-sm-10 {
        margin-top: 10px;
    }

    .mt-sm-15 {
        margin-top: 15px;
    }

    .mt-sm-20 {
        margin-top: 20px;
    }

    .mt-sm-25 {
        margin-top: 25px;
    }

    .mt-sm-30 {
        margin-top: 30px;
    }

    .mt-sm-35 {
        margin-top: 35px;
    }

    .mt-sm-40 {
        margin-top: 40px;
    }

    .mt-sm-45 {
        margin-top: 45px;
    }

    .mt-sm-50 {
        margin-top: 50px;
    }
}

@media only screen and (min-width : 992px) {
    /* margin-bottom */
    .mb-md-0 {
        margin-bottom: 0;
    }

    .mb-md-5 {
        margin-bottom: 5px;
    }

    .mb-md-10 {
        margin-bottom: 10px;
    }

    .mb-md-15 {
        margin-bottom: 15px;
    }

    .mb-md-20 {
        margin-bottom: 20px;
    }

    .mb-md-25 {
        margin-bottom: 25px;
    }

    .mb-md-30 {
        margin-bottom: 30px;
    }

    .mb-md-35 {
        margin-bottom: 35px;
    }

    .mb-md-40 {
        margin-bottom: 40px;
    }

    .mb-md-45 {
        margin-bottom: 45px;
    }

    .mb-md-50 {
        margin-bottom: 50px;
    }

    /* margin-top */
    .mt-md-0 {
        margin-top: 0;
    }

    .mt-md-5 {
        margin-top: 5px;
    }

    .mt-md-10 {
        margin-top: 10px;
    }

    .mt-md-15 {
        margin-top: 15px;
    }

    .mt-md-20 {
        margin-top: 20px;
    }

    .mt-md-25 {
        margin-top: 25px;
    }

    .mt-md-30 {
        margin-top: 30px;
    }

    .mt-md-35 {
        margin-top: 35px;
    }

    .mt-md-40 {
        margin-top: 40px;
    }

    .mt-md-45 {
        margin-top: 45px;
    }

    .mt-md-50 {
        margin-top: 50px;
    }
}

@media only screen and (min-width : 1200px) {
    /* margin-bottom */
    .mb-lg-0 {
        margin-bottom: 0;
    }

    .mb-lg-5 {
        margin-bottom: 5px;
    }

    .mb-lg-10 {
        margin-bottom: 10px;
    }

    .mb-lg-15 {
        margin-bottom: 15px;
    }

    .mb-lg-20 {
        margin-bottom: 20px;
    }

    .mb-lg-25 {
        margin-bottom: 25px;
    }

    .mb-lg-30 {
        margin-bottom: 30px;
    }

    .mb-lg-35 {
        margin-bottom: 35px;
    }

    .mb-lg-40 {
        margin-bottom: 40px;
    }

    .mb-lg-45 {
        margin-bottom: 45px;
    }

    .mb-lg-50 {
        margin-bottom: 50px;
    }

    /* margin-top */
    .mt-lg-0 {
        margin-top: 0;
    }

    .mt-lg-5 {
        margin-top: 5px;
    }

    .mt-lg-10 {
        margin-top: 10px;
    }

    .mt-lg-15 {
        margin-top: 15px;
    }

    .mt-lg-20 {
        margin-top: 20px;
    }

    .mt-lg-25 {
        margin-top: 25px;
    }

    .mt-lg-30 {
        margin-top: 30px;
    }

    .mt-lg-35 {
        margin-top: 35px;
    }

    .mt-lg-40 {
        margin-top: 40px;
    }

    .mt-lg-45 {
        margin-top: 45px;
    }

    .mt-lg-50 {
        margin-top: 50px;
    }
}

.circle-number:lang(th) {
    display: inline-block;
    width: 18px;
    height: 18px;
    color: #fff;
    background-color: #20acc6;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
}

.circle-number:lang(en) {
    display: inline-block;
    width: 20px;
    height: 20px;
    color: #fff;
    background-color: #20acc6;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    margin-right: 10px;
}


.field-validation-success {
    color: #3b3fd8;
    font-weight: normal;
    text-transform: uppercase;
}

.content-lg {
    padding-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
}

.background-grey {
    background-color: #f5f5f5;
}