#matoolsContainer {    width: 1380px;overflow:hidden;padding:15px;background-color:#fff;border:1px solid #037ef3;border-radius:4px;}
#matoolsContainer .panel-heading h1 {font-family:inherit;font-weight:500;line-height:1.1;color:inherit;margin-bottom:10px;font-size:36px;text-align:center;}
#matoolsContainer .form-horizontal {border:1px solid #ddd;border-radius:4px;padding:15px;overflow:hidden;}
#matoolsContainer h2 {font-weight:400;font-size:16px;color:#333;background-color:#f5f5f5;padding:10px 15px;border-bottom:1px solid #ddd;border-top-left-radius:3px;border-top-right-radius:3px;}

#matoolsContainer .col-sm-12 textarea {min-height:12em;width:98.5%;padding:0.5em;resize:none;font-family:inherit;display:block;font-size:14px;line-height:1.42857143;color:#555;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgb(0 0 0 / 75%);box-shadow:inset 0 1px 1px rgb(0 0 0 / 75%);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
#matoolsContainer .col-sm-12 textarea:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.75),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.75),0 0 8px rgba(102,175,233,.6);}

#matoolsContainer .form-group .list-inline {padding:1em 0;text-align:center;}
#matoolsContainer .form-group .btn {color:#fff;background-color:#037ef3;border-color:#037ef3;padding:0 16px;border:1px solid transparent;box-shadow:initial;display:inline-block;font-weight:400;font-size:14px;height:35px;line-height:35px;text-align:center;border-radius:4px;cursor:pointer;}
#matoolsContainer .form-group .btn:hover {background-color:#136ec5;border-color:#136ec5;}
#matoolsContainer .form-group .btns {color:#fff;background-color:#d9534f;border-color:#d9534f;padding:0 16px;border:1px solid transparent;box-shadow:initial;display:inline-block;font-weight:400;font-size:14px;height:35px;line-height:35px;text-align:center;border-radius:4px;cursor:pointer;margin-bottom:10px;}
#matoolsContainer .form-group .btns:hover {background-color:#c32057;border-color:#c32057;}

#matoolsContainer .form-groupa .list-inline {padding:1em 0;text-align:center;}
#matoolsContainer .form-groupa .btn {color:#fff;background-color:#037ef3;border-color:#037ef3;padding:0 16px;border:1px solid transparent;box-shadow:initial;display:inline-block;font-weight:400;font-size:14px;height:35px;line-height:35px;text-align:center;border-radius:4px;cursor:pointer;margin:10px 0;}
#matoolsContainer .form-groupa .btn:hover {background-color:#136ec5;border-color:#136ec5;}
#matoolsContainer .form-groupa .btns {color:#fff;background-color:#d9534f;border-color:#d9534f;padding:0 16px;border:1px solid transparent;box-shadow:initial;display:inline-block;font-weight:400;font-size:14px;height:35px;line-height:35px;text-align:center;border-radius:4px;cursor:pointer;margin:10px 0;}
#matoolsContainer .form-groupa .btns:hover {background-color:#c32057;border-color:#c32057;}
#matoolsContainer .form-groupa label {margin-bottom:1em;display:inline-block;}
#matoolsContainer .form-groupa .input-group-addon {padding-top:7px;text-align:right;width:37%;float:left;display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700;position:relative;min-height:1px;padding-right:15px;padding-left:15px;}
#matoolsContainer .form-groupa .input-group input {padding:0 12px;display:block;width:25%;height:34px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;}

#matoolsContainer .form-groups {margin-right:0px;margin-left:0px;margin-bottom:15px;}
#matoolsContainer .form-groups label {padding-top:7px;text-align:right;width:36%;float:left;display:inline-block;max-width:100%;margin-bottom:5px;font-weight:700;position:relative;min-height:1px;padding-right:15px;padding-left:15px;}
#matoolsContainer .form-groups .col-sm-9 {width:75%;}
#matoolsContainer .form-groups .col-sm-9 .btn-primary {color:#fff;background-color:#037ef3;border-color:#037ef3;}
#matoolsContainer .form-groups .col-sm-10 .form-control {padding:0 12px;display:block;width:50%;height:34px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;}
#matoolsContainer .form-groups .col-sm-12 pre {margin:0 0 10px;font-size:13px;line-height:1.42857143;color:#333;word-break:break-all;word-wrap:break-word;background-color:#f5f5f5;display:block;width:50%;background-image:none;float:left;box-sizing:border-box;}
#matoolsContainer .form-groups .col-sm-12 .alert {padding:15px;margin-bottom:20px;border:1px solid transparent;border-radius:4px;}

#matoolsContainer .form-groups .btn {color:#fff;background-color:#037ef3;border-color:#037ef3;padding:0 16px;border:1px solid transparent;box-shadow:initial;font-weight:400;font-size:14px;height:35px;line-height:35px;text-align:center;margin:auto;border-radius:4px;cursor:pointer;margin-bottom:10px;}
#matoolsContainer .form-groups .btn:hover {background-color:#136ec5;border-color:#136ec5;}

