.plain-select, .vertical-middle {
    vertical-align: middle
}

@font-face {
    font-family: SuperRichArial;
    src: url(../fonts/arial.ttf)
}

@font-face {
    font-family: SuperRichGalSILR;
    src: url(../fonts/GalSILR_0.ttf)
}

@font-face {
    font-family: SuperRichSupermarket;
    src: url(../fonts/supermarket.ttf)
}

@font-face {
    font-family: SuperRichDBSurawong;
    src: url(../fonts/DB_Surawong_X_Li_v3.2_1.ttf)
}

.font-normal {
    font-family: SuperRichArial
}

.font-normal-thai {
    font-size: 16px;
    font-family: SuperRichSupermarket
}

.font-header {
    font-family: SuperRichGalSILR
}

.font-header-term-con {
    font-family: SuperRichArial
}

.superrich-color-green {
    color: #006d50
}

.superrich-color-super-green {
    color: #0c7151
}

.superrich-color-super-light-green {
    color: #00a261
}

.superrich-color-light-green {
    color: #2c9d45
}

.superrich-color-white {
    color: #fff
}

.superrich-color-black {
    color: #222
}

.superrich-color-gray {
    color: #8c9894
}

.superrich-color-super-gray {
    color: #576260
}

.superrich-color-red {
    color: #af1a08
}

.superrich-color-yellow {
    color: #f9e852
}

.superrich-bg-yellow {
    background: #f9e852
}

.superrich-bg-green {
    background: #006e51
}

.superrich-bg-green2 {
    background: #007d55
}

.superrich-bg-light-green {
    background: #2c9d45
}

.superrich-bg-super-light-green {
    background: #00a261
}

.superrich-bg-super-super-green {
    background: #ccddd3
}

.superrich-bg-light-gray {
    background: #f6f6f6
}

.superrich-bg-super-light-gray {
    background: #fafafa
}

.superrich-bg-gray {
    background: #f1f1f1
}

.superrich-bg-white {
    background: #fff
}

.superrich-bg-fb {
    background: #4266a4
}

.superrich-bg-red {
    background: #af1a08
}

.has-left {
    text-align: left
}

.has-right {
    text-align: right
}

.has-center {
    text-align: center
}

.has-justify {
    text-align: justify
}

.no-padding-left {
    padding-left: 0
}

.no-padding-right {
    padding-right: 0
}

.no-padding-left-right {
    padding-left: 0;
    padding-right: 0
}

.no-margin-left-right {
    margin-left: 0 !important;
    margin-right: 0 !important
}

.no-padding {
    padding: 0
}

.no-margin {
    margin: 0
}

.no-margin-right {
    margin-right: 0
}

.padding10 {
    padding: 10px
}

.margin-top5 {
    margin-top: 5px
}

.margin-top10 {
    margin-top: 10px
}

.margin-top20, .margin-top30 {
    margin-top: 20px
}

.margin-top40 {
    margin-top: 40px !important
}

.padding-left25 {
    padding-left: 25px
}

.padding-left40 {
    padding-left: 40px
}

.menu-right, .menu-right.green, .menu-right.yellow {
    padding: 2px;
    margin-right: 5px
}

.img-button:hover {
    cursor: pointer;
    opacity: .8;
    filter: alpha(opacity=80);
    -moz-opacity: .8;
    -khtml-opacity: .8
}

.btn-web:hover, .button-web:hover, .div-converter .row-buy-sell .button-buy-sell:hover, .link-button:hover {
    cursor: pointer;
    opacity: .8
}

.text-super-normal {
    font-size: 1.2em
}

.text-small-big {
    font-size: 1.3em
}

.text-big {
    font-size: 1.5em
}

.text-size16 {
    font-size: 16px
}

.text-size18 {
    font-size: 18px
}

.text-bold {
    font-weight: 700
}

.menu-right {
    background: #fff
}

.menu-right.yellow {
    background: #f9e854;
    color: #006e51
}

.menu-right.green {
    background: #00a261;
    color: #006e51
}

.td-bg-white {
    background: #fff;
    width: 100px;
    height: 35px;
    line-height: 35px;
    text-align: left;
    margin: auto
}

.btn-explore, .button-web {
    height: 40px;
    line-height: 40px
}

.btn-web, .button-web, .modal, .td-bg-white.center, .text-center {
    text-align: center
}

.td-bg-white.padding {
    padding-left: 15px
}

.button-web {
    border-radius: 7px
}

.btn-explore {
    width: 170px
}

.superrich-select {
    border-radius: 0;
    background: #017050;
    color: #fff;
    -webkit-appearance: none;
    border: none
}

.superrich-select-white {
    border: none;
    border-radius: 0
}

.superrich-select-green {
    border: none;
    border-radius: 0;
    color: #fff;
    background: #2c9d45
}

.superrich-input {
    /*border: none !important*/
    border: 1px solid #8c9894;
    border-radius: 0;
    /*max-width: 350px;*/
}

