@media only screen and (max-width: 640px){

/***************SLIDER***************/

	.menu a.navbar-brand {
		padding-left: 5px;
	}
	.menu a.navbar-brand img{
				height: 50px;
	}
	
	.fade-carousel .slides .slide-1, 
	.fade-carousel .slides .slide-2,
	.fade-carousel .slides .slide-3 {
		background-position: left;
	}

	.hero{
		text-align: center;
	}

    .hero h1 { font-size: 3rem; }    

    .carousel-indicators{
    	bottom: -5px;
    }


/***************SERVICIOS***************/
	#servicios{
		background-position: center center;
		height: 50vh;
		padding: 0;
	}
	#servicios ul{
		padding: 0;
		margin:0 0 0 5px;
	}
	#servicios h3{
		font-size: 2rem;
		font-weight: bold;
		color: white;
	}
	#servicios li{
		font-size: 1.5rem;
	}
	
	/***************PARTNERS***************/
	#partners{
		height: 25vh;
	}

	#partners h2{
		font-size: 2.4rem;
	}

	#partners img{
		max-width: 50px;
	}

	/***************FOOTER***************/

	footer div.row p{
		margin-top: 15px;
		text-align: justify;
	}

	/*********************************************/
	/******************SERVICIOS******************/
	/*********************************************/

	.serv li{
		width: calc(100% / 2)
	}

	.servicio .titular h2{
	  font-size: 3rem;
	}
	.servicio .titular p{
	  font-size: 1.5rem;
	}

	.serv li a div h3 {
	  font-size: 1.3em;
	  padding: 0 10px;
	}

	.serv li a div p {
		font-size: 1em;
		padding: 0 10px;
	}

	div.testimonios{
 		height: 48vh;
	}

	.testimonios h1 {
		font-size: 2.2rem;
		color: #0f4688;
	}

	.portada h3{
		font-size: 3rem;
		padding-top: 40px;
	}

	.portada p{
  		font-size: 2rem;
  	}

	div.seguridad{
		height: 30vh;
	}

	div.servcli{
		height: 30vh;
	}

	div.planes{
		height: 30vh;
	}

	div.alertas{
		height: 30vh;
	}

	div.soporte{
		height: 30vh;
	}

	div.estadisticas{
		height: 30vh;
	}

	div.tecnologia{
		height: 30vh;
	}

	div.vacantes{
		height: 30vh;
	}

  	div.descripcion{
  		height: 65vh;
  	}

  	div.descripcion h4{
  		font-size: 2rem;
  	}

  	.descripcion p{
  		font-size: 1.5rem;
  	}

  	div.descripcion ul li{
  		font-size: 1.5rem;
  	}

  	.descripcion img{
  		
  		width: 200px;
  	}
	
	div.slogan{
		height: 20vh;
		background-position: bottom;
	}

  	.slogan p{
  		font-size: 2rem;
  	}
  	.slogan p span{
  		font-size: 2.5rem;
  	}
  	.slogan p i{
 		font-size: 2.5rem;
	}

	/*********************************************/
	/********************About********************/
	/*********************************************/
	
	.lineadetiempo h2{
	  	font-size: 2rem;
	}
	.lineadetiempo p{
	  	font-family: 'Poppins';
	  	font-size: 1.5rem;
	}
	.timeline > li > .timeline-panel {
		width: 100%;
		padding: 10px;
		margin-top: 70px;
	}

	.timeline > li:not(.timeline-inverted) {
	  	padding-right:0px;
	}
	.timeline > li.timeline-inverted {
      	padding-left: 0px;
	}
	.timeline > li > .timeline-badge {
		top: 0;
	}

	.timeline > li.timeline-inverted + li:not(.timeline-inverted),
	.timeline > li:not(.timeline-inverted) + li.timeline-inverted {
		margin-top: 0;
	}
	.timeline > li > .timeline-panel::before{
		right: -35px;
	}

	.timeline > li > .timeline-panel::after{
		right: -35px;
	}

	.timeline > li.timeline-inverted > .timeline-panel::before{
		left: -35px;
	}

	.timeline > li.timeline-inverted > .timeline-panel::after{
		left: -35px;	
	}

	#contacto div.mensaje h3 {
    	font-size: 2.5rem;
    }

    #contacto div.mensaje p{
   		font-size: 1.5rem;
   	}
   	div.mensaje h4{
  		font-size: 2.5rem;
  	}
}