#matoolsContainer .col-md-7 .tool {border:solid 1px #ddd;background-color:#eee;width:100%;font-size:1.2vh;z-index:100;margin-top:1em;box-sizing:border-box;border-top-left-radius:4px;border-top-right-radius:4px;}#matoolsContainer .col-md-7 .tool a {cursor:pointer;width:5%;text-align:center;display:inline-block;color:#999;padding:.5em 0;}
#matoolsContainer .col-md-7 .tool .glyphicon {font-family:'Glyphicons Halflings';-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
#matoolsContainer .col-md-7 .tool .glyphicon-compressed:before {content:"\e181";}
#matoolsContainer .col-md-7 .tool .glyphicon-sort-by-order:before {content:"\e153";}
#matoolsContainer .col-md-7 .tool .glyphicon-trash:before {content:"\e020";}
#matoolsContainer .col-md-7 .tool .glyphicon-save:before {content:"\e166";}
#matoolsContainer .col-md-7 .tool .glyphicon-file:before {content:"\e022";}
#matoolsContainer .col-md-7 .tool .glyphicon-minus-sign:before {content:"\e082";}
#matoolsContainer .col-md-7 .common-font-size {min-height:12em;width:100%;padding:0.5em;font-size:14px;line-height:1.42857143;color:#555;background-image:none;border:1px solid #ccc;border-top:0px solid #ccc;border-bottom-left-radius:4px;box-sizing:border-box;border-bottom-right-radius:4px;-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}

#matoolsContainer .form-groups .glyphicon {position:relative;top:2px;font-family:'Glyphicons Halflings';border:0;font-size:14px;text-align:center;border-radius:4px;cursor:pointer;}
#matoolsContainer .form-groups .glyphicon-pause:before{content:"\e073"}
#matoolsContainer .form-groups .glyphicon-play:before {content:"\e072";}
#matoolsContainer .form-groups .glyphicon-arrow-right:before {content:"\e092";}
#matoolsContainer .form-groups .glyphicon-transfer:before {content:"\e178";}

#matoolsContainer .numberedtextarea-wrapper textarea {min-height:12em;width:100%;padding:0.5em;resize:none;font-family:inherit;display:block;font-size:14px;line-height:1.42857143;color:#555;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgb(0 0 0 / 75%);box-shadow:inset 0 1px 1px rgb(0 0 0 / 75%);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
#matoolsContainer .numberedtextarea-wrapper textarea:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.75),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.75),0 0 8px rgba(102,175,233,.6);}


#toolDescription {border:1px solid #ddd;border-radius:4px;margin-bottom:0.8em;margin-top:1em}
#toolDescription .neirong {padding:15px;text-align:justify;}
#toolDescription .neirong p {margin:0 0 10px;}

#toolDescription table {margin:1%;width:98%;}
#toolDescription table caption {padding-top:8px;padding-bottom:8px;color:#777;text-align:left;}
#toolDescription table th, #toolDescription table td {word-wrap:break-word;word-break:break-all;text-align:justify;padding:8px;line-height:1.42857143;vertical-align:top;border:1px solid #ddd;}
#toolDescription table th {text-align:left;font-weight:700;}

#toolDescription .neirong table {margin:0%;width:100%;}
#toolDescription .neirong table caption {padding-top:8px;padding-bottom:8px;color:#777;text-align:left;}
#toolDescription .neirong table th, #toolDescription table td {word-wrap:break-word;word-break:break-all;text-align:justify;padding:8px;line-height:1.42857143;vertical-align:top;border:1px solid #ddd;}
#toolDescription .neirong table th {text-align:left;font-weight:700;}

