/* basic config */
html {
    font-family:PingFang, NotoSansHans-Regular, AvenirNext-Regular, proxima-nova, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", "Open Sans", "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    height: 100%;
}

body {
    color: #494a4a;
    background: #FFF;
    font-size: 1rem; /* 14 px */
    height: 100%;
}

/* font size settings */
.font-12 {
    font-size: 0.85rem;
}
.font-14 {
    font-size: 1.000rem;
}

.font-16 {
    font-size: 1.143rem;
}

.font-20 {
    font-size: 1.429rem;
}

.font-24 {
    font-size: 1.714rem;
}

.font-36 {
    font-size: 2.571rem;
}

.font-50 {
    font-size: 3.571rem;
}
/* text color settings */
.text-main {
    color: #68A463;
}

.text-contrast {
    color: #FFF;
}

.text-dark {
    color: #494a4a;
}

/* background filled settings */
.image-filled {
    background-color: #FFF;
    background-position: center;
    background-size: cover;
}

.color-filled-white {
    background-color: #FFF;
}

.color-filled-grey {
    background-color: #F6F6F6;
}

.color-filled-darkgrey {
    background-color: #2B2B2B;
}

.color-filled-grident-grey {
    background: linear-gradient(90deg, #F4F4F4, #E7EAF1);
}
/* links */

.btn-outline-primary {
    border-color:#5656F0;
    color:#5656F0;
}

.btn-outline-primary:hover {
    background:#5656F0;
    border-color:#5656F0;
    color:#fff;
}

/* transition animations */
.with-transition {
    transition: all 200ms ease-out 0s;
}


/* backgrund image icon */
i.img {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0%;
}

i.img.half-size {
    width: 60%;
    height: 60%;
    margin: 20%;
}

.text-primary{
    color:#68A463 !important;
}
.text-primary:hover {
    color: #68A463 !important;
}
a.text-primary:hover {
    color: #68A463 !important;
}

/* .text-primary:hover, .btn-primary:hover{
    color:#86B682 !important;
} */

.text-primary:active, .btn-primary:active{
    color:white !important;
}

.btn-primary {
    background-color:#5656F0;
    border-color:#5656F0;
}

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

.btn-primary:active, .btn-primary:focus{
    background-color:#6e6ef1;
    border-color:#6e6ef1;
}

.btn-primary:active { background-color:#53834F; border-color:#6e6ef1; }

.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active {
    color: #fff;
    background-color: #6e6ef1;
    border-color: #6e6ef1;

input:focus, select:focus{
	border-color:#86B682;
}

.form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: #86B682;
  outline: 0;
  box-shadow: 0 0 0 0.05rem #86B682;
}
.tips-with-border {
    display: flex;
    align-items: center;
    justify-content: 'center';
}
.tips-with-border > .tips {
margin: 0;
}
.tips-with-border > .right-border ,
.tips-with-border > .left-border {
    height: 1px;
    flex-grow: 1;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.mb-30 { margin-bottom: 30px; }
.mb-20 { margin-bottom: 20px; }
.my-30 { margin-bottom: 30px;margin-top: 30px; }
.text-gray { color: #c2c2c2; }
.bg-gray { background-color: #e3e3e3; }
.border-gray { border-color: #e3e3e3; }
.bg-primary {
    background-color:#86B682 !important;
}

.bg-primary:hover {
    background-color:#86B682 !important;
}

/* login */
.login-input {
    line-height:2.25rem;
}
.login-third .col-sm-3, .col-xs-3 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}