/*
CSS CORRESPONDIENTE AL INDEX - EDICIÓN DE CSS BOOTSTRAP
*/

.outline {
	outline: 1px solid blue;
}

.outline-red {
	outline: 1px solid red;
}

.outline-green {
	outline: 1px solid green;
}

.padding-10 {
	padding:10px;
}


/* ///////// Nav - Barra del Navegador /////////  */

/*Quitar radius - Nav */
.no-radius-nav {
	border-radius: 0px;
	margin-bottom: 5px;
	
}


/* ///////// Cuadros - Módulos /////////  */

.container {
	padding-bottom:30px;
}

.logo-mp img {
	width: 200px;
	height: auto;
	margin: 20px 0px 20px 0px;
}

/*Módulos*/

/* Módulos - Estilos */
.container-modulo-overlay {
  position: relative;
  width: 100%;
  height: 135px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}



.text-modulo {
  white-space: nowrap; 
  color: white;
  font-size: 20px;
  position: absolute;
  overflow: hidden;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}


/* ------- Backgrounds - Módulos ----------- */


/* --- Módulo Archivo --- */ 

.bg-archivo {
	color: #fff;
	background-color:#3f51b5;
    border-color:#3f51b5;
}

/* Botón Archivo */

.btn-archivo {
	color: #fff;
	background-color:#3f51b5;  
    border-color:#3f51b5;
	padding: 20px;
}

.btn-archivo:focus {
  background-color: #3f51b5;
  border-color: #3f51b5;
}

.btn-archivo:hover {
  background-color: #3f51b5;
  border-color: #3f51b5;
}


/* Modulos sobre ingreso de datos */

