@charset "utf-8";
@font-face{
	 font-family:Gotham-Bold;
	src: url("../fonts/Gotham-Bold.otf");
}
@font-face{
	 font-family:Gotha-Book;
	src: url("../fonts/Gotham-Book.otf");
}
@font-face{
	 font-family:Gotham-Light;
	src: url("../fonts/Gotham-Light.otf");
}
body{
    -webkit-overflow-x:hidden;
	-moz-overflow-x:hidden;
	overflow-x:hidden;
}
.shome1{
	background-image:url("../imagenes/home/fondopc.png");
	background-repeat:no-repeat;
	background-size: cover;
	margin-top:5%;
}
#inicio_texto{
	width:30%;
	float:left;
	margin-left:8%;
	margin-top:8%;
}
#inicio_texto h1{
	font-family:Gotham-Bold;
	font-size:70px;
	color:white;
}
#inicio_texto p{
	font-family:Gotham-Light;
	font-size:25px;
	color:white;
}
#inicio_imagen{
	width:40%;
	display:inline-flex;
	margin-left:6%;
}
#selecciona_h2{
	color:white;
	text-align:center;
	font-family:Gotham-Bold;
	font-size:30px;
	margin-top:3%;
}
#selecciona{
	color:white;
	text-align:center;
	font-family:Gotham-Light;
	font-size:25px;
}
#tipo_paq div{
	width:20%;
	height:250px;
	text-align:center;
	font-family:Gotham-Bold;
	font-size:20px;
	background:white;
	border-radius:20px;
	display:inline-table;
	margin-left:4%;
	margin-top:5%;
	margin-bottom:10%;
	border:none;
	-webkit-box-shadow: 5px 5px 5px rgba(222,222,222,0.4);
  	-moz-box-shadow: 5px 5px 5px rgba(222,222,222,0.5);
  	color:black;
}
#tipo_paq div:hover{
	width:22%;
	height:255px;
	margin-top:2%;
}
#tipo_paq div img{
	margin-top:5%;
}
#select{
	background:#E20613;
	color:white;
	font-family:Gotham-Light;
	font-size:20px;
	text-align:center;
	padding:2%;
	border-radius:0px 0px 20px 20px;
	position:relative;
	top:10%;
	opacity:0;
}
#select:hover{
	opacity:1;
	top:5.5%;
}

.shome2 div{
	font-family:Gotham-Light;
	font-size:25px;
}
#img_shome2{
	width:40%;
	float:left;
	margin-left:6%;
	}
