@charset 'utf-8';
@import '//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css';

.clearfix:after {content:"";clear:both;display:table;}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}
.middle, .middle * {vertical-align:middle !important;}
.ellipsis {text-overflow:ellipsis;overflow:hidden;white-space:nowrap;}

/* page-editor */
#page-editor.on {outline:dashed 1px #f00;}
#page-editor.on:after {content:"";clear:both;display:table;}

/* Number Pin */
span.npin{display:inline-block;vertical-align:middle;}
span.npin i{display:block;float:left;height:21px;width:8px;font-size:1px;text-indent:-10000px;background:url(/gears/resource/npin.png) no-repeat 0px 0px;padding-right:0;margin-right:0;overflow:hidden;}
span.npin strong{display:block;float:left;height:21px;line-height:19px;color:#fff;font-weight:bold;font-size:12px;font-family:arial,sans-serif;background:url(/gears/resource/npin.png) no-repeat 100% 0px;margin-left:0;padding-left:0;padding-right:8px;}
span.npin.blue i{background-position:0px -25px;}
span.npin.blue strong{background-position:100% -25px;}
span.npin.black i{background-position:0px -50px;}
span.npin.black strong{background-position:100% -50px;}
span.npin.green i{background-position:0px -75px;}
span.npin.green strong{background-position:100% -75px;}

/* paginate */
.paginate * {margin:0;padding:0;}
.paginate a, .paginate strong {position:relative;font-weight:bold;display:inline-block;padding:3px 8px 1px 7px;color:#313031;text-decoration:none;line-height:normal;border-right:solid 1px #ccc;}
.paginate a:first-child,
.paginate strong:first-child {border-left:solid 1px #ccc;}
.paginate strong {color:#00f !important;}
.paginate a:hover {background:#F7F7F7;}

.gears form.inline {display:inline;}

/* float layouts */
.gears .float-left {float:left;}
.gears .float-right {float:right;}

/* text and buttons */
.gears {font-size:1em;}
/*.gears * {font-size:1em;}*/
.gears .tiny {font-size:0.7em !important;}
.gears .mini {font-size:0.8em !important;}
.gears .small {font-size:0.9em !important;}
.gears .large {font-size:1.1em !important;}
.gears .huge {font-size:1.3em !important;}
.gears .text-bottom {vertical-align:bottom;}
.gears .text-top {vertical-align:top;}
.gears .center {text-align:center;}
.gears .left {text-align:left;}
.gears .right {text-align:right;}
.gears select {border:1px solid #666666;}
.gears textarea {border:1px solid #666666;}
.gears input {border:1px solid #666666;}
.gears input[type="checkbox"],
.gears input[type="radio"],
.gears input[type="file"] {border:none;}

.gears .scroll-text {border:solid 1px #666666;padding:1em;height:8em;overflow-y:scroll;white-space:pre-line;}

.gears .action {font-size:1em;display:inline-block;line-height:2.1em;box-sizing:border-box;border:none;border-radius:3px;}
.gears .action[disabled] {cursor:not-allowed;}
.gears .action {padding:0 1em;}
.gears .action img {vertical-align:middle;}
.gears button.action {cursor:pointer;}
.gears a.action,
.gears a.action:visited {text-decoration:none;}
.gears a.action:hover {text-decoration:none;}

.gears .action {background-color:#666;color:#fff !important;}
.gears .action:hover,
.gears .action:focus,
.gears .action.on {background-color:#444;}
.gears .action.block {display:block;width:100%;}

/* material color button */
.gears .action.red {background-color:#D32F2F !important;}
.gears .action.red:hover, .gears .action.red:focus, .gears .action.red.on {background-color:#B71C1C !important;}
.gears .action.pink {background-color:#C2185B !important;}
.gears .action.pink:hover, .gears .action.pink:focus, .gears .action.pink.on {background-color:#880E4F !important;}
.gears .action.purple {background-color:#7B1FA2 !important;}
.gears .action.purple:hover, .gears .action.purple:focus, .gears .action.purple.on {background-color:#4A148C !important;}
.gears .action.deep-purple {background-color:#512DA8 !important;}
.gears .action.deep-purple:hover, .gears .action.deep-purple:focus, .gears .action.deep-purple.on {background-color:#311B92 !important;}
.gears .action.indigo {background-color:#303F9F !important;}
.gears .action.indigo:hover, .gears .action.indigo:focus, .gears .action.indigo.on {background-color:#1A237E !important;}
.gears .action.blue {background-color:#1976D2 !important;}
.gears .action.blue:hover, .gears .action.blue:focus, .gears .action.blue.on {background-color:#0D47A1 !important;}
.gears .action.light-blue {background-color:#0288D1 !important;}
.gears .action.light-blue:hover, .gears .action.light-blue:focus, .gears .action.light-blue.on {background-color:#01579B !important;}
.gears .action.cyan {background-color:#0097A7 !important;}
.gears .action.cyan:hover, .gears .action.cyan:focus, .gears .action.cyan.on {background-color:#006064 !important;}
.gears .action.teal {background-color:#00796B !important;}
.gears .action.teal:hover, .gears .action.teal:focus, .gears .action.teal.on {background-color:#004D40 !important;}
.gears .action.green {background-color:#388E3C !important;}
.gears .action.green:hover, .gears .action.green:focus, .gears .action.green.on {background-color:#1B5E20 !important;}
.gears .action.light-green {background-color:#689F38 !important;}
.gears .action.light-green:hover, .gears .action.light-green:focus, .gears .action.light-green.on {background-color:#33691E !important;}
.gears .action.lime {background-color:#AFB42B !important;}
.gears .action.lime:hover, .gears .action.lime:focus, .gears .action.lime.on {background-color:#827717 !important;}
.gears .action.yellow {background-color:#FBC02D !important;color:#000 !important;}
.gears .action.yellow:hover, .gears .action.yellow:focus, .gears .action.yellow.on {background-color:#F57F17 !important;}
.gears .action.amber {background-color:#FFA000 !important;color:#000 !important;}
.gears .action.amber:hover, .gears .action.amber:focus, .gears .action.amber.on {background-color:#FF6F00 !important;}
.gears .action.orange {background-color:#EF6C00 !important;}
.gears .action.orange:hover, .gears .action.orange:focus, .gears .action.orange.on {background-color:#E65100 !important;}
.gears .action.deep-orange {background-color:#E64A19 !important;}
.gears .action.deep-orange:hover, .gears .action.deep-orange:focus, .gears .action.deep-orange.on {background-color:#BF360C !important;}
.gears .action.brown {background-color:#5D4037 !important;}
.gears .action.brown:hover, .gears .action.brown:focus, .gears .action.brown.on {background-color:#3E2723 !important;}
.gears .action.grey {background-color:#616161 !important;}
.gears .action.grey:hover, .gears .action.grey:focus, .gears .action.grey.on {background-color:#212121 !important;}
.gears .action.blue-grey {background-color:#455A64 !important;}
.gears .action.blue-grey:hover, .gears .action.blue-grey:focus, .gears .action.blue-grey.on {background-color:#263238 !important;}
.gears .action.white {background-color:#fff !important;color:#000 !important;}
.gears .action.white:hover, .gears .action.white:focus, .gears .action.white.on {background-color:#f4f4f4 !important;color:#000 !important;}
.gears .action.black {background-color:#000 !important;}
.gears .action.black:hover, .gears .action.black:focus, .gears .action.black.on {background-color:#212121 !important;}
.gears .action.smoke {background-color:#f4f4f4 !important;color:#666 !important;}
.gears .action.smoke:hover, .gears .action.smoke:focus, .gears .action.smoke.on {background-color:#eee !important;color:#000 !important;}

.gears .bg-red {background-color:#D32F2F;color:#fff;}
.gears .bg-pink {background-color:#C2185B;color:#fff;}
.gears .bg-purple {background-color:#7B1FA2;color:#fff;}
.gears .bg-deep-purple {background-color:#512DA8;color:#fff;}
.gears .bg-indigo {background-color:#303F9F;color:#fff;}
.gears .bg-blue {background-color:#1976D2;color:#fff;}
.gears .bg-light-blue {background-color:#0288D1;color:#fff;}
.gears .bg-cyan {background-color:#0097A7;color:#fff;}
.gears .bg-teal {background-color:#00796B;color:#fff;}
.gears .bg-green {background-color:#388E3C;color:#fff;}
.gears .bg-light-green {background-color:#689F38;color:#fff;}
.gears .bg-lime {background-color:#AFB42B;color:#fff;}
.gears .bg-yellow {background-color:#FBC02D;color:#000;}
.gears .bg-amber {background-color:#FFA000;color:#000;}
.gears .bg-orange {background-color:#EF6C00;color:#fff;}
.gears .bg-deep-orange {background-color:#E64A19;color:#fff;}
.gears .bg-brown {background-color:#5D4037;color:#fff;}
.gears .bg-grey {background-color:#616161;color:#fff;}
.gears .bg-blue-grey {background-color:#455A64;color:#fff;}
.gears .bg-white {background-color:#fff;color:#212121;}
.gears .bg-black {background-color:#000;color:#f4f4f4;}

.gears .text-red {color:#D32F2F !important;}
.gears .text-pink {color:#C2185B !important;}
.gears .text-purple {color:#7B1FA2 !important;}
.gears .text-deep-purple {color:#512DA8 !important;}
.gears .text-indigo {color:#303F9F !important;}
.gears .text-blue {color:#1976D2 !important;}
.gears .text-light-blue {color:#0288D1 !important;}
.gears .text-cyan {color:#006064 !important;}
.gears .text-teal {color:#00796B !important;}
.gears .text-green {color:#388E3C !important;}
.gears .text-light-green {color:#689F38 !important;}
.gears .text-lime {color:#827717 !important;}
.gears .text-yellow {color:#F57F17 !important;}
.gears .text-amber {color:#FF6F00 !important;}
.gears .text-orange {color:#E65100 !important;}
.gears .text-deep-orange {color:#BF360C !important;}
.gears .text-brown {color:#5D4037 !important;}
.gears .text-grey {color:#616161 !important;}
.gears .text-blue-grey {color:#455A64 !important;}
.gears .text-black {color:#000 !important;}
.gears .text-white {color:#fff !important;}

/* form inputs */
.gears button[disabled],
.gears a[disabled],
.gears input[disabled],
.gears textarea[disabled],
.gears select[disabled] {cursor:not-allowed !important;}
.gears .write-group {padding-bottom:1em;clear:both;position:relative;}
.gears .write-group:after {clear:both;display:table;content:'';}
.gears .write-group * {vertical-align:middle;box-sizing:border-box;font-size:1em;}
.gears .write-inline > * {float:left;}
.gears .write-group select {border:1px solid #666666;padding:5px;line-height:1;}
.gears .write-group textarea {border:1px solid #666666;padding:5px;line-height:1.6;}
.gears .write-group input {border:1px solid #666666;padding:6px;line-height:1;}
.gears .write-group input[type="checkbox"],
.gears .write-group input[type="radio"] {border:none;margin:5px 0;}
.gears .write-group input[type="file"] {border:none;}
.gears .write-group .half {float:left;width:50%;position:relative;}
.gears .write-group .label {display:block;float:left;width:8em;text-align:center;z-index:2;position:relative;padding-top:7px;line-height:1;}
.gears .write-group .full,
.gears .write-group .write-block,
.gears .write-group .write-block2 {display:block;width:100%;padding-left:8em;margin-left:-8em;float:left;}
.gears .write-group .write-block2 {margin-left:0;float:none;}
.gears .write-inline .write-block,
.gears .write-inline .write-block2 {display:inline;width:auto;padding-left:0;margin-left:0;}
.gears .write-group .write-captcha img {float:left;margin-right:10px;}
.gears .write-group .write-captcha a.refresh-captcha {display:inline-block;padding:0.2em;font-size:0.8em;background:#595;color:#fff;text-decoration:none;line-height:1;vertical-align:top;}
.gears .write-group .write-captcha input {margin-top:10px;}
.gears .help-group {margin-left:8em;clear:both;}
.gears .write-group .full input,
.gears .write-group .full textarea,
.gears .write-group .full select {width:100%;}
.gears .write-group-content {padding-right:2px;margin-bottom:1em;}
.gears .write-group-content * {vertical-align:middle;box-sizing:border-box;}
.gears .write-group-content select {border:1px solid #666666;padding:5px;}
.gears .write-group-content textarea {border:1px solid #666666;padding:5px;line-height:1.6;}
.gears .write-group-content input {border:1px solid #666666;padding:5px;}
.gears .write-group-content input[type="checkbox"],
.gears .write-group-content input[type="radio"] {border:none;margin:5px 0;}
.gears .write-group-content input[type="file"] {border:none;}
.gears .write-group-content .full {display:block;width:100%;}
.gears .write-group-content .full input,
.gears .write-group-content .full textarea,
.gears .write-group-content .full select {width:100%;}

body.sign-in-modal-on {overflow:hidden;}
.sign-in-modal {position:fixed;left:0;width:100%;top:0;height:100%;z-index:2000;overflow-y:auto;}
.sign-in-modal:before {content:"";display:block;position:fixed;left:0;top:0;width:100%;height:100%;background:#fff;opacity:0.5;}
.sign-in-modal .sign-in-form,
.sign-in-modal .sign-in-form * {box-sizing:border-box;}
.sign-in-modal .sign-in-form {margin:10% auto 0 auto;width:320px;text-align:center;box-shadow:#666 0 0 100px;background:#fff;z-index:2001;position:relative;}
.sign-in-modal .sign-in-form form {padding:20px 10px 10px 10px;}
.sign-in-modal .sign-in-form div {margin-bottom:20px;}
.sign-in-modal .sign-in-form div label {display:block;margin-bottom:10px;}
.sign-in-modal .sign-in-form div input {font-size:13pt;font-family:Arial,sans-serif;padding:5px;text-align:center;}
.sign-in-modal .sign-in-form div.card {background:#333;color:#333;}
.sign-in-modal .sign-in-form div.card i.fa {font-size:46px;display:inline-block;line-height:100px;width:100px;height:100px;margin:50px 0;background:#fff;border-radius:50%;}

@media screen\9 { /* media query css hack for ie<=7 */
    .gears .write-group .label {display:inline-block;width:8em;text-align:center;float:none;}
    .gears .write-group .full,
    .gears .write-group .write-block,
    .gears .write-group .write-block2 {display:inline;float:none;clear:none;}
    .gears .write-group .full input,
    .gears .write-group .full textarea {width:auto;}
}

/* responsive */
@media (max-width: 640px)
{
  .responsive .gears .write-group .half input,
  .responsive .gears .write-group .half textarea {width:100%;}
  .responsive .gears .write-group .half input[type="radio"],
  .responsive .gears .write-group .half input[type="checkbox"] {width:auto;}
}
@media (max-width: 540px)
{
  .responsive .gears .write-group .half {float:none;width:auto;clear:both;}
  .responsize .gears .write-group .half:after {content:'';clear:both;display:table;}
  .responsive .gears .write-group .half:nth-child(2n) {padding-top:1em;}
  .responsive .gears .write-group .write-block2 {margin-bottom:1em;}
  .responsive .gears .write-group .write-block2:last-child {margin-bottom:0;}
  .responsive .gears .write-group select,
  .responsive .gears .write-group textarea,
  .responsive .gears .write-group input {width:100%;}
  .responsive .gears .write-group input[type="checkbox"],
  .responsive .gears .write-group input[type="radio"],
  .responsive .gears .write-group input[type="file"] {width:auto;}
  .responsive .gears .float-left,
  .responsive .gears .float-right {float:none;text-align:center;}
  .responsive .gears .float-right {margin-top:0.5em;}
  
}