﻿body {
    background-color: #f8f8f8;
    /*font-family: Open Sans Condensed;*/
    font-family: "Trebuchet MS", Helvetica, sans-serif;
}

.page-header {
    margin: 10px 0 10px;
    color: #89bdd3;
}

.clientAlert{
     margin: 10px 0 0;
}

#wrapper {
    width: 100%;
}

#page-wrapper {
    padding: 0 15px;
    min-height: 568px;
    background-color: #fff;
}

@media(min-width:768px) {
    #page-wrapper {
        position: inherit;
        margin: 0 0 0 250px;
        padding: 0 30px;
        border-left: 1px solid #e7e7e7;
    }
}

@media (max-width:768px){
    .accionMenu{
        display:none;
    }
}
@media (max-width: 992px) {
    .col-md-margin-bottom {
        margin-bottom: 10px;
    }
}

.navbar-top-links {
    margin-right: 0;
}

.navbar-top-links li {
    display: inline-block;
}

.navbar-top-links li:last-child {
    margin-right: 15px;
}

.navbar-top-links li a {
    padding: 15px;
    min-height: 50px;
}

.navbar-top-links .dropdown-menu li {
    display: block;
}

.navbar-top-links .dropdown-menu li:last-child {
    margin-right: 0;
}

.navbar-top-links .dropdown-menu li a {
    padding: 3px 20px;
    min-height: 0;
}

.navbar-top-links .dropdown-menu li a div {
    white-space: normal;
}

.navbar-top-links .dropdown-messages,
.navbar-top-links .dropdown-tasks,
.navbar-top-links .dropdown-alerts {
    width: 310px;
    min-width: 0;
}

.navbar-top-links .dropdown-messages {
    margin-left: 5px;
}

.navbar-top-links .dropdown-tasks {
    margin-left: -59px;
}

.navbar-top-links .dropdown-alerts {
    margin-left: -123px;
}

.navbar-top-links .dropdown-user {
    right: 0;
    left: auto;
}

.sidebar .sidebar-nav.navbar-collapse {
    padding-right: 0;
    padding-left: 0;
}

.sidebar .sidebar-search {
    padding: 15px;
}

.sidebar ul li {
    border-bottom: 1px solid #e7e7e7;
}

.sidebar ul li a.active {
    background-color: #eee;
}

.sidebar .arrow {
    float: right;
}

.sidebar .fa.arrow:before {
    content: "\f104";
}

.sidebar .active>a>.fa.arrow:before {
    content: "\f107";
}

.sidebar .nav-second-level li,
.sidebar .nav-third-level li {
    border-bottom: 0!important;
}

.sidebar .nav-second-level li a {
    padding-left: 37px;
}

.sidebar .nav-third-level li a {
    padding-left: 52px;
}

@media(min-width:768px) {
    .sidebar {
        z-index: 1;
        position: absolute;
        width: 250px;
        margin-top: 51px;
    }

    .navbar-top-links .dropdown-messages,
    .navbar-top-links .dropdown-tasks,
    .navbar-top-links .dropdown-alerts {
        margin-left: auto;
    }
}

.btn-outline {
    color: inherit;
    background-color: transparent;
    transition: all .5s;
}

.btn-primary.btn-outline {
    color: #428bca;
}

.btn-success.btn-outline {
    color: #5cb85c;
}

.btn-info.btn-outline {
    color: #5bc0de;
}

.btn-warning.btn-outline {
    color: #f0ad4e;
}

.btn-danger.btn-outline {
    color: #d9534f;
}

.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
    color: #fff;
}

.chat {
    margin: 0;
    padding: 0;
    list-style: none;
}

.chat li {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px dotted #999;
}

.chat li.left .chat-body {
    margin-left: 60px;
}

.chat li.right .chat-body {
    margin-right: 60px;
}

.chat li .chat-body p {
    margin: 0;
}

.panel .slidedown .glyphicon,
.chat .glyphicon {
    margin-right: 5px;
}

.panel-small {
    margin-bottom: 10px;
}

