
/* `sm` applies to x-small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { ... }

/* `md` applies to small devices (landscape phones, less than 768px)*/


/* `lg` applies to medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) { 
	.caption1, .caption2, .caption3 {
	    width: 80%;
	    margin: 0 auto;
	}
	.cd-section {
	    height: auto;
	}
	.mobile{
	  display: block;
	}
	.desktop{
	  display: none;
	}
	img.chica.mobile{
		width: 140%;
	}
	h1 {
	    font-size: 100px;
	}
	img.image-bg-mobile.mobile {
	    width: 80%;
	    margin: 0 auto;
	}
	    img.frame-image {
        position: absolute;
        width: 95%;
        z-index: 3;
        margin: -.5em auto;
        transform: translate(-7%);
    }
	.carousel {
	    position: relative;
	    width: 100%;
	    margin: 0px auto;
	}
	span.qs.section3 {
	    right: 5%;
	    top: -5%;
	}
	#section5 .container-fluid.content-container {
	    height: auto;
	    display: flex;
	    flex-direction: column;
	    justify-content: center;
	    padding-top: 15%;
	}
	#section3 .container-fluid.content-container {
	    height: auto;
	    /* display: flex; */
	    align-content: center;
	    padding: 0 0 10em 0;
	}
	.qs.section1 {
	    position: absolute;
	    right: 15%;
	    bottom: 40px;
	}
	.image-absolute-bottom {
        position: relative;
    }
    .cd-single-point:nth-of-type(2) {
	    bottom: 34%;
	    left: 36%;
	}
	.cd-single-point:nth-of-type(1) {
	    top: 22%;
	        left: 16%;
	}
	.qs.section3 .popover {
	    top: 90px;
	    right: 0;
	}
	.qs.section1 .popover {
	    bottom: 90px;
	    left:-200px;
	}
 }