.container-modulo-overlay-ingreso-datos {
  position: relative;
  width: 100%;
  height: 80px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


/******************Ingreso de datos****************************/

.bg-ingreso-datos {
	background-color:#0D47A1;
	color:white;
	position: relative;
  	display: inline-block;
  	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  	border-radius: 5px;
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-ingreso-datos::after {
	  content: "";
	  color:white;
	  border-radius: 5px;
	  position: absolute;
	  z-index: -1;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
	  opacity: 0;
	  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
	  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-ingreso-datos:hover {
	-webkit-transform: scale(1.10, 1.10);
    transform: scale(1.10, 1.10);
    color:white;
}

.bg-ingreso-datos:hover::after {
	opacity: 1;
	color:white;
}

.btn-ingreso-datos {
	color: white;
	background-color:#0D47A1;  
	padding: 20px;
}
.btn-ingreso-datos:hover {
	color: white;
}
/**********************************************************************/

.btn-ingreso-datos2 {
	color: white;
	background-color:#1565C0;  
    border-color:#1565C0;
	padding: 20px;
}
.btn-ingreso-datos2:hover {
	color: white;
}

.btn-ingreso-datos3 {
	color: white;
	background-color:#1976D2;  
	padding: 20px;
}

.btn-ingreso-datos3:hover {
	color: white;
}

.btn-ingreso-datos4 {
	color: white;
	background-color:#1E88E5;  
    border-color:#1E88E5;
	padding: 20px;
}
.btn-ingreso-datos4:hover {
	color: white;
}

.btn-ingreso-datos5 {
	color: #fff;
	background-color:#2196F3;  
    border-color:#2196F3;
	padding: 20px;
}
.btn-ingreso-datos5:hover {
	color: white;
}

.btn-ingreso-datos6 {
	color: #fff;
	background-color:#42A5F5;  
    border-color:#42A5F5;
	padding: 20px;
}
.btn-ingreso-datos6:hover {
	color: white;
}

.btn-ingreso-datos7 {
	color: #fff;
	background-color:#29B6F6;  
    border-color:#29B6F6;
	padding: 20px;
}
.btn-ingreso-datos7:hover {
	color: white;
}

.btn-ingreso-datos8 {
	color: #fff;
	background-color:#4FC3F7;  
    border-color:#4FC3F7;
	padding: 20px;
}
.btn-ingreso-datos8:hover {
	color: white;
}

/********************************************************/
.container-modulo-overlay-list-compania {
  position: relative;
  width: 100%;
  padding: 25%;
  height: 135px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/****************************Menu de escoger compania********************************************************/
.bg-list-comapnia {
	color: white
	position: relative;
  	display: inline-block;
  	width: 90%;
  	height: 30%;
  	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  	border-radius: 5px;
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-list-comapnia::after {
  content: "";
  border-radius: 5px;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-list-comapnia:hover{
  -webkit-transform: scale(1.10, 1.10);
  transform: scale(1.10, 1.10);
}

.bg-list-comapnia:hover::after{
	opacity: 1;
}

.btn-list-comapnia {
	background-color:#000080;  
	width: 70%;
  	height:70px;
  	color:white;
}

.btn-list-comapnia:hover{
  	color:white;
}
/***************************************************************/

/* --- Módulo Usuarios --- */ 

/**/
.bg-relacionados {
	background-color:#08298A;
	position: relative;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-relacionados::after{
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  border-radius: 5px;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.bg-relacionados:hover{
  -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-relacionados:hover::after{
	opacity: 1;
}

/* Botón Usuarios */

.btn-relacionados {
	color: #fff;
	background-color:#08298A;  
    border-color:#08298A;
}

.btn-relacionados:focus {
  background-color: #08298A;
  border-color: #08298A;
}

.btn-relacionados:hover {
  background-color: #08298A;
  border-color: #08298A;
}

/* --- Módulo Clientes --- */ 

.bg-productos {
	background-color:#0B614B;
	position: relative;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-productos::after{
  content: "";
  position: absolute;
  border-radius: 5px;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.bg-productos:hover{
  -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-productos:hover::after{
	opacity: 1;
}

/* Botón Clientes */

.btn-productos {
	color: #fff;
	background-color:#0B614B;  
    border-color:#0B614B;
	padding: 20px;
}

.btn-productos:focus {
  background-color: #0B614B;
  border-color: #0B614B;
}

.btn-productos:hover {
  background-color: #0B614B;
  border-color: #0B614B;
}

/* --- Módulo Salir sistema --- */ 

.bg-servicios {
	background-color:#2E2E2E;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-servicios::after{
	content: "";
  border-radius: 5px;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-servicios:hover{
  -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-servicios:hover::after{
	opacity: 1;
}

/* Botón Salir */

.btn-servicios {
	color: #fff;
	background-color:#2E2E2E;  
    border-color:#2E2E2E;
	padding: 20px;
}

.btn-servicios:focus {
  background-color: #2E2E2E;
  border-color: #2E2E2E;
}

.btn-servicios:hover {
  background-color: #2E2E2E;
  border-color: #2E2E2E;
}

/* --- Módulo Ingreso se datos --- */

.bg-facturacion {
	background-color:#2F0B3A;
	position: relative;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.bg-facturacion::after{
  content: "";
  position: absolute;
  border-radius: 5px;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.bg-facturacion:hover{
 -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-facturacion:hover::after{
	opacity: 1;
}
	
.btn-facturacion{
 	color: #fff;
	background-color:#2F0B3A;  
    border-color:#2F0B3A;
	
}

.btn-facturacion:focus {
  background-color: #2F0B3A;
  border-color: #2F0B3A;
}

.btn-facturacion:hover {
  background-color: #2F0B3A;
  border-color: #2F0B3A;
}
/* --- Fin del modulo Ingreso se datos --- */


/* --- Módulo Funciones financieras --- */

.bg-reportes {
	background-color:#0B4C5F;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-reportes::after{
	content: "";
  border-radius: 5px;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-reportes:hover{
  -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-reportes:hover::after{
	opacity: 1;
}

/* Botón Funcoines financieras */

.btn-reportes{
	color: #fff;
	background-color:#0B4C5F;  
    border-color:#0B4C5F;
	padding: 20px;
}

.btn-reportes:focus {
  background-color: #0B4C5F;
  border-color: #0B4C5F;
}

.btn-reportes:hover {
  background-color: #0B4C5F;
  border-color: #0B4C5F;
}

/* --- Módulo Reportes --- */

.bg-tiendas {
	background-color:#ff9800;
	display: inline-block;
	border-radius: 5px;
  	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  	transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-tiendas::after{
  content: "";
  border-radius: 5px;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.bg-tiendas:hover{
   -webkit-transform: scale(1.05, 1.05);
  transform: scale(1.05, 1.05);
}

.bg-tiendas:hover::after{
	opacity: 1;
}

/* Botón Reportes */

.btn-tiendas{
	color: #fff;
	background-color:#ff9800;  
    border-color:#ff9800;
	padding: 20px;
}

.btn-tiendas:focus {
  background-color: #ff9800;
  border-color: #ff9800;
}

.btn-tiendas:hover {
  background-color: #ff9800;
  border-color: #ff9800;
}

/* Margen entre sub modulos - Botones*/

.btn-margin {
	margin: 10px;
	width: 120px;
	height: 120px;
	padding: 5px;
	text-align: center;
	font-size: 16px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/* ///////// Footer /////////  */

footer {
	margin-top: 20px;
	bottom: 0;
	position: absolute;
	position: fixed;
	width: 100%;
}

.bg-footer {
	background-color:#222;
	padding:5px 0px 5px 0px;
	color: #fff;
}

@media (max-width: 1024px) {
	
	
}

@media (max-width: 768px) {
	

	
}

@media (max-width: 600px) {
	
	
}
/*24/08/2017*/

.thumbnail:hover{
  -webkit-box-shadow: 0px 3px 51px -1px rgba(0,0,0,0.75);
  -moz-box-shadow: 0px 3px 51px -1px rgba(0,0,0,0.75);
  box-shadow: 0px 3px 51px -1px rgba(0,0,0,0.75);
  transition: 0.7s;
}


.imagen_container{
  width: 100%;
  overflow: hidden;
}
.producto_imagen{
  height: 200px;
  margin: 0 auto;
  display: block;
  max-width: 100%;
}
.imagen_relleno{
 background: #ccc;
 width: 100%;
 height: 200px;
}

.fondo{
  background: #0e0e0e; 
  display: block;
  height:520px;
  width: 100%;
  -webkit-box-shadow: -1px 0px 20px 4px rgba(0,0,0,0.75);
  -moz-box-shadow: -1px 0px 20px 4px rgba(0,0,0,0.75);
  box-shadow: -1px 0px 20px 4px rgba(0,0,0,0.75);
}

.img{
  width: 100%;
  height: 90%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.fondoX{ 
  height:2%;
  width: 100%; 
  display: flex;
  justify-content: center;
  align-items: center;
}