/* ---- my style ---- */
.button-login{
  background: #3CB371;
  color: white; 
  border-radius: 10px 10px 0px 0px; 
  padding: 6px; 
  font-size: 15px
}

.button-login:hover{
  background: #C0C0C0;
  color: white; 
  border-radius: 10px 10px 0px 0px; 
  padding: 6px; 
  font-size: 15px
}

/* ---- reset ---- */ 
body{ 
  /*margin:0; font:normal 75% Arial, Helvetica, sans-serif; */
} 
canvas{ 
  display: block; vertical-align: bottom;
} 

/* ---- particles.js container ---- */
#particles-js{ 
  position:fixed; 
  width: 100%; 
  height: 100%; 
  background-color: #3CB371; 
  background-image: url(""); 
  background-repeat: no-repeat; 
  background-size: cover; 
  background-position: 50% 50%; 
} 
/* ---- stats.js ---- */ 
.count-particles{ 
  background: #000022; 
  position: absolute; 
  top: 48px; 
  left: 0;
  width: 80px; 
  color: #13E8E9; 
  font-size: .8em; 
  text-align: left; 
  text-indent: 4px; 
  line-height: 14px; 
  padding-bottom: 2px; 
  font-family: Helvetica, Arial, sans-serif; font-weight: bold; 
} 
.js-count-particles{ 
  font-size: 1.1em; 
} 
#stats, .count-particles{ 
  -webkit-user-select: none; 
  margin-top: 5px; 
  margin-left: 5px; 
} 
#stats{ 
  border-radius: 3px 3px 0 0; 
  overflow: hidden; 
} 
.count-particles{
  border-radius: 0 0 3px 3px; 
}

#drop-area{
 margin-top:20px;
 margin-left:220px;
 width:550px;
 height:200px;
 background-color:white;
 border:3px dashed grey;
}
.drop-text{
 margin-top:70px;
 color:grey;
 font-size:25px;
 font-weight:bold;
}
#drop-area img{
 max-width:200px;
}

.link-icons{
  color: #227f8e;
}

/*------------------ NewStyles ---------------------*/

#login{
  background: #ffffff;
  width: 250px;
  margin: 0 auto;
  position: relative;
  top: 110px;
  border: 1px solid #f1f1f1;
  padding: 15px;
  margin-bottom: 40px;
}
#login-cadastro{
  background: #ffffff;
  width: 250px;
  height: 100%;
  margin: 0 auto;
  position: relative;
  top: 110px;
  border: 1px solid #f1f1f1;
  padding: 15px;
}
.logo{
  background: #ffffff;
  width: 200px;
  height: 200px;
  margin: 0 auto;
  padding: 7px;
  position: relative;
  top: 5px;
  text-align: center;
}
.flash{
  width: 100%;
  height:40px;
  background: #C00;
  /*opacity: 0.5;*/
  text-align: center;
  line-height: 40px;
  font: 400 18px Oswald;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
}
.welcome{
  width: 100%;
}
#cadastrar{
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 15px;
  -webkit-border-bottom-left-radius: 8px;
  -webkit-border-bottom-right-radius: 15px;
  -moz-border-radius-bottomleft:8px;
  -moz-border-radius-bottomright:15px;
  height: 40px;
  width: 120px;
  background: #f1f1f1;
  text-align: center;
  line-height: 40px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}
.message{
  width:100%;
  height: auto;
  padding:3px;
  color:#666;
  background:#f1f1f1;
  margin:0 auto;
  text-align: center; 
}
#cadastrar a{
  padding-top: 5px;
  display: block;
  color:#999;
  font: 400 18px Oswald;

}
#cadastrar:hover{
  background: #1a0a60;
  color: #fff;
}
#cadastrar:hover a{
  color: #fff;
}
.form label{
  display: block;
  padding-top: 5px;
}
.acomodar{
  background: #ffffff;
  margin: 0 0;
  width: 250px;
}
.txt{
  border: none;
  height: 40px;
  width: 250px;
  border: thin solid #f1f1f1;
}
.txt:focus{
  border: thin solid #00b7f1;
  box-shadow: 0 2px 10px #00b7f1;
  -webkit-box-shadow:0 2px 16px #00b7f1;
  -moz-box-shadow:0 2px 16px #00b7f1;
}
.sb{
  display: block;
  border: none;
  width: 250px;
  height: 40px;
  margin-top: 10px;
  cursor: pointer;
  font: 400 18px Oswald;
  color: #999;
}
.sb:hover{
  background: #1a0a60;
  color: #fff;
}

/* Classes de herança */
.bradius{
  border-radius:6px;
  -webkit-border-radius:6px;
  -moz-border-radius:6px;
}
.fleft{
  float: left;
}
.fright{
  float: right;
}
/* Múltiplos Estilos */
.txt,.txt:focus,.sb,.sb:hover,#cadastrar:hover,#cadastrar{
  transition: all 0.5s linear;
  -webkit-transition: all 0.5s linear;
  -moz-transition: all 0.5s linear;
}

.wysi-html ul, .wysi-html li{
  margin-left: 10px;
}

div.note-editable.card-block > ul > li{
  margin: 20px;
}

div.note-editing-area > div.note-editable.card-block > ol > li{
  margin: 20px;
}


@media (max-width: 767px) {
  .welcome{
    width: 67%;
  }
  .flash {
      width: 100%;
      height: 60px;
      background: #C00;
      /*opacity: 0.5;*/
      text-align: center;
      line-height: 40px;
      font: 400 18px Oswald;
      color: #fff;
      position: absolute;
      top: 0;
      left: 0;
      z-index: 999;
  }
}