/* Add here all your CSS customizations */

/*AGRA*/

/*Font euro*/

@font-face {
    font-family: 'Eurostile';
    src: url(../euro/EurostileMedium.ttf) format("truetype");
}

@font-face {
    font-family: 'Eurostile Medium';
    src: url(../euro/EurostileMedium.ttf) format("truetype");
}

@font-face {
    font-family: 'Eurostile Bold';
    src: url(../euro/EurostileBold.ttf) format("truetype");
}

.euro{
	font-family: 'Eurostile';
}

.euro-m{
	font-family: 'Eurostile Medium';
}

.euro-b{
	font-family: 'Eurostile Bold'; 
}

.arial{
	font-family: Arial;
}

/**/

:root{
	--rojo: #e20613;
	--rojoClaro: #e20612;

}

.p-no-margin{
	margin: 0;
}

.l-blanca{
	color: #fff !important;
}

.l-roja{
	color: #e20613;
}

.mb-5-title{
	margin-bottom: 3rem!important;
}

.padd-0{
	padding: 0;
}

.cut-img-2{
	position: relative;
	left: -4.9%;
}

.cut-img-3{
	position: relative;
	left: -40%;
}

.card{
	background-color: #000;
}

.featured-box{
	background: #000;
	min-height: 360px;
}


/**/
.card-title{
	text-align: center;
}

.camera{
	background: rgba(226, 6, 19, 0.6);
    border-radius: 50%;
    height: 210px;
    width: 210px !important;
}

.span-camera{
	position: absolute;
    top: 50%;
    line-height: 30px;
    left: 50%;
    width: 100%;
    transform: translate(-50%,-50%);
}

.logos{
	text-align: center;
}

.justi-p{
	text-align: justify;
}

.tp-caption{
	letter-spacing: 1px!important;
}

.left-footer{
	text-align: left;
}

.center-footer{
	text-align: center;
}

.right-footer{
	text-align: right;
}

.logo-leadme{
	width: 175px;
	height: 48px;
}

.hide{
	display: none;
}

.list-red{
	list-style: disc;
	color: red;
	text-align: left;
}

.logos img{
	width: 150px;
}

.linea1{
	position: absolute;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	left: 45px;
}

.linea2{
	position: absolute;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	right: 45px;
}

.linea3{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	left: 45px;
}

.linea4{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	right: 45px;
}

.frame-circle{
	position: absolute;
    width: 25px;
    border-radius: 50%;
    background: #e20613;
    height: 25px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}


/*Home Camera*/
.linea1-home{
	position: absolute;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	left: 45px;
}

.linea2-home{
	position: absolute;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	right: 45px;
}

.linea3-home{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	left: 45px;
}

.linea4-home{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	right: 45px;
}

.frame-circle-home{
	position: absolute;
    width: 25px;
    border-radius: 50%;
    background: #e20613;
    height: 25px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

/**/

/*Home Carousel*/
.linea1-carousel{
	position: absolute;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	left: 45px;
	z-index: 99;
}

.linea2-carousel{
	position: absolute;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	top: 45px;
	right: 45px;
	z-index: 99;
}

.linea3-carousel{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	left: 45px;
	z-index: 99;
}

.linea4-carousel{
	position: absolute;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	width: 75px;
	height: 75px;
	bottom: 45px;
	right: 45px;
	z-index: 99;
}

.frame-circle-carousel{
	position: absolute;
    width: 25px;
    border-radius: 50%;
    background: #e20613;
    height: 25px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.wasa-mobile{
	display: none;
}

.round-img{
	border-radius: 50%;
	border: 1px solid red;
	transition: all .6s ease-in-out;
	padding: 7px;
}

.round-img:hover{
	border-radius: 50%;
	border: 5px solid red;
	transition: all .6s ease-in-out;
	padding: 3px;
}

.reverse-button:hover{
	background: transparent;
	color: #fff;
	transition: all .4s ease-in-out;
	border: 1px solid #e20613;
}

::-webkit-scrollbar {
  width: 0.5em;
  height: 0.5em;
}

::-webkit-scrollbar-thumb {
  background: #e20613;
}

::-webkit-scrollbar-track {
  background: #b8c0c8;
}


/*size-font*/

.f-18{
	font-size: 18px !important;
}

.f-20{
	font-size: 20px !important;
}

.sist-23{
	font-size: 20px !important;
}

.socials{
	display: flex;
	padding: 0;
}

.w-600{
	font-weight: 600;
}

.no-upper{
	text-transform: none;
}

.lh-normal{
	line-height: normal;
}

/*Redes*/
.redes{
	font-size: 30px;
	margin-left: 30px;
	margin-bottom: 25px;
	margin-top: 30px;
}

.redes i{
	margin-right: 10px;
}

#redes-mobile{
	display: none;
}

#redes-float{
	position: fixed;
    bottom: 150px;
    right: -95px;
    z-index: 99999;
    background: #25d366;
    padding: 1px 10px;
    border-radius: 5px;
    transition: all .5s ease-in-out;
}

