@import url('https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap');

*{box-sizing: border-box;}

div#index-mobile{display: none;}  
div::-webkit-scrollbar { display: none;}

body#body_guide{margin: 0; box-sizing: border-box; font-family: 'Lato'}

div#gps {background: #eee; color: gray; width: 100%; text-align: center; position: fixed; bottom: 0; z-index:11; padding: 21px 0;}
div#gps i{color: gray;}
div#gps i:last-child{position: absolute; right: 3%;}
div#gps span{font-weight: 900; text-decoration: underline; cursor: pointer;}

.inner{width: 1000px; margin:  auto;}
button{font-family: 'Montserrat', sans-serif; background: #DDDB00; color: white; border: none; text-transform: uppercase; cursor: pointer;}
button:hover{text-shadow: 6px 6px 12px #fff; transition:0.5s;}

.map{display: none; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;}
.map-show{display: block}

.see_more-mobile{display: none;}

.after-banner-text{font-size: 40px; text-align: center;}


/*Banner nuevo*/
div#index{width: 100%; position: relative; padding-top:120px; background: #E04E27; padding-bottom: 60px;}

div#index .banner{max-width: 1200px; margin:auto; display: flex; justify-content: center; align-items: center; gap:3%; color: white; text-align: center;}
div#index .box-1{flex: 45%; position: relative;}
div#index .box-1 .banner-title{width: 90%; margin-left: auto;}
div#index .box-1 .banner-title h1{text-align: center; font-size: 3em;}
div#index .box-1 .banner-title p{font-size: 1.7em;}
div#index .box-1 .banner-title button{background: transparent; padding: 1em; border-radius: 2em; border: 2px solid white; font-weight: 500}
div#index .box-2{flex: 22%}
div#index .box-2 .banner-img{width: 100%;}
div#index .box-2 .banner-img img{width: 100%; display: block;}
div#index .box-3{flex: 27%; position: relative;}
div#index .box-3 .banner-text{font-size: 1.7em; display: flex; flex-direction: column;}
div#index .box-3 .banner-text p {text-align: initial}
	

/*Banner viejo*/
/*div#index{width: 100%; position: relative; padding-top:60px;}
div#index>img{display: block; width: 83%; margin-left: auto;}
div#index .index-text{position: absolute; top: 0; left: 0; bottom: 0; right: 0;}
div#index .index-text>div{max-width: 83%; margin: auto;}
div#index .index-text>div div{width: 630px; margin-top: 210px;}
div#index .index-text>div div h1{font-size: 4em; margin: 0;}
div#index .index-text>div p{font-size: 1.67em; font-weight: 500; font-family:'Montserrat', sans-serif; text-align: justify; margin: 30px 0 40px 0;}
div#index .index-text>div button{padding: 1em; background: #DDDB00; color: white; border-radius: 2em; border: none; font-size: 1.2em; font-weight: 700; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}*/ 

.modal{position: fixed; background: white; top: 0; left: 0; right: 0; bottom: 15%; z-index: 13; background: #E04E27; opacity: 0; pointer-events:none; transition:0.5s}
.lead_overflow-2{width: 202%; display: flex;gap:1%; position: relative}
.m-top{margin-top:150px;}
.lead_overflow-desktop{width: 100%;}

form#form_Guide{margin-top: 70px;}
form#form_Guide input, form#form_Guide select{font-family: 'DM Sans', sans-serif; width:100%; padding: 1em; padding-left:60px; border-radius: 2em; border: none; background: #eee; position: relative; font-size: 1em;}
form#form_Guide input+div{width: 300px; margin-top: 10px;}
form#form_Guide select option{padding: 1em; }
form#form_Guide select{border-right: 10px solid transparent; margin-top: -2px;}
form#form_Guide button{background: #DDDB00; font-weight: 600; font-size: 1em;display: block; margin: 30px auto; border-radius: 1em; padding: 0.5em;}
div#filter{width: 100%; display: flex; justify-content: space-between;}
div#filter>div{width: 300px; position: relative;}
div#filter>div i{position: absolute; top: 33%;z-index: 5;left: 90%;}
div#filter>div i:first-child{position: absolute; top: 33%; left: 10%;  z-index: 3;}

div#type{margin-top: 100px; width: 100%;}
div#type a{color: black; text-decoration: none;}
div#type a:hover{color: #E04E27}
div#type>div{width: 100%; overflow-x: auto; margin: 70px 0;}
div#type>div>div{display: flex; justify-content: space-between;}
div#type .type-capsule{cursor: pointer; width: 90px;}
div#type .type-capsule>div{width: 50px; height: 50px; border-radius: 50%; margin: auto; display: flex; align-items: center; justify-content: center;}
div#type .type-capsule>div i{font-size: 2.5em;}
div#type .type-capsule p {font-size: 0.8em; text-align: center; font-weight: 600;}
div#type .type-capsule:hover{color: #E04E27;}

 .tooltiptext {visibility: hidden; background: #E04E27;;color: #fff;text-align: center;border-radius: 6px;padding: 5px 0;position: absolute;z-index: 1;bottom: 125%;left: 10%; right:10%;opacity: 0;transition: opacity 0.3s;}
 .tooltiptext::after { content: "";position: absolute;top: 100%;left: 50%;margin-left: -5px;border-width: 5px;border-style: solid;border-color: #E04E27 transparent transparent transparent;}
 .tooltiptextShow {visibility: visible;opacity: 1;}
 
 .suggest{margin-top: 10px; width: 100%; position: absolute; background: #eee; z-index: 11;}

div#order{display: flex; justify-content: space-between; font-family:'DM Sans', sans-serif }
div#order>div>span{color: #E04E27; text-decoration: underline; cursor: pointer; width: 200px;}
div#order span+div{display:flex; justify-content: end; align-items: baseline;}
div#order span:first-child{border-radius: 5px; padding:0.5em; text-decoration: none}
div#order a{color: black; text-decoration: none}
div#order span:nth-child(2){color: #E04E27; text-transform: capitalize;}
div#order select{color:gray; font-family:'DM Sans', sans-serif;  -moz-appearance: none; border:none; text-indent: 0.01px; text-overflow: ''; background: white; -webkit-appearance:none; -ms-appearance:none; -o-appearance:none; appearance:none; padding:2px;}
div#order select:focus{outline: none; font-family:'DM Sans', sans-serif; }
div#order select option{color: gray;}
div#order i{color: gray;}

div#map{width: 880px; height: 600px; margin: 100px auto; transition:0.5s}

.counter_swiper{display: none;}
.slide-arrow{visibility: hidden; position: absolute;right: 6%;z-index: 10;top: 30%;font-size: 2em;color: gray;}
div#leads{width:90%; margin:50px auto; transition:0.5s}
div#leads .lead{width: 100%; padding: 10px; margin-bottom: 20px; border-radius: 10px; display: flex; justify-content: space-between; background: #eee;}
div#leads .lead:hover{cursor: pointer;}
/*div#leads .lead i{display: none;}*/
.lead-box{display:none!important;}
.lead_overflow{width: 202%; display: flex;gap:1%; position: relative}
div#leads .lead h3{margin: 0; font-size: 1.4em;}
div#leads .lead .span1{font-size: 0.7em; font-family: 'Montserrat', sans-serif}
div#leads .box-info>div {display: flex; width: 100%; gap:20px; font-family: 'Montserrat', sans-serif}
div#leads .box-info>div>div:first-child{width: 80px; height: 80px; /*background: gray;*/ border-radius: 1em; }
div#leads .box-ig>div{display: flex; flex-wrap: wrap; width: 100%; justify-content: center; gap:0; position: relative;}
div#leads .box-ig>div>div{width: 60px; height: 60px; border-radius: 0; margin: 1px;}
div#leads .box-ig>div>div img{width: 100%;}
div#leads .distance{font-size: 0.8em; width: 100%}
div#leads .lead-box>div{display: flex; flex-wrap: wrap; width: 100%; justify-content: space-between; gap:0;position: relative;}
div#leads .lead-box>div>div{width: 90px; border-radius: 0; height: auto;}
div#leads .lead-box>div>div .img{width: 100%; position: relative; height: 90px; border-radius: 0.5em; overflow: hidden}
div#leads .lead-box img{width: 100%; display: block; height: 90px;}
div#leads .lead-box .p-title{font-size: 0.6em; height: 10px; overflow: hidden; margin-top: 5px;}
div#leads .lead-box .p-price{font-size: 0.6em; color: gray; margin-top: 5px;}



/*div#leads .lead>div>div:first-child img{width: 100%;}*/
div#leads .box-info>div>div:nth-child(2)>div{font-size: 0.9em;}
div#leads a{text-decoration: none; align-self: flex-end; color: black;}
div#leads .span1{color: gray; margin-bottom: 6px;}
div#leads button{width: 72px; height: 20px; align-self: flex-end; border: none; border-radius: 1.5em; background: #DDDB00; color: white; text-transform: none; font-weight: 600; font-size: 0.9em;}

div#features{width: 100%; text-align: center; margin: 100px 0;}
div#features h2{font-size: 1.8em;}
div#features>div{display: flex; justify-content: space-between; margin: 50px 0;}
div#features>div>div{width: 30%}
div#features>div>div img{width: 100px; height:100px; margin-bottom: 50px;}
div#features>div>div h3{font-size: 1.6em;}
div#features>div>div p{font-size: 1.6em; font-weight: 300;}


div#formulario{background: #E04E27;}
div#formulario .inner{color:white; margin: auto; padding-top: 50px;}
div#formulario .inner h1{font-size: 2.1em}
div#formulario .inner >p{font-size: 1.5em; max-width: 880px; text-align: center; margin: auto; font-weight: 600;}
div#formulario .inner>div{display: flex; margin-top:50px; justify-content: space-between;}
			
div#formulario .inner>div>div:first-child{width: 45%;}
div#formulario .inner>div>div p{font-size: 1.6em; font-weight: 700; margin-top: 0;}
div#formulario .inner>div>div ul{margin-top: 50px;}
div#formulario .inner>div>div ul li{margin-bottom: 10px; font-size: 1.4em; display: block}
div#formulario .inner>div>div ul li span{ padding: 2px; border-radius: 20px;}
div#formulario .inner>div>div a{color: white; padding: 2px; border-radius: 20px;}
div#formulario .inner>div>div a:hover{color: #DDDB00; transition:0.5s; }
			
div#formContainer{width: 45%;}
div#formContainer hr{display: none;}
div#formContainer label{display: none;}
div#formContainer input{width: 100%; color:black; box-sizing: border-box;padding: 1em 0.5em; border: none; margin-bottom: 20px;  font-family: 'Lato'; font-size: 1em;}
div#formContainer select{width: 100%; background:white; box-sizing: border-box;padding: 1em; border: none; margin-bottom: 20px;  font-family: 'Lato'; font-size: 1em;}
div#formContainer textarea{width: 100%; margin-bottom: 10px; border: none; height: 200px; display: none;}
div#formContainer #submit{width: auto; margin: 50px auto; display: block; border-radius: 1.5em; background: #DDDB00; color: white; font-weight: 700; font-size: 1.2em; text-transform: uppercase; cursor: pointer; padding: 0.5em 1em;}
div#formContainer #submit:hover{text-shadow: 6px 6px 12px #fff; transition:0.5s;}
div#formContainer .jrapid_cancel{display: none;}

div#mobile-icon{display: none;}

div#download{width: 100%; text-align: center; padding: 0 100px;}
div#download>div{display:flex; justify-content: center; gap:50px;}
div#download>div>div{width: 300px; background: black; color: white;  border-radius: 10px; font-size: 1.1em; padding: 1em; display: flex; text-align: left; gap:8%}
div#download>div>div i{font-size: 2em;}
div#download h2{font-size: 2em;}
div#download p{font-size: 1.3em; margin: 50px 0; font-family: 'Montserrat', sans-serif;}
div#download span{color: #DDDB00}
div#download br{display: none;}


div#footer{width: 100%; margin-top: 100px;}
div.box-list .inner>div:first-child{display: flex; justify-content: space-between; margin: 100px auto 0;}
div#footer img{display: block; margin: auto; width: 200px;}
div#footer p, div.box-list p{text-align: center; margin: 0}
div#footer a, div.box-list a{color: black; text-decoration: none;}
div#footer i, div.box-list i{font-size: 2em;}
div#footer .inner, div.box-list .inner{margin-bottom: 30px;}
div#footer .inner>div, div.box-list .inner>div {padding: 1em;}
div.box-list .inner>div ul{margin: 0; padding: 0; width:250px; font-size: 0.9em;}
div.box-list .inner>div ul>li{list-style: none; font-family: 'Montserrat', sans-serif; letter-spacing: 1px; margin-bottom: 5px;}
div.box-list .box h3{font-weight: 600;}
div.box-list .inner>div:nth-child(2){margin: 50px auto 50px; width: 120px; display: flex; justify-content: space-between; align-items: center;}
div#mobile{display: none;}

@media (max-width:1300px){
		div#index .index-text>div div{width: 550px; margin-top: 160px;}
		div#index .index-text>div div h1{font-size: 3.5em; }
		div#index .index-text>div p{font-size: 1.3em;}
		div#index .index-text>div button{font-size: 1em;}
		
		div#index .banner{width: 90%; max-width:none;}
		div#index .box-1 .banner-title h1{font-size: 2.4em;}
		div#index .box-1 .banner-title p {font-size: 1.4em;}
		div#index .box-3 .banner-text{font-size: 1.4em;}
}
			
@media (max-width:1024px){
		.inner{width: 90%; margin: auto;}
		
		div#index .index-text>div{width: 90%; margin: auto;}
		div#index .index-text>div div{width: 400px; margin-top: 17%;}
		div#index .index-text>div div h1{font-size: 2.5em; }
		div#index .index-text>div p{font-size: 1.3em;}
		div#index .index-text>div button{font-size: 1em;}
		
		div#index .box-1 .banner-title h1{font-size: 2em;}
		div#index .box-1 .banner-title p {font-size: 1em;}
		div#index .box-3 .banner-text{font-size: 1em;}
		
		form#form_Guide input+div{width: 250px; }
}
			
@media (max-width:768px){
		.inner{width: 90%; margin: auto;}
		
		.after-banner-text{font-size: 20px;}
		
		.see_more-mobile{display: block;}
		.see_more-desktop{display: none;}
		
		div#gps {font-size: 0.9em}
		
		div#type-desktop{display: none;}
		div#type-mobile{display: block}
		.overlay{background: black; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9; opacity: 0; pointer-events: none; transition:0.6s;}
		.active{opacity: 0.5; pointer-events:unset;}
		
		.overlay-active{overflow: hidden;}
		
		div#index{margin-top: 20px; display: none;}
		div#index .index-text>div{width:90%; margin: auto;}
		div#index .index-text>div div{width: 55%; margin-top: 0; display: flex; flex-direction: column; gap: 10px;}
		div#index .index-text>div div h1{font-size: 1.2em; margin: 0;}
		div#index .index-text>div p{font-size: 0.6em; /*display: none;*/ margin: 10px 0;}  
		div#index .index-text>div button{font-size: 0.5em; /*display: none;*/}
		
		div#index-mobile{display:block; background: #E04E27; width: 100%; padding: 5em 1em; color: white; text-align: center;}
		div#index-mobile h1{font-size: 1.6em;}
		div#index-mobile p {font-size: 0.9em;}
		div#index-mobile div{width: 80%; margin: auto;}
		div#index-mobile button{background: transparent; padding: 1em; border-radius: 2em; border: 2px solid white; font-weight: 500;}
		/*div#index-mobile button{padding: 1em; background: #DDDB00; color: white; border-radius: 2em; border: none; font-size: 0.8em; font-weight: 700; box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;}*/
		
		
		.m-top{margin-top:70px;}
		
		div#type{margin-top: 50px; width: 100%;}
		div#type>div{display: block;}
		div#type>div>div{width: 800px;}
		div#type .type-capsule>div i{font-size: 2em;}
		div#type .type-capsule p {font-size: 0.7em;}
			
		.modal-menu{ width: 100%; padding-top: 2em;}
		.modal-menu ul{margin: 0}
		.modal-menu li{list-style: none; margin-bottom: 40px; display: flex; justify-content: space-between; margin-right:20px;color: white; font-weight: 600;}
		.modal-menu li i{color: white;}
		.modal-menu li:first-child{text-align: right; display: block; color: #DDDB00;}
		.modal-menu li:first-child i{color: #DDDB00; font-size: 2em}
		.modal-menu a{text-decoration: none; color: white; width: 100%;}
		.modal-menu a>div{display: flex; justify-content: space-between;} 
		
		.modal-show{opacity: 1; pointer-events: unset; overflow: hidden}
		
		div#mobile p{font-size: 1em; text-align: right;}  
		
		form#form_Guide{margin-top: 50px;}
		form#form_Guide select{padding: 0.5em; margin-bottom: 20px; padding-left:50px}
		form#form_Guide input{padding: 0.5em; margin-bottom: 20px; padding-left:50px}
		form#form_Guide span+div{width: 100%; z-index:5; margin-top: -15px;}
		form#form_Guide button{font-size: 0.8em;}
		
		
		div#filter{width: 100%; display: flex; flex-wrap: wrap;}
		div#filter>div{width: 100%; position: relative;}
		div#filter>div i{position: absolute; top: 18%;  z-index: 3;}
		div#filter>div i:first-child{position: absolute; top: 15%; left: 5%;  z-index: 3;}
		
		.suggest{margin-top: -15px;}
		
		#mostrando{ font-size: 1em;}
		
		div#order{font-size: 0.8em; align-items: center;}
		div#order select{width: 100px; display: none;}
		div#order>div>span{width: auto;}
		div#order span+div{display:flex; justify-content: end; align-items: baseline; margin: 0;}
		div#orden {display: none;}
		
		div#map{width: 100%; height: 600px;}
		
		.counter_swiper{display: block; position: absolute; z-index: 5; right: 5%; bottom:20%; color:gray;border-radius: 15px; font-size: 0.8em; padding: 0.2em; }
		.slide-arrow{visibility: visible;}
		
		.lead_overflow-2{width: 202%;}
		.lead_overflow{width: 306%;}
		.lead-box{display:flex!important;}
		div#leads {width: 100%; margin-top: 50px; }
		div#leads .lead .box-info{flex-wrap: wrap;}
		div#leads .see_more-mobile{margin-top: 10px;}
		div#leads .province{display: none;}
		div#leads .lead h3{margin: 0; font-size: 1.2em;}
		/*div#leads .lead>div>div{width: 70%; overflow: hidden;}*/
		div#leads .box-info>div>div:first-child{width: 60px; height: 60px;}
		div#leads .box-info>div>div:nth-child(2)>div{font-size: 0.8em;}

		div#features h2{font-size: 1.5em;}
		div#features>div{display: flex; justify-content: space-between; margin: 50px 0;}
		div#features>div>div{width: 100%}
		div#features>div>div h3{font-size: 0.8em;}
		div#features>div>div p{font-size: 1.2em; font-weight: 300; display: none;}
		div#features>div>div img{/*width: 50px;*/ height: 50px;}
		
		div#formulario .inner{width: 90%; margin:auto;}
		div#formulario .inner>h1{font-size: 1.5em;}
		div#formulario .inner >p{font-size: 1.2em; display: none;}
		div#formulario .inner>div{ flex-wrap: wrap; gap:0;}
		div#formulario .inner>div>div:first-child{width: 100%}
		div#formulario .inner>div>div{width: 100%; text-align: center;}
		div#formulario .inner>div>div p{font-size: 1.2em; font-weight: 700; margin-top: 0;}
		div#formulario .inner>div>div ul li{margin-bottom: 20px; font-size: 1.1em;}
		div#formulario .inner>div>div ul{display: none;}
		div#formulario .inner>div{margin-top: 20px;}
		
		.jrapid_tooltip{display: none;}
		
		div#formContainer{width: 100%; margin-bottom: 50px;}
		div#formContainer #submit{width: auto; font-size: 0.9em;}
		
		div#mobile-icon{display: block;}
		div#mobile-icon div{width: 100%; display: flex; justify-content: space-around;}
		div#mobile-icon i{font-size: 2em;}
		
		div#download h2{font-size: 1.5em;}
		div#download{width: 100%; text-align: center; padding: 0;}		
		div#download p{font-size: 1em; margin: 50px 0; font-family: 'Montserrat', sans-serif;}
		div#download>div{display:flex; justify-content: center; flex-wrap: wrap;}
		div#download br{display: block;}
		
		div#footer img{display: block; margin: auto; width: 150px;}
		div#footer i{font-size: 1.5em;}
		div#footer p{text-align: center; margin: 0 ; font-size: 0.8em;}
		div.box-list .inner>div {flex-wrap: wrap; padding: 0; align-items: center;}
		div.box-list .inner>div:nth-child(2){flex-direction: row; width: 85px;}
		div.box-list .inner>div ul{font-size: 0.7em; margin: 0 auto; width: 300px;}
		div.box-list .inner>div ul li{letter-spacing: 0px;}
		div.box-list .box{width: 100%;}
		#categoriesTree{display: block;}
		

}

