body{
	font-family: 'Pontano Sans', sans-serif;
}

h2{
	font-family: 'Advent Pro', sans-serif;
	font-size: 40px;
}

.black{
	background-color: #0071bb !important
}


#section-1 {
	margin:0px;
	padding-bottom: 70px
}

#section-1 .background{
	background-image: url(../imgs/section1.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 500px;
	position: relative;
}

#section-1 #content-info1{
	width: 100%;
	margin: 0px;
}


#section-1 #content-cel1{
	padding-left: 0
}

#section-1 #content-cel1 #celular1{
	width: 100%;
	max-width: 600px;
	height: auto;
	min-height: 582px;
    min-width: 545px; position: relative;
}

#section-1 #content-info1 #logo{
	padding-top: 100px;
	width: 500px;
	margin: auto;
	margin-bottom: 15px;
	/*max-width: 500px*/
}

#section-1 #content-info1 #content-text{
	padding-top: 15px;
	padding-bottom: 40px
}

#section-1 #content-info1 #content-text #text1{
	font-size: 20px;
	color: white;
	margin: 0;
	position: absolute;
	top: -20px;
	font-family: 'Pontano Sans', sans-serif;
}

#section-1 #content-info1 #content-text #text2{
	/*text-align: left;*/
	font-size: 30px;
	color: white;
	margin: 0;
	position: relative;
	display: inline-block;
	font-family: 'Advent Pro', sans-serif;
}

#section-1 #content-info1 #content-text #text3{
	font-size: 20px;
	color: white;
	margin: 0;
	position: absolute;
	right: 0;
	top: 28px;
	font-family: 'Pontano Sans', sans-serif;
}

#section-1 #linea{
	width: 25%;
	min-width: 100px;
	height: 2px;
	background-color: white;
	margin: auto;
}

#linea2{
	width: 100%;
	height: 1px;
	background-color: black;
	margin: auto;
	position: absolute;
	left: 196px;
	top: -6px;
}

#section-1 #text4{
	color: white;
}

#section-1 #btn-play-store{
	width: 120px;
}

#section-1 #content-text5{
	position: absolute;
	top: 89%;
	/*right: -552px;*/
	right: -389px
}

#section-1 .text5{
	font-size: 16px;
	margin-top: 0px;

}




/*section 2*/

#section-2{
	margin: 0px;
	padding-top: 60px;
}

#section-2 h2{
    margin-left: 50px;
}

#section-2 p{
    margin-left: 50px;
    font-size: 16px;
    text-align: justify;
}

#section-2 .content-iconos{
	padding: 30px 0px
}

#section-2 .content-iconos label{
	font-size: 16px;
	font-weight: normal;
	/*text-align: center;*/
}

#section-2 #icono1, #section-2 .flecha{
	width: 100px
}

#section-2 .flecha{
	position: absolute;
	top: 42px;
	right: -52px
}

#section-2 #flecha2{
	left: -52px
}

#section-2 #celular2-md{
	margin-top: -74px
}

#section-2 #celular2-sm{
	max-width: 305px;
	margin: auto;
}


/*#section-3*/

#section-3{
	margin: 0px;
	padding-top: 40px;
	background-color: #e2e2e2;
	padding-bottom: 30px
}
#section-3 h2{
	margin-bottom: 40px
}

#section-3 p, #section-3 label{
	font-size: 17px;
	margin-bottom: 20px;
	font-weight: normal;
}

#section-3 label{
	margin: 0px
}

#section-3 #lista li{
   margin-bottom: 10px;
   font-size: 17px
}

#section-3 #celular3-sm{
	width: 350px;
	margin: auto;
}




.navbar-inverse {
	-webkit-transition: .8s;
	-o-transition: .8s;
	-moz-transition: .8s;
	-ms-transition: .8s;
	transition: .8s;
	top: -60px;
    border-color: transparent;
    background-color: transparent;
}

.navbar-inverse .navbar-collapse{
	border: none;
}