@media (max-width: 767.98px) { 
	.caption1, .caption2, .caption3 {
	    width: 80%;
	    margin: 0 auto;
	}
	img.image-bg-mobile.mobile {
	    width: 100%;
	    margin: 0 auto;
	}
	.cd-single-point > a {
	    width: 30px;
	    height: 30px;
	}
	.cd-single-point > a::before {
	    height: 15px;
	    width: 2px;
	}
	.cd-single-point > a::after {
	    height: 2px;
	    width: 15px;
	}
	    .cd-single-point:nth-of-type(1) {
        top: 22%;
        left: 9%;
    }
        .cd-single-point:nth-of-type(2) {
        bottom: 32%;
        left: 25%;
    }
    .cd-single-point:nth-of-type(3) {
    bottom: 41%;
    right: 27%;
}
	.cd-single-point .cd-more-info {
	    top: 0;
        left: 0;
        width: 100%;
        height: auto;
        padding: 10%;
	}
	.cd-close-info {
	    position: fixed;
	    top: 5px;
	    right: 5px;
	    height: 35px;
	    width: 35px;
	    background-color: #ff6700;
	    border-radius: 50%;
	}
	.cd-close-info::after, .cd-close-info:before{
		color: white;
	}
	.cd-section {
	    height: auto;
	}
	.mobile{
	  display: block;
	}
	.desktop{
	  display: none;
	}
	img.chica.mobile {
	    width: 90%;
	}
	.context-text-index {
	    margin-top: -55%;
	}
	.image-absolute-bottom{
		position: relative;
	}
	.image-absolute-top {
	    top: 20%;
	}
	#section2, #section4{
		padding: 10% 0;
	}  
	.image-bg-mobile {
        width: 100%;
        margin: 0 auto;
        display: block;
    }
	#section5 .container-fluid.content-container {
	    justify-content: flex-start;
	    height: auto;
	}
	.texto-final {
	    font-size: 60px;
	    padding-bottom: 15%;
	}
	span.qs img {
	    width: 50px;
	}
	.qs.section1 {
	    position: absolute;
	    right: 17%;
	    top: 2%;
	}
	img.frame-image {
	    position: absolute;
	    width: 95%;
	    z-index: 3;
	    margin: -.5em auto;
	    transform: translate(1%);
	}
	.carousel {
	    position: relative;
	    width: 84%;
	    margin: 0px auto;
	}
	#section3 .container-fluid.content-container {
	    height: auto;	
	    align-content: center;
	    padding: 0 0 5em 0;
	}
	.acordeon {
	    margin-top: -25%;
	    width: 100%;
	    max-width: 500px;
	}
	.logo-final img {
	    width: 200px;
	    margin: 0 auto;
	    display: block;
	}
	.caption-container {
	    width: 85%;
	    margin: 0 auto;
	}
	span.qs.section3 {
	    position: absolute;
	    right: 15%;
	    bottom: -15%;
	    z-index: 9;
	}
	.context-text-index {
	    z-index: 0;
	}
	.qs.section3 .popover {
	    left: -200px;
        top: 50px;
	}
	.carousel-dark .carousel-caption p {
	    font-size: 16px;
	    line-height: 21px;
	}
	.carousel-dark .carousel-caption p span {
	    font-size: 18px;
	    font-family: 'Oswald', sans-serif;
	    font-weight: bold;
	}
}
/* `xl` applies to large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) and (min-width: 991.98px) and (orientation: landscape) { 
	.image-relative .star {
	    right: -55%;
	}
	img.chica.mobile {
    display: block;
    width: 130%;
}
img.chica.hover-image.desktop {
    display: none;
}
h1 {
    font-size: 130px;
    font-weight: bold;
    text-transform: uppercase;
}
.caption1, .caption2, .caption3 {
    width: 80%;
    margin: 0 auto;
}
#section1 p {
    font-size: 20px;
    line-height: 23px;
}
.qs.section1 {
    position: absolute;
    right: -40px;
    bottom: 20px;
}
.image-absolute-bottom {
    position: absolute;
    bottom: -5%;
    z-index: 2;
}
#section4 .image-absolute-bottom {
    z-index: 0;
}
#section3 .caption-container img{
	display: none;
}
#section2 .image-absolute-bottom {
    position: absolute;
    bottom: 0;
    z-index: 2;
}
#section3 .container-fluid.content-container {
    height: 100vh;
    /* display: flex; */
    align-content: center;
    padding: 4em 0 0 0;
}
img.frame-image {
    position: absolute;
    width: 57%;
    z-index: 3;
    margin: -.5em auto;
    transform: translate(-7%);
}
}

/* `xxl` applies to x-large devices (large desktops, less than 1400px)*/
@media (min-width: 1440.98px) { 
	.logo {
    height: 10vh;
}
	.rrss.scale-rrss {
	    position: absolute;
	    top: -5%;
	    left: -6%;
	    width: 395px;
	    height: auto;
	    transform: scale(0);
	    transition: transform 0.3s ease;
	}
	.bubble.scale-bubble {
	    position: absolute;
	    bottom: 35%;
	    left: -15%;
	    width: 335px;
	    height: auto;
	    transform: scale(0);
	    transition: transform 0.3s ease;
	}
	.star.scale-star {
	    position: absolute;
	    z-index: -1;
	    top: 0;
	    right: 20%;
	    width: 535px;
	    height: auto;
	    transform: scale(0);
	    transition: transform 0.3s ease;
	}
	#section3 .container-fluid.content-container {
		height: 100vh;
		/* display: flex; */
		align-content: center;
		padding: 10em 0 0 0;
		}
	.container.desktop-lg {
	    /* max-width: 1440px; */
	    display: flex;
	    align-items: flex-end;
	    height: 90vh;
	}
	.image-bg {
	    width: 86%;
	}
	/*#section5 .container-fluid.content-container {
	    justify-content: center;
	}*/
	.image-absolute-top {
	    top: 5%;
	}
	    img.frame-image {
        width: 58%;
        transform: translate(-7%);
    }
    .image-absolute-bottom {
	    position: absolute;
	    bottom: -8%;
	    z-index: 0;
	}
}