.panel-borderless {
    border: 0;
    -webkit-box-shadow: 0 0 0;
    box-shadow: 0 0 0;
    border-radius: 0;
}

.panel-small .panel-heading {
    padding: 5px 10px;
}

.panel-small .panel-body {
    padding-bottom: 2px;
}

.chat-panel .panel-body {
    height: 350px;
    overflow-y: scroll;
}

.login-panel {
    margin-top: 10%;
}

.flot-chart {
    display: block;
    height: 400px;
}

.flot-chart-content {
    width: 100%;
    height: 100%;
}

.dataTables_wrapper {
    position: relative;
    clear: both;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background: 0 0;
}

table.dataTable thead .sorting_asc:after {
    content: "\f0de";
    float: right;
    font-family: fontawesome;
}

table.dataTable thead .sorting_desc:after {
    content: "\f0dd";
    float: right;
    font-family: fontawesome;
}

table.dataTable thead .sorting:after {
    content: "\f0dc";
    float: right;
    font-family: fontawesome;
    color: rgba(50,50,50,.5);
}

.btn-circle {
    width: 30px;
    height: 30px;
    padding: 6px 0;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.428571429;
}

.btn-circle.btn-lg {
    width: 50px;
    height: 50px;
    padding: 10px 16px;
    border-radius: 25px;
    font-size: 18px;
    line-height: 1.33;
}

.btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 10px 16px;
    border-radius: 35px;
    font-size: 24px;
    line-height: 1.33;
}

.show-grid [class^=col-] {
    padding-top: 10px;
    padding-bottom: 10px;
    border: 1px solid #ddd;
    background-color: #eee!important;
}

.show-grid {
    margin: 15px 0;
}

.huge {
    font-size: 40px;
}

.panel-green {
    border-color: #5cb85c;
}

.panel-green .panel-heading {
    border-color: #5cb85c;
    color: #fff;
    background-color: #5cb85c;
}

.panel-green a {
    color: #5cb85c;
}

.panel-green a:hover {
    color: #3d8b3d;
}

.panel-red {
    border-color: #d9534f;
}

.panel-red .panel-heading {
    border-color: #d9534f;
    color: #fff;
    background-color: #d9534f;
}

.panel-red a {
    color: #d9534f;
}

.panel-red a:hover {
    color: #b52b27;
}

.panel-yellow {
    border-color: #f0ad4e;
}

.panel-yellow .panel-heading {
    border-color: #f0ad4e;
    color: #fff;
    background-color: #f0ad4e;
}

.panel-yellow a {
    color: #f0ad4e;
}

.panel-yellow a:hover {
    color: #df8a13;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #a94442;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #a94442;
    background-color: #FFEFEE;
}

.validation-summary-errors {
    font-weight: bold;
    color: #a94442;
}

.validation-summary-valid {
    display: none;
}
.span-validation-error {
    display: inline-block;
    color: #a94442;
}


.CargandoInfo {
     flex : 1 ;
}

.mensageCargando {    
    padding: 10px 0 0 50px;
}

.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

.glyphicon-cog-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 3s infinite linear;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}


.btn-file {
    position: relative;
    overflow: hidden;
}
.btn-file input[type=file] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}

.box-shadow {
    box-shadow: 0 1px 5px 0 #ddd;
}

.postroll-button:hover {
    border: 1px solid #ccc;
     cursor: pointer;
}

.postroll-button-square:hover {
    border: 1px solid #ccc;
    cursor: pointer;
    color: black;
}
.postroll-button-square-small:hover {
    border: 1px solid #ccc;
    cursor: pointer;
    color: black;
}

.flex .flex-item {
    width: 400px;
    padding: 20px;
}
.flex-item {
    position: relative;
}

