/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/

.container {
	width: 90%;
	padding: 0;
}

.section{
	margin: 2rem 0 2rem;
}

.section.header{
	
}

.section.header.bg{
	margin-top: 0;
	padding: 1rem 0;
}

.section.header.fixed{
	position: fixed;
	z-index: 5000;
	top: 0;
	left: 0;
	width: 100%;
}

.section.header .logo{
	font-size: 0;
}

.section.header .logo img{
	height: 90px;
}

.section.header .info{
	position: absolute;
	right: 0;
	top: 0;
	line-height: 140%;
}

.section.header .info span{
	display: block;
}

.section.header .info a{
	font-size: 1.5rem;
}

.section.after-fixed{
	margin-top: 9rem;
}

.section.menu{
	
}

.section.content{
	
}

.section.footer{
	margin-bottom: 0;
	padding: 1rem;
	border-top: 1px solid #979797;
	color: #5E5D5D;
}

.section.footer a{
	
}

.section.footer a:hover{
	
}

.section.footer ul{
	list-style: none;
	margin-bottom: 0;
}

.section.footer ul li{
	margin-bottom: 0;
	line-height: 120%;
}

.section.bg{
	padding: 2rem 0;
}

.section.footer ul li{
	margin-bottom: 0;
}

.add-bottom{
	margin-bottom: 20px;
}

.add-top{
	margin-top: 20px;
}

.add-half-bottom,
.half-bottom{
	margin-bottom: 10px;
}

.add-half-top,
.half-top{
	margin-top: 10px;
}


.remove-bottom{
	margin-bottom: 0px;
}

.remove-top{
	margin-top: 0px;
}

.google-maps {
    position: relative;
    padding-bottom: 75%;
    height: 0;
    overflow: hidden;
}
.google-maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.owl-carousel .item{
	margin: 0 0.5rem;
}

.box{
	border-radius: .5rem;
}

h1{
	font-size: 2.6rem;
	color: #403F3F;
	font-weight: bold;
	letter-spacing: .01rem;
}

h2{
	font-size: 2.3rem;
}

h3{
	font-size: 2.0rem;
	color: #fff;
	font-weight: bold;
	letter-spacing: .01rem;
	background: #D01E2B;
	text-transform: uppercase;
	padding: .5rem;
	border-top-left-radius: 1rem;
	border-top-right-radius: 1rem;
	margin-bottom: 0;
}

h4{
	font-size: 1.7rem;
	font-weight: bold;
	text-align: center;
	color: #D01E2B;
	margin-bottom: 0;
}

h5{
	font-size: 1.5rem;
	font-weight: bold;
	text-align: center;
	color: #D01E2B;
	margin-bottom: 0;
}

h6{
	font-size: 1.3rem;
}

.mobile{
	display: block;
}

.no-mobile{
	display: none;
}

.shadow{
	-webkit-box-shadow: 0px 1px 15px #888888;
	-moz-box-shadow: 0px 1px 15px #888888;
	box-shadow: 0px 1px 15px #888888;
}

.contacto{
	font-size: 2rem;
	border-bottom: solid 1px #ccc;
	font-weight: 400;
	margin-bottom: 1.3rem;
	display: block;
	background: rgba(81,163,81,.9);
	padding: 1rem;
	color: #fff;
}

.forma{
	padding: 1.5rem;
}

.note{
	display: block;
	color: #0A478E;
	font-style: italic;
	font-size: 1.3rem;
	margin-bottom: .5rem;
}
label{
	font-size: 1.3rem;
	margin-bottom: .2rem;
	display: inline-block;
	font-weight: bold;
}

#intro input, #intro textarea, #intro select{
	margin-bottom: 0;
	font-size: 1.3rem;
}

input, textarea, select{
	margin-bottom: 1.3rem;
	font-size: 1.3rem;
}

input[type="text"], input[type="email"], select, input[type="date"], input[type="datetime-local"]{
	height: 30px;
}

input[type="submit"]{
	background:#3DA8EE;
	color:#fff;
	border-radius: 1.3rem;
	width: 220px;
	font-size: 2.2rem;
	border: none;
	
}
input[type="submit"]:hover{
	color: #fff;
    -moz-box-shadow:   inset 0 0 15px rgba(68,68,68,.5);
    -webkit-box-shadow:inset 0 0 15px rgba(68,68,68,.5);
    box-shadow:        inset 0 0 15px rgba(68,68,68,.5); 
}

