body{
	padding:0;
	margin:0;
	background:#fff;
	position:relative;
	font-family: 'Montserrat', sans-serif;
}
body a{
    transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
a:hover{
	text-decoration:none;
}
input[type="button"],input[type="submit"],.contact-form input[type="submit"]{
	transition:0.5s all;
	-webkit-transition:0.5s all;
	-moz-transition:0.5s all;
	-o-transition:0.5s all;
	-ms-transition:0.5s all;
}
h1,h2,h3,h4,h5,h6{
	margin:0;	
}	
p{
	margin:0;
	font-family: 'Open Sans', sans-serif;
}
ul{
	margin:0;
	padding:0;
}
label{
	margin:0;
}
img{
	width:100%;
}
/*--header--*/

.slogan-phone-show{
  	display:none;
}
/*-- navbar --*/
.bg-faded {
    background: #1060A7;
    border: solid 1px #0060A7;
}
.navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .open>.nav-link {
    color: #FFFFFF;
}
.navbar-light .navbar-nav .nav-link {
    color: #FFFFFF;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
}
.dropdown-item {
    text-transform: uppercase;
    font-weight: 600;
    font-size: 15px;
    color: #333;
}
.dropdown-item:hover,.dropdown-item:focus {
    color: #ffffff;
    background-color: #626464;
}
li.nav-item {
    margin: 0 20px;
    color: #fff;
}
.nav-pills li.nav-item{
	width:27%;
	text-align:center;
	background-color: #e5e6e6;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), to(transparent));
    background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
    background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
}

.help_hand{
	float:left;
}
/*-- //navbar --*/

/*-- header top --*/
.headder-y3, .y3-header-top-right-text, .email-right, .agileinfo-social-grids {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}
.headder-y3 a {
    color: #1b1b1b;
    font-weight: 800;
    font-size: 40px;
}
h6.caption {
    font-size: 20px;
    color: #333;
}
.email-right p a, .y3-header-top-right-text p, .agileinfo-social-grids ul li a {
    font-size: 14px;
    color: #7b7b7b;
    letter-spacing: 2px;
}
.agileinfo-social-grids ul li a {
    font-size: 13px;
    border: 1px dashed #6b6b6b;
    margin: 0 2px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    display: block;
    color: #6b6b6b;
}
.email-right p a:hover, .y3-header-top-right-text p:hover, .agileinfo-social-grids ul li a:hover{
    color: #f14156;
}
.agileinfo-social-grids ul li a:hover {
    color: #f14156;
    border: 1px dashed #f14156;
}

.login-icon{
	position: absolute;
	right: 3%;
	top: 0.5rem;
	font-weight: 400;
	cursor: pointer;
	color:#6E6E6E;
	
}

.login-icon:hover{
	color:#333;
}

.login-icon img{
	width:3em;
	height:3em; 
	border-radius: 10px;
}

.navbar-name{
	color: #FFF;
	width: 65%;
	margin-left: 2em;
	display: none;
}

/*-- //header top --*/
.tlinks{text-indent:-9999px;height:0;line-height:0;font-size:0;overflow:hidden;}
/*-- modal --*/
.modal-body {
    font-size: 15px;
    line-height: 28px;
    color: #2a2a2a;
}
.modal-title {
    font-size: 30px;
    font-weight: 700;
    color: #333;
}
/*-- //modal --*/

/*-- banner-slider --*/
.y3layouts-banner-top{
    background: url(../images/changqu1.jpg) no-repeat 0px 0px;
    background-size: cover;	
	-webkit-background-size: cover;	
	-moz-background-size: cover;
	-o-background-size: cover;		
	-moz-background-size: cover;
	min-height:650px;
}
.y3layouts-banner-top1{
    background: url(../images/banner1.jpg) no-repeat 0px 0px;
    background-size: cover;	
	-webkit-background-size: cover;	
	-moz-background-size: cover;
	-o-background-size: cover;		
	-moz-background-size: cover;
}
.y3layouts-banner-top2{
    background: url(../images/1.jpg) no-repeat 0px 0px;
    background-size: cover;	
	-webkit-background-size: cover;	
	-moz-background-size: cover;
	-o-background-size: cover;		
	-moz-background-size: cover;
}
.y3layouts-banner-top3{
    background: url(../images/shopbaner.jpg) no-repeat 0px 0px;
    background-size: cover;	
	-webkit-background-size: cover;	
	-moz-background-size: cover;
	-o-background-size: cover;		
	-moz-background-size: cover;
}
.y3layouts-banner-top4{
    background: url(../images/banner2.jpg) no-repeat 0px 0px;
    background-size: cover;	
	-webkit-background-size: cover;	
	-moz-background-size: cover;
	-o-background-size: cover;		
	-moz-background-size: cover;
}
.bs-slider-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; 
	background: url(../images/dott.png)repeat 0px 0px;
    background-size: 2px;
    -webkit-background-size: 2px;
    -moz-background-size: 2px;
    -o-background-size: 2px;
    -ms-background-size: 2px;
}
.y3l-slide-text {
    margin-top: 13em;
}
.y3l-slide-text h3 {
    color: #fff;
    font-size: 55px;
	font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
    text-shadow: 2px 2px 3px #292828;
    -webkit-animation-delay: 0.7s;
    animation-delay: 0.7s;
}
.y3l-slide-text p {
    color: #d6d6d6;
    letter-spacing: 3px;
    text-shadow: 1px 1px 4.8px rgba(3,3,3,.3);
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
    font-weight: 600;
    font-size: 15px;
    border: 1px solid #fff;
    text-transform: capitalize;
}
.y3l-slide-text p.heading_bottom{
	border: none;
	color: #eee;
	font-size: 15px;
	letter-spacing: 1px;
	font-weight: 100;
	line-height: 28px;
	width: 70%;
	margin: 0 auto;
    text-transform: lowercase;
}
 a.button-style {
    color: #d6d6d6;
    letter-spacing: 2px;
    text-shadow: 1px 1px 4.8px rgba(3,3,3,.3);
    -webkit-animation-delay: 1.1s;
    animation-delay: 1.1s;
    font-size: 15px;
    border: 1px solid #fff;
    text-transform: capitalize;
	padding: 10px 30px;
 }
 a.button-style:hover{
	background: #818b99;
    border: 1px solid #818b99;
 }
/*-- //banner-slider --*/
/*- slogan -*/
.slogan-bg-blue{
	background-color: #173A50;
    padding: 6px 0;
    border-bottom: 1px solid #fff;
}
.slogan-bg-red{
	background-color: #5A202C;
	padding: 3px 10px;
}