#text_shome2{
	width:40%;
	display:inline-block;
	margin-top:15%;
	margin-left:7%;
}
#text_shome2 span{
	font-family:Gotham-Bold;
}
.shome3{
	margin-top:15%;
}
.shome3 h2{
	font-family:Gotham-Bold;
	font-size:25px;
}
.shome3 p{
	font-family:Gotham-Light;
	font-size:20px;
}
#service div{
	padding-bottom:10%;
}
#service_img{
	width:25%;
	margin-left:8%;
	float:left;
}
#service_img img{
	width:100%;
}
#service_text{
	width:30%;
	display:inline-block;
	margin-top:7%;
}
#confianza div{
	padding-bottom:10%;
}
#confianza_img{
	width:25%;
	margin-left:-10%;
	float:left;
}
#confianza_img img{
	width:100%;
}
#confianza_text{
	width:30%;
	display:inline-block;
	margin-top:7%;
}
#eficiencia div{
	padding-bottom:10%;
}
#eficiencia_img{
	width:25%;
	margin-left:-15%;
	float:left;
}
#eficiencia_img img{
	width:100%;
}
#eficiencia_text{
	width:30%;
	display:inline-block;
	margin-top:7%;
}
.shome4{
	background-image:url("../imagenes/home/ciudad.png");
	background-repeat:no-repeat;
	background-size:100% 100%;
	height:720px;
	text-align:center;
}
.shome4 h1{
	padding-top:42%;
	font-family:Gotham-bold;
	font-size:40px;
}
.tyc{
    text-decoration:none;
    color:black;
}
.tyc:hover{
    text-decoration:underline;
    color:black;
}
#cambiarp{
	padding-top: 3%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:30px;
    height: 12%;
    border-radius: 10px;
}
#cambiarp a{
    text-decoration:none;
    color:black;
}
#cambiarc{
	padding-top: 3%;
    margin-top: -13%;
    margin-left: 50%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:30px;
    background: #D9D9D9;
    height: 12%;
    border-top-right-radius: 30px;
}
#cambiarc a{
    text-decoration:none;
    color:black;
}
.btn-cerrar{
	font-family:Gotham-Bold;
	font-size: 25px;
	color: #BBBBBB;
	text-decoration: none;
	margin-left: 90%;
}
.btn-cerrar:hover{
	color: black;
}
#t1{
    margin-top: -1%;
    margin-bottom: 1%;
}
.campos{
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: Gotha-Book;
    font-size: 20px;
    width: 70%;
    height: 35px;
    background: #F1F1F9;
    border: 1px solid #bbbbbb;
}
#logi img{
    width: 30%;
}
.checka{
    margin-top: 3%;
    font-family: Gotha-Book;
    font-size: 17px;
}
.btnr{
    margin-top: 3%;
    background: #0F4495;
    border: none;
    border-radius: 3px;
    font-family: Gotha-Book;
    font-size: 20px;
    color: white;
    width: 70%;
    height: 40px;
}
.btnr:hover{
	background: #1862D1;
}
.notienes{
    margin-top: 3%;
    font-family: Gotha-Book;
    font-size: 15px;
}
.notienes a{
    text-decoration: none;
}
.overlay{
    background: rgba(0,0,0,.6);
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}
.overlay.active{
    visibility: visible;
}
.popup{
    background: #f8f8f8;
    border-radius: 30px;
    font-family: Gotha-Book;
    font-size: 20px;
    text-align: center;
    width: 40%;
    height: 85%;
    transition: .3s ease all;
    transform: scale(0.7);
    opacity: 0;
}
.popup.active{
	opacity: 1;
	transform: scale(1);
}
#cambiarp2{
	padding-top: 3%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:30px;
    background: #D9D9D9;
    border-top-left-radius: 30px;
    height: 13%;
}
#cambiarp2 a{
    text-decoration:none;
    color:black;
}
#cambiarc2{
	padding-top: 3%;
    margin-top: -13.3%;
    margin-left: 50%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:30px;
    height: 13%;
    border-top-right-radius: 30px;
}
#cambiarc2 a{
    text-decoration:none;
    color:black;
}
.btn-cerrar2{
	font-family:Gotham-Bold;
	font-size: 25px;
	color: #BBBBBB;
	text-decoration: none;
	margin-left: 90%;
}
.btn-cerrar2:hover{
	color: black;
}
#t12{
    margin-top: 2%;
    margin-bottom: 2%;
}
.campos2{
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: Gotha-Book;
    font-size: 20px;
    width: 70%;
    height: 35px;
    background: #F1F1F9;
    border: 1px solid #bbbbbb;
}
#logi2 img{
    width: 30%;
}
.checka2{
	width: 50%;
    margin-top: 3%;
    font-family: Gotha-Book;
    font-size: 17px
}
.olvide{
	width: 50%;
	font-family: Gotha-Book;
    font-size: 15px;
    margin-left: 41%;
    margin-top: -3.3%;
}
.olvide a{
	text-decoration: none;
	color: black;
}
.olvide:hover{
	text-decoration: underline;
	color: black;
}
.btne{
    margin-top: 5%;
    background: #0F4495;
    border: none;
    border-radius: 3px;
    font-family: Gotha-Book;
    font-size: 20px;
    color: white;
    width: 70%;
    height: 40px;
}
.btne:hover{
	background: #1862D1;
}
.tienes{
    margin-top: 5%;
    font-family: Gotha-Book;
    font-size: 15px;
}
.tienes a{
    text-decoration: none;
}
.overlay2{
    background: rgba(0,0,0,.6);
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}
.overlay2.active{
    visibility: visible;
}
.popup2{
    background: #f8f8f8;
    border-radius: 30px;
    font-family: Gotha-Book;
    font-size: 20px;
    text-align: center;
    width: 40%;
    height: 80%;
    transition: .3s ease all;
    transform: scale(0.7);
    opacity: 0;
}
.popup2.active{
	opacity: 1;
	transform: scale(1);
}
@media screen and (max-width: 600px){
	.shome1{
	background-image:url("../imagenes/home/fondomovil.png");
	background-repeat:no-repeat;
	background-size: cover;
	margin-top:-8%;
}
	#inicio_texto{
	width:90%;
	float:none;
	margin-left:5%;
	margin-top:8%;
	text-align:center;
}
#inicio_texto h1{
	font-family:Gotham-Bold;
	font-size:50px;
	color:white;
}
#inicio_texto p{
	font-family:Gotham-Light;
	font-size:25px;
	color:white;
}
#inicio_imagen{
	width:90%;
	display:block;
	margin-left:5%;
}
#inicio_imagen img{
	width:100%;
}
#tipo_paq div{
	width:42.5%;
	margin-left:4%;
}
#tipo_paq div:hover{
    width:42.5%;
}
#tipo_paq h2{
	font-size:20px;
}
#tipo_paq div img{
	width:80%;
}
#img_shome2{
	width:90%;
	float:none;
	margin-right:5%;
	}
	#img_shome2 img{
		width:100%;
	}
#text_shome2{
	width:90%;
	display:block;
	margin-top:15%;
	margin-left:5%;
	text-align:center;
}
.shome3 p{
	font-size:18px;
}
#service_img{
	margin-left:3%;
}
#service_text{
	width:60%;
	margin-top:2%;
	margin-left:2%;
}
#confianza div{
	padding-bottom:10%;
}
#confianza_img{
	margin-left:3%;
}

#confianza_text{
	width:60%;
	margin-top:2%;
	margin-left:2%;
}
#eficiencia div{
	padding-bottom:10%;
}
#eficiencia_img{
	margin-left:2%;
}

