/* Theme Name: The Project - Responsive Website Template
Author:HtmlCoder
Author URI:http://www.htmlcoder.me
Author e-mail:htmlcoder.me@gmail.com
Version:1.0.0
Created:December 2014
License URI:http://support.wrapbootstrap.com/
File Description: Place here your custom CSS styles
*/
body {
    color: #555;
    font-weight: 400;
    font-size: 15px;
    overflow-x: hidden;
}

h2 {
    font-size: 24px;
    font-weight: 600;
}

form {
    margin: 0;
}


.color-red {
    color: #E82727 !important;
}

.header-left {
    padding: 15px 0 10px 0;
}

.header-left .logo {
    height: 38px;
}

.fixed-header-on .header .logo img {
    max-height: 38px;
}

.header-left #logo img {
    max-height: 100%;
    width: auto;
}

.header {
    background-color: #31A2A4 !important;
}

.header.fixed:not(.dark) {
    background-color: rgba(49, 162, 164, 0.95) !important;
}

.navbar-default .navbar-nav>li>a {
    color: #fff;
    font-size: 16px;
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #fff !important;
}

.transparent-header .header:not(.dark) .navbar-nav>li.active>a {
    border-bottom: 4px solid #4bced0;
    background-color: transparent;
}

.transparent-header .header:not(.dark) .navbar-nav>li:not(.active)>a {
    color: #fff;
    border-bottom: 4px solid transparent;
}

.transparent-header .header:not(.dark) .navbar-nav>li:not(.active)>a:hover {
    border-bottom: 4px solid #4bced0;
    background-color: #2c989a;
}

.header .btn-hvr {
    margin: 0;
    border: 1px solid #fff;
    color: #fff;
    margin-top: 15px;
    font-size: 15px;
    padding: 5px 15px;
}

.header .btn-hvr:hover {
    color: #009698;
}

.header .hvr-shutter-out-horizontal:before {
    background: #dcedf7;
}

.subfooter {
    color: #000;
    padding: 15px 0;
    border-top: none;
    background-color: #099295;
    color: #fff;
}

.subfooter a {
    color: #fff;
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
    border-color: transparent;
    background-color: #3ca7a9;
}

.navbar-default .navbar-toggle {
    margin: 5px 0;
}


.slideshow .dark-translucent-bg {
    background-color: rgba(0, 0, 0, 0.0);
}

.tparrows.preview2 {
    background-color: rgba(49, 162, 164, 0.1);
    /* background-color: rgba(0, 0, 0, 0.3); */
    /* display: none; */
}

.tparrows.preview2:before {
    color: #2c989a;
}

.tparrows.preview2:hover {
    background-color: rgba(49, 162, 164, 0.2);
    /* background-color: rgba(0, 0, 0, 0.4); */
}

.tp-bullets.preview4 .bullet,
.tp-bullets.preview2 .bullet {
    margin-left: 2px !important;
    margin-right: 2px !important;
}

.tp-bullets.preview4 .bullet:hover,
.tp-bullets.preview4 .bullet.selected,
.tp-bullets.preview2 .bullet:hover,
.tp-bullets.preview2 .bullet.selected {
    background: #2c989a !important;
}

.btn-lg {
    font-size: 16px;
}

.xlarge_blue {
    font-size: 34px;
    font-weight: 600;
    color: #238486;
    line-height: 1.2;
    /* font-family: "黑体"; */
}

.large_blue {
    font-size: 30px;
    font-weight: 600;
    color: #238486;
    line-height: 1.4 !important;
}

.large_black {
    font-size: 24px;
    /* font-weight: 600; */
    color: #000;
    line-height: 1.4 !important;
    font-family: "";
}

.medium_blue {
    font-size: 17px;
    color: #238486;
    font-weight: 400;
}

.medium_black {
    font-size: 17px;
    color: #000;
    font-weight: 400;
    line-height: 1.4 !important;
}

.small_blue {
    font-size: 15px;
    color: #238486;
    font-weight: 400;
}

.small_black {
    font-size: 15px;
    color: #000;
    font-weight: 400;
}

.scrollToTop {
    /* background-color: rgba(49, 162, 164, 0.8); */
    width: 48px;
    height: 45px;
}

.scrollToTop i {
    line-height: 45px;
    font-size: 22px;
}

.scrollToTop:hover {
    background-color: rgba(49, 162, 164, 0.9);
}

.tp-bannertimer {
    background-color: rgba(49, 162, 164, 0.3);
}

