html, body{
    width:100%;
    min-width:900px;
    height:100%;
    min-height:100%;
    margin:0;
    padding:0;
    background-color:rgba(240,240,240,1);
}
.page-img{
    box-shadow:inset 0px 2px 5px rgba(100,100,100,0.3);
    width:100%;
    height:300px;
    background-image:url('../img/talk-back.jpg');
    background-repeat:no-repeat;
    background-size:100% 100%;
}
.panel{
    width:100%;
    min-height:max(calc(100% - 380px),600px);
    max-height:min(calc(100% - 380px),800px);
    background-color:rgba(0,0,0,0.8);
    display:flow-root;
    height:auto;
}
.panel>.card{
    width:calc(50% - 100px);
    margin-left:50px;
    margin-right:50px;
    border-radius:10px;
    float:left;
    height:400px;
    margin-top:50px;
    background-color:white;
}
.panel>.card.info{background-color:rgba(255,255,255,0.9);}
.panel>.card.send{background-color:rgba(0,0,0,0.7);}

.panel>.card>.title{
    height:100px;
    line-height:100px;
    width:80%;
    margin-left:10%;
}
.panel>.card>.title>*{font-size:25px;font-weight:bold;}
.panel>.card.send>.title>*{color:rgba(255,255,255,0.9);}

.panel>.card>.contain{width:80%;margin-left:10%;}
.panel>.card>.contain>.link{width:100%;height:80px;line-height:80px;}
.panel>.card>.contain>.link>*{font-size:25px;float:right;color:rgba(0,25,255,1);}

.panel>.card>.form{
    margin-left:10%;
    width:80%;
    height:auto;
}

.panel>.card>.form>.item{
    height:auto;
    display:flow-root;
    width:100%;
}
.panel>.card>.form>.item>textarea{
    width:100%;
    height:60px;
    resize:none;
    overflow-x:hidden;
    font-size:15px;
    border-top:none;
    border-left:none;
    border-right:none;
    border-bottom:solid 1px rgba(255,255,255,0.8);
    box-sizing:border-box;
    outline:none;
    background-color:transparent;
    color:rgba(255,255,255,0.8);
    font-family:"微软雅黑";
}
textarea::-webkit-input-placeholder {
    color: rgba(255,255,255,0.8);
    font-size: 15px;
    font-weight:500;
    font-family:"微软雅黑";
}
textarea::-webkit-scrollbar{
	width:7px;
	height:10px;
	margin:0;
	padding:0;
	border-radius: 3px;
}
textarea::-webkit-scrollbar-thumb{
	border-radius: 3px;
	-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
	background: rgba(255,255,255,1);
}
textarea::-webkit-scrollbar-track{
	-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
	border-radius: 3px;
	background:rgba(255,255,255,0.4);
}
.panel>.card>.form>hr{
    padding:0;
    border:none;
    margin:0;
    height:0.5px;
    background-color:white;
}
input::-webkit-input-placeholder {
    color: rgba(255,255,255,0.8);
    font-size: 15px;
    font-weight:500;
    font-family:"微软雅黑";
}
.panel>.card>.form>.item>input{
    width:100%;
    height:45px;
    line-height:45px;
    padding:0;
    margin:0;
    font-size: 15px;
    color:rgba(255,255,255,0.8);
    background-color:transparent;
    border-top:none;
    border-left:none;
    border-right:none;
    box-sizing:border-box;
    color:15px;
    border-bottom:solid 1px rgba(255,255,255,0.8);
    outline:none;
    font-family:"微软雅黑";
}
.panel>.card>.form>.item>input.code{width:calc(100% - 120px)!important;float:left}
.panel>.card>.form>.item>.yzm{
    width:120px;
    height:45px;
    float:left;
}
.panel>.card>.form>.item>.yzm>*{height:45px;width:120px;}
.panel>.card>.form>.item>.error{
    width:100%;
    height:15px;
    line-height:15px;
    font-size:10px;
    color:rgba(255,100,50,1);
    visibility:hidden;
}
.panel>.card>.form>.item>.error.active{
    visibility:visible;
}
.panel>.card>.form>.item>.error.code{float:left;}
.panel>.card>.form>.item>#submit{
    width:30%;
    height:35px;
    line-height:35px;
    background-color:rgba(255,255,255,0.9);
    margin-top:30px;
    border-radius:5px;
    color:rgba(0,0,0,0.9);
    text-align:center;
    font-size:14px;
}
#text_len{
    height:15px;
    line-height:15px;
    font-size:10px;
    text-align:right;
    color:rgba(255,255,255,0.9);
}
#text_len.type-danger{
    color:rgba(255,0,0,0.9)!important;
}