#eficiencia_text{
	width:60%;
	margin-top:2%;
	margin-left:2%;
}
.shome4{
	height:300px;
}
.shome4 h1{
	padding-top:67%;
	font-family:Gotham-bold;
	font-size:20px;
}
footer{
	margin-top:-5%;
}
#cambiarp{
	padding-top: 3%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:20px;
    height: 12%;
    border-radius: 10px;
}
#cambiarp a{
    text-decoration:none;
    color:black;
}
#cambiarc{
	padding-top: 3%;
    margin-top: -24%;
    margin-left: 50%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:20px;
    background: #D9D9D9;
    height: 12%;
    border-top-right-radius: 30px;
}
#cambiarc a{
    text-decoration:none;
    color:black;
}
.btn-cerrar{
	font-family:Gotham-Bold;
	font-size: 25px;
	color: #BBBBBB;
	text-decoration: none;
	margin-left: 90%;
}
.btn-cerrar:hover{
	color: black;
}
#t1{
    margin-top: 2%;
    margin-bottom: 2%;
}
.campos{
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: Gotha-Book;
    font-size: 20px;
    width: 70%;
    height: 35px;
    background: #F1F1F9;
    border: 1px solid #bbbbbb;
}
#logi img{
    width: 30%;
}
.checka{
    margin-top: 3%;
    font-family: Gotha-Book;
    font-size: 17px;
}
.btnr{
    margin-top: 3%;
    background: #0F4495;
    border: none;
    border-radius: 3px;
    font-family: Gotha-Book;
    font-size: 20px;
    color: white;
    width: 70%;
    height: 40px;
}
.btnr:hover{
	background: #1862D1;
}
.notienes{
    margin-top: 5%;
    font-family: Gotha-Book;
    font-size: 15px;
}
.notienes a{
    text-decoration: none;
}
.overlay{
    background: rgba(0,0,0,.6);
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}
.overlay.active{
    visibility: visible;
}
.popup{
    background: #f8f8f8;
    border-radius: 30px;
    font-family: Gotha-Book;
    font-size: 20px;
    text-align: center;
    width: 80%;
    height: 90%;
    transition: .3s ease all;
    transform: scale(0.7);
    opacity: 0;
}
.popup.active{
	opacity: 1;
	transform: scale(1);
}
#cambiarp2{
	padding-top: 3%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:20px;
    background: #D9D9D9;
    border-top-left-radius: 30px;
    height: 13%;
}
#cambiarp2 a{
    text-decoration:none;
    color:black;
}
#cambiarc2{
	padding-top: 3%;
    margin-top: -24%;
    margin-left: 50%;
    width: 50%;
    font-family:Gotham-Bold;
    font-size:20px;
    height: 13%;
    border-top-right-radius: 30px;
}
#cambiarc2 a{
    text-decoration:none;
    color:black;
}
.btn-cerrar2{
	font-family:Gotham-Bold;
	font-size: 25px;
	color: #BBBBBB;
	text-decoration: none;
	margin-left: 90%;
}
.btn-cerrar2:hover{
	color: black;
}
#t12{
    margin-top: 2%;
    margin-bottom: 2%;
}
.campos2{
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: Gotha-Book;
    font-size: 20px;
    width: 70%;
    height: 35px;
    background: #F1F1F9;
    border: 1px solid #bbbbbb;
}
#logi2 img{
    width: 30%;
}
.checka2{
	width: 50%;
    margin-top: 3%;
    font-family: Gotha-Book;
    font-size: 17px
}
.olvide{
	width: 50%;
	font-family: Gotha-Book;
    font-size: 15px;
    margin-left: 41%;
    margin-top: -3.3%;
}
.olvide a{
	text-decoration: none;
	color: black;
}
.btne{
    margin-top: 5%;
    background: #0F4495;
    border: none;
    border-radius: 3px;
    font-family: Gotha-Book;
    font-size: 20px;
    color: white;
    width: 70%;
    height: 40px;
}
.btne:hover{
	background: #1862D1;
}
.tienes{
    margin-top: 5%;
    font-family: Gotha-Book;
    font-size: 15px;
}
.tienes a{
    text-decoration: none;
}
.overlay2{
    background: rgba(0,0,0,.6);
    position: fixed;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    visibility: hidden;
}
.overlay2.active{
    visibility: visible;
}
.popup2{
    background: #f8f8f8;
    border-radius: 30px;
    font-family: Gotha-Book;
    font-size: 20px;
    text-align: center;
    width: 80%;
    height: 80%;
    transition: .3s ease all;
    transform: scale(0.7);
    opacity: 0;
}
.popup2.active{
	opacity: 1;
	transform: scale(1);
}
}
@media screen and (max-width: 450px){
    .shome4 h1{
	padding-top:57%;
	margin-bottom:5%;
	font-family:Gotham-bold;
	font-size:20px;
}
}
@media screen and (max-width: 380px){
    .shome4 h1{
	padding-top:67%;
	margin-bottom:5%;
	font-family:Gotham-bold;
	font-size:20px;
}
}