.postroll-button {
     display: block;
    width: 100%;
    height: 100px;
    line-height: 40px;
    background: #fff;
    padding: 20px;
    margin: 0 10px 20px 10px;
    color: #494747;
    text-align: center;
    border: 1px solid transparent;
    -webkit-transition: 200ms;
    transition: 200ms;
}
.postroll-button-square {
    display: block;
    width: 70px;
    height: 50px;
    background: #fff;
    padding: 15px;
    color: gray;
    text-align: center;
    border: 1px solid transparent;
    -webkit-transition: 200ms;
    transition: 200ms;
}
.postroll-button-square-small {
    display: block;
    width: 40px;
    height: 30px;
    background: #fff;
    padding: 8px;
    color: darkgray;
    text-align: center;
    border: 1px solid transparent;
    -webkit-transition: 200ms;
    transition: 200ms;
    border-radius:2px;
}

div.header {
    padding: 10px;
}

.postroll-button  a
{
    text-decoration:none !important;
}

.revisionCerrada {
    background-color :  #999;
    color: #e7e7e7;
}

.modal {
    position: absolute !important;
}
.modal-xxl {
    width: 95%;
}
.modal-sm2 {
    width: 450px;
}
.modal-mlg {
    width: 800px;
}

.logo-brand {
    background: url(./images/logo.png) no-repeat top left;
     display: block;
     width: 150px;
     margin-top: 9px;
     margin-bottom: -9px;
     text-indent: -9999px; /* hides the link text */
}

.divider {
  height: 1px;
  width:100%;
  display:block; /* for use on default inline elements like span */
  margin: 9px 0;
  overflow: hidden;
  background-color: #e5e5e5;
}

.tab-content {
    border-left: 1px solid #DDDDDD;
    border-bottom: 1px solid #DDDDDD;
    border-right: 1px solid #DDDDDD;
    margin-right: 1px;
}

/*  FONT AWESOME SIZES */
.fa-3 {
    font-size:x-large;
}

.select2-container .select2-choice {
    height:28px;
}


.grupoBarra {
    border: 1px solid #f8f8f8;
    margin-bottom: 10px;
    margin-left: 2px;
    margin-right: 2px;
    padding-top: 10px;
    font-size: 12px;
    background-color: #f8f8f8;
}

.grupoBarra .totalVal {
    font-weight: 600;
    font-size: 12px;
    color: darkblue;
}

.observacion {
    margin-left: 0px;
}


.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.col-xs-15 {
    width: 20%;
    float: left;
}
@media (min-width: 768px) {
.col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
}

.form-control-custom {
    text-align:center;
    background-color:#F8F8F8;
    display: block;
    padding: 6px 12px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #555;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 6px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.control-label{
    font-weight:normal;
}

.dropdown-colorselector {
    border: 1px solid #eee;
}

.label-info2 {
  background-color: #9b59b6;
  color:#fff;
}
.label-info2:hover,
.label-info2:focus {
  background-color: #8e44ad;
  color:#fff;
}
.label-primary2 {
  background-color: #00A388;
  color:#fff;
}
.label-primary2:hover,
.label-primary2:focus {
  background-color: #007D68;
  color:#fff;
}

.label-warning2 {
  background-color: #ccab00;
  border-color: #ccab00;
  color:#fff;
}
.label-warning2:hover,
.label-warning2:focus,
.label-warning2:active,
.label-warning2.active {
  background-color: #b39600;
  border-color: #998000;
  color:#fff;
}

.btn-no-cursor {
    cursor: default;
}

.requestedOutTime {
    background-color:#F8E0E6;
}

.fobProtoActualizado {
    background-color: #CEF6CE !important;
}

.claseTotales {
    background-color: #f8f8f8 !important;
}

.margin-xxs {
    margin-top: 10px;
}
.margin-xs {
    margin-top: 20px;
}
.margin-sm {
    margin-top: 30px;
}
.margin-md {
    margin-top: 50px;
}
.margin-lg {
    margin-top: 100px;
}
.margin-xl {
    margin-top: 150px;
}
.margin-xxl {
    margin-top: 200px;
}

.bootstrap-switch {
  margin-bottom: 2px;
}

.bootstrap-switch.bootstrap-switch-xmini .bootstrap-switch-handle-on,
.bootstrap-switch.bootstrap-switch-xmini .bootstrap-switch-handle-off,
.bootstrap-switch.bootstrap-switch-xmini .bootstrap-switch-label {
  padding: 1px 5px;
  font-size: 10px;
  line-height: 1.3;
}