.superrich-label-form {
    font-weight: 400;
    padding-left: 15px
}

.up-to {
    border-radius: 50%;
    width: 75px;
    height: 75px;
    background: #017050;
    margin: auto;
    padding-top: 13px;
    line-height: 13px
}

.up-to span {
    font-size: 1.5em
}

.td-no-border {
    border: none !important
}

.canvasjs-chart-credit {
    display: none
}

.circleStatus, .div-inline, .plain-select {
    display: inline-block
}

.input-group-addon {
    border-radius: 0;
    border: none;
    background: #fff
}

.input-group input {
    border-radius: 0;
    border: none
}

.input-daterange input:first-child {
    border-radius: 0
}

.btn-convert {
    background: #0c7153;
    width: 100%
}

.text-shadow {
    text-shadow: 0 1px 2px rgba(0, 0, 0, .6)
}

.margin-right10 {
    margin-right: 10px
}

.line-height30 {
    line-height: 30px
}

.circleRegister, .line-height40 {
    line-height: 40px
}

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

.img-width100 {
    width: 100%
}

.padding-left-right15 {
    padding-left: 15px;
    padding-right: 15px
}

.circleBase {
    border-radius: 50%
}

.circleStatus {
    width: 30px;
    height: 30px;
    border: 5px solid #fff
}

.circleRegister {
    width: 40px;
    height: 40px
}

.superrich-ul li {
    line-height: 2em
}

.superrich-date input {
    /*border-bottom-left-radius: 4px;*/
    /*border-top-left-radius: 4px*/
    /*border: 1px solid #8c9894;*/
    /*border-radius: 0;*/
}

.superrich-date {
    /*border-bottom-left-radius: 4px;*/
    /*border-top-left-radius: 4px*/
    border: 1px solid #8c9894;
    border-radius: 0;
}

.superrich-date span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px
}

.plain-select {
    position: relative;
    width: 100%
}

.plain-select select {
    height: 38px;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    border-radius: 0;
    display: block;
    width: 100%;
    border: none;
    color: #fff;
    padding: 8px 20px 7px 10px;
    margin: 0;
    line-height: normal
}

.plain-select select.white {
    background: #fff;
    color: #000
}

.ie8 .plain-select select {
    padding-right: 3px
}

.plain-select select:focus {
    outline: 0;
    border-color: rgba(82, 168, 236, .8);
    box-shadow: 0 0 8px rgba(82, 168, 236, .6)
}

.plain-select ::-ms-expand {
    display: none
}

.plain-select:after {
    content: "";
    position: absolute;
    z-index: 2;
    right: 8px;
    top: 50%;
    margin-top: -3px;
    height: 0;
    width: 0;
    border-top: 6px solid #fff;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    pointer-events: none
}

.plain-select.white:after {
    border-top: 6px solid #006d50
}

.currency-selectpicker, .currency-selectpicker:focus, .currency-selectpicker:hover {
    background: #fff;
    border-radius: 0
}

.bootstrap-select {
    border: none
}

.bootstrap-select .dropdown-menu {
    background: #fff;
    border-radius: 0;
    border: none
}

.bootstrap-select .dropdown-menu ul li a, .bootstrap-select .dropdown-menu ul li.selected a {
    background: #fff !important;
    color: #000 !important
}

.navbar-inverse, .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background: #fff
}

.bootstrap-select .dropdown-menu ul li.selected a {
    color: rgba(82, 168, 236, .6) !important
}

::-webkit-input-placeholder {
    font-weight: 400
}

:-moz-placeholder {
    font-weight: 400
}

::-moz-placeholder {
    font-weight: 400
}

:-ms-input-placeholder {
    font-weight: 400
}

.specifictd {
    white-space: pre-wrap;
    white-space: -moz-pre-wrap;
    white-space: -o-pre-wrap;
    word-wrap: break-word
}

.navbar-inverse {
    border-bottom: none
}

.navbar-inverse .navbar-toggle, .navbar-inverse .navbar-toggle:focus {
    background: #fff;
    border: none;
    margin-top: 0
}

.navbar-inverse .navbar-toggle .icon-bar {
    background: #006d50;
    height: 7px;
    width: 35px
}

.navbar-nav > li {
    background: #006d50
}

.navbar-nav > li > a {
    color: #fff
}

.navbar-nav > .active > a {
    background: #03975d !important
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border: none
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
    background-color: #03975d !important
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a .navbar-inverse .navbar-nav > .open > a {
    background: #f9e852
}

.dropdown-menu {
    padding: 0
}

.dropdown-menu > li > a {
    color: #000 !important;
    background: #f9e852
}

#myCarousel3 ol li {
    background: #ddd
}

#myCarousel3 ol li.active {
    background: #00a261
}

#myCarousel2 ol li {
    background: #fff
}

