/*
Theme Name: transbe
Theme URI:
Author: Mauricio Sanhueza (Plasmable)
Version: 1.0
*/

body
{
	margin: 0;
	padding: 0;
	background: #c9c9d0;
	color: #464342;
	max-width: 100%;
}
ul{
	color: #fff;
}
h2{
	font-family: 'Montserrat', sans-serif;
}
h3{
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 800;
	text-transform: uppercase;
}
h4{
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 800;
	text-transform: uppercase;
	color: #fff;
}
p{
	font-family: 'Open Sans';
	color: #fff;
}
.header-superior{
	background: #cacad0;
}
.header-ubicacion{
	color: #0d0d94;
	font-weight: bold;
	
}
.header-ubicacion p{
	color: #0d0d94;
	font-size: 14px;
}
.header-ubicacion p i{
	color: #0d0d94;
	padding-top: 5px;
	font-size: 18px;
	padding-top: 0;
} 
.nav-item-trabaja{
	background: #f8d020;
	height: 120%;
	color: #fff;
	line-height: 24px;
	border-radius: 1px;
	padding: 10px 10px 0px 10px !important;
	text-transform: uppercase;
}
.nav-item-trabaja:hover{
	text-decoration: none;
}
.nav-trabaja{
	font-family: 'Montserrat', sans-serif !important;
	color: #fff !important;
	text-decoration: none;
}
.nav-trabaja:hover{
	color: #0d0d94 !important;
	text-decoration: none;
}
.menu-superior{
	font-size: 22px;
	font-weight: 500;
	border-bottom: 3px solid #fff;
}
.texto-menu-superior{
	font-size: 12px;
}
.menu-superior p{
	font-family: 'Montserrat', sans-serif;
	padding-bottom: 1px;
}
.menu-logo{
	background: #0d0d94;
}
.menu-logo:before{
	content: "";
	position: absolute;
	background: #4646a4;
	height: 90%;
	width: 1px;
	right: 0;
}
.menu-telefono{
	line-height: 10px;
	background: #0d0d94;
	color: #fff;
	padding-top: 15px;
	font-weight: bold;
}
.menu-telefono:before{
	content: "";
	position: absolute;
	background: #4646a4;
	height: 90%;
	width: 1px;
	right: 0;
	
}
.menu-telefono:after{
	content: "";
	position: absolute;
	background: #fff;
	height: 1px;
	width: 50%;
	left: 50%;
	transform: translateX(-50%);
}
.menu-email{
	line-height: 10px;
	background: #0d0d94;
	color: #fff;
	font-weight: bold;
}
.menu-email:before{
	content: "";
	position: absolute;
	background: #4646a4;
	height: 90%;
	width: 1px;
	left: 0;
	
}
.menu-email:after{
	content: "";
	position: absolute;
	background: #fff;
	height: 1px;
	width: 50%;
	left: 50%;
	transform: translateX(-50%);
}
.menu-direccion{
	line-height: 10px;
	background: #f8d020;
	color: #fff;
}
.menu-direccion:after{
	content: "";
	position: absolute;
	background: #fff;
	height: 1px;
	width: 50%;
	left: 50%;
	transform: translateX(-50%);
}
.fas{
	color: #fff;
	font-size: 34px;
}

.navbar{
	background: #0d0d94;
}
.nav-link{
	color:#fff !important;
	text-transform: uppercase;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
}
.nav-link:hover{
	color:#f8d020 !important;
}
.menu{
	display: flex;
}
.menu li{
	list-style: none;
	text-transform: uppercase;
	margin: 10px;
	color: #fff;
	transition: .3s;
	font-weight: bold;
	z-index: 10;
}
.menu li:hover{
	color:#f8d020;
}
.nav-item-contacto{
	background: #f8d020;
	height: 120%;
	color: #fff;
	line-height: 24px;
	border-radius: 1px;
}
.nav-item-contacto:hover{
	background: #EDC951;
	text-decoration: none;
	color: #0d0d94;
}
.nav-contacto:hover{
	color: #0d0d94 !important;
}
.active{
	color: red !important;
}
.fondo-header{
	width: 100%;
	height: 100vh;
	position: relative;
	display: flex;
	overflow: hidden;
}
.fondo-header:before{
	display: block;
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: linear-gradient(rgba( 70, 70, 164,.3) 100%, transparent 30%);
	left: 0;
	top:0;
	z-index: 10;
}
/*.fondo-header:before{
	display: block;
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background: radial-gradient(rgba(1,1,1,.9) 30%, transparent 30%);
	background-size: 3px 3px;
	left: 0;
	top:0;
	z-index: 10;
}*/
.slide{
	position: relative;
	width: 100%;
	height: 100vh;
	left: 0;
	padding: 0;
	animation: animate 15s linear infinite alternate;
}
/*@keyframes animaSlide{
	0%{margin-left: 0;}
	20%{margin-left: 0;}
	
	25%{margin-left:-100%;}
	50%{margin-left:-100%;}
	
	75%{margin-left:-200%;}
	100%{margin-left:-200%;}
}*/
.slide2{
	position: relative;
	width: 100%;
	height: 100vh;
	left: 0;
	padding: 0;
	opacity: .4;
	/*animation: animate 7s linear infinite;*/
}
.slide3{
	position: relative;
	width: 100%;
	height: 100vh;
	left: 0;
	padding: 0;
	opacity: .4;
	/*animation: animate 7s linear infinite alternate;*/
}
@keyframes animate {
	0%
	{
		transform: scale(1.1);
	}
	30%
	{
		transform: scale(1.17);
	}
	60%
	{
		transform: scale(1.21);
	}
	100%
	{
		transform: scale(1.25);
	}
}
.contenido-header{
	display:flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	width: 400px;
	top: 5%;
	left: 50%;
	transform: translate(-50%,-10%);
	z-index: 20;
}