#previousimageLayoutPopup:hover {
    opacity: 0.9 !important;
}
#nextimageLayoutPopup:hover {
    opacity: 0.9 !important;
}

.alineaGrid {
    text-align:right;
}


/*Agregado por: Oscar Torres
Historial de comentarios
*/
.sub-table-header {
    margin-top: 0em;
    margin-bottom: 0em;
    border-top: 0px;
    font-size:13px;
}

.table-separator{
    height: 20px;
}

/*Progress Circle */
.prog-circle .slice {
  position : absolute;
  width    : 1em;
  height   : 1em;
  clip     : rect(0em, 1em, 1em, 0.5em);
}
.prog-circle .slice.clipauto {
  clip : rect(auto, auto, auto, auto);
}
.prog-circle .fill, .prog-circle .bar {
  position              : absolute;
  border                : 0.08em solid #90c844;
  width                 : 0.84em;
  height                : 0.84em;
  clip                  : rect(0em, .5em, 1em, 0em);
  -webkit-border-radius : 50%;
  -moz-border-radius    : 50%;
  -ms-border-radius     : 50%;
  -o-border-radius      : 50%;
  border-radius         : 50%;
  -webkit-transform     : rotate(20deg);
  -moz-transform        : rotate(20deg);
  -ms-transform         : rotate(20deg);
  -o-transform          : rotate(20deg);
  transform             : rotate(20deg);
}
.prog-circle {
  position              : relative;
  font-size             : 120px;
  width                 : 1em;
  height                : 1em;
  -webkit-border-radius : 50%;
  -moz-border-radius    : 50%;
  -ms-border-radius     : 50%;
  -o-border-radius      : 50%;
  border-radius         : 50%;
  float                 : left;
  margin                : 0 0.1em 0.1em 0;
  background-color      : #BDBDBD;
}
.prog-circle .percenttext {
  position                           : absolute;
  width                              : 100%;
  height                             : 1em;
  z-index                            : 1;
  margin                             : auto;
  top                                : 0;
  left                               : 0;
  right                              : 0;
  bottom                             : 0;
  font-size                          : 0.3em;
  color                              : #424242;
  display                            : block;
  text-align                         : center;
  white-space                        : nowrap;
  line-height                        : 100%;
  -webkit-transition-duration        : 0.2s;
  -moz-transition-duration           : 0.2s;
  -o-transition-duration             : 0.2s;
  transition-duration                : 0.2s;
  -webkit-transition-timing-function : ease-out;
  -moz-transition-timing-function    : ease-out;
  -o-transition-timing-function      : ease-out;
  transition-timing-function         : ease-out;
}
.prog-circle .after {
  position              : absolute;
  top                   : 0.08em;
  left                  : 0.08em;
  display               : block;
  content               : " ";
  -webkit-border-radius : 50%;
  -moz-border-radius    : 50%;
  -ms-border-radius     : 50%;
  -o-border-radius      : 50%;
  border-radius         : 50%;
  background-color      : #FFFFFF;
  width                 : 0.84em;
  height                : 0.84em;
}
.end .fill,.end .bar {
  border-color:#000;
  transition:border-color 5s linear;
}
.end .percenttext {
  color:#000;
  transition:color 5s linear;
}
.end.complate .fill,.end.complate .bar {
  border-color:#ccc;
  transition:border-color 1.5s linear;
}
.end.complate .percenttext {
  color:#ccc;
  transition:color 1.5s linear;
}
#fakhar-cricle .circle * {
    -webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
	
}
#cricle-btn:after {
	display:block;
	text-align:center;
	content:attr(data-size) ' records' ;
}

.customFont {
  font-size: 0.8em;
}

.ocultaColumna {
    display:none;
}

/*.bootstrap-datetimepicker-widget{    
   font-size:12px;
   position:sticky;
   z-index:9999 !important;
}*/

/*.clsCard {
   position:relative;  
   z-index:9999 !important;
}*/