.separator:after {
    height: 1px;
    background: #e8e8e8;
    background: -moz-linear-gradient(left, rgba(49, 162, 164, 0) 0%, rgba(49, 162, 164, 0.39) 35%, rgba(49, 162, 164, 0.39) 70%, rgba(49, 162, 164, 0) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(49, 162, 164, 0)), color-stop(35%, rgba(49, 162, 164, 0.39)), color-stop(70%, rgba(49, 162, 164, 0.39)), color-stop(100%, rgba(49, 162, 164, 0)));
    background: -webkit-linear-gradient(left, rgba(49, 162, 164, 0) 0%, rgba(49, 162, 164, 0.39) 35%, rgba(49, 162, 164, 0.39) 70%, rgba(49, 162, 164, 0) 100%);
    background: -o-linear-gradient(left, rgba(49, 162, 164, 0) 0%, rgba(49, 162, 164, 0.39) 35%, rgba(49, 162, 164, 0.39) 70%, rgba(49, 162, 164, 0) 100%);
    background: -ms-linear-gradient(left, rgba(49, 162, 164, 0) 0%, rgba(49, 162, 164, 0.39) 35%, rgba(49, 162, 164, 0.39) 70%, rgba(49, 162, 164, 0) 100%);
    background: linear-gradient(to right, rgba(49, 162, 164, 0) 0%, rgba(49, 162, 164, 0.39) 35%, rgba(49, 162, 164, 0.39) 70%, rgba(49, 162, 164, 0) 100%);
    position: absolute;
    bottom: -1px;
    content: "";
    width: 100%;
    left: 0;
}

.separator-2:after {
    height: 1px;
    background: #d1d1d1;
    background: -moz-linear-gradient(left, rgba(49, 162, 164, 0.58) 0%, rgba(49, 162, 164, 0.42) 35%, rgba(49, 162, 164, 0.25) 70%, rgba(49, 162, 164, 0) 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(49, 162, 164, 0.58)), color-stop(35%, rgba(49, 162, 164, 0.42)), color-stop(70%, rgba(49, 162, 164, 0.25)), color-stop(100%, rgba(49, 162, 164, 0)));
    background: -webkit-linear-gradient(left, rgba(49, 162, 164, 0.58) 0%, rgba(49, 162, 164, 0.42) 35%, rgba(49, 162, 164, 0.25) 70%, rgba(49, 162, 164, 0) 100%);
    background: -o-linear-gradient(left, rgba(49, 162, 164, 0.58) 0%, rgba(49, 162, 164, 0.42) 35%, rgba(49, 162, 164, 0.25) 70%, rgba(49, 162, 164, 0) 100%);
    background: -ms-linear-gradient(left, rgba(49, 162, 164, 0.58) 0%, rgba(49, 162, 164, 0.42) 35%, rgba(49, 162, 164, 0.25) 70%, rgba(49, 162, 164, 0) 100%);
    background: linear-gradient(to right, rgba(49, 162, 164, 0.58) 0%, rgba(49, 162, 164, 0.42) 35%, rgba(49, 162, 164, 0.25) 70%, rgba(49, 162, 164, 0) 100%);
    position: absolute;
    bottom: -1px;
    left: 0px;
    content: "";
    width: 100%;
}

.input-group .btn {
    margin: 0;
}

.input-group .form-control {
    height: 36px;
}

.icon.small {
    width: 40px;
    height: 40px;
    line-height: 40px;
}

.page-content {
    min-height: calc(100vh - 117px);
}

.diamond {
    background-color: #CCE9EF;
    color: #009698;
    min-width: 80px;
    height: 40px;
    display: block;
    text-align: center;
    padding: 0 35px 0 15px;
    line-height: 40px;
    position: relative;
    font-size: 16px;
    /* font-weight: 600; */
}

.diamond::before {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-bottom: 40px solid #CCE9EF;
    border-left: 20px solid transparent;
    left: -20px;
    top: 0;
}

.diamond::after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-bottom: 40px solid #fff;
    border-left: 20px solid transparent;
    right: 0px;
    top: 0;
}

.home .banner .show-btn {
    cursor: default;

}

.home .banner .feature {
    height: 26px;
}

.home .banner p {
    margin: 0;
}

.home .func h2 {
    margin-top: 10%;
}

.home .func img {
    box-shadow: 0px 0px 20px 0px #cccccc;
}

.section-title {
    color: #2c989a;
    font-size: 22px;
    margin: 0 0 30px 0;
}

.home .technology .testimonial h3 {
    font-size: 40px;
    color: #4B525C;
    margin-top: 0;
}

.home .technology blockquote {
    padding: 10px 40px;
    max-width: 620px;
}

.home .login-form {
    position: absolute;
    top: 67%;
    z-index: 100;
    width: 300px;
}

.home .login-form .btn {
    width: 100px;
}

.home .aboutus .aboutus-item {
    margin-bottom: 30px;
}

.home .aboutus .aboutus-item h5 {
    font-size: 16px;
}

.home .aboutus .aboutus-item h5 i {
    margin-right: 10px;
    color: #ffffff;
    font-size: 15px;
    display: inline-block;
    vertical-align: middle;
    background-color: #31A2A4;
    width: 24px;
    text-align: center;
    height: 24px;
    border-radius: 50%;
    line-height: 24px;
}

.home .aboutus .aboutus-item h5 i.fa-briefcase {
    font-size: 12px;
}

.home .aboutus .aboutus-item p {
    margin-bottom: 5px;
    padding-left: 35px;
}