/*-- slogan end--*/
/*-- process bar --*/
.yeprocessbar {
	width:100%;
	padding:0;
	margin:0;
	position:relative;
	display:block;
	overflow:hidden;
	height:20px;
	background-color:#fff;
	border-radius:5px 0 0 5px;
	font-size: 13px;
	color: #ffff;
    /* text-align: center; */
}
.yeprocessbar .percent{
	padding:5px 5px 5px 20px;
	position:absolute;
	top:0;
	z-index:9
}
.yeprocessbar .percent {
	right:0;
	color:#000;
	font-weight:700
}
.yeprocessbar .filled {
	animation:change 5s linear 0s infinite;
	-webkit-animation:change 5s infinite;
	-moz-animation:change 5s infinite;
	-ms-animation:change 5s infinite;
	
	animation-iteration-count:3;
	-webkit-animation-iteration-count:3; /* Safari 和 Chrome */
	
	z-index:8;
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:20px;
	border-radius:5px 0 0 5px;
	color:#fff;
	background-color:#015990;
}
@keyframes change{
	0% {background-color:#015990;}
	25%{background-color:#015990;}
	50%{background-color:#CE261F;}
	75%{background-color:#FCCE01;}
	100% {background-color:#FCCE01;}
}

@-moz-keyframes change /* Firefox */
{
	0% {background-color:#015990;}
	25%{background-color:#015990;}
	50%{background-color:#CE261F;}
	75%{background-color:#FCCE01;}
	100% {background-color:#FCCE01;}
}

@-webkit-keyframes change /* Safari 和 Chrome */
{
	0% {background-color:#015990;}
	25%{background-color:#015990;}
	50%{background-color:#CE261F;}
	75%{background-color:#FCCE01;}
	100% {background-color:#FCCE01;}
}



/*--// process bar --*/
/*-- stats --*/
.numscroller {
    font-size: 13px;
    color: #3e4b5d;
    font-weight: 600;
}

.stats-grid p {
    color: #eee;
    letter-spacing: 1px;
    font-size: 15px;
    min-width:4rem;
}
.stats-info-agile p {
    color: #000;
    font-size: 16px;
}
.right-stats {
   /*  background: #818b99; */
  /*  background: rgb(237, 247, 255); */
   margin:auto;
}
/*-- //stats --*/

/*-- Welcome section --*/
h2.heading,h3.heading {
    font-size: 40px;
    font-weight: 700;
    color: #232323;
}
p.heading-bottom {
    color: #dbdbdb;
    letter-spacing: 2px;
    font-size: 15px;
}
.welcome_right p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #7b7b7b;
}
.icon span.fa,.icon span.fas {
    font-size: 20px;
    width: 55px;
    height: 55px;
    line-height: 55px;
    background: #818b99;
    color: #fff;
}
.grid_info {
    padding-left: 0;
}
.grid_info h3 {
    font-size: 20px;
    font-weight: 700;
    color: #333;
}
.welcome_right{
    z-index: 1;
}
.welcome_right:after {
    border: 5px solid #818b99;
    content: "";
    display: inline-block;
    /*left: -15px;*/
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: -1;
}
/*-- //Welcome section --*/

/*-- clients --*/
.cli-ent {
    width: 100%;
    margin: 0 auto;
	background: #1b1b1b;
	padding: 2em;
}
.contact-y3layouts h3,
.clients h3 {
	color: #000!important;
}
.spldishes-y3left {
	padding: 2.3em;
	background-color: #fd463e;
	-webkit-transition: .5s all;
	-moz-transition: .5s all;
	-o-transition: .5s all;
	-ms-transition: .5s all;
	transition: .5s all;
}
.y3agile-spldishes p.para-agileits-y3layouts {
	color: #8a8888!important;
}
.spldishes-agileinfo:hover .spldishes-y3left {
	background-color: #09c4dc;
}
.spldishes-agileinfo {
	margin-top: 4em;
}
.spldishes-agileinfo h5 {
	font-size: 2em;
	color: #fff;
}
.spldishes-y3left p {
	color: #fff;
	margin-top: 1.4em;
}
.spldishes-grids {
	padding: 0;
}
.g1 {
	position: relative;
	display: block;
	padding: 0em 0em 3em;
	margin: 0em 0em 0em 1em;
}
.agile-dish-caption h4 {
    font-size: 26px;
    color: #fff;
    margin: 0.6em 0;
}
.agile-dish-caption h5 {
    font-size: 17px;
    color: #eee;
    margin: 0.6em 0;
    letter-spacing: 3px;
}
.agile-dish-caption h3 {
	font-weight: bold;
	color: #3d3d3d;
}
.agile-dish-caption span {
    margin: 0;
    padding: 0;
    font-size: 16px;
    line-height: 30px;
    color: #999;
    font-weight: 300;
    display: block;
}
#owl-demo .item img {
	width: 100px;
}
p.para-y3-agile {
	line-height: 32px;
    font-size: 14px;
    color: #bbb;
    letter-spacing: 1px;
    width: 80%;
    margin: 0 auto;
    font-weight: 100;
}
.agile-dish-caption {
    text-align: center;
}
.flexslider .slides img {
    display: inline-block;
    width: 120px;
    height: 120px;
    border: 3px solid #818b99;
    padding: 5px;
}
.g1 p span.fa {
	font-size: 1.8em;
	color: #444;
	margin-right: 0.5em;
}

.y3layouts-header-top {
    padding: 1em 2em;
    background: #fff;
    color: #6E6E6E;
}
.y3-header-top-left {
	width: 25%;
	float: left;
	text-align: left;
}
.y3-header-top-right {
	/* width:60%; */
	float: left;
	text-align:left;
	margin: 0 0 0 1.2em;
}

/*-- contract --*/
.contract{
	background:url(../images/globalBg.jpg) no-repeat 0px 0px;
	background-size: cover;
	height:auto;
	height:auto;
	overflow-y: auto;
	border-radius: 40px;
}

.contract .doc-report .card-report-item .slid-move {
    margin-top: -48px;
}
.contract .card{
	 background: rgba(206, 206, 206, 0.6);
	 width:100%;
     border-radius: 15px;
}
.contract .open-detail.card-report-item{
    border-radius: 15px;
}

.contract .open-detail.card-report-item:hover{
   background: rgba(46, 70, 156, 0.6);
}


.contract-grid h3 {
    font-size: 20px;
    font-weight: 600;
    color: #eee;
    letter-spacing: 1px;
}
.contract-grid p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #bbb;
}
.contract-grid .agileits-button.two a {
    color: #fff;
}
.contract  h3.heading{
    color: #fff;
}


.title_head,.card-title.item-title span{
	border-bottom:1px dashed  #9e9e9e;
}
.doc-report .card-report-item .content .item-title{
	color:#515559;
	padding:1rem;
	background: linear-gradient(#fffefd, #b2b2b2);
}

.contract-icon{
	
}

.card-level2-group{
	position: relative;
	min-height: 50px;
   /*  background-color: #eee; */
    padding-left: 2%;
    margin-bottom:2px;
}

.card-level2-group:before{
    content: " ";
    position: absolute;
    top: -65px;
    left: 51px;
    height: 100%;
    border: none;
    border-left: 1px dashed #2f5597;
}

.card-level2-group:first-child:before{
    top: -20px;
}

.card-level2-group:after{
	content: " ";
    position: absolute;
    top: 25px;
    left: 51px;
    width: 18px;
    border: none;
    border-top: 1px dashed #2f5597;
}

.card-level2-content{
	display:flex;
	min-height: 50px;
    height: auto;
    width: 100%;
    margin-left: 5%;
    border-radius: 10px;
    align-items: center;
    font-size: .8rem;
    border:1px solid #3f3f3f;
    flex-wrap: wrap;
    position:relative;
    padding: 0.8% 0 0 0;
    cursor: pointer;
    background: rgba(200, 212, 252, 0.6);
    color: #0d189a;
    border:1px solid #0d189a;
    
}    
.card-level2-content:hover{
    background-color: #8FAADC;
     color: #fff;
     border:1px solid #fff;
}

.card-level2-content.invoice{
	background-color: #FFD966;
}

.card-level3-group{
    position: relative;
    min-height: 150px;
    background-color: #f6f6f6;
    padding-left: 2%;
    width: 90%;
    margin-left: 10%;
    margin-top: 3px;
    border-radius: 29px;
    border: 1.5px dashed #5f5f5f;
    font-size: .8rem;
    cursor: pointer;
    color: #27357f;
}
.card-level3-group .row{
	width:100%;
}

.card-level3-group table{
	font-size:.8rem;
}

.doc-report .slid-move.right-align{
	bottom: 1.3rem;
    left: 97%;
}


/*-- //contract --*/
/*-- debit --*/
.debit{
	background:url(../images/invoiceBg.jpg) no-repeat 0px 0px;
	background-size: cover;
}
.debit .card{
	 background: rgba(58, 58, 58, 0.6);
}
.debit .open-detail{
	background: rgba(141, 141, 141, 0.4);
    border-radius: 29px;
}
.debit-grid h3 {
    font-size: 20px;
    font-weight: 600;
    color: #eee;
    letter-spacing: 1px;
}
.debit-grid p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #bbb;
}
.debit-grid .agileits-button.two a {
    color: #fff;
}
.debit  h3.heading{
    color: #fff;
}
/*-- //debit --*/
/*--balance group --*/
.radius-bar .bar-item{
	border-radius:20px;
	cursor:pointer;
 	-webkit-user-select:none; 
 	-moz-user-select:none; 
 	-ms-user-select:none; 
 	user-select:none;
}
ul.container:before {
	width: 92%;
	bottom: -8px;
	left: 4%;
	background: #f2f2f2;
	border: 1px solid #b9b9b9
}

ul.container li.container_li{
	background: #fbfbfb
}

.container li.container_li label {
	display: block;
	color: white;
	padding: 10px;
	cursor: pointer;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 15px;
	font-weight: bold;
	position: relative;
	z-index: 50;
	line-height: 26px;
	text-shadow: 0 1px 0 rgba(0,0,0,0.6);
	background-color: #ea8220ba;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	transition: background-color .17s ease;
	-webkit-transition: background-color .17s ease;
	-moz-transition: background-color .17s ease;
	-o-transition: background-color .17s ease;
	-ms-transition: background-color .17s ease
}

.container li.container_li label,.container.anim-label-4 li.container_li label:before {
	background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,0.10)),to(rgba(0,0,0,0.50)));
	background-image: -webkit-linear-gradient(top,rgba(0,0,0,0.10),rgba(0,0,0,0.50));
	background-image: -moz-linear-gradient(top,rgba(0,0,0,0.10),rgba(0,0,0,0.50));
	background-image: -o-linear-gradient(top,rgba(0,0,0,0.10),rgba(0,0,0,0.50));
	background-image: -ms-linear-gradient(top,rgba(0,0,0,0.10),rgba(0,0,0,0.50));
	background-image: linear-gradient(top,rgba(0,0,0,0.10),rgba(0,0,0,0.50));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#000000',EndColorStr='#000000');
	box-shadow: inset 0 1px 0 rgba(255,255,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1);
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255ul.container .cspc-pagination-page,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1);
	-o-box-shadow: inset 0 1px 0 rgba(255,255,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1);
	-ms-box-shadow: inset 0 1px 0 rgba(255,255,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1);
	-khtml-box-shadow: inset 0 1px 0 rgba(255,255,255,0.16),inset 0 -1px 0 rgba(0,0,0,0.25),0 2px 0 rgba(0,0,0,0.1)
}

ul.container li.container_li:first-child,ul.container li.container_li:first-child label,ul.container li.container_li:first-child label:before {
	border-radius: 2px 2px 0 0;
	-webkit-border-radius: 2px 2px 0 0;
	-moz-border-radius: 2px 2px 0 0;
	-o-border-radius: 2px 2px 0 0;
	-ms-border-radius: 2px 2px 0 0;
	-khtml-border-radius: 2px 2px 0 0
}

ul.container li.container_li input.containe_input {
	display: none
}
ul.container .cspc-pagination{
	color:#fff;
}
ul.container .cspc-pagination-page{
	border-radius: 16px;
    background-color: #808080;
}

ul.container li.container_li label:hover {
	background-color: grey
}

.container li.container_li input:checked ~ label {
	background-color: #5a5a5a
}

ul.container li.container_li article {
	height: 0;
	overflow: hidden;
	display: block;
	-webkit-transition: max-height 1s ease;
	-moz-transition: max-height 1s ease;
	-o-transition: max-height 1s ease;
	-ms-transition: max-height 1s ease;
	-khtml-transition: max-height 1s ease
}

/* ul.container li article p {
	padding: 10px;
	margin: 4px 13px;
	font-family: Helvetica;
	word-wrap: break-word;
	color: #444;
	font-size: 13px;
	line-height: 23px
} */

ul.container li.container_li article a {
	text-decoration: none;
	color: #fff;
}

ul.container li.container_li:last-child article {
	border-bottom: 1px solid #7d7d7d
}

/* ul.container li article iframe {
	border: 1px solid #7d7d7d;
	box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-o-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-ms-box-shadow: 0 0 10px rgba(0,0,0,0.2);
	-khtml-box-shadow: 0 0 10px rgba(0,0,0,0.2)
} */

ul.container li.container_li input:checked ~ article {
	height: auto;
	max-height: 800px
}

/* .anim-art li input:checked ~ article p {
	transform-origin: top;
	-webkit-transform-origin: top;
	-moz-transform-origin: top;
	-khtml-transform-origin: top;
	animation: fade-bounce .7s ease normal;
	-webkit-animation: fade-bounce .7s ease normal;
	-moz-animation: fade-bounce .7s ease normal;
	-khtml-animation: fade-bounce .7s ease normal
} */

@keyframes fade-bounce {
	0% {
		transform: perspective(800px) translateY(-10px) translateZ(-40px) rotateX(-90deg);
		opacity: 0
	}

	40% {
		transform: perspective(800px) translateZ(0px) rotateX(10deg)
	}

	70% {
		transform: perspective(800px) translateZ(0px) rotateX(-5deg)
	}

	100% {
		transform: perspective(800px) translateZ(0px) rotateX(0deg);
		opacity: 1
	}
}

@-webkit-keyframes fade-bounce {
	0% {
		-webkit-transform: perspective(800px) translateY(-10px) translateZ(-40px) rotateX(-90deg);
		opacity: 0
	}

	40% {
		-webkit-transform: perspective(800px) translateZ(0px) rotateX(10deg)
	}

	70% {
		-webkit-transform: perspective(800px) translateZ(0px) rotateX(-5deg)
	}

	100% {
		-webkit-transform: perspective(800px) translateZ(0px) rotateX(0deg);
		opacity: 1
	}
}

@-moz-keyframes fade-bounce {
	0% {
		-moz-transform: perspective(800px) translateY(-10px) translateZ(-40px) rotateX(-90deg);
		opacity: 0
	}

	40% {
		-moz-transform: perspective(800px) translateZ(0px) rotateX(10deg)
	}

	70% {
		-moz-transform: perspective(800px) translateZ(0px) rotateX(-5deg)
	}

	100% {
		-moz-transform: perspective(800px) translateZ(0px) rotateX(0deg);
		opacity: 1
	}
}

@-khtml-keyframes fade-bounce {
	0% {
		-khtml-transform: perspective(800px) translateY(-10px) translateZ(-40px) rotateX(-90deg);
		opacity: 0
	}

	40% {
		-khtml-transform: perspective(800px) translateZ(0px) rotateX(10deg)
	}

	70% {
		-khtml-transform: perspective(800px) translateZ(0px) rotateX(-5deg)
	}

	100% {
		-khtml-transform: perspective(800px) translateZ(0px) rotateX(0deg);
		opacity: 1
	}
}

.anim-label-4 li.container_li label {
	transform: perspective(0px) translateZ(0px) translateY(0px) rotateX(0deg);
	-webkit-transform: perspective(0px) translateZ(0px) translateY(0px) rotateX(0deg);
	-moz-transform: perspective(0px) translateZ(0px) translateY(0px) rotateX(0deg);
	-khtml-transform: perspective(0px) translateZ(0px) translateY(0px) rotateX(0deg);
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-origin: top;
	-webkit-transform-origin: top;
	-moz-transform-origin: top
}

.anim-label-4 li.container_li label:before {
	content: attr(title);
	line-height: 45px;
	text-indent: 10px;
	position: absolute;
	height: 100%;
	width: 100%;
	color: white;
	left: 0;
	top: 20px;
	background-color: #5a5a5a;
	transform: translateZ(-23px) rotateX(-90deg);
	-webkit-transform: translateZ(-23px) rotateX(-90deg);
	-moz-transform: translateZ(-23px) rotateX(-90deg);
	-o-transform: matrix(1,0,0,0,0,0);
	-ms-transform: matrix(1,0,0,0,0,0);
	-khtml-transform: translateZ(-23px) rotateX(-90deg)
}

.container.anim-label-4 input:checked ~ label {
	background-color: #adadad;
	animation: flipup .8s forwards normal ease;
	-webkit-animation: flipup .8s forwards normal ease;
	-moz-animation: flipup .8s forwards normal ease;
	-khtml-animation: flipup .8s forwards normal ease
}

.container.anim-label-4 input:checked ~ label:hover {
	-moz-transform: none
}

@keyframes flipup {
	0% {
		transform: perspective(600px) translateZ(0px) rotateX(0deg)
	}

	40% {
		transform: perspective(800px) translateZ(-43px) rotateX(100deg)
	}

	70% {
		transform: perspective(1000px) translateZ(-43px) rotateX(87deg)
	}

	100% {
		transform: perspective(1000px) translateZ(-43px) rotateX(90deg)
	}
}

@-webkit-keyframes flipup {
	0% {
		-webkit-transform: perspective(600px) translateZ(0px) rotateX(0deg)
	}

	40% {
		-webkit-transform: perspective(800px) translateZ(-43px) rotateX(100deg)
	}

	70% {
		-webkit-transform: perspective(1000px) translateZ(-43px) rotateX(87deg)
	}

	100% {
		-webkit-transform: perspective(1000px) translateZ(-43px) rotateX(90deg)
	}
}

@-moz-keyframes flipup {
	0% {
		-moz-transform: perspective(600px) translateZ(0px) rotateX(0deg)
	}

	40% {
		-moz-transform: perspective(800px) translateZ(-43px) rotateX(100deg)
	}

	70% {
		-moz-transform: perspective(1000px) translateZ(-43px) rotateX(87deg)
	}

	100% {
		-moz-transform: perspective(1000px) translateZ(-43px) rotateX(90deg)
	}
}

@-khtml-keyframes flipup {
	0% {
		-khtml-transform: perspective(600px) translateZ(0px) rotateX(0deg)
	}

	40% {
		-khtml-transform: perspective(800px) translateZ(-40px) rotateX(100deg)
	}

	70% {
		-khtml-transform: perspective(1000px) translateZ(-43px) rotateX(87deg)
	}

	100% {
		-khtml-transform: perspective(1000px) translateZ(-43px) rotateX(90deg)
	}
}
/*-- //balance group--*/
/*-- 物流信息 card 样式 --*/
.balance-scroll{
	font-size:40px;
	color:#ffffff;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link{
	background-color: #428BCA;
    background-image: -webkit-gradient(linear, 0 0, 100% 100%, 
		 color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), 
		 color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), 
		 color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), 
		 to(transparent));
		    background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
		 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
		 transparent 75%, transparent);
		    background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
		 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
		 transparent 75%, transparent);
		    background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
		 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
		 transparent 75%, transparent);
}

.doc-report .card-report-padding{
	padding:.8rem .2rem;
}

.doc-report .card-report-item{
	background-color: #2F5597;
	cursor:pointer;
}

.doc-report .card-report-item.contract-item{
	background-color:#fff;
	cursor:pointer;
}

.doc-report .card-report-item.contract-item:hover .title_head{
	/* background-color:#9f9f9f; */
	border-left:2px solid #fa8a8e;
	border-top:2px solid #fa8a8e;
	border-right:2px solid #fa8a8e;
}
.doc-report .card-report-item.contract-item:hover .content{
	/* background-color:#9f9f9f; */
	border-left:2px solid #fa8a8e;
	border-right:2px solid #fa8a8e;
}

.doc-report .card-report-item.contract-item:hover .card_tag_letter{
	background-color:#fa8a8e;
}

/**-- 合同 --**/


/** //合同 **/

/**--发票 --**/
/* .stamp_list{  
    margin:10px auto;  
    width:100%;  
}  
.stamp{  
    min-height: 248px; 
    margin-bottom: 20px;  
    position: relative;  
    box-sizing:border-box;  
    border-radius:5px;  
}  
.stamp_inner{  
    min-height: 248px; 
    display:inline-block;  
    vertical-align:top;  
    box-sizing:border-box;  
    position:relative;  
    border-radius:5px;  
    box-shadow:0 1px 1px rgba(0, 0, 0, 0.2);  
} 
.card-stamp-item{
	 background: #ffffff;  
}
.stamp_left{  
    width: 70%;  
    background: #ffffff;  
}  
.stamp_left .box{  
    position:absolute;  
    right:0;  
    bottom:0;  
    width:78px;  
    height:81px;  
}  
.stamp_right{  
  	width: 100%;
    background: #fcfcfc;
    border: 1px solid #edecec;
    padding: 2px 20px;
}  

.stamp_header{
	width: 100%;
    height: 30px;
    padding: 2px;
    text-align: center;
    color: #ca906a;
    font-size: 1.2rem;
    text-align:center;
}

.stamp_body{
    width: 100%;
    min-height:230px;
    border: 2px solid #d1926f;
    font-size:.8rem;
    padding:10px;
}
.stamp .row{
	margin:0 0 20px 0 ;
}
.stamp_body b{
	color:#ca906a;
}
.stamp_body span{
	border-bottom: 1px solid #d1926f;
	font-style: italic;
    color: #128beb;
}
.circle_list{  
    position:absolute;  
    top:5px;  
}  
.circle_list1{  
    left:2px;  
    height: 100%;
    overflow: hidden;
}  
.circle_list2{  
    right:-5px;  
    height: 100%;
    overflow: hidden;
}  
.circle_list2:after{  
    content: '';  
    position: absolute;  
    top: 0;  
    bottom: 6px;  
    left: 8px; 
    right: -5px;  
    z-index: 1;  
    background-color: #fcfcfc;  
}  
.circle_list>li{  
    background-color:#eee;  
    width:10px;  
    height:10px;  
    border-radius:50%;  
    margin-bottom:5px;  
    box-shadow:0 2px 1px rgba(0,0,0,0.2) inset;  
} */
/** //发票 **/
/** 合同 **/

 
/* .doc-report .card-report-item:hover{
	background-color:#6c757de8;
	-webkit-animation: twinkling_item 1s infinite ease-in-out;
} */
.doc-report .card-report-item .item-title{
	font-size:1rem;
	color:#ffffff;
}
.doc-report a{
	color:#6c757d;
}
.doc-report a:hover{
	color:#ffffff;
	background-color:#3277B2;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%, 
	 color-stop(.25, rgba(255, 255, 255, .2)), color-stop(.25, transparent), 
	 color-stop(.5, transparent), color-stop(.5, rgba(255, 255, 255, .2)), 
	 color-stop(.75, rgba(255, 255, 255, .2)), color-stop(.75, transparent), 
	 to(transparent));
	    background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
	 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
	 transparent 75%, transparent);
	    background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
	 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
	 transparent 75%, transparent);
	    background-image: linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, 
	 transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, 
	 transparent 75%, transparent);
}

