/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 11-27-2017, 07:59:27 AM
    Author     : dcastro
*/

.icon-box2 {
    display: table;
    margin-bottom: 20px;
    width:90%
}

.icon-box2 h3 {
    margin: 0 0 10px 0
}

.icon-box2 i.icon {
    display: table-cell;
    font-size: 3em;
    vertical-align: middle;
    background-color: #d9f7ff;
    border-left: solid 4px #00708c;
    padding: 10px 20px;
    color: #00708c
}

.icon-box2 .icon-box2-content {
    display: table-cell;
    padding: 10px;
    background-color: #edfbff;
    width:90%
}

.icon-box2.icon-box2-success .icon-box2-content {
    background-color: #efffef;
    width:90%
}

.icon-box2.icon-box2-success i.icon {
    background-color: #dbffdb;
    border-left: solid 4px #005b00;
    color: #005b00
}

.icon-box2.icon-box2-info .icon-box2-content {
    background-color: #fbf0ff;
    width:90%
}

.icon-box2.icon-box2-info i.icon {
    background-color: #f8e1ff;
    border-left: solid 4px #8300ae;
    color: #8300ae
}

.icon-box2.icon-box2-warning .icon-box2-content {
    background-color: #fff7ea;
    width:90%
}

.icon-box2.icon-box2-warning i.icon {
    background-color: #fff3e0;
    border-left: solid 4px #f89e01;
    color: #f89e01
}

.icon-box2.icon-box2-danger .icon-box2-content {
    background-color: #fff2f2;
    width:90%
}

.icon-box2.icon-box2-danger i.icon {
    background-color: #ffd9d9;
    border-left: solid 4px #bf0000;
    color: #bf0000
}

.icon-box2.icon-box2-inverse .icon-box2-content {
    background-color: #00708c;
    color: #fff;
    width:90%
}

.icon-box2.icon-box2-inverse i.icon {
    background-color: #004759;
    border-left: solid 4px #001e26;
    color: #fff
}

.icon-box2.icon-box2-inverse h1,
.icon-box2.icon-box2-inverse h2,
.icon-box2.icon-box2-inverse h3,
.icon-box2.icon-box2-inverse h4,
.icon-box2.icon-box2-inverse h5,
.icon-box2.icon-box2-inverse h6 {
    color: #fff
}

.icon-box2.icon-box2-info h1,
.icon-box2.icon-box2-info h2,
.icon-box2.icon-box2-info h3,
.icon-box2.icon-box2-info h4,
.icon-box2.icon-box2-info h5,
.icon-box2.icon-box2-info h6 {
    color: #8300ae
}

.icon-box2.icon-box2-success h1,
.icon-box2.icon-box2-success h2,
.icon-box2.icon-box2-success h3,
.icon-box2.icon-box2-success h4,
.icon-box2.icon-box2-success h5,
.icon-box2.icon-box2-success h6 {
    color: #005b00
}

.icon-box2.icon-box2-warning h1,
.icon-box2.icon-box2-warning h2,
.icon-box2.icon-box2-warning h3,
.icon-box2.icon-box2-warning h4,
.icon-box2.icon-box2-warning h5,
.icon-box2.icon-box2-warning h6 {
    color: #f89e01
}

.icon-box2.icon-box2-danger h1,
.icon-box2.icon-box2-danger h2,
.icon-box2.icon-box2-danger h3,
.icon-box2.icon-box2-danger h4,
.icon-box2.icon-box2-danger h5,
.icon-box2.icon-box2-danger h6 {
    color: #bf0000
}



.box {
  display: block;
  /*z-index: 1999*/
  position: relative;
  border: 1px solid #f8f8f8;
  box-shadow: 0 0 4px #D8D8D8;
  background: transparent;
  margin-bottom: 20px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.full-content .box {
  border: 0;
  margin-bottom: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.box-header {
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
  color: #363636;
  font-size: 16px;
  position:relative;
  overflow: hidden;
  background: #f5f5f5;
  border-bottom: 1px solid #E4E4E4;
  height: 28px;
}
.box-name, .modal-header-name {
  padding-left: 15px;
  line-height: 28px;
}
.box-name:hover {
  cursor: move;
}
.box-name > i {
  margin-right:5px;
}
.box-icons {
  position: absolute;
  top:0;
  right:0;
  z-index: 9;
}
.no-move {
  display: none;
}
.expanded .no-move {
  position: absolute;
  top:0;
  left: 0;
  width:100%;
  height: 100%;
  z-index: 1;
  display: block;
}
.box-content {
  position: relative;
  -webkit-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px;
  padding: 15px;
  background: #FCFCFC;
}
.box-content.dropbox, .box-content.sortablebox {
  overflow: hidden;
}
.full-content .box-content {
  height: 100%;
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.box-icons a {
  cursor: pointer;
  text-decoration: none !important;
  border-left: 1px solid #fafafa;
  height: 26px;
  line-height: 26px;
  width: 28px;
  display: block;
  float: left;
  text-align: center;
  color: #b8b8b8 !important;
  -webkit-transition: 0.2s;
  -moz-transition: 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}
.box-icons a.beauty-table-to-json {
  width: auto;
  padding: 0 10px;
  font-size: 14px;
}
.box-icons a:hover {
  box-shadow:inset 0 0 1px 0 #CECECE;
}

  .avatar {
    margin: 0;
  }
  .avatar {
  width: 40px;
  float: left;
  margin-right: 5px;
}