@font-face{font-family:'Material Icons';src:url('../fonts/MaterialIcons-Regular.eot');src:url('../fonts/MaterialIcons-Regular.eot') format('embedded-opentype'), url('../fonts/MaterialIcons-Regular.woff') format('woff'), url('../fonts/MaterialIcons-Regular.ttf') format('truetype'), url('../fonts/MaterialIcons-Regular.svg?v=4.1.0#materialiconsregular') format('svg');font-weight:normal;font-style:normal}
.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
}

html,
body {
  font-size: 14px;
}
body {
  /*font-family: 'Montserrat';*/
  margin: 2em;
  padding: 0px;
  color: #fff;
  text-rendering: optimizeLegibility;
  font-weight: 300;
  text-transform: lowercase;
  /*background-color: #33527B;*/
}
a.backto {
  position: absolute;
  top: 1em;
  right: 1em;
  cursor: pointer;
  color: #FFFFFF;
  text-decoration: none;
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  -o-transition: all .35s ease;
  transition: all .35s ease;
  outline: none;
  background-color: #1F324B;
  border-radius: .35em;
  padding-top: 0.5em;
  padding-right: 1em;
  padding-bottom: .5em;
  padding-left: 1em;
}
a.backto:hover {
  color: #FFFFFF;
  -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -o-transition: all .35s ease;
  transition: all .55s ease;
  outline: none;
  background-color: #294263;
  text-decoration: none
}
.logo {
  position: absolute;
  top: 1em;
  left: 1em;
}
header p {
  /*font-family: 'Montserrat';*/
  font-size: 2em;
  margin-top: 0.5em;
  margin-right: 0em;
  margin-bottom: 0.5em;
  margin-left: 0em;
  text-align: center;
  font-weight:300;
}
.container {
  /*margin-top: 150px;*/
  margin-right: auto;
  margin-left: auto;
  max-width: 385px
}
#container {
  /*margin-top: 150px;*/
  margin-right: auto;
  margin-left: auto;
  max-width: 350px
}
.body {
  /*background-color: #fff;*/
  border-radius: .35em;
  /*box-shadow: 0 0 0 .35em #294263;*/
  overflow:hidden;
}
.row {
  padding: .5em;
}
input[name=username],
input[name=password] {
 /* font-family: 'Montserrat';*/
  font-weight: 400;
  font-size: 16px;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  border-radius: 20px;
  text-align:center;
  width: 100%;
  display: block;
  padding-top: .5em;
  padding-bottom: .5em;
  /*background-color: #FFF;*/
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(255,255,255,0);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  outline: none
}
input[type=text] {
  /*font-family: 'Montserrat';*/
  font-weight: 400;
  font-size: 16px;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 2px;
  border-left-width: 0px;
  border-radius: 10px;
  width: 100%;
  display: block;
  padding-top: .5em;
  padding-bottom: .5em;
  /*background-color: #FFF;*/
  -webkit-appearance: none;
  -webkit-tap-highlight-color: rgba(255,255,255,0);
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  outline: none;
  text-transform:lowercase;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px white inset;
}
input[type=button],button {
 /* font-family: 'Montserrat';*/
  font-weight: 400;
  font-size: 16px;
  display: block;
  width: 100%;
  /*background-color: #294263;*/
  padding: 0.5em;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  /*color: #FFF;*/
  text-align: center;
  border-radius: 20px;
  margin-top: 1em;
  cursor: pointer;
  outline: none;
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  -o-transition: all .35s ease;
  transition: all .35s ease;
  text-transform:lowercase;
}
button:hover {
  /*background-color: #1F324B;*/
  -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -o-transition: all .35s ease;
  transition: all .55s ease;
  outline: none;
}
a.button {
 /* font-family: 'Montserrat';*/
  font-weight: 400;
  font-size: 16px;
  display: block;
  width: 100%;
  /*background-color: #294263;*/
  padding: 0.5em;
  border-top-width: 0px;
  border-right-width: 0px;
  border-bottom-width: 0px;
  border-left-width: 0px;
  color: #FFF;
  text-align: center;
  border-radius: .35em;
  margin-top: 1em;
  cursor: pointer;
  outline: none;
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  -o-transition: all .35s ease;
  transition: all .35s ease;
}
a.button:hover {
  /*background-color: #1F324B;*/
  -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -o-transition: all .35s ease;
  transition: all .55s ease;
  outline: none;
}
.divider {
  height: 1px;
  background-color: #eee;
}
#message-box {
  margin: 0 auto;
  max-width: 400px;
  margin-top: 1em;
}
.wojo.message,
.wojo.message,
.cledit.message {
  position: relative;
  min-height: 18px;
  margin: 1em 0em;
  height: auto;
  padding: 1em;
  line-height: 1.33;
  -webkit-transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease;
  transition: opacity 0.1s ease, color 0.1s ease, background 0.1s ease, box-shadow 0.1s ease;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  border-radius: 0.325em 0.325em 0.325em 0.325em;
  box-shadow: 0em -0.2rem 0em rgba(0, 0, 0, 0.1) inset;
  /*background-color: #882722;
  color: #FFFFFF;*/
}
.wojo.success.message, 
.cledit.success.message {
  background-color: #51A351;
  color: #FFFFFF;
}
.wojo.message .header,
.cledit.message .header {
  margin: 0em;
  font-size: 1.2em;
 /* font-family: 'Montserrat';*/
  font-weight: 400;
}
.wojo.message ul.list,
.cledit.message ul.list {
  opacity: 0.85;
  list-style-position: inside;
  margin: 0.2em 0em;
  padding: 0em;
}
.wojo.message ul.list li,
.cledit.message ul.list li {
  position: relative;
  list-style-type: none;
  margin: 0em 0em 0.3em 1em;
  padding: 0em;
}

.wojo.loading:after {
    position: absolute;
    top: 0;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4) url(../images/load_fancy.gif) no-repeat 50% 50%;
    visibility: visible;
    z-index: 5000
}
.cledit.round{
    margin-right: 0em;
    display: inline-block;
    width: 3em;
    height: 3em;
    border-radius: 500rem;
	cursor:pointer;
}
.cledit1.round{
    margin: 0.25rem;
    display: inline-block;
    width: 1.25em;
    height: 1.25em;
    border-radius: 500rem;
	cursor:pointer;
}
.wojo.avatar.image {
    margin-right: 0em;
    display: inline-block;
    border-radius: 50%;
	cursor:pointer;
	behavior:url('https://dev.imgcanvas.com/assets/IEPIE/PIE.htc');
}
.cleditor {
    margin-right: 0em;
    display: inline-block;
    border-radius: 50%;
	cursor:pointer;
}
.cledit.round{
    margin-right: 0em;
    display: inline-block;
    width: 3em;
    height: 3em;
	padding:2px;
    border-radius: 500rem;
	cursor:pointer;
}
.size8 {
    
    width: 8em;
    height: 8em;
	padding:10px;
    
}

.size4{
    
    width: 6em;
    height: 6em;
	padding:10px;
    
}