.doc-report .card-body.item-toggle{
    height: auto;
    max-height: calc(70vh);
    overflow-y: scroll;
}

.contract .doc-report .card-body.item-toggle{
	height: auto;
    max-height: calc(100vh);
    overflow-y:scroll;
}

.doc-report .card-body.item-toggle:after{
}

.doc-report .slid-move{
    display: block;
    margin-top: 10%;
    padding: 0 .2rem;
    position: absolute;
    bottom: 1.1rem;
}

.doc-report .slid-move.double-up{
    display: block;
    margin-top: 10%;
    padding: 0 .2rem;
    position: absolute;
    bottom: 1.1rem;
    left: 48%;
}

.doc-report .card-report-item .slid-move{
    display: block;
    padding: 0 .2rem;
    position: static;
    bottom: .1rem;
    float: right;
    right: 0%;
    margin-top: -24px;
    color:#ffffff;
    
}
.item-toggle .text-muted{
	color: #f34119 !important;
    background-color: #9e9e9e1f;
}

.slid-move.opened {
   transform:rotate(-90deg);
　　transition: width 2s;
	-moz-transition: width 2s; /* Firefox 4 */
	-webkit-transition: width 2s; /* Safari 和 Chrome */
	-o-transition: width 2s; /* Opera */
	animation-timing-function: ease; 
}

.slid-move.closed {
  	transform:rotate(0);
　	-moz-transition: width 2s; /* Firefox 4 */
	-webkit-transition: width 2s; /* Safari 和 Chrome */
	-o-transition: width 2s; /* Opera */
	animation-timing-function: ease; 
}

.doc-report .item-toggle .double-up{
	font-size: 1.2rem;
    cursor: pointer;
    color: #868484;
    animation: twinkling 2s infinite ease-in-out;
    -webkit-animation: twinkling 2s infinite ease-in-out;
}
.doc-report .item-toggle .double-up:hover{
	color:#575757;
	
}
.doc-report .item-toggle .double-up:hover:after{
	content:"隐藏";
}
@-webkit-keyframes twinkling_item{ 
	0%{ 
		opacity: 0.5; 
	} 
	100%{ 
		opacity: 1; 
	} 
} 
@keyframes twinkling_item{ 
	0%{ 
		opacity: 0.5; 
	} 
	100%{ 
		opacity: 1; 
		} 
}
@-webkit-keyframes twinkling{ 
	0%{ 
		opacity: 0.2; 
	} 
	100%{ 
		opacity: 1; 
	} 
} 
@keyframes twinkling{ 
	0%{ 
		opacity: 0.2; 
	} 
	100%{ 
		opacity: 1; 
		} 
}
.animated{ 
	-webkit-animation-duration: 2s; 
	animation-duration: 2s; 
	-webkit-animation-fill-mode: both; 
	animation-fill-mode: both;
}
/*-- //物流信息 card 样式 --*/