.titulo-header{
	color: #fff;
	font-weight: bold;
	font-size: 70px;
}
.suma{
	font-size: 180px;
	color:#f8d020;
	font-weight: bold;	
}
.suma:before{
	content: "de ";
	position: absolute;
	left: 30%;
	top: 28%;
	font-size: 40px;
	color: #fff;
	font-weight: 400;
}
.anos{
	position: relative;
	left: 5%;
	top: 0%;
	background: #cacad0;
	padding-left: 10px;
	padding-right: 10px;
}
.entregando-soluciones{
	font-size: 25px;
	font-weight:400;
	position: relative;
	left: 5%;
	top: -15%;
	background: #0d0d94;
	padding-left: 10px;
	padding-right: 10px;
}
.seguridad{
	font-size: 50px;
	font-weight:900;
	position: relative;
	left: 5%;
	background: #0d0d94;
	padding-left: 10px;
	padding-right: 10px;
}
.titulo-home{
	color: #0d0d94;
	text-transform: uppercase;
	font-weight: 900;
	position: relative;
}
.titulo-home:before{
	display: block;
	content: "";
	background:#0d0d94;
	position: absolute;
	height: 2px;
	width: 140px;
	bottom: -5px;
	left: 0;
}
.transbe{
	color: #0d0d94;
	font-weight: bold;
}
.titulo-algunos-clientes{
	color: #fff;
}
footer{
	background: #0d0d94;
	color: #fff;
	position: relative;
}

.content-footer{
	position: relative;
}
.content-footer:after{
	content: "";
	display: block;
	position: absolute;
	bottom: -10px;
	left: 50%;
	background: #fff;
	height: 3px;
	width: 50%;
	transform: translate(-50%,-50%);
}
.desarrollado{
	background: #0d0d94;
	color: #fff;
}
.desarrollado a{
	color: #f8d020;
}

.transbe{
	color: #0d0d94;
	font-weight: bold;
}
.texto-certificado{
	color: #0d0d94;
	font-family: 'Montserrat', sans-serif;
}
.texto-certificado span{
	font-weight: bold;
}
.titulo-home span{
	color:#4646a4;
	font-family: 'Montserrat', sans-serif;
	
}
.descripcion-transbe{
	font-size: 18px;
}