textarea{
	min-height: 50px;
}

input[type="search"]{
	height: 25px;
	margin-left: 1rem;
	display: inline-block;
	font-style: italic;
	margin-bottom: .5rem;
	padding: 0 3rem 0 0.5rem;
}

#search-form a.fa {
    position: absolute;
    color: #3DA8EE;
    background: none;
    right: 0;
    font-size: 1.5rem;
    border: none;
    font-family: FontAwesome;
}

#search-form a {
    background: #8B805F;
    text-decoration: none;
    padding: 0.5rem 1rem;
    font-family: 'Prata', serif;
    font-size: 1.2rem;
    text-transform: uppercase;
}

/* Larger than mobile */
@media (min-width: 400px) {
	
	#search-form a.fa {
    position: absolute;
    color: #3DA8EE;
    background: none;
    right: 0;
    font-size: 1.5rem;
    border: none;
    font-family: FontAwesome;
	}
	
	#search-form a {
	    background: #8B805F;
	    text-decoration: none;
	    padding: 0.5rem 1rem;
	    font-family: 'Prata', serif;
	    font-size: 1.2rem;
	    text-transform: uppercase;
	}
	
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
	
	#search-form a.fa {
    position: absolute;
    color: #3DA8EE;
    background: none;
    right: 0;
    font-size: 1.5rem;
    border: none;
    font-family: FontAwesome;
	}
	
	#search-form a {
	    background: #8B805F;
	    text-decoration: none;
	    padding: 0.5rem 1rem;
	    font-family: 'Prata', serif;
	    font-size: 1.2rem;
	    text-transform: uppercase;
	}
	
}

/* Larger than tablet */
@media (min-width: 750px) {
	.container {
    	width: 95%;
    }
    
    .section.header .logo img{
	    height: auto;
    }
    
    .section.header .info{
	    line-height: 160%;
	    top: 2.0rem;
    }
    
    .section.header .info span{
	    font-size: 2.0rem;
    }
    
    .section.header .info a{
	    font-size: 2.3rem;
    }
    
    .section.after-fixed{
		margin-top: 12.8rem;
	}
    
	
	.no-mobile{
		display: block;
	}
	
	.mobile{
		display: none;
	}
	.sub-menu {
   		width:195%;
	}

    .sub-menu li{
   		width:100%;
	}

    .sub-menu li ul{
   		width:60%;
	}
	
	#search-form a.fa {
    position: absolute;
    color: #3DA8EE;
    background: none;
    right: 43%;
    font-size: 1.5rem;
    border: none;
    font-family: FontAwesome;
	}
	
	#search-form a {
	    background: #8B805F;
	    text-decoration: none;
	    padding: 0.5rem 1rem;
	    font-family: 'Prata', serif;
	    font-size: 1.2rem;
	    text-transform: uppercase;
	}
}

/* Larger than desktop */
@media (min-width: 1000px) {
	.container{
		max-width: 1800px;
	}
	
	#search-form a.fa {
    position: absolute;
    color: #3DA8EE;
    background: none;
    right: 43%;
    font-size: 1.5rem;
    border: none;
    font-family: FontAwesome;
	}
	
	#search-form a {
	    background: #8B805F;
	    text-decoration: none;
	    padding: 0.5rem 1rem;
	    font-family: 'Prata', serif;
	    font-size: 1.2rem;
	    text-transform: uppercase;
	}
}

i{
	color: #51A351;
	font: 2rem;
}

.tip{
	color: #5E5D5D;
	font-size: 1.5rem;
	text-align: center;
	display: block;
}

.gris{
	background: #F4F4F4;
}

.gris-light{
	background: rgba(244,244,244,.9);
}

.lines{
	background: url(../img/bg.png) center center repeat-x;

}

.btn{
	background:#3DA8EE;
	color:#fff;
	border-radius: 1.3rem;
	width: 220px;
	font-size: 2.2rem;
	border: none;
	display: inline-block;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: bold;
	margin: 1rem 0;
	
}
.btn:hover{
	color: #fff;
    -moz-box-shadow:   inset 0 0 15px rgba(68,68,68,.5);
    -webkit-box-shadow:inset 0 0 15px rgba(68,68,68,.5);
    box-shadow:        inset 0 0 15px rgba(68,68,68,.5); 
}