.client-eql {
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
/*-- //clients --*/

/* contact */
.contact-left {
    background: #1b1b1b;
    padding: 5em 0em;
    height: 370px;
}
.contact-right {
    padding-right: 0px;
}
.social-icons{
	text-align:center;
}
.social-icons i.fab.fa-twitter:hover{
    color: #fff;
	background:  #1da1f2;
}
.social-icons i.fab.fa-facebook-f:hover{
    color: #fff;
	background: #3b5998;
}
.social-icons i.fab.fa-pinterest-p:hover{
    color: #fff;
	background: #bd081c;
}
.social-icons i.fab.fa-google-plus-g:hover {
    color: #fff;
	background: #dd4b39;
}
.social-icons i.fab {
    color: #ffffff;
    background: #212121;
    width: 35px;
    font-size: 14px;
    line-height: 35px;
    height: 35px;
    border: 1px dotted #eee;
    -webkit-appearance: none; 
	-webkit-transition: 0.5s all; 
    -moz-transition: 0.5s all;
	transition: 0.5s all;
}
.contact-left address {
    margin-bottom: 20px;
}
ul {
    list-style-type: none;
}
.social-icons li {
    list-style-type: none;
    display: inline;
}
.contact-left i.fas {
    font-size: 18px;
    color: #818b99;
    margin-right: 5px;
}
address a {
    color: #bbb;
}
address a:hover {
    color: #818b99;
}
address p{
    font-size: 1em;
    color: #eee;
	line-height:2em;
	letter-spacing: 1px;
	font-family: 'Montserrat', sans-serif;
}
iframe {
    width: 100%;
    border: none;
    height: 370px;
}
.map {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
}
.contact-cspc input[type="text"],.contact-cspc input[type="email"],.contact-cspc input[type="password"],.contact-cspc textarea {
    width: 49.5%;
    color: #000;
    background: none;
    outline: none;
    font-size: 14px;
    letter-spacing: 2px;
    padding: 1em;
	margin-right: .5em;
    margin-bottom: 1em;
    box-sizing: border-box;
    border: solid 1px #999;
    -webkit-appearance: none; 
	-webkit-transition: 0.5s all; 
    -moz-transition: 0.5s all;
	transition: 0.5s all;
}
.contact-cspc input[type="email"],.contact-cspc input[type="password"] {
    margin-right: 0;
}
.contact-cspc ::-webkit-input-placeholder{
	color:#666 !important;
}
.contact-cspc textarea {
    resize: none;
    width: 100%;
    padding: .6em 1em;
    min-height: 12em;
}
.contact-cspc input[type="submit"] {
    outline: none;
    color: #fff;
    padding: 0.6em 3em;
    font-size: 1em;
	font-weight: 600;
    -webkit-appearance: none;
    background: #818b99;
    border: none;
	color:#fff;
    -webkit-transition: 0.5s all; 
    -moz-transition: 0.5s all;
	transition: 0.5s all;
    cursor: pointer;
    letter-spacing: 2px;
}
.contact-cspc input[type="submit"]:hover {
    background: #2b2b2b;
}
.contact-cspc {
    margin: 3em 0em 0;
    width: 100%;
}
/*-- //contact --*/

/*-- inner_page_banner --*/
.inner_page_banner{
	background: url(../images/lightBg.jpg) no-repeat 0px 0px;
	background-size: cover;
	min-height: 250px;
}
.inner_page_banner h4,.inner_page_banner h4 a{
    font-size: 17px;
    color: #fff;
    font-weight: 600;
    text-shadow: 2px 2px 3px #292828;
}
.inner_page_banner h4 a:hover{
    color: #818b99;
}

h2.page_heading {
    font-size: 45px;
    font-weight: 700;
    color: #fff;
    text-shadow: 2px 2px 3px #292828;
}
/*-- //inner_page_banner --*/

/*-- footer --*/
.footer-top {
   background: #0064A3;
}
.footer-grid h3, .footer-list h3, .agile-footer-grid h3 {
    font-size: 1.4em;
    color: #fff;
    font-weight: 700;
}
.footer-logo  a {
    color: #FFFFFF;
    font-size: 2em;
	font-weight:600;
    text-decoration: none;
}
.footer-grid p {
    color: #bbbbbb;
    font-size: .9em;
    line-height: 1.8em;
    font-family: 'Montserrat', sans-serif;
}
.footer-grid ul, .footer-list ul {
    padding: 0;
    margin: 0;
}
.footer-logo li {
    display: inline-block !important;
}
.footer-logo ul li a {
    color: #bbb;
    font-size: 1.2em;
    text-decoration: none;
    padding-right: 15px;
}
.footer-list ul li {
    color: #bbb;
    font-size: 1em;
}
.footer-grid span.fa {
    margin-right: 10px;
}
.footer-grid span.addr {
    padding-left: 28px;
}
.footer-grid ul li a,.footer-grid ul li {
    color: #aaa;
    font-size: 15px;
    text-decoration: none;
    line-height: 2em;
	letter-spacing: .5px;
    padding: 1px 0;
}
.footer-grid ul li a:hover{
    color: #818b99;
}
.agile-footer-grid ul {
    padding: 0;
    margin: 0;
}
ul.y3agile_footer_grid_list li {
    list-style-type: none;
    color: #bbbbbb;
    line-height: 1.8em;
    font-size: 1em;
}
ul.y3agile_footer_grid_list li a {
    color: #ff9900;
    text-decoration: none;
}
ul.y3agile_footer_grid_list li span {
    display: block;
    margin: 1em 0 0;
}
ul.y3agile_footer_grid_list i.fa.fa-twitter {
    margin-right: 1em;
}
.agile-footer-grid input[type="email"],.agile-footer-grid input[type="text"]{
	outline:none;
    padding: 11px 20px;
	background:#fff;
	border:none;
	font-size:14px;
	color:#212121;
    margin-top: 1em;
	width:100%;
}
.agile-footer-grid input[type="submit"] {
    outline: none;
    padding: 11px 20px;
    border: none;
    font-size: 14px;
    color: #fff;
    margin: 1em 0 0;
    border: 2px solid #146eb4;
    width: 100%;
    text-align: left;
    text-transform: uppercase;
    background-color: #146eb4;
    letter-spacing: 1px;
    font-family: 'Montserrat', sans-serif;
}
.agile-footer-grid input[type="submit"]:hover{
    border: 2px solid #ffffff;
    background-color: transparent;
}
.footer-logo a {
    color: #FFFFFF;
    font-size: 2em;
    font-weight: 600;
    text-decoration: none;
}
.footer-grid p {
    color: #aaa;
    font-size: 15px;
    line-height: 1.8em;
    letter-spacing: .5px;
}
address {
    margin-bottom: 0;
}
.cspc_copy_right p {
    text-align: center;
   	color: #fff;
    font-size: 12px;
    letter-spacing: 2px;
    font-family: 'Montserrat', sans-serif;
}
.cspc_copy_right {
     background: #0064A3;
}
.cspc_copy_right a {
    color: #fff;
}
.y3_agileits_footer_grid_left {
    padding: 0;
    border: 2px solid #1b1b1b;
}
.insta{
	margin: 0;
}
/*-- //footer --*/

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #aaa;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #aaa;
}
::-ms-input-placeholder { /* IE 10+ */
  color: #aaa;
}
::-moz-placeholder { /* Firefox 18- */
  color: #aaa;
}

/*-- services --*/
.agile_cspc_inner_grids {
    margin-top: 5em;
}
.agileits-button.two a, .agileits-button a {
    padding: 0.5em 0em;
    color: #818b99;
    font-size: 15px;
    letter-spacing: 1px;
    background: none;
    border: none;
    border-radius: 0;
}
.btn-primary:focus, .btn-primary.focus {
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.5);
}

.btn-primary{
    background-color: #575757;
    border-color: #7f7c7c;
}

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

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle{
	 background-color: #3e4b5d;
    border-color: #3e4b5d;
}

.btn-primary.disabled, .btn-primary:disabled{
	background-color: #aaa;
    border-color: #ced4da;
}

.btn-sm, .btn-group-sm > .btn{
	font-size: .7rem;
}

/* Underline From Left */

.hvr-underline-from-left {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px transparent;
    position: relative;
    overflow: hidden;
}

.hvr-underline-from-left:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 100%;
    bottom: 0;
    background: #ff4c4c;
    height: 2px;
    -webkit-transition-property: right;
    transition-property: right;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.hvr-underline-from-left:hover:before,
.hvr-underline-from-left:focus:before,
.hvr-underline-from-left:active:before {
    right: 0;
}
.cspc_banner_bottom_grid_right h4 {
    font-size: 20px;
    letter-spacing: 0px;
    font-weight: 600;
    color: #333;
}
.cspc_banner_bottom_grid_right p {
    line-height: 28px;
    font-size: 14px;
    color: #676767;
    letter-spacing: 1px;
}
.agileits_banner_bottom_left {
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;
}
.agile_banner_bottom_grid_left_grid i {
    font-size: 22px;
    color: #fff;
    background: #818b99;
    width: 60px;
    height: 60px;
    line-height: 60px;
}
.y3_agileits_banner_bottom_pos_grid:hover i {
    color: #333;
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;
}
/*-- //services --*/

/*-- middle services --*/
section.middle {
    background: url(../images/globalBg.jpg) no-repeat 0px 0px;
    background-size: cover;
    background-attachment: fixed;
}
.middle h3{
    font-size: 30px;
    color: #fff;
    letter-spacing: 1px;
    font-weight: 600;
}

.middle .letter-spacing-h3{
	letter-spacing:18px;
}
.middle .letter-spacing-h4{
	letter-spacing:20px;
}
.middle .letter-spacing-h5{
	letter-spacing:15px;
}

.middle h4{
    font-size: 24px;
    color: #fff;
    letter-spacing: 1px;
    font-weight: 600;
}

.middle h5{
    font-size: 20px;
    color: #fff;
    letter-spacing: 1px;
    font-weight: 600;
}

.middle  p {
    color: #d7d7d7;
    letter-spacing: 2px;
    font-size: 15px;
}
.layer {
    background: rgba(0, 0, 0, 0.5);
}
.layer2 {
    background: rgba(0, 0, 0, 0.5);
}
.contactus a {
    font-size: 14px;
    color: #1b1b1b;
    background: #fff;
    padding: 12px 30px;
    letter-spacing: 1px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}
.contactus a:hover {
    background: #6e6e6e;
	color: #fff;
}
/*-- //middle services --*/

/*--  other services --*/
.servicegrid h3 {
    background: #1b1b1b;
    color: #fff;
    font-size: 20px;
    letter-spacing: 1px;
	margin-top:1px;
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;
}
.servicegrid:hover h3 {
    background: #818b99;
	transition: 0.5s all;
	-webkit-transition: 0.5s all;
	-moz-transition: 0.5s all;
	-ms-transition: 0.5s all;
	-o-transition: 0.5s all;
}
.servicetextgrid h3 {
    color: #222;
    font-size: 30px;
}
.servicetextgrid p.para {
    color: #a6a6a6;
    letter-spacing: 2px;
    font-size: 15px;
    margin: 10px 0;
}
.servicetextgrid p {
    line-height: 28px;
    font-size: 14px;
    color: #676767;
    letter-spacing: 1px;
}
.servicetextgrid .read a {
    font-size: 14px;
    background: #333;
    color: #fff;
    padding: 12px 30px;
    letter-spacing: 1px;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}

.servicetextgrid .read a:hover {
    background: #818b99;
	color: #fff;
}
/*-- // other services --*/

/*--portal table--*/
.portal-table-wrapper{
    margin: 10px 0;
    box-shadow: 0px 2px 5px rgba( 0, 0, 0, 0.2 )
}

.portal-table {
    border-radius: 5px;
    font-size: 12px;
    font-weight: normal;
    border: none;
    border-collapse: collapse;
    width: 100%;
    max-width: 100%;
    white-space: nowrap;
    background-color: white;
}

.portal-table td, .portal-table th {
    text-align: center;
    padding: 8px;
}

.portal-table td {
    /*border-right: 1px solid #f8f8f8;*/
    border-bottom: 1px solid #efefef;
    font-size: 12px;
}

.portal-table thead th {
    color: #ffffff;
    background: #7e7e7e;
}


.portal-table thead th:nth-child(odd) {
    color: #ffffff;
	background: #535252;	
	height:60px;
}

.portal-table tbody tr:nth-child(odd) {
    background: #F8F8F8;
}
.portal-table-wrapper .slid-move{
	display:none;
}
.pro-form{
	width: 100%;
    position: relative;
    margin: 2rem 0 2rem 0;
    margin: 2rem 0 3rem 0\0;
}
.pro-form .form-group{
	position: absolute;
}
.pro-form .btn-1{
	position: absolute;
	left:30%;
}
.pro-form .btn-2{
	position: absolute;
	right:1%;
}

/** 蓝色风格样式**/
.portal-table.color-blue thead th {
	height:40px;
	background: #ffffff;
}

/* .portal-table.color-blue tbody tr:nth-child(odd){
	background: rgba(0,0,0,.05);
} */

.portal-table.color-blue .btn-primary{
	background: #428bca;
	border-color:#357ebd;
}

.portal-table.color-blue thead th:nth-child(odd) {
    color: #343a40;
	background: #ffffff;	
	height:60px;
}
/* .portal-table.color-blue thead th{
	color: #343a40;
    background: #6C757D;
} */

.portal-table.color-blue .btn-primary:hover{
	color:#3e4b5d;
	background:#ffffff;
	border-color:#3e4b5d;
}

.portal-table.color-blue .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active{
	color:#3e4b5d;
	background:#ffffff;
	border-color:#3e4b5d;
}
.portal-table-text-blue{
	color:#3e4b5d;
}

.portal-table.color-blue thead th {
    color:#343a40;
}

.quote_table_area{
	max-width: 1920px;
	width: 100%;
    padding-right: 10%;
    padding-left: 10%;
    margin-right: auto;
    margin-left: auto;
}
	


/** end 蓝色风格样式**/

/* Responsive */

@media(max-width:480px) {
	.agile-dish-caption {
		padding: 0.5em;
	}
	.agile-dish-caption span {
		font-size: 0.8em;
	}
	.y3-header-top-grids{
		visibility: hidden;
	}
}

