@charset "UTF-8";
.closer,
.exclusives {
    z-index:0;
    width:100%
}

.hero {
    width:100%;
}

.exclusives {
    background:url(../images/home/bg_Inher.jpg) 50% 50%;
    background-size:cover;
    height:90%;
    margin:0
}

.cha-fly,
.cha-lucha,
.closer,
.logo-a,
.logo-a img,
.modal-bg {
    height:100%
}

.closer {
    background:url(../images/home/bg_closer.jpg) 50% 0;
    background-size:cover;
    margin:-6% 0 0
}

.modal-bg,
.modal-content {
    background-position:50% 0;
    background-size:cover
}

.closer-copy {
    top:50%
}

.mobile {
	padding:150px 0;
}

.mobile_copy {
    position:relative;
    z-index:100
}

.logo_stela_hp {
    position:relative;
    padding:20px
}

.logo_stela_hp img {
    width:100%
}

.logo_stela_hp_close {
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    opacity:.4
}

.logo_stela_hp_close img {
    position:relative;
    top:0;
    left:0;
    width:100%;
    margin-bottom:-15px
}

.modal-content {
    background-color:#000;
    border:1px solid #333
}

.modal-container {
    position:absolute;
    bottom:5%;
    left:50%;
    transform:translateX(-50%);
    text-align:center;
    margin:0 auto;
    width:80%
}

.modal-bg {
    position:absolute;
    width:100%;
    background-image:url(../images/home/bg_modal.jpg);
    opacity:1
}

.modal-container h2 {
    padding:0
}

.modal-container p {
    padding:20px 0
}

.modal-headline {
    position:relative;
    transform:translateY(-50px);
    font-size:1.8em;
    text-align:left;
    width:50%;
    color:#fff
}

.cha-bird-blue img,
.cha-bird-red img,
.cha-francis img,
.cha-lucha img,
.cha-lumi img,
.logo-a img {
    transform:translateX(-50%)
}

.characters_copy {
    padding:100px 0 0
}

.characters {
    position:relative;
    display:block
}

.cha_inher img {
    margin:0;
    width:100%;
    z-index:100
}

.curve_phone {
    margin:0
}

.curve_phone img {
    margin:0;
    width:100%;
    z-index:100
}

.cha-lucha {
    position:absolute;
    bottom:0;
    left:0;
    width:100%
}

.cha-lucha img {
    position:relative;
    top:0;
    left:60%;
    height:100%
}

.logo-a {
    position:absolute;
    top:0;
    left:0;
    width:100%
}

.logo-a img {
    position:relative;
    top:0;
    left:50%;
    opacity:.2
}

.cha-dad,
.cha-dragon,
.cha-fly,
.cha-fly div,
.cha-francis {
    position:absolute
}

.cha-dad {
    width:100%
}

.cha-dad img {
    width:100%;
    max-width:1200px
}

.cha-dragon {
    top:0;
    right:0;
    width:100%;
    text-align:right
}

.cha-dragon img {
    width:100%;
    max-width:1200px
}

.cha-fly {
    width:100%
}

.cha-francis {
    bottom:10%;
    left:0;
    width:100%
}

.cha-francis img {
    position:relative;
    top:0;
    left:50%;
    width:90%;
    max-width:800px
}

.cha-lumi {
    position:absolute;
    bottom:5%;
    left:0;
    width:100%
}

.cha-lumi img {
    position:relative;
    top:0;
    left:50%;
    width:70%;
    max-width:500px
}

.cha-bird-blue {
    position:absolute;
    top:20%;
    left:20%;
    width:100%
}

.cha-bird-blue img {
    position:relative;
    top:0;
    left:30%;
    width:90%;
    max-width:80px
}

.cha-bird-red {
    position:absolute;
    bottom:20%;
    left:0;
    width:100%
}

.cha-bird-red img {
    position:relative;
    top:0;
    left:50%;
    width:90%;
    max-width:200px
}

.bg-ground {
    position:absolute;
    bottom:-10%;
    left:0;
    width:115%;
    margin-bottom:-5px
}

.bg-ground img {
    position:relative;
    top:0;
    left:0;
    width:100%
}

.cha-fore {
    position:absolute;
    bottom:0%;
    left:0;
    width:115%;
    margin-bottom:-5px
}

.curve-up,
.curve-up img {
    width:100%
}

