/*==================================================
=            Bootstrap 5 Media Queries             =
==================================================*/

/*==========  Mobile First Method  ==========*/

/* X-Small devices (portrait phones, less than 576px)
No media query for `xs` since this is the default in Bootstrap */




/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 320px) { 
	.navbar {
		background:#f4f4f4 ;
	}

	#navbarNav a{
		color:#0C2E59;
	}

	.lang{
		text-align:center;
	}
	.lang figure {
		display:inline-block;
		float:left;
	}
	.lang figure.icon-lang{
		max-width:26px;
		margin:10px 10px 10px 0%;
	}
	.lang a{
		max-width:26px;
		display:block;
		float: left;
		margin:10px;

	}

	.lang figure img, .lang a figure img{
		max-width:100%;
	}

	#banner-hero{
		background: rgb(193,189,189);
		background: linear-gradient(0deg, #BFBDBE 0%, #F2F2F2 100%);
		text-align: center;
		padding-top:100px;
	}


	#myBanner span.title{
		color:#04B2D9;
		font-weight: bold;
		font-size: 48px;
		line-height: 1.4;
	}
	#myBanner p{
		color:#0C2E59;
		font-size:21px;
		font-weight:300;
	}
	#myBanner span.yourself{
		color:#0C2E59;
		font-size:48px;
		font-weight:bold;
	}
	#BariSlideShow {
	    overflow: hidden;
	    width: 100%;
	    height: auto;
	    background-color: #000;
	    margin: 0px;
	}
	a.cta{
		background:#04B2D9;
		border-radius: 25px;
		color:#fff;
		display: inline-block;
		font-size:18px;
		margin: 20px auto ;
		max-width: 80%;
		padding: 10px 20px;
		text-align: center;
		text-decoration: none;
	}

	#bloque-01 h1{
		color:#04B2D9;
		font-weight: bold;
		font-size: 21px;
		text-align:center;
		margin: 50px auto 20px;
	}
	#bloque-01 p{
		text-align:center;
		font-size:18px;
		max-width: 90%;
		margin: 10px auto 50px;
	}

	#success-stories{
		background: #f0f0f0;
		padding:80px 0px;
	}

	#carouseTestimonios p{
		color:#0C2E59;
		font-size:32px;
		margin: 20px 30px;
	}

	#cirugias{
		background: rgb(193,189,189);
		background: linear-gradient(0deg, #BFBDBE 0%, #F2F2F2 100%);
	}

	#cirugias .surgery{
		margin: 50px 0px;
	}

	#cirugias .surgery img{
		margin: 20px auto;
    	width: 60%;
    	display: block;
	}
	#cirugias .surgery p, .paso p{
		font-size:21px;
		margin: 0px 0px 50px 0px;
	}

	#cirugias .surgery p b{
		color:#0C2E59;
	}

	.paso{
		margin:50px 0px;
	}

	#descubre h2{
		color:#0C2E59;
		font-size:26px;
		font-weight:bold;
		text-align:center;
		margin: 50px auto;
	}

	footer{
		background:#4fb9fc;
		color:#fff;
		margin-top:0px;
		padding-top:60px;
		padding-bottom: 60px;
	}

	a.rrss{
		display: inline-block;
		max-width:28%;
		margin: 15px 10px 15px 0px;
	}

	a.rrss img{
		max-width:100%;
	}

	footer h5{
		color: #0C2E59;
		font-weight:bold;
		font-size:2rem;
	}
	footer p b{
		font-weight:bold;
		color:#0C2E59;
		display:block;
	}
	footer p span{
		background: url("../images/icon-phone.png") no-repeat left top;
		background-size: 20px;
		margin-top:10px;
		padding:0px 0px 3px 30px;
		display:block;
	}

	footer p.marker{
		background: url("../images/icon-marker.png") no-repeat left top;
		background-size: 20px;
		margin-top:30px;
		padding:0px 0px 3px 30px;
		display:block;
		float:left;
	}

	a.correo{
		background: url("../images/icon-correo.png") no-repeat left top;
		background-size: 20px;
		margin-top:20px;
		padding:0px 0px 3px 30px;
		display:block;
		float:left;
		width:100%;
	}

	a.web{
		background: url("../images/icon-web.png") no-repeat left top;
		background-size: 20px;
		margin:20px 0px;
		padding:0px 0px 3px 30px;
		display:block;
		float:left;
		width:100%;
	}

	footer a{
		color:#fff;
	}
	footer p{display:block;
		float:left;}

	#carouselWizzard figure{
		margin: 20px 25%;
		display: block;
		float: none;
	}

	#pre-form{
		background:url("../images/bg-sombra-form.png") center bottom no-repeat;
		background-size: cover;
		margin-top:60px;
		padding-top:120px;
		padding-bottom:80px;
	}


}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) { 

	.lang figure.icon-lang{
		max-width:30px;
		margin:10px 10px 10px 0%;
	}
	#banner-hero{
		text-align:left;
	}

	#myBanner span.title{
		font-weight: bold;
		font-size: 32px;
		margin-top:7%;
		display:block;
	}
	#myBanner p{
		color:#0C2E59;
		font-size:24px;
		font-weight:600;
	}

	#bloque-01 h1{
		font-size: 36px;
		text-align:center;
		margin: 50px auto 20px;
		max-width: 80%;
		display:block;
	}

	#bloque-01 p{
		text-align:center;
		font-size:21px;
		max-width: 80%;
		margin: 10px auto 50px;
	}


	a.cta{
		display: block;
		margin: 40px auto;
		max-width: 85%;
		padding: 15px 30px;
		text-align: center;
	}
	#myBanner a.cta{
		padding: 10px 15px;
		max-width:100%;
	}

	p.tel{
		width: 45%;
    	display: block;
    	float: left;
	}
	a.cta{font-size:21px;}

	#success-stories .title-hist{
		display: block;
		margin:0 auto;
		margin-bottom: 20px;
		max-width:60%;
	}

	#success-stories .testimonio{
		text-align:center;
	}
	#success-stories .testimonio figure{
		max-width: 160px;
		display: block;
		margin: 0 auto;
	}
	#carouseTestimonios p{font-size:19px;}

	#cirugias .surgery img{
    	width: 90%;
	}
	#descubre p{
		font-size:1.3rem;
	}

}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
	.navbar {
		background:none;
	}
	#navbarNav a{
		font-size:26px;
	}

	.fixed-top.scrolled {
        background-color: #fff !important;
        transition: background-color 500ms linear;
    }

    #myBanner span.title{
		font-size: 72px;
		display:block;
	}
	#myBanner p{
		font-size:34px;
		max-width:70%;
	}
	footer{
		font-size:24px;
	}

}

/*X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 

 	#myBanner span.title{
		font-size: 92px;
		display:block;
	}
	#myBanner p{
		color:#0C2E59;
		font-size:42px;
		font-weight:600;
		max-width:80%;
	}

	#bloque-01 h1{
		font-size: 70px;
		max-width: 80%;
	}

	#bloque-01 p{
		font-size:34px;
		max-width: 70%;
	}
	#success-stories .title-hist{
		margin:50px auto;
		margin-bottom: 20px;
		max-width:80%;
	}

	#carouseTestimonios p{font-size:24px;}

}

/*XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) { 
	#success-stories .title-hist{
		margin-bottom: 20px;
		max-width:60%;
	}
	#carouseTestimonios p{font-size:28px;}


}