@media (max-width: 767px) {
	.portal-table {
		/* display: block; //old-sytle
		width: 100%;*/
		display:contents;
	}
	.portal-table thead, .portal-table tbody, .portal-table thead th {
		display: block;
	}
	.portal-table thead th:last-child{
		border-bottom: none;
	}
	.portal-table thead {
		float: left;
	}
	.portal-table tbody {
		/* width: auto;
		position: relative;
		overflow-x: auto; //old-style*/
		overflow-x:scroll;
		display:flex;
		min-width:0;
		
	}
	.portal-table td, .portal-table th {
		padding: 20px .625em .625em .625em;
		min-height: 60px;
    	height: auto;
		vertical-align: middle;
		box-sizing: border-box;
		overflow-x: auto;
		overflow-y: auto;
		font-size: 13px;
		min-width: 120px;
		/* max-width: 220px; */
		max-width: calc(100%);
		/* text-overflow: ellipsis; */
	}
	.portal-table th{
		min-width:60px;
		/* max-width: 80px; */
		max-width:auto;
	}
	.portal-table thead th {
		text-align: left;
		border-bottom: 1px solid #f7f7f9;
	}
	.portal-table tbody tr {
		/* display: table-cell; //old-style*/
		display:flex;
		flex-direction:column;
		min-width: -webkit-fill-available;
	}
	.portal-table tbody tr:nth-child(odd) {
		background: none;
	}
	.portal-table tr:nth-child(even) {
		background: transparent;
	}
	.portal-table tr td:nth-child(odd) {
		background: #F8F8F8;
		border-right: 1px solid #E6E4E4;
	}
	.portal-table tr td:nth-child(even) {
		border-right: 1px solid #E6E4E4;
	}
	.portal-table tbody td {
		display: block;
		text-align: center;
	}
	.products-table tbody tr:nth-last-child(1):first-child td{
		  width: calc(100% + 110px);
	}

	.msds-table tbody tr:nth-last-child(1):first-child td{
		  width: calc(100% + 80px);
	}
	.sale-table tbody tr:nth-last-child(1):first-child td{
		  width: calc(100% + 80px);
	}
	.products-paging{
		display: none;
	}
	.portal-table-wrapper .slid-move{
		display: block;
		float:right;
		margin-top:6%;
		padding:0 .2rem;
	}
	.pro-form{
		margin: 2rem 0 8rem 0;
	}
	.pro-form .form-group{
		width: 100%;
	}
	.pro-form .btn-1{
		top: 1.5rem;
	    width: 100%;
	    left: 0;
	}
	.pro-form .btn-2{
		top: 4.2rem;
	    width: 100%;
	    left: 0;
	    right:0;
	    margin-left:0;
	}
	.pro-form .form-group input{
		text-align:center;
	}
	.form-inline .form-control{
		width:100%;
	    display: inline-block;
	}
	
	
	.portal-table.color-blue tr td:nth-child(odd) {
		/* background: rgba(0,0,0,.05); */
		border-right: 1px solid #FFFFFF;
	}
	.portal-table.color-blue tr td:nth-child(even){
		background: #FFFFFF;
		border-right: 1px solid rgba(0,0,0,.05);
	}
	.portal-table.color-blue  th:nth-child(11){
		min-height:92px;
	}
	.portal-table.color-blue thead th {
		height:40px;
		background: #ffffff;
		border-right: 1.5px solid #e6e6e6;
		color:#6C757D;
	}
	.portal-table tr td:nth-child(odd) {
	    background: #f0f8ff;
	    border-right: 1px solid #E6E4E4;
	}
	.portal-table tr td:nth-child(even) {
   		  background: #fff;
	}
	
}

@media (min-width: 1023px) {
	.pro-form .btn-1{
		 left: 23%;
	}
}

@media (min-width: 1279px) {
	.pro-form .btn-1{
		 left: 20%;
	}
}

/*-- //portal--*/

/*-- Error page --*/
.error_content span.fas {
    font-size: 70px;
    color: #f8593e;
}
.error_content p {
    font-size: 14px;
    letter-spacing: 1px;
    line-height: 28px;
}
.error_content form{
	display: flex;
    width: 50%;
}
form input[type="search"] {
    outline: none;
    border: 1px solid #c4c5c5;
    background: none;
    color: #212121;
    padding: 10px 15px;
    width: 80%;
    box-sizing: border-box;
    font-size: 14px;
    letter-spacing: 2px;
}

button.btn1 {
    color: #fff;
    border: none;
    padding: 10px 0;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
    background: #232323;
    -webkit-transition: 0.5s all;
    -moz-transition: 0.5s all;
    -o-transition: 0.5s all;
    -ms-transition: 0.5s all;
    transition: 0.5s all;
    width: 20%;
    box-sizing: border-box;
}
a.home {
    background: #333;
    padding: 10px 20px;
    display: inline-block;
    color: #FFF;
    text-decoration: none;
    font-size: 14px;
	letter-spacing:1px;
}
a.home:hover,button.btn1:hover{
    background: #f8593e;
}
/*-- //Error page --*/

/*-- about --*/
.about h4 {
    font-size: 26px;
    color: #232323;
    margin-bottom: 15px;
}
.banner_bottom_left p {
    font-size: 14px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #7b7b7b;
	margin: 10px 0;
}

/*-- //about --*/

/*-- Newsletter --*/
.newsletter input[type="email"] {
    outline: none;
    color: #fff;
    padding: 13px 25px;
    font-size: 1em;
    width: 80%;
	box-sizing: border-box;
    background: none;
    border: none;
    background: #1d1b1b;
    letter-spacing: 1px;
    font-family: 'Montserrat', sans-serif;
}
.newsletter input[type="submit"] {
    outline: none;
    color: #fff;
    padding: 13px 0;
    font-size: 1em;
	font-weight: 600;
    width: 19%;
    background: #818b99;
	cursor: pointer;
    border: none;
	box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
}
.newsletter  form {
    width: 70%;
    margin: 0 auto;
}
/*-- //Newsletter --*/

/*-- to-top --*/
#toTop {
	display: none;
	text-decoration: none;
	position: fixed;
	bottom: 20px;
	right: 2%;
	overflow: hidden;
	z-index: 999; 
	width: 40px;
	height: 40px;
	border: none;
	text-indent: 100%;
	background: url(../images/arr_bl.png) no-repeat 0px 0px;
}
#toTopHover {
	width: 40px;
	height: 40px;
	display: block;
	overflow: hidden;
	float: right;
	opacity: 0;
	-moz-opacity: 0;
	filter: alpha(opacity=0);
}
/*-- //to-top --*/

/*-- Responsive Design zsy--*/

@media(max-width: 1366px){
	.y3layouts-banner-top {
		min-height: 580px;
	}
	.y3l-slide-text {
		margin-top: 11em;
	}
	.y3l-slide-text h3 {
		font-size: 50px;
		letter-spacing: 2px;
	}
	.nav-pills li.nav-item{
		width:28%;
	}
	
	/*contract */
	.table.table-striped tbody tr{
		display: table-row;
	}
	.card-level2-content{
		margin-left: 2%;
	}
	/*// contract*/
	/**contract list before after **/
	
	
	.card-level2-group:first-child:before {
	    top: -21px;
    	height: 100%;
	}
	
	.card-level2-group:before{
		top: -65px;
    	left: 19px;
	}
	
	.card-level2-group:after{
		top: 25px;
	    left: 22px;
	    width: 18px;
	}
	/** //contract list before after **/
}
@media(max-width: 1080px){
	.card-level2-group:before{
		top: -65px;
    	left: 19px;
	}
	.headder-y3 a {
		font-size: 34px;
	}
	.cspc_banner_bottom_grid_right h4 {
		font-size: 17px;
	}
	.cspc_banner_bottom_grid_right p {
		letter-spacing: 0.5px;
	}
	.y3_agileits_sub_work:hover {
		line-height: 135px;
	}
	.footer-grid span.fa {
		margin-right: 8px;
	}
	.footer-grid span.addr {
		padding-left: 0;
	}
	.footer-grid h3, .footer-list h3, .agile-footer-grid h3 {
		font-size: 1.3em;
	}
	.contact-cspc input[type="text"] {
		margin-right: .3em;
	}
	.why-grid h3 {
		font-size: 18px;
		letter-spacing: 0px;
	}
	.why-grid p {
		font-size: 14px;
	}
	.middle h3 {
		font-size: 27px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:18px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:20px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:15px;
	}
	.middle h4{
	    font-size: 20px;
	}
	.middle h5{
	    font-size: 18px;
	}

	/**contract list before after **/
	
	
	.card-level2-group:first-child:before {
	    top: -21px;
    	height: 100%;
	}
	
	.card-level2-group:before{
		top: -59px;
    	left: 19px;
	}
	
	.card-level2-group:after{
		top: 30px;
	    left: 18px;
	    width: 14px;
	}
	/** //contract list before after **/
}

