﻿/* ==========================================================================
   Estilos principales en elementos de la Aplicacion
   ========================================================================== */


.content-wrapper{
    background-color:white !important;
}

/* FUENTE PARA TODO EL DOCUMENTO */
@font-face { font-family: Helvetica; src: url('../../fonts/Helvetica-CE-Regular.ttf'); } 

body {
    font-family: Helvetica, Calibri !important;
}
h1, h2, h3, h4, h5, h6 {
    font-family: Helvetica, Calibri !important;
}
p, div {
    font-family: Helvetica, Calibri !important;
}
a, button {
    font-family: Helvetica, Calibri !important;
}
blockquote, pre {
   font-family:  Helvetica, Calibri !important;
}

/* TOOLTIP BOOTSTRAP */
.tooltip {
    position: fixed; /* Permite situarlo por encima de cualquier widget */
}
/*loading personalizado para todas las pantallas*/
.k-loading-image {
    z-index:999999;
    background-image: url("../../img/BlackOrangeSpinner.gif") !important;
}

/*Div con Bordes naranjas arriba*/
.box.box-nikeOrange{
    border-top:3px solid;
    border-top-color: #FA5400;
    margin-bottom:0px;
}

/* COLORES PERSONALIZADOS EN BOTONES */
.btn-nike-orange{
    background-color: #FA5400;
    border-color: #FA5400;
    color: #fff;

}
.btn-nike-orange:hover, 
.btn-nike-orange:active,
.btn-nike-orange.active
{
    background-color: #FA5400;
    color: #333;

}

.btn-nike-fucsia{
    background-color: #d7104e;
    border-color: #d7104f;
    color: #fff !important;
}
.btn-nike-fucsia:hover,.btn-nike-fucsia:active,.btn-nike-fucsia.hover
{
    background-color: #d7104f;

}

.btn-nike-black{
    background-color: #222D32;
    border-color: #222D32;
    color: #fff !important;

}
.btn-nike-black:hover,.btn-nike-black:active,.btn-nike-black.hover
{
    background-color: #FA5400;
}




/* INPUT PLACEHOLDERS */