.navbar-inverse .navbar-nav>li>a {
	display: inline-block;
    color: white;
    font-size: 18px;
    transition: .4s;
	box-shadow: inset 0px 0px 100px 0px rgba(255,255,255,0);
	-webkit-box-shadow: inset 0px 0px 100px 0px rgba(255,255,255,0);
	-o-box-shadow: inset 0px 0px 100px 0px rgba(255,255,255,0);
	-moz-box-shadow: inset 0px 0px 100px 0px rgba(255,255,255,0);
	-ms-box-shadow: inset 0px 0px 100px 0px rgba(255,255,255,0);
	-webkit-transition:box-shadow .4s;
}

.navbar-inverse .navbar-nav>li>a:hover {
    color: white;
    background: rgba(0,0,0,.5);
    box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,0.5);
	-o-box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,.5);
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,.5);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,.5);
	-ms-box-shadow: inset 0px 0px 0px 0px rgba(255,255,255,.5);
}

.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: transparent;
}


.navbar-inverse .navbar-toggle {
    border: none;
}

.navbar-brand img{
	margin-top: -2px;
	width: 120px;
}

/*footer*/

#footer{
	background-image: url(../imgs/footer.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0px;
	margin: 0px;
	width: 100%;
}

#footer p,  #footer span{
	color: white;
}

#footer p{
	font-size: 16px;
}

#footer span{
	font-size: 25px;
}

#footer #footer-bottom{
	background-color: #1a3449;
	padding: 20px
}

#footer a{
	text-decoration: none;
	color: white
}

@media(max-width: 320px){
   #text4-xs{
   	  font-size: 12px !important
   }
}

@media (min-width: 768px) {

	#footer .colum{
		height: 200px;
		/*display: table;*/
	}


	#footer #col-1{
		padding-top: 60px
	}

	#footer #col-2{
		padding-top: 30px
	}

	#footer #col-2 p{
		position: relative;
	}

	#footer #col-2 #icon-market{
		position: absolute;
		left: -26px;
		top: 43px;
	}

	#footer #col-4, #col-5{
        padding-top: 50px;
	}


	#footer p, #footer span{
		text-align: justify;
		display: inline-block;
	}

	#footer #text-phone-number, #footer #text-tel-number{
		position: relative;
	}

	#footer #icon-mobile, #footer #icon-mobile{
		position: absolute;
		left: -19px;
	}

	#footer #icon-tel{
		top: -20px
	}
}

@media (max-width: 768px){
	#section-1 .background{
		background-position: right;
	}

	/*xs*/

	.xs{
		padding-bottom: 62px;
	}

	.xs-2{
        position: absolute;
        top: 500px
	}


		#text1-xs{
			display: inline-block;
			position: relative;
			color: white;
			font-size: 20px;
		}

		#text2-xs, #text3-xs{
		   position: absolute;
		   top: -14px;
		   font-size: 15px;
		}

		#text3-xs{
			top: 20px;
			right: 0
		}


		#btn-descargar-xs{
			color: white;
			border: 2px solid white;
			text-decoration: none;
			padding: 10px 50px;
			font-size: 17px;
			margin: auto;
			display: inline-block;
		}


		.btn-store img{
		   width: 130px
		}

		#text4-xs{
			text-align: left;
			font-size: 13px;
			padding-top: 10px
		}

		#linea-xs{
			height: 1px;
			width: 150%;
			background: black;
			position: absolute;
			top: 100%;
			left: 32%
		}



    #section-2{
    	margin-top: 100px
    }

	#section-2 .flecha{
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
        width: 50px;
        top: 160px;
		left: 50%;
		margin-left: -24px;
	}

	#section-2 #flecha2{
		left: 50%;
		margin-left: -24px;
		top: -22px
	}

}

@media (max-width: 991px) {
	#section-1 #content-info1 #content-text #text1, #section-1 #content-info1 #content-text #text3{
		font-size: 16px
	}

    #section-1 #content-info1 #content-text #text2{
		font-size: 21px
	}

	#section-2{
		padding-top: 0
	}

	#section-2 h2{
        text-align: center;
        margin-left: 0
	}

	#section-2 p{
		text-align: justify;
		margin-left: 0
	}

	
	#section-3 h2{
		text-align: center;
	}

	#section-3 p{
		text-align: center;
	}
	
}

@media (min-width: 2000px){
	
	.navbar-inverse, #section-1, #section-2, #section-3, #section-4, #footer{
        max-width: 1500px;
        margin: auto;
	}
}