@media(max-width: 1024px){
	/*contract */
	.card-level2-content{
		margin-left: 3%;
	}
	.middle h3 {
		font-size: 21px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:18px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:20px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:15px;
	}
	.middle h4{
	    font-size: 18px;
	}
	.middle h5{
	    font-size: 15px;
	}
	.card-level2-group:first-child:before {
	    top: -21px;
    	height: 100%;
	}
	
	.card-level2-group:before{
		top: -64px;
    	left: 19px;
	}
	.card-level2-group:after{
		top: 25px;
	    left: 20px;
	    width: 18px;
	}
	/*// contract*/
}
@media(max-width: 991px){
	.y3l-slide-text h3 {
		font-size: 42px;
		letter-spacing: 1px;
	}
	.y3l-slide-text p.heading_bottom {
		width: 90%;
	}
	.y3layouts-banner-top {
		min-height: 520px;
	}
	.y3l-slide-text {
		margin-top: 9em;
	}
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 210px;
	}
	.col-6 team-grids {
		padding: 0 3px;
	}
	.team .y3agile-caption {
		width: 90%;
		left: 5%;
		height: 37%;
		padding: 1em;
	}
	.team h4 {
		font-size: 1.2em;
	}
	.team p {
		letter-spacing: 0px;
	}
	.numscroller {
		font-size: 10px;
	}
	.servicegrid h3 {
		font-size: 17px;
		letter-spacing: 0px;
	}
	.contact-cspc input[type="text"] {
		margin-right: .2em;
	}
	.welcome_right:after {
		left: 0px;
	}
	.servicegrid {
		padding: 0 5px;
	}
	h2.heading, h3.heading {
		font-size: 30px;
	}
	.contact-left {
		padding: 3em 0em;
		height: 320px;
	}
	iframe {
		height: 320px;
	}
	li.nav-item {
		text-align: center;
	}
	.dropdown-menu {
		padding: 0;
		color: #fff;
		border: 1px transparent;
		background-color: transparent;
	}
	.dropdown-item {
		color: #333;
		text-align: center;
	}
	.dropdown-item:hover, .dropdown-item:focus {
		background-color: transparent;
	}
	.headder-y3 a {
		font-size: 26px;
	}
	.nav-pills li.nav-item{
		width:100%;
	}
	.navbar-name{
		display: none;
	}
	
	.y3-header-top-left{
		width: 40%;
	}
	
	.middle h3 {
		font-size: 21px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:18px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:20px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:5px;
	}
	.middle h4{
	    font-size: 18px;
	}
	.middle h5{
	    font-size: 15px;
	}
	
}
@media(max-width: 800px){
	.inner_page_banner {
		min-height: 200px;
	}
	h2.page_heading {
		font-size: 35px;
	}
	h6.caption {
		font-size: 17px;
	}
	.email-right p a, .y3-header-top-right-text p, .agileinfo-social-grids ul li a {
		font-size: 13px;
	}
	.headder-y3 a {
		font-size: 26px;
	}
	.card .contract-item .letter_content{
		font-size:1rem;
	}
	/*//conctact*/
	/*contract table for phone*/
	.table.table-striped{
		display: contents;
	}
	
	.table.table-striped .slid-move{
	    display: block;
	    float: right;
	    margin-top: 6%;
	    padding: 0 .2rem;
	}
	
	.table.table-striped thead{
	    display: block;
   		float: left;
	}
	.table.table-striped thead th{
		border-bottom: none;
		display:block;
	    border-bottom: none;
	    display: block;
	    background-color: #FF5722;
	    color: #fff;
	    margin-left: 10px;
	}
	
	.table.table-striped tbody{
	    overflow-x: scroll;
	    display: flex;
	    flex: 1;
	    min-width: 0;
	    margin-right:-10px;
	}
	.table.table-striped tbody tr{
		flex:1;
	}
	.table.table-striped tbody tr{
		display:flex;
		flex-direction:column;
	}
	.table.table-striped tbody  td{
		display:block;
		text-align: center;
	}
	.contract .form-inline.form-group{
		margin-bottom:10px;
	}
	/* contract*/
	/*contract level */
	.container.card-padding-y20{
		padding:0;
	}
	.container.search-tab{
		padding-left:0;
		padding-right:0;
	}
	.card-level2-group:before{
		border-left: none;	
	}
	.card-body{
		padding:0;
		padding:0 1.25rem 1.25rem 1.25rem;
	}
	.card-body.card-report-padding{
		padding:0;
		padding-top:20px;
	}
	.card-level2-group:after{
		border-top:none;
	}
	.card-level2-group{
		padding-left:0;
	}
	.card-level2-content{
		margin-left:0;
	}
	.card-level3-group{
		width:100%;
		margin-left:0;
	}
	
	/*//contract level */
	
	.middle h3 {
		font-size: 18px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:18px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:16px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:3px;
	}
	.middle h4{
	    font-size: 14px;
	}
	.middle h5{
	    font-size: 13px;
	}
	
}
@media(max-width: 736px){
	.contact-cspc input[type="text"], .contact-cspc input[type="email"], .contact-cspc input[type="password"], .contact-cspc textarea {
		margin-right: 0;
		width: 100%;
		letter-spacing: 1px;
	}
	.y3l-slide-text h3 {
		font-size: 32px;
		letter-spacing: 0px;
	}
	.y3l-slide-text p.heading_bottom {
		width: 100%;
	}
	.y3l-slide-text p {
		letter-spacing: 2px;
		font-size: 14px;
	}
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 150px;
	}
	.agile-dish-caption h4 {
		font-size: 22px;
	}
	p.para-y3-agile {
		line-height: 30px;
		width: 90%;
	}
	.team .y3agile-caption {
		height: 25%;
		bottom: -10%;
	}
	.thumbnail.team-agileits:hover .y3agile-caption {
		height: 44%;
	}
	.newsletter form {
		width: 90%;
		margin: 0 auto;
	}
	.y3_agileits_sub_work>.agileits_w3layouts_work {
		font-size: 1.5em;
	}
	.y3_agileits_sub_work:hover {
		line-height: 95px;
	}
	.contact-right {
		padding: 0;
	}
	.inner_page_banner {
		min-height: 170px;
	}
	.headder-y3, .y3-header-top-right-text, .email-right, .agileinfo-social-grids {
		width: 50%;
		padding-bottom: 10px;
		float: left;
	}
	.headder-y3 a {
		font-size: 30px;
	}
	.login-icon img{
		width:4em;
		height:4em; 
	}
}
@media(max-width: 667px){
	.gallery1 h3 {
		line-height: 20px;
		font-size: 25px;
	}
	.login-icon img{
		width:4em;
		height:4em; 
	}
	
	.report-paging .js-page-first{
		display:none;
	}
	.report-paging .js-page-last{
		display:none;
	}
	.report-paging .js-page-prev{
		display:none;
	}
	.report-paging .js-page-next{
		display:none;
	}
	.help_hand{
		float:right;
	}
}
@media(max-width: 600px){
	h2.page_heading {
		font-size: 30px;
	}
	.inner_page_banner h4, .inner_page_banner h4 a {
		font-size: 14px;
	}
	p.para-y3-agile {
		line-height: 28px;
		width: 100%;
	}
	.middle h3 {
		font-size: 20px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:15px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:16px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:3px;
	}
	.middle h4{
	    font-size: 16px;
	}
	.middle h5{
	    font-size: 14px;
	}
	.middle p {
		font-size: 14px;
	}
	
	/** contract **/
	.contract .doc-report .card-report-item .slid-move{
		margin-top: -98px;
	}
	.doc-report .slid-move.right-align{
		bottom: 4.3rem;
		left:94%;
	}
	.login-icon img{
		width:4em;
		height:4em; 
	}
	
}
@media(max-width: 568px){
	.y3layouts-banner-top {
		min-height: 450px;
	}
	h2.page_heading {
		font-size: 28px;
	}
	.y3l-slide-text {
		margin-top: 6em;
	}
	.y3l-slide-text p.heading_bottom {
		width: 90%;
	}
	.inner_page_banner {
		min-height: 120px;
	}
	.error h3 {
		font-size: 24px;
	}
	.servicetextgrid h3 {
		font-size: 28px;
	}
	.contact-left {
		height: auto;
	}
	.y3-header-top-grids{
		visibility: hidden;
	}
	.login-icon{
		top:12px;
		left: 2%;
		font-weight: 400;
		text-align: left;
	}
	.navbar-name{
		display: block;
	}
	.navbar-name img{
		margin-top:10px;
	}
	
	.middle h3 {
		font-size: 20px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:9px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:12px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:1px;
	}
	.middle h4{
	    font-size: 16px;
	}
	.middle h5{
	    font-size: 14px;
	}
	
}
@media(max-width: 480px){
	.y3l-slide-text h3 {
		font-size: 26px;
	}
	.y3l-slide-text p {
		letter-spacing: 1px;
		font-size: 13px;
	}
	.y3l-slide-text p.heading_bottom {
		font-size: 14px;
	}
	.servicetextgrid h3 {
		font-size: 25px;
	}
	.grid_info h3 {
		font-size: 17px;
	}
	.icon span.fa, .icon span.fas {
		font-size: 20px;
		width: 50px;
		height: 50px;
		line-height: 50px;
	}
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 130px;
	}
	.agile-dish-caption h5 {
		font-size: 14px;
		letter-spacing: 2px;
	}
	.agile-dish-caption h4 {
		font-size: 20px;
	}
	.team .y3agile-caption {
		height: 32%;
		bottom: -13%;
		padding: 1em;
	}
	.newsletter form {
		width: 100%;
		margin: 0 auto;
	}
	.comp-name{
		display: none;
	}
	
	.y3-header-top-grids{
		visibility: hidden;
	}
	.login-icon{
		top:12px;
		left: 2%;
		font-weight: 400;
	}
	.navbar-name{
		display: block;
	}
	
	.doc-report .slid-move.right-align{
    	bottom: 4.1rem;
    	left: 93%;
	}
	.card-level2-group:before {
	    top: -41px;
	    left: -2px;
	}
	.card-level2-group:after {
	    top: 97px;
	    left: -2px;
	}
	.middle h3 {
		font-size: 19px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:6px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:10px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:1px;
	}
	.middle h4{
	    font-size: 16px;
	}
	.middle h5{
	    font-size: 11px;
	}
	.slogan-bg-blue {
    	padding: 8px 0;
	}
	.slogan-bg-red {
    	padding: 6px 10px;
	}
}
@media(max-width: 414px){
	.y3l-slide-text {
		margin-top: 4em;
	}
	.y3l-slide-text h3 {
		font-size: 25px;
	}
	.newsletter input[type="email"] {
		padding: 12px 15px;
		font-size: .875em;
		width: 79%;
	}
	.newsletter input[type="submit"] {
		padding: 12px 0;
		font-size: .875em;
	}
	.footer-grid h3, .footer-list h3, .agile-footer-grid h3 {
		font-size: 1.2em;
	}
	
	.middle h3 {
		font-size: 18px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:2px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:7px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:0px;
	}
	.middle h4{
	    font-size: 14px;
	}
	.middle h5{
	    font-size: 11px;
	}
	.slogan-bg-blue {
    	padding: 9px 0;
	}
	.slogan-bg-red {
    	padding: 6px 10px;
	}
	.slogan-pc-show{
	 	display:none;
	}
	.slogan-phone-show{
		display:block;
	}
	
	.gallery1 h3 {
		letter-spacing: 0px;
	}
	address p {
		font-size: .9em;
	}
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 110px;
	}
	h2.heading, h3.heading {
		font-size: 27px;
	}
	p.heading-bottom {
		font-size: 14px;
	}
	.cspc_copy_right p {
		letter-spacing: 0px;
	}
	.about h4 {
		font-size: 22px;
	}
	iframe {
		height: 250px;
	}
	.contact-cspc input[type="text"], .contact-cspc input[type="email"], .contact-cspc input[type="password"], .contact-cspc textarea {
		font-size: 13px;
	}
	.contact-cspc textarea {
		min-height: 9em;
	}
	.modal-title {
		font-size: 26px;
	}
	.y3layouts-banner-top {
		min-height: 420px;
	}
	.headder-y3 a {
		font-size: 26px;
	}
	.comp-name{
		display: none;
	}
	.y3-header-top-grids{
		visibility: hidden;
	}
	.login-icon{
		top: 12px;
	    left: 6%;
	    font-weight: 400;
	}
	.navbar-name{
		display: block;
	}
}
@media(max-width: 384px){
	.social-icon a {
		font-size: 13px;
	}
	.team .social-y3lsicon {
		padding: .2em;
	}
	.y3l-slide-text h3 {
		font-size: 23px;
	}
	.y3l-slide-text p.heading_bottom {
		font-size: 13px;
		line-height: 26px;
	}
	a.button-style {
		letter-spacing: 1px;
		font-size: 14px;
		padding: 8px 25px;
	}
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 100px;
	}
	.servicetextgrid h3 {
		font-size: 22px;
	}
	.gallery1 h3 {
		font-size: 23px;
	}
	h2.page_heading {
		font-size: 24px;
	}
	.inner_page_banner h4, .inner_page_banner h4 a {
		font-size: 13px;
	}
	.error h3 {
		font-size: 22px;
	}
	.error_content form {
		width: 80%;
	}
	.headder-y3, .y3-header-top-right-text, .email-right, .agileinfo-social-grids {
		width: 100%;
		padding-bottom: 5px;
		float: none;
	}
	.comp-name{
		display: none;
	}
	.y3-header-top-grids{
		visibility: hidden;
	}
	.login-icon{
		top: 12px;
	    left: 6%;
	    font-weight: 400;
	}
	.navbar-name{
		display: block;
	}
	.y3layouts-header-top{
		padding: 1em 0em;
	}
	
}
@media(max-width: 375px){
	.indexgallery .y3_agileits_sub_work:hover {
		line-height: 90px;
	}
	.team h4 {
		font-size: 1em;
	}
	.team p {
		font-size: 14px;
	}
	.y3l-slide-text h3 {
		font-size: 22px;
	}
	.comp-name{
		display: none;
	}
	.y3layouts-header-top{
		padding: 1em 0em;
	}
	.y3-header-top-grids{
		visibility: hidden;
	}
	.login-icon{
		top: 12px;
	    left: 6%;
	    font-weight: 400;
	}
	.navbar-name{
		display: block;
	}
	.middle h3 {
		font-size: 18px;
	}
	.middle .letter-spacing-h3{
		letter-spacing:0px;
	}
	.middle .letter-spacing-h4{
		letter-spacing:2px;
	}
	.middle .letter-spacing-h5{
		letter-spacing:0px;
	}
	.middle h4{
	    font-size: 14px;
	}
	.middle h5{
	    font-size: 11px;
	}
	
}
@media(max-width: 1680px){
	
}
@media(max-width: 1680px){
	
}
@media(max-width: 1680px){
	
}

/*-- //Responsive Design  --*/


/* =============================start pagination 分页=============================== */
.cspc-pagination {
     max-width: 850px;
    color: #838a91;
    margin: 2rem 0 0 15%;
    height: 50px;
    box-sizing: content-box;
    font-size: .8rem;
	font-weight: bold;
	-moz-user-select:none; /*火狐*/
    -webkit-user-select:none; /*webkit浏览器*/
    -ms-user-select:none; /*IE10*/
    -khtml-user-select:none; /*早期浏览器*/
    user-select:none;
}
.cspc-pagination-text {
    float: left;
    padding-right: 20px;
}
.cspc-pagination-num {
    padding-right: 5px;
}
.cspc-pagination-display {
    float: left;
    line-height: 25px;
    padding-right: 20px;
}
.cspc-pagination-display-select {
    margin-left: 5px;
}
.cspc-pagination-page {
    float: left;
}
.cspc-pagination-page-item {
    float: left;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    cursor: pointer;
    margin-left: 5px;
    margin-right: 5px;
}
.cspc-pagination-page .active {
    background-color: #575757;
    border-radius: 17.5px;
    color: #ffffff;
}

.cspc-pagination-text {
    line-height: 25px;
    padding-left: 20px;
    padding-right: 10px;
    text-align: center;
}
.cspc-pagination-jump {
    width: 35px;
    height: 25px;
    margin: 0 10px;
    padding: 0 10px;
    border: 2px solid #ddd;
    box-sizing: border-box;
    outline: 0;
    border-radius: 12.5px;
}
.cspc-pagination-page .ctrl {
    width: 50px;
}