/* all */
::-webkit-input-placeholder { font-style:italic; color:#999; }
::-moz-placeholder { font-style:italic; color:#999; } /* firefox 19+ */
:-ms-input-placeholder { font-style:italic; color:#999; } /* ie */
input:-moz-placeholder { font-style:italic; color:#999; }
.k-multiselect-wrap > .k-input { font-style:italic; color:#999; }

/* INPUT/TEXTAREA VALIDACIONES */
input:required:invalid, input:focus:invalid {
  /*background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAeVJREFUeNqkU01oE1EQ/mazSTdRmqSxLVSJVKU9RYoHD8WfHr16kh5EFA8eSy6hXrwUPBSKZ6E9V1CU4tGf0DZWDEQrGkhprRDbCvlpavan3ezu+LLSUnADLZnHwHvzmJlvvpkhZkY7IqFNaTuAfPhhP/8Uo87SGSaDsP27hgYM/lUpy6lHdqsAtM+BPfvqKp3ufYKwcgmWCug6oKmrrG3PoaqngWjdd/922hOBs5C/jJA6x7AiUt8VYVUAVQXXShfIqCYRMZO8/N1N+B8H1sOUwivpSUSVCJ2MAjtVwBAIdv+AQkHQqbOgc+fBvorjyQENDcch16/BtkQdAlC4E6jrYHGgGU18Io3gmhzJuwub6/fQJYNi/YBpCifhbDaAPXFvCBVxXbvfbNGFeN8DkjogWAd8DljV3KRutcEAeHMN/HXZ4p9bhncJHCyhNx52R0Kv/XNuQvYBnM+CP7xddXL5KaJw0TMAF8qjnMvegeK/SLHubhpKDKIrJDlvXoMX3y9xcSMZyBQ+tpyk5hzsa2Ns7LGdfWdbL6fZvHn92d7dgROH/730YBLtiZmEdGPkFnhX4kxmjVe2xgPfCtrRd6GHRtEh9zsL8xVe+pwSzj+OtwvletZZ/wLeKD71L+ZeHHWZ/gowABkp7AwwnEjFAAAAAElFTkSuQmCC);*/
  background-position: right top;
  background-repeat: no-repeat;
  -moz-box-shadow: none;
}
input:required:valid {
  /*background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAepJREFUeNrEk79PFEEUx9/uDDd7v/AAQQnEQokmJCRGwc7/QeM/YGVxsZJQYI/EhCChICYmUJigNBSGzobQaI5SaYRw6imne0d2D/bYmZ3dGd+YQKEHYiyc5GUyb3Y+77vfeWNpreFfhvXfAWAAJtbKi7dff1rWK9vPHx3mThP2Iaipk5EzTg8Qmru38H7izmkFHAF4WH1R52654PR0Oamzj2dKxYt/Bbg1OPZuY3d9aU82VGem/5LtnJscLxWzfzRxaWNqWJP0XUadIbSzu5DuvUJpzq7sfYBKsP1GJeLB+PWpt8cCXm4+2+zLXx4guKiLXWA2Nc5ChOuacMEPv20FkT+dIawyenVi5VcAbcigWzXLeNiDRCdwId0LFm5IUMBIBgrp8wOEsFlfeCGm23/zoBZWn9a4C314A1nCoM1OAVccuGyCkPs/P+pIdVIOkG9pIh6YlyqCrwhRKD3GygK9PUBImIQQxRi4b2O+JcCLg8+e8NZiLVEygwCrWpYF0jQJziYU/ho2TUuCPTn8hHcQNuZy1/94sAMOzQHDeqaij7Cd8Dt8CatGhX3iWxgtFW/m29pnUjR7TSQcRCIAVW1FSr6KAVYdi+5Pj8yunviYHq7f72po3Y9dbi7CxzDO1+duzCXH9cEPAQYAhJELY/AqBtwAAAAASUVORK5CYII=);*/
  background-position: right top;
  background-repeat: no-repeat;
}

/*Textarea para kendo editor */
textarea {

  -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
             resize: none;
}

table.k-editor{
    height:100px !important
}
textarea:required:invalid, textarea:focus:invalid {
  border-color: red !important;
}

/* RIBBON INDICADOR DE VERSION */

.ribbon {
  background-color: #a00;
  overflow: hidden;
  white-space: nowrap;
  position: absolute;
  right: 0px;
  bottom: 30px;
  -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
       -o-transform: rotate(-45deg);
          transform: rotate(-45deg);
  -webkit-box-shadow: 0 0 10px #888;
     -moz-box-shadow: 0 0 10px #888;
          box-shadow: 0 0 10px #888;
}
.ribbon a {
  border: 1px solid #faa;
  color: #fff;
  display: block;
  font: bold 81.25% HelveticaCERegular !important;
  margin: 1px 0;
  padding: 5px 30px;
  text-align: center;
  text-decoration: none;
  text-shadow: 0 0 5px #444;
}

.ribbon:before, .ribbon:after {
  content: "";
  border-top:   3px solid #630000;   
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}
/* Para invertir colores */
.inverted {
	filter: invert(100%);
    -webkit-filter: invert(100%);
	-moz-filter:invert(100%); 
	-o-filter: invert(100%); 
}

/* ADICIONES DE COLORES DE TEXTO DE ADMIN */
.text-white{color:#FFF !important}


/* estilos personalizados de botones */

.col-padding-btn-volver-recepcion {
      padding-top: 25px;
}
.col-padding-btn-buscar {
      padding-top: 10px;
}

.input-rounded-corners {
    border-radius: 4px !important;
}

/* Ocultar y mostrar div */
.div_js_hidden {
    display: none;
}
.div_js_visible {
    display: block;
}

/*Caja negra*/
.black-nike-box{
    background-color: #222d32 !important;   
}
.border-black-nike-box {
    border: 1px solid #222d32 !important;
}
/*Quitar spinners a los input numbers**/
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/* Estilo especial para el uploader */
.csi_uploader {
     font-family: Helvetica, Calibri;
     color: white;
}
.csi_uploader .k-button {
    background-color: #FA5400;
    color: #fff; 
}
.csi_uploader .k-button:hover {
    color: #333;
    background-color: #FA5400;
}
.csi_uploader .k-upload-selected {
    background-color: #FA5400;
    color: #fff; 
}


/*estilo del layout*/
.content {
    /* padding: 15px; */
    padding-top:2px;
    padding-right: 2px;
    padding-left: 2px;
    padding-bottom:2px;
}


.csi_main_background {
    background-image: url('../../img/home-DW.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 95vh;
    width: 97vw;
    z-index: 1;
    padding: 0;
    overflow: hidden;
}

.csi_main_app{
    height:90vh;
}

.csi_jumbotron{
    background: none;
    padding-top:20px;
    padding-bottom:0px;
}


.csi_jumbotron_1{
    position: absolute;
    color: #FA5400;
    opacity: 1;
}

.csi_jumbotron_2{
    position:absolute;
    opacity: 0.2;
    background-color: #eee;
    height:200px;
    width:95vw;
}

/*
.k-list>.k-state-selected.k-state-focused,
.k-list>.k-state-selected,
.k-list.k-state-selected,
.k-state-selected,

    */

.k-list-optionlabel.k-state-selected.k-state-focused,
.k-list>.k-state-selected,
.k-popup .k-list .k-state-selected,
.k-list>.k-state-selected.k-state-focused
{
    background-color: #FA5400;
    border-color:  #FA5400;
    color: #fff;
}

.k-list>.k-state-selected:hover,
.k-popup .k-list .k-state-selected:hover,
.k-list>.k-state-selected.k-state-focused:hover
{
    color: #333;
}


.menuSpan {

width:250px !important;
}