/*--------------------------------------------------------------
# Login
--------------------------------------------------------------*/
* {
  margin: 0;
  padding: 0;
}

.login {
  padding-bottom: 20px;
}

.login .icon-box {
  padding: 30px;
  position: relative;
  overflow: hidden;
  margin: 0 0 40px 0;
  background: #fff;
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  transition: all 0.3s ease-in-out;
  text-align: center;
  border: 1px solid #fff;
}

.login .icon {
  margin: 0 auto 20px auto;
  padding-top: 5px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.login .icon i {
  font-size: 66px;
  /* line-height: ; */
}

.login .icon-box-pink .icon {
  background: #e1eeff;
}

.login .icon-box-pink .icon i {
  color: #2282ff;
}

.login .icon-box-pink:hover {
  border-color: #2282ff;
}

.btn1 {
  background-color: #2282ff;
  width: 100px;
  margin-top: 30px;
  color: white;
  position: relative;
  border-radius: 5px;
}

.fgroup {
  margin-top: 15px;
}

/*--------------------------------------------------------------
# Supplier Data
--------------------------------------------------------------*/
.supplier {
  padding-bottom: 30px;
}

.supplier .row {
  width: 100%;
}

.supplier .supplier-info-form {
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 30px;
  margin-bottom: 30px;
  width: 100%;
  position: relative;
}

.supplier .supplier-info-form input {
  padding: 20px 15px;
}

.supplier .icon-box {
  padding: 30px;
  position: relative;
  /* overflow: hidden; */
  margin-bottom: 30px;
  background: rgb(255, 255, 255);
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  /* transition: all 0.3s ease-in-out; */
  text-align: center;
  border: 1px solid #fff;
}

.supplier .icon {
  margin: 0 auto 20px auto;
  padding-top: 17px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.supplier .icon i {
  font-size: 36px;
  line-height: 1;
}

.supplier .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.supplier .title a {
  color: #111;
}

.supplier .icon-box-pink .icon {
  background: #fceef3;
}

.supplier .icon-box-pink .icon i {
  color: #ff689b;
}

.supplier .icon-box-pink:hover {
  border-color: #ff689b;
}

.supplier .flex-container {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 100%;
}

.supplier .flex-row {
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
}

.supplier .form-group label {
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 0px;
}

.supplier label {
  font-size: 18px;
  margin-bottom: 30px;
  font-weight: bold;
}

.supplier .down {
  color: #444;
  text-align: center;
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 10px 10px 10px 10px;
}

.supplier .up {
  color: #444;
  text-align: center;
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 10px 10px 10px 10px;
}

.supplier .textIcon {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.supplier .down i {
  font-size: 32px;
  color: #41cf2e;
  border-radius: 50%;
  padding: 8px;
}

.supplier .down:hover {
  border-color: #41cf2e;
}

.supplier .up i {
  font-size: 32px;
  color: #2282ff;
  border-radius: 50%;
  padding: 8px;
}

.supplier .up:hover {
  border-color: #2282ff;
}

.supplier .icon-info {
  display: inline-block;
}

/*--------------------------------------------------------------
# Evaluations
--------------------------------------------------------------*/
.evaluations {
  padding-bottom: 30px;
}

.evaluations .evaluations-info-form {
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 30px;
  margin-bottom: 30px;
  width: 100%;
}

.evaluations .evaluations-info-form input {
  padding: 20px 15px;
}

.evaluations .icon-box {
  padding: 30px;
  margin-bottom: 30px;
  position: relative;
  background: rgb(255, 255, 255);
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  text-align: center;
  border: 1px solid #fff;
}

.evaluations .icon {
  margin: 0 auto 20px auto;
  padding-top: 17px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.evaluations .icon i {
  font-size: 36px;
  line-height: 1;
}

.evaluations .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.evaluations .title a {
  color: #111;
}

.evaluations .icon-box-cyan .icon {
  background: #e6fdfc;
}

.evaluations .icon-box-cyan .icon i {
  color: #3fcdc7;
}

.evaluations .icon-box-cyan:hover {
  border-color: #3fcdc7;
}

.evaluations .card-deck .card {
  width: 250px;
  min-height: 250px;
  border-radius: 0px;
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
}

.evaluations .card-deck i {
  font-size: 100px;
  margin-top: 10px;
}

.evaluations .card-deck a i {
  font-size: 14px;
}

.evaluations .card-deck .card-footer i {
  font-size: 16px;
  margin-top: 10px;
}

.evaluations .card-deck .card-footer {
  opacity: 1;
  background-color: rgb(0, 0, 0, 0.6);
  height: 20%;
}

.evaluations .card-deck .card-footer label {
  color: #ffffff;
  font-weight: bold;
}

.evaluations .card-deck a {
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

/*--------------------------------------------------------------
# New Projects
--------------------------------------------------------------*/
.new-project {
  padding-bottom: 30px;
}

.new-project .new-info-form {
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 30px;
  margin-bottom: 30px;
  width: 100%;
  /* position: relative; */
}

.new-project .new-info-form input {
  padding: 20px 15px;
}

.new-project .icon-box {
  padding: 30px;
  /* margin-right: 30px; */
  margin-bottom: 15px;
  ;
  position: relative;
  background: rgb(255, 255, 255);
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  text-align: center;
  border: 1px solid #fff;
}

.new-project .icon {
  margin: 0 auto 20px auto;
  padding-top: 17px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.new-project .icon i {
  font-size: 36px;
  line-height: 1;
}

.new-project .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.new-project .title a {
  color: #111;
}

.new-project .icon-box-green .icon {
  background: #eafde7;
}

.new-project .icon-box-green .icon i {
  color: #41cf2e;
}

.new-project .icon-box-green:hover {
  border-color: #41cf2e;
}

.new-project .card-deck .card {
  width: 250px;
  min-height: 250px;
  border-radius: 0px;
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
}

.new-project .card-deck .card-body .card-text i {
  font-size: 80px;
  margin-top: -10px;
}

.new-project .card-deck .card-body i {
  font-size: 16px;
}

.new-project .card-deck .card-title label {
  font-size: 14px;
  font-weight: bold;
}

.new-project .card-deck a {
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.new-project .card-deck .card-footer {
  opacity: 1;
  background-color: rgb(0, 0, 0, 0.6);
  height: 20%;
}

/* .new-project .card-deck .card-footer label{
  color: #ffffff;
  font-size: 10px;
  font-weight: bold;
} */

/*--------------------------------------------------------------
# Documents
--------------------------------------------------------------*/
.documents {
  padding-bottom: 30px;
}

.documents .documents-info-form {
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 30px;
  margin-bottom: 30px;
  width: 100%;
}

.documents .documents-info-form input {
  padding: 20px 15px;
}

.documents .icon-box {
  padding: 30px;
  margin-bottom: 30px;
  position: relative;
  background: rgb(255, 255, 255);
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  text-align: center;
  border: 1px solid #fff;
}

.documents .icon {
  margin: 0 auto 20px auto;
  padding-top: 17px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.documents .icon i {
  font-size: 36px;
  line-height: 1;
}

.documents .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.documents .title a {
  color: #111;
}

.documents .icon-box-blue .icon {
  background: #e1eeff;
}

.documents .icon-box-blue .icon i {
  color: #2282ff;
}

.documents .icon-box-blue:hover {
  border-color: #2282ff;
}

.documents .card-deck .card {
  width: 250px;
  min-height: 250px;
  border-radius: 0px;
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
}

.documents .card-deck i {
  font-size: 90px;
  margin-top: -20px;
}

.documents .card-deck a i {
  font-size: 14px;
  margin-top: -20px;
}



.documents .card-deck .ellipsis {
  min-width: 250px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.documents .card-deck a {
  margin-bottom: 0px;
  margin-left: 0px;
  margin-right: 0px;
}

.documents .card-deck .card-footer {
  opacity: 1;
  background-color: rgb(0, 0, 0, 0.6);
  height: 20%;
}

.documents .card-deck .card-footer label {
  color: #ffffff;
  font-weight: bold;
}

.documents .card-deck .card-footer i {
  font-size: 16px;
  color: #ffffff;
}

.documents .card-deck .card-header {
  height: 30%;
  overflow: hidden;
  text-overflow: ellipsis;
  background-color: rgb(255, 255, 255);
  border-color: #ffffff;
}

/* .documents .card-deck .card-footer label{
  color: #ffffff;
  font-size: 10px;
  font-weight: bold;
} */

/*--------------------------------------------------------------
# New Project/Selected Project 
--------------------------------------------------------------*/
.project {
  padding-bottom: 30px;
}

.project .project-info-form {
  /* box-shadow: 0 0 30px rgba(214, 215, 216, 0.6); */
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 20px;
  width: 100%;
}

.project .project-info-form input {
  padding: 20px 15px;
}

.project .project-info-form ul {
  list-style-type: none
}

.project .icon-box {
  padding: 30px;
  position: relative;
  background: rgb(255, 255, 255);
  box-shadow: 0 5px 26px 0 rgba(68, 88, 144, 0.14);
  text-align: center;
  border: 1px solid #fff;
}

.project .icon {
  margin: 0 auto 20px auto;
  padding-top: 17px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  width: 72px;
  height: 72px;
}

.project .icon i {
  font-size: 36px;
  line-height: 1;
}

.project .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 18px;
}

.project .title a {
  color: #111;
}

.project .icon-box-green .icon {
  background: #eafde7;
}

.project .icon-box-green .icon i {
  color: #41cf2e;
}

.project .icon-box-green:hover {
  border-color: #41cf2e;
}

.project .icon-box-blue .icon {
  background: #e1eeff;
}

.project .icon-box-blue .icon i {
  color: #2282ff;
}

.project .icon-box-blue:hover {
  border-color: #2282ff;
}

.project .project-info-form .image {
  height: 90%;
  width: 20%;
  vertical-align: middle;
  border-radius: 0px;
  border-color: #e0e264;
  /* box-shadow: 0 5px 26px 0 rgba(144, 139, 68, 0.14); */
}

.project .image .card-footer {
  color: #000;
}

.project .card i {
  font-size: 45px;
}

.project .down i {
  font-size: 35px;
  color: #41cf2e;
  border-radius: 50%;
  /* padding: 8px; */
  /* border: 2px dotted #eafde7; */
}

.project .project-info-form .vertical-text {
  font-size: 15px;
  font-weight: bold;
  margin-right: 10px;
  height: 100px;
  text-align: center;
  writing-mode: vertical-lr;
  transform: rotate(180deg);
  vertical-align: middle;

}

.project .project-info-form .horizontal-text {
  font-size: 12px;
  font-weight: bold;
  vertical-align: middle;
}

.project .down {
  text-align: center;
  vertical-align: middle;
}

.project .up {
  text-align: center;
  vertical-align: middle;
}

.project .up i {
  font-size: 35px;
  color: #2282ff;
  border-radius: 50%;
  /* padding: 8px; */
}

.project .icon-info {
  display: inline-block;
}

.project .info i {
  font-size: 30px;
  color: rgb(211, 211, 60);
}

.popover {
  border-radius: 5px;
  justify-content: center;
  align-content: center;
  font-size: 15px;
  /* font-weight: bold; */
}


/*--------------------------------------------------------------
# Upload File
--------------------------------------------------------------*/

.example {
  padding-bottom: 30px;
}

.example .info-box {
  color: #444;
  text-align: center;
  box-shadow: 0 0 30px rgba(214, 215, 216, 0.6);
  padding: 20px 0 30px 0;
  margin-bottom: 30px;
}