.cspc-pagination-page .ctrl:hover {
    background-color: #9e9e9e;
    border-radius: 17.5px;
    color: #ffffff;
}
.cspc-pagination-page-item-prev {
   background-color: #575757;
	border-radius: 12.5px;
	color: #ffffff;
}
.ui-pager-disabled{
	background: #eeeeee;
	color:#838a91;
}
.ui-paging-ellipse{
	float:left;
}
/* =============================end pagination=============================== */

/* =============================未找到信息显示模块 样式 ====================== */
.noData{
	text-align: center;
    box-shadow: 0px 2px 5px rgba( 0, 0, 0, 0.2 );
}

.p-4-up-bottom{
	padding: 4rem 0;
}
.p-2-up-bottom{
	padding: 2rem 0;
}
/* =============================end 未找到信息显示模块 样式 ====================== */
/* =======================================  淡入淡出效果  ================================ */
@-webkit-keyframes fadeIn {
	0% {
		opacity: 0; /*初始状态 透明度为0*/
	}
	50% {
		opacity: 0.5; /*中间状态 透明度为0.5*/
	}
	100% {
		opacity: 1; /*结尾状态 透明度为1*/
	}
}
@-webkit-keyframes fadeOut {
	0% {
		opacity: 1; /*初始状态 透明度为0*/
	}
	50% {
		opacity: 0.8; /*中间状态 透明度为0.8*/
	}
	60% {
		opacity: 0.8; /*中间状态 透明度为0.8*/
	}
	80% {
		opacity: 0.6; /*中间状态 透明度为0.8*/
	}
	85% {
		opacity: 0.5; /*中间状态 透明度为0.8*/
	}
	90% {
		opacity: 0.5; /*中间状态 透明度为0.8*/
	}
	95% {
		opacity: 0.4; /*中间状态 透明度为0.8*/
	}
	100% {
		opacity: 0; /*结尾状态 透明度为1*/
	}
}
#fadeBar{
	/* Firefox: */
	-moz-animation-name: fadeIn; /*动画名称*/
	-moz-animation-duration: 2s; /*动画持续时间*/
	-moz-animation-iteration-count: 1; /*动画次数*/
	-moz-animation-delay: 0s; /*延迟时间*/
	/* Safari 和 Chrome: */
	-webkit-animation-name: fadeIn; /*动画名称*/
	-webkit-animation-duration: 2s; /*动画持续时间*/
	-webkit-animation-iteration-count: 1; /*动画次数*/
	-webkit-animation-delay: 0s; /*延迟时间*/
	/* Opera: */
	-o-animation-name: fadeIn; /*动画名称*/
	-o-animation-duration: 2s; /*动画持续时间*/
	-o-animation-iteration-count: 1; /*动画次数*/
	-o-animation-delay: 0s; /*延迟时间*/
}
.fadeInStyle{
	/* Firefox: */
	-moz-animation-name: fadeIn; /*动画名称*/
	-moz-animation-duration: 2s; /*动画持续时间*/
	-moz-animation-iteration-count: 1; /*动画次数*/
	-moz-animation-delay: 0s; /*延迟时间*/
	/* Safari 和 Chrome: */
	-webkit-animation-name: fadeIn; /*动画名称*/
	-webkit-animation-duration: 2s; /*动画持续时间*/
	-webkit-animation-iteration-count: 1; /*动画次数*/
	-webkit-animation-delay: 0s; /*延迟时间*/
	/* Opera: */
	-o-animation-name: fadeIn; /*动画名称*/
	-o-animation-duration: 2s; /*动画持续时间*/
	-o-animation-iteration-count: 1; /*动画次数*/
	-o-animation-delay: 0s; /*延迟时间*/
}
.fadeOutStyle{
	/* Firefox: */
	-moz-animation-name: fadeOut; /*动画名称*/
	-moz-animation-duration: 10s; /*动画持续时间*/
	-moz-animation-iteration-count: 1; /*动画次数*/
	-moz-animation-delay: 0s; /*延迟时间*/
	/* Safari 和 Chrome: */
	-webkit-animation-name: fadeOut; /*动画名称*/
	-webkit-animation-duration: 10s; /*动画持续时间*/
	-webkit-animation-iteration-count: 1; /*动画次数*/
	-webkit-animation-delay: 0s; /*延迟时间*/
	/* Opera: */
	-o-animation-name: fadeOut; /*动画名称*/
	-o-animation-duration: 10s; /*动画持续时间*/
	-o-animation-iteration-count: 1; /*动画次数*/
	-o-animation-delay: 0s; /*延迟时间*/
}
/* =======================================end  淡入淡出效果  ================================ */


/*-- overwrite flavr --*/
.flavr-container .flavr-fixer .flavr-outer .flavr-toolbar .flavr-button{
	background-color:#acb6be;
}
.flavr-container .flavr-fixer .flavr-outer .flavr-toolbar .flavr-button.danger {
	background-color: #818b99;
}

.wordbrek_all{
	word-break: break-all;
}

.none-p-m{
	padding:0;
	margin:0;
}
.base-box-shadow{
	-webkit-box-shadow: -6px -7px 10px rgba( 0, 0, 0, 0.2 );
	-webkit-border-radius: 10px;
	-o-box-shadow: -6px -7px 10px rgba( 0, 0, 0, 0.2 );
	-o-border-radius: 10px;
	-moz-box-shadow: -6px -7px 10px rgba( 0, 0, 0, 0.2 );
	-moz-border-radius: 10px;
}
/*-- //overwrite flavr --*/
/*-- overwrite select2 --*/
.select2-container--default.select2-container--focus, .select2-container--default:focus, .select2-container--default:active,
.select2-selection.select2-container--focus,
.select2-selection:focus,
.select2-selection:active {
  outline: none;
}

.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
  border: 1px solid #d2d6de;
  padding: 6px 12px;
  height: 34px;
}

.select2-container--default.select2-container--open {
  border-color: #004666;
}

.select2-dropdown {
  border: 1px solid #d2d6de;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: #808080;
  color: white;
}

.select2-results__option {
  padding: 6px 12px;
  user-select: none;
  -webkit-user-select: none;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  padding-left: 0;
  padding-right: 0;
  height: auto;
  margin-top: -4px;
}

.select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
  padding-right: 6px;
  padding-left: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 28px;
  right: 3px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  margin-top: 0;
}

.select2-dropdown .select2-search__field,
.select2-search--inline .select2-search__field {
  border: 1px solid #d2d6de;
}

.select2-dropdown .select2-search__field:focus,
.select2-search--inline .select2-search__field:focus {
  outline: none;
  border: 1px solid #004666;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
  color: #999;
}

.select2-container--default .select2-results__option[aria-selected=true] {
  background-color: #ddd;
}

.select2-container--default .select2-results__option[aria-selected=true], .select2-container--default .select2-results__option[aria-selected=true]:hover {
  color: #444;
}

.select2-container--default .select2-selection--multiple {
  border: 1px solid #d2d6de;
}

.select2-container--default .select2-selection--multiple:focus {
  border-color: #004666;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
  border-color: #d2d6de;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background-color: #004666;
  border-color: #006fe6;
  padding: 1px 10px;
  color: #ffffff;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  margin-right: 5px;
  color: rgba(255, 255, 255, 0.7);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: #ffffff;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  padding-right: 10px;
}
select.form-control:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px);
}

select.form-control:focus::-ms-value {
  color: #495057;
  background-color: #ffffff;
}

.input-group-prepend{
	width:100%;
}

select.form-control-sm:not([size]):not([multiple]), .input-group-sm > select.form-control:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-sm > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-sm > .input-group-append > select.btn:not([size]):not([multiple]) {
  height: calc(1.8125rem + 2px);
}


select.form-control-lg:not([size]):not([multiple]), .input-group-lg > select.form-control:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.input-group-text:not([size]):not([multiple]),
.input-group-lg > .input-group-prepend > select.btn:not([size]):not([multiple]),
.input-group-lg > .input-group-append > select.btn:not([size]):not([multiple]) {
  height: calc(2.875rem + 2px);
}
/*-- //overwrite select2 --*/

/*-- overwrite dropdown-item drowpdow_head --*/
.drowpdow_head .dropdown-item{
	color:#6E6E6E;
	font-size:.8rem;
}
.drowpdow_head .dropdown-menu {
  position: absolute;
  right: 0;
  left: auto;
}
.drowpdow_head .dropdown-menu {
    position: absolute;
    right: 8%;
    left: auto;
    border: 1px solid #ddd;
    background: #ffffff;
  }

.drowpdow_head .dropdown-item.active, .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #626464;
}

.drowpdow_head .dropdown-item:hover, .dropdown-item:focus {
    color: #ffffff;
    text-decoration: none;
    background-color: #626464;
}


.drowpdow_head.dropdown-toggle::after {
  display: none;
}


/*-- //overwrite dropdown-item drowpdow_head --*/





/*-- blance --*/
.blance{
	background:url(../images/globalBg.jpg) no-repeat 0px 0px;
	background-size: cover;
	border-radius: 40px;
	height: auto;
}
.blance-grid h3 {
    font-size: 20px;
    font-weight: 600;
    color: #eee;
    letter-spacing: 1px;
    
}
.blance-grid p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #bbb;
}
.blance-grid .agileits-button.two a {
    color: #fff;
}
.blance  h3.heading{
    color: #fff;
}
/*-- //blance --*/
/*-- ordder --*/
.ordder{
	background:url(../images/moneyBg.png) no-repeat 0px 0px;
	background-size: cover;
	padding:20px 0;
}
.ordder-grid h3 {
    font-size: 20px;
    font-weight: 600;
    color: #eee;
    letter-spacing: 1px;
}
.ordder-grid p {
    font-size: 15px;
    letter-spacing: .5px;
    line-height: 28px;
    color: #bbb;
}
.ordder-grid .agileits-button.two a {
    color: #fff;
}
.ordder  h3.heading{
    color: #fff;
}
.ordder .card {
    background: rgba(104, 104, 104, 0.6);
}
/*-- //ordder--*/

/*-- info box --*/
.info-box {
    box-shadow: 0 0 1px rgba(0,0,0,.125), 0 1px 3px rgba(0,0,0,.2);
    border-radius: .25rem;
    padding: .5rem;
    min-height: 80px;
    background: #fff;
}
.elevation-1{
	box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
}

.info-box-icon {
    border-radius: .25rem;
    display: block;
    width: 70px;
    text-align: center;
    font-size: 30px;
}