.blue .btn-action, .blue i{
	color: #0847a4;
}

.btn-action{
	background:#F4F4F4;
	color:#59A759;
	border-radius: .5rem;
	font-size: 1.5rem;
	border: 1px solid #979797;
	display: inline-block;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: bold;
	margin: 1rem 0;
	padding: .3rem 1rem;
	
}

.btn-action{
	-moz-box-shadow:   inset 0 0 15px rgba(68,68,68,.2);
    -webkit-box-shadow:inset 0 0 15px rgba(68,68,68,.2);
    box-shadow:        inset 0 0 15px rgba(68,68,68,.2); 
}

.outline-box{
	padding: 6rem 3rem;
	border: 1px solid #E9E9E9;
}

.marquee {
  overflow: hidden;
  border:none;
  font-size: 1.3rem;
  background: #51A351;
  padding: 1rem;
  color: #fff;
  font-size: 1.7rem;
  max-height: 30px;
}
.drop{
	background: rgba(254,254,254,.7);
	border: 1px solid #555;
	display: inline-block;
	padding: .5rem 0;
	border-radius: .5rem;
	font-size: 1.3rem;
}
.drop li{
	list-style-type: none;
	margin-bottom: 0;
	padding: 0 .5rem;
}
.drop li:hover{
	background: rgba(254,254,254,.9);
}

#intro{
	background-image: url("../img/bg-login.png");
	background-position: 100px; 
	background-size: 100% auto;
}

.gradient{
 /*background: #fff; 
  background: -webkit-linear-gradient(110deg, #fff, #fff, #0847A4, #0847A4, #0847A4); 
  background: -o-linear-gradient(110deg, #fff, #fff, #0847A4, #0847A4, #0847A4); 
  background: -moz-linear-gradient(110deg, #fff, #fff, #0847A4, #0847A4, #0847A4);
  background: linear-gradient(110deg, #fff, #fff, #0847A4, #0847A4, #0847A4);*/
  background-image: url("../img/bg-header.png");
  background-position: bottom; 
  background-size: cover;
}

.search{
	color: #fff;
	font-weight: bold;
	font-style: italic;
	text-shadow: 1px 1px 5px #0847A4;
}

.advanced{
	color:#fff;
	text-align: right;
	font-size: 1rem;
	display: block;
}

.tabla{
	overflow: scroll;
}

.top-green{
	background: #59A759;
	color: #fff;
	border: 1px solid #979797;
}

.top-green th{
	padding: 0.5rem;
}

.top-green:hover{
	background: #59A759;
}

.top-blue{
	background: #0847a4;
	color: #fff;
	border: 1px solid #979797;
}

.top-blue th{
	padding: 0.5rem;
}

.top-blue:hover{
	background: #0847a4;
}

td{
	padding: 0.3rem;
	font-size: 1.3rem;
	color: #353535;
}

th:first-child, td:first-child {
    padding-left: 0.5rem;
}

tr:hover{
	background: #D7D7D7;
}

.reporte table{
	border: 1px solid #979797;
	padding: .5rem;
}

.line-bottom{
	border-bottom: 1px solid #979797;
}

.green-block{
	background: #59A759;
	padding: 1rem;
}

.green-block h1{
	color: #fff;
}

.link{
	color: #2176CD;
	text-decoration: none;
	font-size: 1.7rem;
	font-weight: bold;
}

.link i{
	color: #2176CD;
	text-decoration: none;
	font-size: 3rem;
}

.blue-block{
	background: #0847A4;
	padding: .3rem 1rem;
	color: #fff;
	font-size: 1.5rem;
	font-weight: bold;
}

.date{
	font-size: 2.0rem;
	color: #403F3F;
	font-weight: bold;
	letter-spacing: .01rem;
}

.data{
	font-size: 1.5rem;
	color: #403F3F;
	letter-spacing: .01rem;
	display: block
}

.line-box{
	border: 1px solid #ccc;
	border-radius: 1rem;
}

.pad{
	padding: 1rem;
}

.red{
	color: #D01E2B;
}

.orange{
	background: #FCB03F;
	padding: 1.6rem;
}