.glyphicon { position: relative; top: 1px; display: inline-block; font-family: 'Glyphicons Halflings'; font-style: normal; font-weight: 400; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.glyphicon-arrow-right:before { content: "\e092"; }
.well { min-height: 20px; padding: 19px; margin-bottom: 20px; background-color: #f5f5f5; border: 1px solid #e3e3e3; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%); box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%); }


@media (max-width:920px){
   #matoolsContainer {padding:0.5em;width:initial;}
   #matoolsContainer .panel-heading h1 {font-size:22px;}
   #matoolsContainer .numberedtextarea-wrapper textarea {width:100%!important;}
   #matoolsContainer .col-sm-12 textarea{width:98%;}
   #matoolsContainer .form-groups label {width:100%;padding-top:0;text-align:initial;padding-right:0;padding-left:0;}
   #matoolsContainer .form-groups .col-sm-9 {overflow:hidden;width:100%;}
   #matoolsContainer .form-groups .col-sm-9 input {margin-bottom:1em;width:100%;box-sizing:border-box}
   #matoolsContainer .form-groups .col-sm-10 .form-control {width:94%;}
   #matoolsContainer .form-groups .col-sm-12 pre {width:100%;}
   #matoolsContainer .form-groups .col-sm-12 .alert {padding:15px 5px;white-space:pre-line;overflow-wrap:break-word;}
   #matoolsContainer .form-groupa .input-group-addon {width:inherit;padding-left:0;}
   #matoolsContainer .form-groupa .input-group input {width:94%;}
   #matoolsContainer .col-md-7 .tool a {width:13%;}
   #toolDescription .neirong p {font-size:14px;}
   #matoolsContainer .form-groups .col-sm-9 .btn-primary {display:flex;justify-content:center;align-items:center;}
}

@media (max-width:834px){
  #matoolsContainer .panel-heading h1 {font-size:20px;} 
  #matoolsContainer .col-sm-12 textarea{width:97.5%;}
}

@media (max-width:600px){
    #matoolsContainer .col-sm-12 textarea{width:97%;}
}
@media (max-width:480px){
    #matoolsContainer .col-sm-12 textarea {width:96%;}
}
@media (max-width:400px){
    #matoolsContainer .col-sm-12 textarea {width:95%;}
}

@media (max-width:375px){
  #matoolsContainer .panel-heading h1 {font-size:18px;}
}

@media (max-width:280px){
    #matoolsContainer .col-sm-12 textarea {width:94%;}
}

@media (max-width:240px){
    #matoolsContainer .col-sm-12 textarea {width:93%;}
}

@charset "utf-8";
.cropBoxContainer { width: 400px; margin: auto; overflow: hidden; }
.cropBoxContainer p { line-height: 12px; height: 0px; margin: 15px 0 60px 0; color: #bbb }
.action { margin: 1em 0; overflow: hidden; }
.cropped { box-sizing: border-box;text-align: center;width: 100%; border: 1px #ddd solid;box-shadow: 0px 0px 12px #ddd;padding: 1em;}
.imageBox { position: relative; height: 400px; width: 400px; border: 1px solid #aaa; background: #fff; overflow: hidden; cursor: move; box-shadow: 4px 4px 12px #b0b0b0;  background-size: 893.101px 893.101px; background-position: -247.551px -247.551px; background-repeat: no-repeat; }
.imageBox .thumbBox { position: absolute; top: 50%; left: 50%; width: 200px; height: 200px; margin-top: -100px; margin-left: -100px; box-sizing: border-box; border: 1px solid rgb(102, 102, 102); box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.5); background: none repeat scroll 0% 0% transparent; }
.imageBox .spinner { position: absolute; top: 0; left: 0; bottom: 0; right: 0; text-align: center; line-height: 400px; background: #0000; }
/*选择文件上传*/
.new-contentarea { width: 100%; overflow: hidden; margin: 0 auto; position: relative; float: left; text-align: center; }
.new-contentarea label { width:100%; height:100%; display:block; }
.upload-img { width: 100%; display: inline-block; margin-bottom: 10px; line-height:2em; font-size: 20px; color: #fff; background-color: #037ef3; border-radius: 3px; text-decoration: none; cursor: pointer; border: 0px #fff solid; box-shadow: 0px 0px 5px #b0b0b0; }
.upload-img:hover { background-color:#136ec5;color: #fff;  }
.Btnsty_peyton { width: 48%; line-height: 2em; float: left; margin: 3% 1%; font-size: 20px; color: #FFFFFF; background-color:#d9534f; border-radius: 3px; cursor: pointer; box-shadow: 0px 0px 5px #b0b0b0; border: 0px #fff solid; box-sizing: border-box; }
.Btnsty_peyton:hover {background-color: #c32057; border-color: #c32057;}

.cropped li {display: inline-block; text-align: center; font-size: 10px;box-sizing: border-box; margin-right: 2em;}
.cropped li canvas {box-shadow: 0px 0px 12px #7e7e7e;}
.cropped li p {margin: 1em 0 0;}
.cropped li p a {background-color: #037ef3; color: #fff; height: 3em; line-height: 3em; padding: 0.3em 1em; border-radius: 3px;}
.cropped li p a:hover {background-color: #136ec5; color: #fff;}

@media (max-width: 920px) {
	.cropBoxContainer {width:100%;}
	.imageBox {width:100%;min-height:22em;height:initial;}
	.imageBox .spinner {line-height: 22em;}
	.cropped li {width: 100%;margin-top: 1.5em;margin-right:0;border-bottom: 1px #ddd solid;}
	.cropped li p { margin: 1em 0; }
	.cropped {padding: 0;}
}

@media (max-width: 411px) {
	.imageBox {min-height:23em;}
	.imageBox .spinner {line-height: 23em;}
}


@media (max-width: 360px) {
	.imageBox {min-height:20em;}
	.imageBox .spinner {line-height: 20em;}
}

@media (max-width: 320px) {
	.imageBox {min-height:18em;}
	.imageBox .spinner {line-height:18em;}
}

@media (max-width: 280px) {
	.imageBox {min-height:13em;}
	.imageBox .spinner {line-height:13em;}
	.imageBox .thumbBox {width: 100px; height: 100px; margin-top: -50px; margin-left: -50px;}
}