.info-box-icon{
    align-items: center!important;
}
.info-box-icon{
	justify-content: center!important;
}
.d-flex, .info-box, .info-box-icon {
    display: flex!important;
}
.bg-info{
	color:#fff;
	background-color: #3E91BB!important;
}
.info-box-content {
    padding: 5px 10px;
    flex: 1;
}
.info-box-text{
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.info-box-number {
    display: block;
    font-weight: 700;
}
/*// info box --*/



/*-- 全屏 显示 --*/ 
.full_screen_view{
	position:fixed;
	left:0; 
	top:0; 
	width:100%; 
	z-index:99999; 
	height:100%; 
	display:none;
}
.full_screen_view .wrapper {
   position: relative;
    display: inline-block;
    height: 100%;
    width: 100%;
    background: rgba(56, 56, 56, 0.7);
    padding:3%;
    overflow-y: scroll;
}
.full_screen_view .wrapper .content{
	border-bottom: 1px dashed  #9e9e9e;
    color: #216bf3;
    font-size: 1.5rem;
    font-style: italic;
    text-transform: none;
    font-weight: 400;
}

.mark_log{
	position: relative;
    margin: 0;
    font-weight: bold;
    letter-spacing: -0.05rem;
    line-height: 1;
    text-transform: uppercase;
    z-index: 10;
    top:20%;
}
.mark_log:before {
   content: "中海壳牌石油化工有限公司";
    font-family: monospace;
    font-size: 5rem;
    position: absolute;
    top: 19rem;
    left: 4rem;
    z-index: 0;
    line-height: 1;
    color: rgba(50, 25, 0, 0.1);
    -ms-transform: rotate(-7deg);
    -moz-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
    -o-transform: rotate(-7deg);
}

.full_screen_view .container .layout_content{
	background-color: #FCFCFC;
    border: 1px solid #f1f1f1;
    box-shadow: 3px 9px 12px #8c8f91;
    margin-top: -15px;
    background: linear-gradient(#fffcf5, #83c4ed);
}

.full_screen_view .wrapper .header{
	border-bottom: 1px solid #9e9e9e;
    color: #333333;
    font-size: 2rem;
    text-align:center;
    font-weight:600;
    padding: 0 0 20px 0;
}
.full_screen_view .wrapper .row{
	margin-left:0;
	padding-left:20px;
}
.full_screen_view .close:before {
  content: '✕';
}
.full_screen_view .close {
  position: fixed;
  top: 1rem;
  right: 8%;
  cursor: pointer;
  z-index:99;
}
/*-- //全屏 显示 */ 
/*-- k2flow modal --*/
.portal-upload-file{
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.k2flow .card-info.card-outline {
    border-top: 3px solid #17a2b8;
}

.k2flow .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 0 solid rgba(0,0,0,.125);
    border-radius: .25rem;
}
.k2flow .card {
    box-shadow: 0 0 1px rgba(0,0,0,.125), 0 1px 3px rgba(0,0,0,.2);
}
.k2flow .callout, .info-box, .small-box {
    margin-bottom: 1rem!important;
}
.k2flow .card-header {
  	position: relative;
    background-color: transparent;
    border-bottom: 1px solid rgba(0,0,0,.125);
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
}
.k2flow .collapsed-card .card-header {
    border-bottom: none;
}
.k2flow .card-title {
    font-size: 1.25rem;
    font-weight: 400;
    margin: 0;
}
.k2flow .card-header>.card-tools {
    position: absolute;
    right: 1rem;
    top: .5rem;
}
.k2flow .card-body::after, .card-footer::after, .card-header::after {
    display: block;
    clear: both;
    content: "";
}
.k2flow .btn-tool {
    padding: .25rem .5rem;
    font-size: .875rem;
    background: 0 0;
    color: #adb5bd;
}
/*-- //k2flow modal --*/
/** -- radiu --**/
.service_radiu {
    background-color: #618bd9;
    height: 99px;
    width: 178px;
    border-radius: 55px;
    line-height: 75px;
    padding: 12px;
    color: #fff;
    margin-left: auto;
  	margin-right: auto;
    text-align: center;
    margin-bottom: 26px;
    cursor: pointer;
}

.service_radiu:hover{
    background: rgba(100, 163, 242, 0.5);
}

.service_radiu.orange{
	background-color: #f69040;
}

.service_radiu.orange:hover{
	 background: rgba(250, 155, 100, 0.5);
}

.portal-table.color-blue .btn-primary.disabled{
    background-color: #d1d1d1;
    border-color: #ced4da;
}

	
a.btn.btn-primary.probtn.btn-sm.disabled{
    opacity: 1;
}
.btn-primary.disabled, .btn-primary:disabled {
    background-color:#d1d1d1;
}

/*//radiu *--/




/*-- customize --*/
.img10per{
	width: 30%;
	height: 50%;
}

.y3layouts-header-left{
	float: left;
}
.y3layouts-header-right{
	float: right;
}

.logoimg{
	width:105%;
	height: 50px;
	/*margin-left: 1.1rem;*/
}
.logoimg2{
	width:43px;
	height: 43px;
	/*margin-left: 1.1rem;*/
}

.container-header{
	width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding:0;
}


.newsletter input[type="ticket"]{
    outline: none;
    color: #fff;
    padding: 13px 25px;
    font-size: 1em;
    width: 80%;
    box-sizing: border-box;
    background: none;
    border: none;
    background: #1d1b1b;
    letter-spacing: 1px;
    font-family: 'Montserrat', sans-serif;
}

.newsletter input[type="sbutton"] {
	outline: none;
    color: #fff;
    padding: 13px 0;
    font-size: 1em;
    font-weight: 600;
    width: 19%;
    background: #6b6b6b;
    cursor: pointer;
    border: none;
    box-sizing: border-box;
	font-family: 'Montserrat', sans-serif;
	text-align: center;
	-webkit-touch-callout: none; /* iOS Safari */
	
	-webkit-user-select: none; /* Chrome/Safari/Opera */
	
	-khtml-user-select: none; /* Konqueror */
	
	-moz-user-select: none; /* Firefox */
	
	-ms-user-select: none; /* Internet Explorer/Edge */
	
	user-select: none; /* Non-prefixed version, currently
	
	not supported by any browser */
}
.txt-align-center{
	text-align:center;
}
.txt-align-left{
	text-align:left;
}
.txt-align-right{
	text-align:right;
}

.card .card_tag{
	width: 0;
    height: 0;
    border-left: 100px solid transparent;
    border-right: 100px solid transparent;
    border-top: 41px solid #03a9f4;
    position: absolute;
    left: 2%;
    top: -13px;
}
.card .card_tag .card_tag_content{
	position:absolute;
	top: -34px;
	left: -49px;
	width: 100px;
	height: 30px;
	text-align: center;
	line-height: 20px;
	color:#fff;
	font-style: italic;
}

.card .ticket_title{
	font-size: 1.2rem;
	
}

.btn-secondary{
	background-color: #6b6b6b;
    border-color: #6b6b6b;
}

.btn-secondary:hover{
	background-color: #908f8f;
    border-color: #908f8f;
}
.card .toggle_all_btn_bar{
	float:right
}

.card.no-border{
	border:none;
}

.item-toggle .txt_blue {
	color:#1a85e3;
	font-size:1rem;
}
.item-toggle  .text_muted_createtime {
	float:right;
	mairgin-right:10px;
	color:#6c757d;
}

.item-toggle .index_num{
	    background-color: #03A9F4;
    color: #fff;
    width: 10px;
    border-radius: 29px;
    /* background: #8AC007; */
    padding: 1px 7px;
    /* width: 200px; */
    /* height: 150px; */
    text-align: center;
    line-height: 20px;
    height: 20px;
}
#ticketNum{
	color:#03a9f4;
}

#createTicket{
	font-size:1.3rem;
	width:100%;
	padding:40px 0; 
	animation:twinkling 3s infinite ease-in-out;
	-webkit-animation: twinkling 3s infinite ease-in-out;
	background: rgba(32, 32, 32, 0.9);
}
.container.card-padding-y20 {
    padding: 20px;
}
.balance-scroll{
	font-size:40px;
	color:#ffffff;
}
.error-txt{
	color:red;
	margin-left:1%;
}
.agree-checkbox{
	position: absolute;
    /* bottom: 9px; */
    right: 7%;
    padding: 12px;
    width: 20px;
    height: 20px;
    border: 1px red solid;
}

/**-- 重写safari手机端 不能显示disabled问题 -**/
.portal-table.color-blue .btn.disabled{
	opacity:1;
}
/**-- 重写safari手机端 不能显示disabled问题-end-**/
/*--slogan 背景--**/
.letter-spacing-h4.slogan-bg-blue{
    border-bottom: none;
}
/*--slogan 背景 end--**/
/*-- customize --*/

/*-- blue theme --*/
/*-- navbar --*/
/* .navbar-light .navbar-nav .active>.nav-link, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .open>.nav-link {
    color: #fff;
}
.navbar-light .navbar-nav .nav-link {
    color: #fff;
}  */

/**-- 重新导航栏样式 --**/
 .navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active{
	color:#fff;
}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{
	color:#fff;
}
/*--// navbar --*/

/*--portal table--*/
.portal-table thead th {
   background: #135a99;
}
.portal-table thead th:nth-child(odd) {
    color: #ffffff;
	background:#1060A7;
}
.portal-table tbody tr:nth-child(odd) {
    background: #f0f8ff;
}
/*--//portal table --*/
 .dropdown-item{
	color: #1060A7;
}
@media (max-width: 1024px){
 .dropdown-item{
	/* color: #1060A7; */
	color:#fff;
	}
}

.dropdown-item:hover, .dropdown-item:focus {
    color: #ffffff;
    background-color: #1060A7;
}

.drowpdow_head .dropdown-item:hover, .dropdown-item:focus {
    background-color: #1060A7;
}

.drowpdow_head .dropdown-item{
	color: #1775c0;
}
.login-icon{
	color: #1060A7;
}
.login-icon:hover{
	color:#67aaef;
}

#createTicket{
	background: rgba(54, 173, 219, 0.9);
}
.newsletter input[type="ticket"]{
	color:#07658f;
	background: #fff;
	border: 1px solid #07658f;
}
.newsletter input[type="sbutton"]{
    background: #428bca;
}

.btn-primary {
  color: #ffffff;
  background-color:#428bca;
  border-color: #357ebd;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075);
}

.btn-primary:hover {
  color: #ffffff;
  background-color: #3276b1;
  border-color:#285e8e;
}

.btn-secondary{
	background:#428bca;
	border-color: #357ebd;
}

.btn-secondary:hover{
	background-color: #3276b1;
    border-color: #285e8e;
}

.contactus a:hover{
	background: #1060A7;
}

.cspc-pagination-page .active{
    background-color: #428bca;
}
.cspc-pagination-page .ctrl:hover{
    background-color: #71b9f1;
}
.cspc-pagination-page-item-prev{
	background: #428bca;
}
.portal-table thead th{
	background: #428bca;
}
.portal-table td {
    border-bottom: 1px solid #fff;
}

.ui-pager-disabled{
	background: #eeeeee;
    color: #838a91;
}

.cspc-pagination{
	color: #6d8fb2;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #0064A3;
    color: white;
}
/**--  card  --**/
/*-- //blue theme --*/

/*--start table help--*/

#table_help{
	position: absolute;
	height: 100%; 
	width: 100%;
	background-color: #575757;
	opacity:0.5;
	display:none;
}
#table_help .close_help{
	position: absolute; 
	right: 20px; 
	top: 10px; 
	font-size: 20px;
	color:#FFF;
	opacity:1;
}

#table_help .arrow_left{
	position: absolute;
    font-size: 32px;
    color: #FFF;
    zoom: 1.1;
    top: 35%;
    left: 28%;
    opacity: 1;
}
#table_help .arrow_right{
	position: absolute;
	font-size: 32px;
	color:#FFF;
	zoom:1.1;
	opacity:1;
	top: 35%;
    right: 28%;
}
#table_help .help_content{
	position: absolute;
    height: 60px;
    width: 100%;
    top: 35%;
    background-color: #0d0d0d;
    padding-left: 15%;
    padding-right: 15%;
    color: white;
    text-align: center;
    line-height: 60px;
}

.arrow_left{
	width:20px;
	height:20px;
	position:relative;
	animation:arrow_left 2s infinite;
	animation-direction:alternate;
	
	/*- Safari and Chrome -*/
	-webkit-animation:arrow_left 2s infinite;
	-webkit-animation-direction:alternate;
}
.arrow_right{
	width:20px;
	height:20px;
	position:relative;
	animation:arrow_right 2s infinite;
	animation-direction:alternate;
	
	/*- Safari and Chrome -*/
	-webkit-animation:arrow_right 2s infinite;
	-webkit-animation-direction:alternate;
}

@keyframes arrow_left
{
	0%   {left:50px; }
	25%  { left:0;}
	50%  { left:50px;}
	75%  { left:0; }
	100% { left:50px; }
}

@-webkit-keyframes arrow /*Safari and Chrome */
{
	0%   {left:50px; }
	25%  { left:0;}
	50%  { left:50px;}
	75%  { left:0; }
	100% { left:50px; }
}


@keyframes arrow_right
{
	0%   {right:50px; }
	25%  { right:0;}
	50%  { right:50px;}
	75%  { right:0; }
	100% { right:50px; }
}

@-webkit-keyframes arrow /*Safari and Chrome */
{
	0%   {right:50px; }
	25%  { right:0;}
	50%  { right:50px;}
	75%  { right:0; }
	100% { right:50px; }
}

/*--end table help --*/
/*--start  be customer help --*/
.help_hand{
	display:none;
	background-color: #0c71cbc2;
    height: 30px;
    width: auto;
    right: 110px;
    padding: 0 20px;
    line-height: 27px;
    border-radius: 7px;
    color: #fff;
    margin-right: 45px;
    animation: twinkling 3s infinite ease-in-out;
    -webkit-animation: twinkling 3s infinite ease-in-out;
}

/*--end be customer help  -- */