.home .aboutus .aboutus-item p span {
    margin-right: 10px;
}

.home .contact {
    padding-bottom: 50px;
}

.home .contact .map {
    height: 350px;
    border: 1px solid #eee;
}

.home .contact2 {
    background-color: #31A2A4;
    color: #fff;
}

.home .contact2 h2 {
    color: #fff;
    margin-bottom: 0;
}

.home .contact2 .btn {
    font-size: 17px;
    color: #32ACAE;
    font-weight: 600;
    padding: 5px 30px;
}

.home .contact2 .btn:hover {
    background-color: #CCE9EF;
}

form label,
.radio label,
.checkbox label {
    font-weight: 400;
}

.modal-content .modal-header {
    text-align: center;
    padding: 12px 15px;
}

.modal-body {
    min-height: 100px;
    padding: 30px 50px;
}

.modal-body p {
    margin-bottom: 10px;
}

.modal-content {
    overflow: hidden;
}

.modal-content .modal-title {
    font-size: 17px;
    font-weight: 600;
}


.modal-footer {
    text-align: center;
    border: none;
    padding: 15px 15px 50px 15px;
}

.modal-body .modal-footer {
    padding: 30px 15px;
}

.modal-footer .btn {
    min-width: 120px;
    margin: 0 15px !important;
    padding: 6px 20px;
}

.form-control {
    height: 36px;
}

button.close {
    color: #fff;
    font-weight: 300;
    opacity: 0.8;
}

button.close:hover {
    color: #fff;
    opacity: 0.9;
}

#registerModal .get-code {
    padding: 6px 10px;
    font-size: 14px;
    width: 100px;
    border-radius: 0 4px 4px 0;
}

#registerModal .get-code.btn-gray {
    color: #E82727;
}

#registerModal .control-label {
    margin-bottom: 0px;
    color: #000;
}

#registerModal .form-group {
    margin-bottom: 20px;
}

#registerModal .bv-form .help-block {
    margin: 0;
    position: absolute;
}

#messageModal {
    margin-top: 12vh;
}

#messageModal p {
    color: #000;
}

#messageModal .list li::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #32ACAE;
    vertical-align: middle;
    margin-right: 5px;
    margin-top: -1px;
}

@media (max-width: 767px) {
    h2 {
        font-size: 20px;
    }

    .transparent-header .main-navigation .navbar.navbar-default {
        background-color: transparent;
        position: absolute;
        width: 100%;
        border-color: transparent;
    }

    .transparent-header .header-left {
        padding: 15px 0 15px;
    }

    .navbar-default .navbar-nav>li>a {
        border-bottom: none;
        font-size: 15px;
    }

    .transparent-header .header:not(.dark) .navbar-nav>li:not(.active)>a:hover {
        border-bottom-width: 2px;
    }

    .btn-lg {
        padding: 8px 20px;
        font-size: 14px;
    }

    .btn-animated.btn-lg i {
        line-height: 36px;
        font-size: 12px;
    }

    .modal-dialog {
        margin: 50px auto 30px;
        border: none;
        padding: 0 5%;
    }

    .modal-body {
        padding: 20px;
    }

    .modal-footer {
        padding-bottom: 30px;
    }

    .pv-40 {
        padding: 30px 0;
    }

    .pv-60 {
        padding: 40px 0;
    }

    .transparent-header .header:not(.dark) .navbar-nav>li.active>a {
        border-bottom: none;
    }

    .header .btn-hvr {
        margin-top: 10px;
    }

    .banner .xlarge_blue {
        font-size: 18px !important;
        font-weight: bold !important;
    }

    .banner .large_blue {
        font-size: 16px !important;
        font-weight: bold !important;
    }

    .banner .medium_blue {
        font-size: 13px !important;
    }

    .banner .medium_black {
        font-size: 13px !important;
    }


    .banner .small_blue {
        font-size: 12px !important;
    }

    .banner .small_black {
        font-size: 12px !important;
    }

    .banner .hidden-sm .diamond {
        height: 30px;
        padding: 0 25px 0 10px;
        line-height: 30px;
        font-size: 14px;
        min-width: 60px;
    }

    .banner .hidden-sm .diamond::before {
        border-bottom: 30px solid #CCE9EF;
        border-left: 15px solid transparent;
        left: -15px;
    }

    .banner .hidden-sm .diamond::after {
        border-bottom: 30px solid #fff;
        border-left: 15px solid transparent;
    }

    .home .banner .feature {
        height: 16px !important;
        width: auto !important;
    }

    .home .aboutus {
        padding-top: 30px;
    }
}

@media (min-width: 768px) {
    .hidden-sm {
        display: none;
    }

    .navbar-default .navbar-nav>li>a {
        padding: 20px 10px 20px 10px;
        margin: 0 10px;
    }

    .modal-dialog {
        width: 700px;
        margin: 12vh auto 30px;
    }

    #registerModal .modal-body {
        padding: 30px 100px;
    }

    .fixed-header-on .header-left {
        padding: 15px 0 0 0;
    }
}