.visible-xs {
	display: hidden;
}


@media screen and (max-width: 767px) {
	.hidden-xs {
		display: none !important;
	}

	.visible-xs {
		display: block;
	}

	#preload {
		display: none;
	}
	
	body {
		padding-top: 72px;
	}
	
	section.with-extra-padding-top {
		padding-top: 0;
	}
	
	.navbar.nav-light {
		background: var(--high);
	}
	
	/* HEADER */
	.navbar {
		background: var(--high);
	}
	.navbar-nav {
	    background: var(--fade);
	}
	.navbar-default {
		min-height: 60px;
	}
	
	.navbar-brand {
		display: block;
	}
	.navbar-brand img {
		height: 50px;
	}
	
	.navbar-nav {
		display: block;
	}
	.navbar-nav .nav-item {
		display: block;
		height: auto;
		text-align: left;
	}

	.submenu {
		display: none;
	}

	.navbar-nav .nav-item a:before {
		content: '—';
	}

	.navbar-nav .nav-item a br {
		display: none !important;
	}

	.navbar-nav .nav-item a,
	.navbar-dark .navbar-nav .nav-link,
	.navbar.nav-light .navbar-nav .nav-item a,
	.navbar.nav-light .navbar-dark .navbar-nav .nav-link {
		color: var(--main);
		display: block;
		font-size: 16px;
		font-weight: 400;
		height: auto;
		line-height: 1;
		padding: 5px 15px;
		text-align: left;
	}
	.navbar-dark .navbar-nav .nav-link:focus,
	.navbar-dark .navbar-nav .nav-link:hover,
	.navbar-dark .navbar-nav .active>.nav-link,
	.navbar-dark .navbar-nav .nav-link.active,
	.navbar-dark .navbar-nav .nav-link.show,
	.navbar-dark .navbar-nav .show>.nav-link {
		color: var(--main);
		font-size: 16px;
		font-weight: 700;
	}
	
	.navbar.nav-light .navbar-nav .nav-item:last-child a,
	.navbar-nav .nav-item:last-child a {
		text-align: left;
	}	

	.navbar.fixed-top {
		position: fixed;
	}

	.navbar-dark .navbar-toggler, .navbar-toggler:focus, .navbar-toggler:hover {
		border: 1px solid rgba(255, 255, 255, 0.6);
		border-radius: 0;
		color: rgba(255, 255, 255, 0.8);
		margin-right: 10px;
		outline: 0;
		padding: 5px 10px;
	}

	.btn-menu-sm {
		border: 1px solid rgba(255, 255, 255, 0.6);
		border-radius: 0;
		color: rgba(255, 255, 255, 0.8);
		line-height: 1;
		margin-right: 10px;
		outline: 0;
	    padding: 8px 10px;
	}
	
	.navbar-dark .navbar-toggler-icon {

	}
	
	.title-lg {
		font-size: 22px;
		margin-bottom:
	 	text-align: center;
	}
	.title-lg br {
		display: none;
	}

	.box-image {
		height: 300px;
	}

	.box-service {
		margin: 0 auto;
		padding: 15px 50px;
	}
	.box-service .title-sm {
		margin-top: 5px;
	}

	.box-service .service-image > img {
		width: 100%;
	}

	.icon-list li img {
		margin-top: 5px;
		top: 5px;
	}
	.icon-list.icon-left li {
		margin-top: 10px;
	}

	.full-width, .img-fluid.full-width {
		margin-bottom: 15px;
	}

	.icon-list.icon-left li,
	.icon-list.icon-right li {
	    padding-left: 0;
	    padding-right: 0;
    	text-align: left;
	}
	.icon-list li span {
	    display: inline-block;
	    line-height: 1.2;
	    font-size: 16px;
	    padding-left: 10px;
	}
	.icon-list.icon-left li img,
	.icon-list.icon-right li img {
	    height: 25px;
	    margin: 0;
	    position: relative;
	    float: left;
	    top: -2px;
	}
	
	.text {
		text-align: center;
	}
	
	.with-padding, section.with-padding {
		padding: 15px 0;
	}

	.vertical-center.half {
		min-height: auto;
	}

	.meta-info {
	    padding: 15px;
	}

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

	.footer {
		padding: 15px 0 0 0;
	}

	/*contcat*/
	.margin-top-15-xs {
		margin-top: 15px;
	}
	.margin-top-50-xs {
		margin-top: 50px;
	}
	.margin-bottom-50-xs {
		margin-bottom: 50px;
	}

	.reset-padding {
		padding: 15px;
	}

	
	
	.layer-dark .text-min {
		color: var(--high);
		display: block;
		font-size: 14px;
		text-align: center;
	}

	.footer {
		text-align: center;
	}

	/*Ruben*/

	/*Menu movil*/

	.navbar-nav{
	   min-height: 90vh ;
	}

	.nav-item {
    	padding: 12px 0px !important;
    	border-bottom: 1px solid #f054228c;
	}

	.navbar-nav .nav-item a, .navbar-dark .navbar-nav .nav-link{
		font-size: 19px;
    	font-weight: 600;
	}

	.navbar-nav .nav-item a:before {
    	content: '' !important;
	}

	.sub-menu-celular{
	    background-color: #e5e5e5;
    	padding: 15px 0px;
    	border: 1px solid #e5e5e5;
	}

	.sub-menu-celular a{
		font-size: 16px !important;
	    padding: 12px 25px !important;

	}

	/*Home*/
	.centro-movil{
		text-align: center;
	}

	.carousel-item video {
    	height: 390px;
	}

	/*Footer*/
	footer .movil-left{
		width: 50% !important;
		text-align: left !important;
		padding: 12px 15px !important;
	}

	/*Espacio en los banner*/
	body {
    	padding-top: 60px !important;
	}

	/*SomosHebel*/
	.clientes-movil{
		width: 50% !important;
    	min-height: 55px !important;
    	margin: 15px 0px !important;
	}

	ul.text li {
    	text-align: left;
	}

	/*Sistemas*/
	.sistema-top{
		margin-top:5em;
	}

	.btn-sistema-movil{
		width: 50%;
		margin-bottom: 2em;
	}

	.box-service {
    	padding: 15px 10px;
	}

	.carousel-fade .carousel-item {
    	max-height: initial;
    }

    .dg-wrapper {
    	height: 320px !important;
	}

	/*distribuidores*/
	.bb{
		height: auto;
    	margin-bottom: 10px;
	}

	.movil-center-title{
		text-align: center;
	}

	/*360*/
	.box-360 {
    	margin: 4em auto;
    	width: 330px;
	}

	/*Aplicaciones*/
	.vertical-banner {
		margin: 15px auto !important;
	}

	.timeline-vertical p{
		text-align: left;
	}
}

@media (min-width: 768px) {
	.text-right-sm {
		text-align: right;
	}
}

@media (min-width: 992px) {
	
}

@media (min-width: 1200px) {
	
}

@media (min-width: 1400px) {
	
}