#myCarousel2 ol li.active {
    background: #00a25f;
    border: none
}

.glyphicon.glyphicon-one-fine-dot:before {
    content: "\25cf";
    font-size: .75em;
    margin-right: 10px
}

.div-converter .row-buy-sell {
    border-bottom: 1px solid #00a261;
    padding-bottom: 10px
}

.div-converter .row-buy-sell .button-buy-sell {
    height: 40px;
    width: 130px;
    border-radius: 10px;
    background: #007d55;
    line-height: 40px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px
}

.div-converter .row-buy-sell .button-buy-sell.select {
    border: 2px solid #fff !important;
    background: #007d55;
    line-height: 36px;
    cursor: default;
    opacity: 1
}

.div-converter .row-currency span {
    margin-top: 5px
}

.href-style {
    color: #0f0f0f !important;
    text-decoration: none
}

.color-red, .has-error .checkbox, .has-error .checkbox-inline, .has-error .control-label, .has-error .help-block, .has-error .radio, .has-error .radio-inline, .has-error.checkbox label, .has-error.checkbox-inline label, .has-error.radio label, .has-error.radio-inline label {
    color: #f1986b !important
}

.href-style:active, .href-style:hover, .href-style:visited, a:active, a:hover, a:visited {
    text-decoration: none !important
}

@media (min-width: 768px) {
    .div-converter {
        padding-bottom: 30px !important
    }

    .div-converter > div {
        margin-top: 10px !important;
        padding-left: 15px !important;
        padding-right: 15px !important
    }

    .div-converter .row-buy-sell .button-buy-sell {
        width: 160px
    }
}

@media (min-width: 992px) {
    .div-converter > div {
        padding-left: 5px !important;
        padding-right: 5px !important
    }

    .div-converter .row-buy-sell {
        border-bottom: 0;
        border-right: 1px solid #00a261
    }

    .div-converter .row-currency, .div-converter > div#converter-header, .div-converter > div.select {
        padding-left: 25px !important
    }
}

@media (min-width: 1200px) {
    .div-converter {
        padding-bottom: 10px !important
    }

    .div-converter > div {
        padding-left: 15px !important;
        padding-top: 30px;
        margin-top: -20px !important
    }

    .div-converter > div#converter-header {
        margin-top: 0 !important
    }

    .div-converter .row-buy-sell {
        padding-left: 0 !important
    }

    .div-converter > div.select {
        padding-left: 43px !important
    }
}

.animate-show.ng-hide-add, .animate-show.ng-hide-remove {
    transition: all linear 1s;
    display: block !important
}

.loader, .modal-dialog, .modal:before {
    display: inline-block;
    vertical-align: middle
}

.animate-show.ng-hide-add.ng-hide-add-active, .animate-show.ng-hide-remove {
    opacity: 0
}

.animate-show.ng-hide-add, .animate-show.ng-hide-remove.ng-hide-remove-active {
    opacity: 1
}

.carousel-fade .carousel-inner .item {
    -webkit-transition-property: opacity;
    transition-property: opacity
}

.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right, .carousel-fade .carousel-inner .item {
    opacity: 0
}

.carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
    opacity: 1
}

.carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right, .carousel-fade .carousel-inner .next, .carousel-fade .carousel-inner .prev {
    left: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.carousel-fade .carousel-control {
    z-index: 2
}

.form-group.has-error .form-control {
    border: 1px solid #f1986b !important
}

.modal:before {
    content: " ";
    height: 100%
}

.modal-dialog {
    text-align: left
}

.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active {
    background-color: #00a261;
    border-color: #00a261;
    font-weight: 600;
    color: white !important;
}

.datepicker table tr td.active.active.focus, .datepicker table tr td.active.active:focus, .datepicker table tr td.active.active:hover, .datepicker table tr td.active.highlighted.active.focus, .datepicker table tr td.active.highlighted.active:focus, .datepicker table tr td.active.highlighted.active:hover, .datepicker table tr td.active.highlighted:active.focus, .datepicker table tr td.active.highlighted:active:focus, .datepicker table tr td.active.highlighted:active:hover, .datepicker table tr td.active:active.focus, .datepicker table tr td.active:active:focus, .datepicker table tr td.active:active:hover {
    background-color: #ddd;
    border-color: #ddd
}

.loader {
    border: 16px solid #f3f3f3;
    border-top: 16px solid #00a261;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin 2s linear infinite;
    margin-right: 10px
}

@keyframes spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

.link-button:hover{
    cursor: pointer;
    opacity: .8;
    filter: alpha(opacity=80);
    -moz-opacity: .8;
    -khtml-opacity: .8
}

.lds-ring {
    vertical-align: middle;
    display: inline-block;
    position: relative;
    width: 35px;
    height: 35px;
}
.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 25px;
    height: 25px;
    margin: 6px;
    border: 6px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
}
@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

a.disabled {
    pointer-events: none;
    cursor: default;
}