#redes-float:hover{
	right: 0;
	transition: all .5s ease-in-out;
}

.cont-whats{
	display: flex;
	align-items: center;
}

.cont-whats:hover{
	text-decoration: none;
}

img.whats-float{
	width: 50px;
	height: 50px;
	margin-right: .5rem;
}

.whats-float{
	-webkit-animation-name: pulse-whats;
	        animation-name: pulse-whats;
	-webkit-animation-iteration-count: infinite;
  			animation-iteration-count: infinite;
	-webkit-animation-duration: 1s;
  			animation-duration: 1s;
  	-webkit-animation-fill-mode: both;
  			animation-fill-mode: both;
}

@-webkit-keyframes pulse-whats {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse-whats {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}



/* Moreeeeeeeeeee css by agra | update 9/10/2019 */
.header-info{position: absolute; top: 15px; right: 30px; display: flex; align-items: center;}
.header-info a{margin: 0 5px; display: flex; align-items: center; font-size: 14px; z-index: 9999;}
.header-info a:hover{text-decoration: none; color: #e20613 !important;}
.header-info a i{margin: 0 10px;}
.l-negra{color: #000;}
.w-400{font-weight: 400!important;}
.fs-15{font-size: 15px;}
.fs-20{font-size: 20px;}
.fs-25{font-size: 25px;}
.fs-30{font-size: 30px;}
.fs-35{font-size: 35px;}
.m-b10{margin-bottom: 10px;}
.m-b15{margin-bottom: 15px;}
.m-b20{margin-bottom: 20px;}
.m-b40{margin-bottom: 40px;}
.p-tb80{padding: 80px 0;}
.p-t80{padding-top: 80px;}
.p-b40{padding-bottom: 40px;}
.p-b60{padding-bottom: 60px;}
.p-lr5{padding-left: 5px; padding-right: 5px;}
.menu-list li{margin-top: 15px;}
.btn-menu-contact{background: #e20613; padding: 2px 15px;}
.box-how-to-work{background: #e20613; padding: 30px 15px; min-height: 305px; margin-bottom: 20px;}
.box-how-to-work img{width: 60px;}
.box-reportes{background: rgba(0,0,0,.75); padding: 30px 15px; min-height: 340px; margin-bottom: 20px; border: 1px solid #fff;}
.box-reportes img{width: 70px; height: 70px;}
.box-numeralia{text-align: center; margin-bottom: 40px;}
.box-numeralia img{width: 60px;}
.bckgd-cedis{background: url('../img/home/cedis/puntos-de-monitoreo-cedis.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.bckgd-retail{background: url('../img/home/retail/puntos-de-monitoreo-retail.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.bckgd-reportes{background: url('../img/home/reportes.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.bckgd-numeralia{background: url('../img/home/nuestras-cifras-en-monitoreo.jpg'); background-size: cover; background-position: center; background-repeat: no-repeat;}
.w-space-pre{white-space: pre-line;}
.circle-carousel{position: relative;}
.circle-carousel img{position: relative; border-radius: 50%;}
.circle-carousel:before{position: absolute; content: ""; top: 50%; left: 50%; border: 1px solid #e20613; width: 90%; height: 90%; border-radius: 50%; z-index: 9; transform: translate(-50%, -50%);}
.owl-cedis.nav-inside .owl-nav button.owl-prev{color: #000!important; left: -70px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #e20613;}
.owl-cedis.nav-inside .owl-nav button.owl-next{color: #000!important; right: -70px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #e20613;}
.owl-retail.nav-inside .owl-nav button.owl-prev{color: #fff!important; left: -70px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #fff;}
.owl-retail.nav-inside .owl-nav button.owl-next{color: #fff!important; right: -70px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border: 1px solid #fff;}
.box-content-cedis{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; padding: 0 30px; z-index: 99;}
.box-content-retail{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; padding: 0 30px; z-index: 99;}
.list-cedis{padding: 0; margin: 0; list-style: none;}
.list-cedis li:before{content: "\2022"; color: #e20613;  font-weight: bold;  display: inline-block;  width: 1em; margin-left: 0em; font-size: 12px;}
.list-retail{padding: 0; margin: 0; list-style: none;}
.list-retail li:before{content: "\2022"; color: #e20613;  font-weight: bold;  display: inline-block;  width: 1em; margin-left: 0em; font-size: 12px;}
.call-to-action-flex{display: flex; align-items: center;}
.btn-call-to-action{background: transparent; padding: 10px 35px; color: #fff; font-size: 25px; border: 1px solid #e20613;}
.btn-call-to-action:hover{background: #e20613; transition: .5s linear; text-decoration: none; color: #fff; font-weight: 400;}
.border-numeralia .col-md-4:nth-child(2n){border-left: 2px solid #e20613; border-right: 2px solid #e20613;}
.logo-spy{width: 230px;}
.lh-20{line-height: 20px;}
.lh-25{line-height: 25px;}
.lh-30{line-height: 30px;}
.lh-35{line-height: 35px;}
.lh-40{line-height: 40px;}
.owl-cedis .owl-dots .owl-dot.active span, .owl-carousel .owl-dots .owl-dot:hover span{background-color: #e20613;}
.owl-retail .owl-dots .owl-dot.active span, .owl-carousel .owl-dots .owl-dot:hover span{background-color: #fff;}
.owl-cedis .owl-dots, .owl-retail .owl-dots{display: none;}








/******Responsive**********/

@media screen and (max-width: 1440px){
	.linea1-home{top: 160px;}
	.linea2-home{top: 160px;}
}

@media screen and (max-width: 768px){
	section.section{margin: 15px 0; padding: 15px 0;}
	.mt-5, .my-5{margin-top: 1rem!important;}
	.mb-5, .my-5{margin-bottom: 1rem!important;}
	.mb-5-title{margin-bottom: 1rem!important;}
	h2{font-size: 1.7em; line-height: 28px;}
	.sist-23{font-size: 14px !important;}
	.span-camera{line-height: 22px;}
	.camera{height: 150px; width: 150px !important;}
	.mt-3, .my-3 {margin-top: .8rem!important;}
	.featured-box{min-height: 315px;}
	.left-footer, .right-footer{text-align: center;}
	.socials{margin: 15px 0;}
	.feature-box{display: block;}
	.form-control{height: calc(3.85rem + 2px); padding-bottom: 0; padding-top: 0; font-size: 18px !important;}
	.pr-5{padding-left: 35px;}
	.linea1{top: 40px; left: 20px; width: 40px; height: 40px;}
	.linea2{top: 40px; right: 20px;  width: 40px; height: 40px;}
	.linea3{bottom: 20px; left: 20px; width: 40px; height: 40px;}
	.linea4{bottom: 20px; right: 20px; width: 40px; height: 40px;}
	.frame-circle{width: 10px; height: 10px;}
	/*lineasHome*/
	.linea1-home{left: 20px; width: 40px; height: 40px;}
	.linea2-home{right: 20px;  width: 40px; height: 40px;}
	.linea3-home{bottom: 20px; left: 20px; width: 40px; height: 40px;}
	.linea4-home{bottom: 20px; right: 20px; width: 40px; height: 40px;}
	.frame-circle-home{width: 10px; height: 10px;}
	/**/
	/*lineaCarousel*/
	.linea1-carousel{top: 10px; left: 20px; width: 30px; height: 30px;}
	.linea2-carousel{top: 10px; right: 20px;  width: 30px; height: 30px;}
	.linea3-carousel{bottom: 30px; left: 20px; width: 30px; height: 30px;}
	.linea4-carousel{bottom: 30px; right: 20px; width: 30px; height: 30px;}
	.frame-circle-carousel{width: 10px; height: 10px;}
	/**/
	.separate-line{border: none;}
	.logos{padding: 0px 15px;}
	#footer .footer-copyright{padding-bottom: 50px;}
	.logo-leadme{margin-top: 15px;}
	.wasa-desktop{display: none;}
	.wasa-mobile{display: inline;}
	#redes-float{display: none;}
	#redes-mobile{display: flex; justify-content: center; position: fixed; bottom: 0; width: 100%; z-index: 9999;}
	.cont-whats{font-size: 22px; align-items: center; justify-content: center;}
	.cut-img-2{left: 0%;}
	.cut-img-3{left: 0%;}

	/*Update by agra 09/10/2019*/
	.w-space-normal-sm{white-space: normal;}
	.text-center-sm{text-align: center!important;}
	.header-info{display: none;}
	.logo-spy{width: 180px;}
	.btn-menu-contact{background: none; padding: 0;}
	.border-numeralia .col-md-4:nth-child(2n){border: none;}
	.text-center-sm{text-align: center;}
	.cont-btn-call-to-action{display: flex; justify-content: center; margin-top: 25px;}
	.bckgd-numeralia{background: #fff;}
	.bckgd-reportes{background: #4c4646;}
	.box-how-to-work{min-height: auto;}
	#redes-mobile a{width: 33.3333%;}
	.cont-whats.whats{background: #e20613; padding: 10px 0;}
	.cont-whats.mail{background: #e20613; padding: 10px 0; border-left: 1px solid #fff; border-right: 1px solid #fff;}
	.cont-whats.phone{background: #e20613; padding: 10px 0;}
	.owl-cedis .owl-dots, .owl-retail .owl-dots{display: block;}
	.logos img{width: 90px;}
	.slide1 .tp-bgimg.defaultimg {background-position-x: 65%!important;}
	.slide2 .tp-bgimg.defaultimg {background-position-x: 30%!important;}
	.sticky-header-active .logo-spy{width: 120px;}

}
