body{background-color: #ddd;}
.page {	width: 800px; margin: 0 auto; background-color: #fff; box-shadow: 0 0 5px #ccc;padding-bottom:50px;}
.logo {padding: 10px 0;text-align:center;margin-bottom:20px;}	
.container {width: 725px}
.message-group{margin: 10px 0;}
.message-group .form-group{margin-top: 5px; margin-bottom: 5px;}
.message-group .form-group .field{color:#7a7a7a}
.message-group .form-group .input{height:auto;padding:10px 6px;}
.message-group .form-d{overflow:hidden;}
.message-group .form-d .form-group{display:flex;align-items:center;}	
.message-group .form-d .form-group .label{margin-right:10px;width:50%;text-align:right;color:#7a7a7a}
.message-group .form-d .form-group .field{width:100%;}	
.message-group .form-w .form-group{display:block;}	
.message-group .form-w .form-group .label{float:none;margin-right:0;margin-bottom:10px;}
.message-group .form-w .form-group .field{}	
.message-group .mr20{margin-right: 20px;}	
.message-group .form-group .ml20{margin-left: 20px;}
.form-x .form-group .field {float: left;width: 85%;}	

.button{padding: 6px 30px}
.button-other{background-color: #5b97cf;color: #fff;padding:10px 40px;width:100%; cursor: pointer;text-align: center; border-radius: 3px; border: none;transition: all 1s cubic-bezier(0.175, 0.885, 0.32, 1) 0s; font-size: 14px;}	
.button-other:hover{background-color: #3b7ab6;}	
	
.field-star .item{display:flex;align-items: center;margin-bottom:10px;}
.field-star .item .title{width: 12%;}	
.field-star .item .other{width:58%;display:flex;align-items:center;}	
.field-star .item .other span{margin-right:10px;}	
.field-star .item .other .input{display:inline-block;width:auto;border:none;border-bottom:1px solid #ccc;border-radius:0;padding:3px 0;box-shadow:none;margin-left:auto;width:53%;}	
.field-star .item .other .input:focus{border-bottom:1px solid #09c;}
.field-star .item-w{display:flex;flex-wrap: wrap;}
.field-star .item-w .item{width:50%;}
.field-star-l .item .title{width:18%;}	
.field-star .item-w .item .title{width:35%;}
.field-star .item-w .star-grow{width:auto;}
.field-star .item-w .item-other{width:100%;}	
.field-star .item-w .other{width:100%;}
.field-star .item-w .other span{width:26%;margin-right: 0;}	
.field-star .item-w .other .input{width:73%;}
.field-star .item-wx .other span{width:28%;margin-right: 0;}
.field-star .item-wx .other .input{width:72%;}

@keyframes grow{0%{transform:scale(1,1)}
99%{transform:scale(4,4);opacity:0}
100%{transform:scale(1,1);opacity:0}
}
.star-grow{display:block;position:relative;padding:0;border:none;width:30%}
.star-grow > input{position:absolute;margin-right:-100%;opacity:0;clip: rect(0px,0px,0px,0px);}
.star-grow > input:checked ~ label,.star-grow > input:focus ~ label{background-position:0 -20px}
.star-grow > input:hover ~ label{background-position:0 -20px}
.star-grow > input:focus + label{outline:none}
.star-grow > label{position:relative;display:inline-block;float:right;width:20px;height:20px;margin-right: 20px;color:transparent;cursor:pointer;background-image:url("https://www.cusabio.com/manage/images/icons.png");background-repeat:no-repeat}
.star-grow > label:before{display:none;position:absolute;content:' ';width:20px;height:20px;background-image:url("https://www.cusabio.com/manage/images/icons.png");background-repeat:no-repeat;bottom:0}
.star-grow > input:checked + label:before{display:block;animation-duration:1s;animation-name:grow;animation-fill-mode:forwards}	
@media screen and (-webkit-min-device-pixel-ratio:2),(-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.star-grow > label{background-image:url("https://www.cusabio.com/manage/images/icons@2x.png");background-size:20px auto}
}
@media screen and (-webkit-min-device-pixel-ratio:2),(-webkit-min-device-pixel-ratio:2),(min-resolution:192dpi){.star-grow > label:before{background-image:url("https://www.cusabio.com/manage/images/icons@2x.png");background-size:20px auto}
}

	
@media screen and (max-width: 767px) {
	.page {	width: 100%; box-shadow:none}
	.logo{text-align: center}
	.container {width: 100%}	
	.message-group .form-group{ margin-right: 0; padding-bottom: 0; margin-bottom: 15px;flex-wrap:wrap;}
	.message-group .form-group .label{ padding-bottom:3px;}
	.message-group .form-d .form-group .label{width:100%;text-align:left;}
	.m-text{float:right;}
	.field-star .item{flex-wrap:wrap;margin-bottom:20px;}
	.field-star .item .title{width:auto;margin-right:10px;}	
	.field-star .item .other{margin-left:0;width:100%;margin-top:10px;flex-wrap:wrap;}
	.star-grow{width:auto;}
	.star-grow > label{margin-right:10px;}
	.field-star .item .other span{margin:0 0 10px 0;display:block;}
	.field-star .item .other .input{width:100%;border:1px solid #ccc;border-radius:4px;padding:10px 6px;box-shadow:0 1px 1px rgba(0,0,0,.075) inset;}
	.field-star .item .other .input:focus{border:1px solid #09c;}
	.field-star .item-w{flex-wrap:wrap;}
	.field-star .item-w .item{width:100%;}
	.field-star .item .other span{width:100%}

}