.contenedor-imagen{
	position: relative;	
	width: 330px;
	height: 355px;
	
}
.contenedor-imagen img{
	top: 0;
	left: auto;
	position: absolute;
	transition: 0.5s;
	width: 330px;
	height: 355px;	
}
.contenedor-imagen:hover img:nth-child(5){
	transform: translate(0px);
	
}
.contenedor-imagen:hover img:nth-child(4){
	transform: translateX(60px);
	opacity: .6;
}
.contenedor-imagen:hover img:nth-child(3){
	transform: translateX(-60px);
	opacity: .4;
}
.contenedor-imagen:hover img:nth-child(2){
	transform: translateY(40px);
	opacity: .4;
}
.contenedor-imagen:hover img:nth-child(1){
	transform: translateY(-40px);
	opacity: .4;
}
.contenedor-servicios-home{
	position: relative;
}
.titulo-servicio p{
	color: #464342;
}
.titulo-servicio{
	position: relative;
	left: 100%;
	bottom:-20%;
	transform: translate(-100%,20%);
	background: #a4a4c8;
	z-index: 100;
	padding: 0px 100px 20px 20px;
	color: #f8d020;
}
.titulo-servicio span{
	color: #0d0d94;
	font-weight: bold;
}
.logo-servicio{
	position: absolute;
	transform: translate(-50%, -2%);
	left: 50%;
	top:2%;
	opacity: 0;
	transition: .5s;
	z-index: 20;
}
.nombre-servicio{
	position: absolute;
	transform: translate(-20%, -50%);
	left: 20%;
	top:40%;
	opacity: 0;
	transition: .6s;
	text-transform: uppercase;
	font-family: 'Montserrat', sans-serif !important;
	font-weight: 800;
	color: #fff;
}
.descripcion-servicio{
	position: absolute;
	transform: translate(-20%, -60%);
	left: 20%;
	top:60%;
	color: #fff;
	z-index: 10;
	opacity: 0;
	transition: .7s;
}
.servicioGuardia{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/guardia-seguridad-home.jpeg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
	
}
.servicioGuardia:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioGuardia:hover::before{
	width: 100%;
}
.servicioGuardia:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioGuardia:hover::after{
	width: 100%;
}
.servicioGuardia:hover .logo-servicio{
	opacity: 1;	
}
.servicioGuardia:hover .nombre-servicio{
	opacity: 1;	
}
.servicioGuardia:hover .descripcion-servicio{
	opacity: 1;	
}
.servicioRuta{
	background: url(http://transbe.cl/wp-content/uploads/2019/10/servicio-seguridad-1.jpg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
}
.servicioRuta:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioRuta:hover::before{
	width: 100%;
}
.servicioRuta:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioRuta:hover::after{
	width: 100%;
}
.servicioRuta:hover .logo-servicio{
	opacity: 1;	
}
.servicioRuta:hover .nombre-servicio{
	opacity: 1;	
}
.servicioRuta:hover .descripcion-servicio{
	opacity: 1;	
}

.servicioEvento{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/eventos-masivos-home.jpeg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
}
.servicioEvento:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioEvento:hover::before{
	width: 100%;
}
.servicioEvento:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioEvento:hover::after{
	width: 100%;
}
.servicioEvento:hover .logo-servicio{
	opacity: 1;	
}
.servicioEvento:hover .nombre-servicio{
	opacity: 1;	
}
.servicioEvento:hover .descripcion-servicio{
	opacity: 1;	
}

.servicioTrafico{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/coordinador-trafico-home.jpeg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
}
.servicioTrafico:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioTrafico:hover::before{
	width: 100%;
}
.servicioTrafico:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioTrafico:hover::after{
	width: 100%;
}
.servicioTrafico:hover .logo-servicio{
	opacity: 1;	
}
.servicioTrafico:hover .nombre-servicio{
	opacity: 1;	
}
.servicioTrafico:hover .descripcion-servicio{
	opacity: 1;	
}

.servicioCapacitacion{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/capacitacion-home.jpg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
}
.servicioCapacitacion:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioCapacitacion:hover::before{
	width: 100%;
}
.servicioCapacitacion:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioCapacitacion:hover::after{
	width: 100%;
}
.servicioCapacitacion:hover .logo-servicio{
	opacity: 1;	
}
.servicioCapacitacion:hover .nombre-servicio{
	opacity: 1;	
}
.servicioCapacitacion:hover .descripcion-servicio{
	opacity: 1;	
}

.servicioOperador{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/servicio-monitoreo.jpg);
	background-size: cover;
	height: 400px;
	overflow: hidden;
	transition: .3s;
	position: relative;
	cursor: pointer;
}
.servicioOperador:before{
	content: "";
	position: absolute;
	display: block;
	left: 0;
	top: 0;
	height: 50%;
	width: 0%;
	background: rgba(172, 172, 202,.7);
	transition: .3s;
}
.servicioOperador:hover::before{
	width: 100%;
}
.servicioOperador:after{
	content: "";
	position: absolute;
	display: block;
	right: 0;
	bottom: 0;
	height: 50%;
	width: 0%;
	background: rgba( 13, 13, 148,.7);
	transition: .3s;	
}
.servicioOperador:hover::after{
	width: 100%;
}
.servicioOperador:hover .logo-servicio{
	opacity: 1;	
}
.servicioOperador:hover .nombre-servicio{
	opacity: 1;	
}
.servicioOperador:hover .descripcion-servicio{
	opacity: 1;	
}
.btn-mas-servicios{
	position: relative;
	background: #f8d020;
	padding: 10px 20px 10px 20px;
	color: #fff;
	font-size: 30px;
	text-decoration: none;
	box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
	z-index: 10;
	border-radius: 2px;	
	transition: .3s;
}
.btn-mas-servicios:hover{
	color: #fff !important;
	background: #f0c509;
	text-decoration: none;
	transition: .3s;
}
.contenedor-btn-servicios{
	background:#5858ac;
}
.btn-mas-servicios:hover:before {
	width: 100%;
}
.contenedor-carousel{
	background: url(http://transbe.cl/wp-content/uploads/2019/10/seguridad2.jpg);
	background-size: cover;
}
/*EMPRESA*/
.contenedor-imagen-empresa{
	background: url(http://transbe.cl/wp-content/uploads/2020/03/empresa-2.jpeg);
	background-size: cover;
}
.contenedor1{
	background: #0d0d94;
	color: #fff;
	transition: 1s;
}
.contenedor1:hover{
	background: #4242ac;
	
}
.titulo-header-empresa{
	font-size: 50px;
	font-weight:900;
	position: relative;
	padding:15px 10px 15px 10px;
	background: #0d0d94;
	display: inline-block;
	transform: translate(-50%,-50%);
	top: 50%;
	left:50%;
	font-family: 'Montserrat', sans-serif;
}
.titulo-empresa{
	text-transform: uppercase;
}
.transbe-empresa{
	color: #f8d020;
	text-transform: uppercase;
	font-weight: bold;
}
.contenedor-imagen{
	background: url(../img/seguridad2.jpg);
	background-size: cover;
}
.contenedor1{
	background: #0d0d94;
	color: #fff;
	transition: 1s;
}
.contenedor1:hover{
	background: #4242ac;
	transition: 1s;
}
.contenedor2{
	background: #4242ac;
	color: #fff;
	transition: 1s;
}
.contenedor2:hover{
	background: #0d0d94;
	transition: 1s;
}
.contenido-header-empresa{
	position: absolute;
	z-index: 20;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	font-size: 60px;
	font-weight: 900;
	font-family: 'Montserrat', sans-serif;
	text-transform: uppercase;
	background: #0d0d94;
}
/*SERVICIOS*/
.titulo-header-servicios{
	font-size: 50px;
	font-weight:900;
	position: relative;
	padding: 15px 10px 15px 10px;
	background: #0d0d94;
	display: inline-block;
	transform: translate(-50%,-50%);
	top: 50%;
	left:50%;
}
.contenedor-servicios{
	background-color: #c9c9d0;
}

.titulo-servicio-servicios{
	position: relative;
	display: inline-block;
	font-weight: bold;
	color: #fff;
	text-align: center;
}
.titulo-servicio-servicios:after{
	position: absolute;
	content: "";
	width: 50%;
	height: 3px;
	left: 50%;
	bottom:-10%;
	transform: translate(-50%,0%);
	background:#f8d020;
}

/*TRABAJA CON NOSOTROS*/
.titulo-header-trabaja{
	font-size: 50px;
	font-weight: 900;
	position: relative;
	padding: 15px 10px 15px 10px;
	background: #0d0d94;
	display: inline-block;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
}
.titulo-trabaja{
	color: #0d0d94;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	position: relative;
}
.titulo-trabaja:after{
	position: absolute;
	content: "";
	width: 50%;
	height: 8px;
	left: 50%;
	bottom: -15%;
	transform: translate(-50%,0%);
	background:#f8d020;
}

.beneficios{
	color: #fff;
}
.contenedor-formulario{
    background:transparent;
	padding: 10px 10px 0px 10px;
}
/*CLIENTES*/
.titulo-header-clientes{
	font-size: 50px;
	font-weight: 900;
	position: relative;
	padding: 15px 10px 15px 10px;
	background: #0d0d94;
	display: inline-block;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
}
.titulo-page-clientes{
	color: #0d0d94;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	position: relative;
}
.titulo-page-clientes:after{
	position: absolute;
	content: "";
	width: 50%;
	height: 8px;
	left: 50%;
	bottom: 0%;
	transform: translate(-50%,0%);
	background:#f8d020;
}
/*CONTACTO*/
.titulo-header-contacto{
	font-size: 50px;
	font-weight: 900;
	position: relative;
	padding: 15px 10px 15px 10px;
	background: #0d0d94;
	display: inline-block;
	transform: translate(-50%,-50%);
	top: 50%;
	left: 50%;
}

.titulo-page-contacto{
	color: #0d0d94;
	font-family: 'Montserrat', sans-serif;
	font-weight: 800;
	position: relative;
}
.titulo-page-contacto:after{
	position: absolute;
	content: "";
	width: 50%;
	height: 8px;
	left: 50%;
	bottom: 0%;
	transform: translate(-50%,0%);
	background:#f8d020;
}
/*PLANTILLA*/
.has-background-dim{
	margin: 0;
	padding: 0;
}
/*FORMULARIO*/
.wpcf7-form-control{
	width: 100%;
}
.wpcf7-submit{
	background:#f8d020;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	padding-top: 10px;
	padding-bottom: 10px;  
}