.orange i{
	color: #000;
	font-size: 6rem;
}

.orange li{
	font-size: 1.3rem;
	margin-bottom: 0;
}

.orange ul{
	margin-bottom: 0;
}

.valido{
	background: rgba(81,163,81,.3);
	color: #51A351;
	padding: 1rem;
	border: 2px solid #51A351;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

.valido i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
}

.invalido{
	background: rgba(208,2,27,.2);
	color: #B20218;
	padding: 1rem;
	border: 2px solid #B20218;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

.invalido i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #B20218;
}

.usado{
	background: rgba(248,231,28,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #EAD905;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

.usado i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}

.fueraTiempo {
	background: rgba(255,0,0,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #ff0000;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

	.fueraTiempo i {
		font-size: 5rem;
		float: left;
		margin-right: 1rem;
		color: #ff0000;
	}
.fueraTiempoNC {
	background: rgba(255,0,0,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #ff0000;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

	.fueraTiempoNC i {
		font-size: 5rem;
		float: left;
		margin-right: 1rem;
		color: #ff0000;
	}
.NoPistoleado{
	background: rgba(248,231,28,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #EAD905;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

.NoPistoleado i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}
.NoCoincide{
	background: rgba(248,231,28,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #EAD905;
	border-radius: .5rem;
	margin-bottom: 1rem;
}
.NoEncontradoOtrasMarcas {
	background: rgba(248,231,28,.1);
	color: #A7A699 ;
	padding: 1rem;
	border: 2px solid #EAD905;
	border-radius: .5rem;
	margin-bottom: 1rem;
}
.NoCoincideCodTermVacio {
	background: rgba(255, 102, 0,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #ff6600;
	border-radius: .5rem;
	margin-bottom: 1rem;
}
.SiCoincideCodTermVacio {
	background: rgba(248,231,28,.1);
	color: #A7A699;
	padding: 1rem;
	border: 2px solid #EAD905;
	border-radius: .5rem;
	margin-bottom: 1rem;
}
.MesesUso {
	background: rgba(8, 71, 164,.1);
	color: #403F3F;
	padding: 1rem;
	border: 2px solid #0847a4;
	border-radius: .5rem;
	margin-bottom: 1rem;
}

.NoCoincide i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}
.NoEncontradoOtrasMarcas i {
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}
.NoCoincideCodTermVacio i {
	font-size: 3rem;
	float: left;
	margin-right: 1rem;
	color: #ff6600;
}.SiCoincide i{
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}
.SiCoincideCodTermVacio i {
	font-size: 3rem;
	float: left;
	margin-right: 1rem;
	color: #EAD905;
}
.MesesUso i {
	font-size: 5rem;
	float: left;
	margin-right: 1rem;
	color: #0847a4;
}
.login{
	margin-bottom: 35rem;
}

.login input[type="submit"]{
	line-height: 31px;
	font-size: 1.5rem;
	width: 180px;
	
}


/*----- Menu Outline -----*/
.menu-wrap {
    width:100%;
}

nav ul {
	padding: 0;
	margin: 0;
	float: left;
}

nav li {
	float: left;
	display: inline;
	position: relative;
	list-style: none;
}

nav ul ul {
	position: absolute;
	left: 0;
	top: 100%;
/* 	display: none; */
	box-shadow:0px 2px 3px rgba(0,0,0,0.2);
    background: rgba(254,254,254,1);
    border-radius: .5rem;
    padding: 5px 0;
    z-index: 1000;
    
    visibility:hidden;
    opacity:0;
    filter:alpha(opacity=0);
    -webkit-transition:200ms ease;
    -moz-transition:200ms ease;
    -o-transition:200ms ease;
    transition:200ms ease;
}

nav ul ul li{
	width: 100px;
	margin: 0;
}

nav ul ul a{
	padding:5px 7px;
    display:block;
    text-decoration: none;
    color:#403F3F;
    font-size: 1.3rem;
}

nav ul ul ul {
	left: 100%;
	top: 0;
}

nav ul ul .left {
	left: -61% !important;
	top: 0;
}

nav ul ul ul ul li{
	width: 100px;
}

nav li:hover > ul {
/* 	display: block; */
	visibility:visible;
    opacity:1;
    filter:alpha(opacity=100);
}

nav > ul > li:hover > a{
    background: #ebebeb;
    color: #1EAEDB;
}

nav li:hover > a {
    background: #ebebeb;
    color: #1EAEDB;
}

nav i{
	color: #3BA3E7;
}

nav .menu{
	background: rgba(254,254,254,.8);
	border: 1px solid #979797;
	width: 100px;
	display: inline-block;
	border-radius: .6rem;
	text-align: center;
	text-decoration: none;
	color: #403F3F;
	margin: 0 .5rem .3rem 0;
}

nav .home{
	background: rgba(254,254,254,.8);
	border: 1px solid #979797;
	display: inline-block;
	border-radius: .6rem;
	text-align: center;
	text-decoration: none;
	color: #403F3F;
	margin-right: .5rem;
	padding: 0 .5rem;
}


/* Larger than mobile */
@media (min-width: 400px) {
	
}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
	
}

/* Larger than tablet */
@media (min-width: 750px) {
	.container {
    	width: 95%;
    }
    
    .section.header .logo img{
	    height: auto;
    }
    
    .section.header .info{
	    line-height: 160%;
	    top: 2.0rem;
    }
    
    .section.header .info span{
	    font-size: 2.0rem;
    }
    
    .section.header .info a{
	    font-size: 2.3rem;
    }
    
    .section.after-fixed{
		margin-top: 12.8rem;
	}
    
	
	.no-mobile{
		display: block;
	}
	
	.mobile{
		display: none;
	}
	
	nav{
		margin: 20px;
	}
	
    /* menu reportes */
	nav ul ul li{
		width: 180px;
	}
}

/* Larger than desktop */
@media (min-width: 1000px) {
	.container{
		max-width: 1800px;
	}
}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}


/* Apartir de aqui papu lawea */

.error{
    color:red !important;
    font-size:14px !important;
    font-weight:400 !important;
}

.error2{
    color:red !important;
    font-size:14px !important;
    font-weight:400 !important;
}

#link  {
    background-color: #51A351;
    color: white;
    margin-top: 20px;
    padding: 14px 55px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

#link:hover, #link:active {
    background-color: #004c00;
}

.page-wrap {
  margin: 0 auto;

}
.page-wrap:after {

}
.site-footer {
  position: fixed;
    bottom:0;
    left: 0;
    right:0;
}

.button.dt-button, div.dt-button, a.dt-button {
    display: none !important;
}

.btn-excel{
    display: none !important;
}

#btnrep{
	background:#3DA8EE !important;
	color:#fff !important;
	border-radius: 1.3rem !important;
	width: 220px !important;
	font-size: 2.2rem !important;
	border: none !important;
	
}
#btnrep:hover{
	color: #fff !important;
    -moz-box-shadow:   inset 0 0 15px rgba(68,68,68,.5) !important;
    -webkit-box-shadow:inset 0 0 15px rgba(68,68,68,.5) !important;
    box-shadow:        inset 0 0 15px rgba(68,68,68,.5) !important; 
}

.card {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 100%;
    border-radius: 5px;
    background-color: white;
    min-height: 300px;
}

.cardfull{
    padding-top: 20px;
    background-color: white;
    margin-bottom: 50px;
    box-shadow: 0 0px 8px 0 rgba(0,0,0,0.2) !important;
}

.card:hover {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

#restavatar {
    border-radius: 5px 5px 0 0;
}

.card-container {
    padding: 2px 16px;
}

@media (min-width: 750px){

.especial {
    width: 18% !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
}

}

.card-container #descpromo{
    padding-top: 10px;
}

.chartWrapper {
    position: relative;
     overflow-x: scroll !important;
}

.chartWrapper > canvas {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events:none;
     
}

.chartAreaWrapper {
    width: 15000px;
    
}

#prommar{
    margin-bottom:3px;
}

#loading {
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   position: fixed;
   display: block;
   opacity: 0.7;
   background-color: #fff;
   z-index: 99;
   text-align: center;
}

#loading-image {
  position: absolute;
  top: 100px;
  left: 240px;
  z-index: 100;
}

#container-float {
    
}
#copyright-float {
    position: fixed;
    bottom: 4%;
    background-color: #4472c4;
    width:100%;
    height:50px;
}

#copyright-float p{
    text-align:center;
    color:white;
    margin-top:5px;
    font-size:18px;
}