.cha-fore img {
    position:relative;
    top:0;
    left:0;
    width:100%
}

.curve-up {
    position:absolute;
    bottom:0;
    margin:0 auto -5px
}

@media only screen and (min-device-width:320px) {
 
    .cha_inher,
    .hundred-thou,
    .mobile,
    .phone-m {
        margin:0
    }
    .phone-dt {
        display:none
    }
    .phone-m {
        display:block;
        padding:0 0 50px
    }
    .closer,
    .hero-headline,
    .modal-headline {
        font-size:1.4em
    }
    .logo_stela_hp img {
        width:100%;
        max-width:200px
    }
    .cha-dad {
        bottom:-1%;
        left:10%
    }
    .cha-lumi {
        left:15%
    }
    .cha-bird-blue {
        top:10%;
        left:20%
    }
    .cha-bird-blue img {
        left:0;
        transform:translateX(0)
    }
    .cha-bird-red {
        bottom:10%;
        left:0
    }
    .bg-ground {
        width:225%;
		bottom:-10%;
    }
    .cha-fore {
        bottom:0%
    }
    .mobile-copy {
        margin:0
    }
    .cta-thanks {
        margin:50px 0 0
    }
    .modal-headline {
        transform:translateY(0);
        color:#fff
    }
    .modal-bg {
        opacity:1
    }
    .cta-download-label {
        color:#fff
    }
    .lines {
        background-color:#fff;
		padding:0;
    }
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) {
    .hundred-thou,
    .mobile,
    .phone-m {
        margin:0
    }
    .phone-dt {
        display:none
    }
    .phone-m {
        display:block;
        padding:0 0 50px
    }
    .hundK {
        font-size:2.6em
    }
    .cha_inher {
        margin:-10% 0 0
    }
    .cha-francis img {
        max-width:600px
    }
    .cha-lumi img {
        max-width:420px;
        left:55%
    }
    .cha-bird-blue {
        top:10%;
        left:20%
    }
    .cha-bird-blue img {
        left:0;
        transform:translateX(0)
    }
    .cha-bird-red {
        bottom:20%;
        left:0
    }
    .bg-ground {
        width:180%
    }
    .modal-bg {
        opacity:1
    }
    .modal-headline {
        transform:translateY(-150px);
        font-size:1.8em;
        color:#fff
    }
    .cta-download-label {
        color:#666
    }
    .lines {
        background-color:#666
    }
    .hero-headline {
        font-size:2.6em
    }
}

@media only screen and (min-device-width:768px) and (max-device-width:1024px) and (orientation:landscape) {
    .closer,
    .exclusives {
        height:80%
    }
    .bg-ground {
        width:140%
    }
}

@media only screen and (min-width:1048px) {

    .hundK {
        font-size:5em
    }
    .logo_stela_hp img {
        width:100%;
        max-width:300px
    }
    .cha_inher {
        margin:-13% 0 0
    }
    .cha-dad {
        bottom:-1%;
        left:10%
    }
    .cha-dad img {
        width:100%;
        max-width:1500px
    }
    .cha-dragon img {
        width:100%;
        max-width:1200px
    }
    .closer,
    .phone-dt,
    .phone-dt img {
        height:100%
    }
    .phone-dt {
        position:absolute;
        bottom:10%;
        left:0;
        display:block;
        z-index:100;
        margin:0 0 0 5%
    }
    .phone-m {
        display:none
    }
    .hero-headline {
        font-size:2.8em!important
    }
    .cha-bird-blue img {
        left:30%;
        transform:translateX(-50%)
    }
    .cha-bird-red {
        bottom:20%;
        left:0
    }
    .cha-fore {
        bottom:0%
    }
    .bg-ground {
        width:115%
    }
    .cta-thanks {
        margin:100px 0 0
    }
    .modal-bg {
        opacity:1
    }
    .modal-headline {
        transform:translateY(-150px);
        font-size:1.8em;
        color:#fff
    }
    .cta-download-label {
        color:#666
    }
    .lines {
        background-color:#666
    }
}

@media only screen and (min-width:1824px) {
    .phone-dt {
        height:110%;
        left:5%
    }
    .cha-dad img,
    .cha-dragon img {
        width:100%;
        max-width:2000px
    }
    .cha-francis img {
        max-width:1200px
    }
    .cha-lumi img {
        max-width:750px
    }
}