@font-face {
    font-family: 'RionaSans-Light';
    src: url('assets/fonts/2DA6E6_3_0.woff');
    /*src: url('assets/fonts/rionasans-light-webfont.woff');*/
}

@font-face {
    font-family: 'RionaSans-Bold';
    /*src: url('assets/fonts/rionasans-bold-webfont.woff');*/
    src: url('assets/fonts/2DA6E6_0_0.woff');
}


.ngdialog-overlay{
    background: rgba(0,0,0,.8);
}

.ngdialog-content{
    margin: auto;
    margin-top: 5%;
}

.ngdialog.ngdialog-theme-default .ngdialog-content {
    padding: 0;
    background: transparent;
    width: 100%;
    padding-top: 5%;
}

.ngdialog.ngdialog-theme-default {
    padding-top: 0;
}

.ngdialog {
    overflow: hidden;
}

.ngdialog-close {
    display: none;
}

#popup-input::-webkit-input-placeholder { text-align: center; color: white;  }
#popup-input:-moz-placeholder { text-align: center; color: white; }
#popup-input::-moz-placeholder { text-align: center; color: white;  } /* firefox 19+ */
#popup-input:-ms-input-placeholder { text-align: center; color: white;  } /* ie */

*:focus {
    outline: 0;
}

body {
    margin: 0;
    line-height: 1.42857143;
}


/*     iPAD        */
@media screen
and (min-device-width : 768px)
and (orientation:portrait) {
    body {
        font-size: 0.81em;
    }

    .win-font-size {
        font-size: 3em;
    }

    .mobile-border {
        border-top: 1px solid #f2f2f2;
    }

    /* Portrait styles */
    /*hide your main content and display message */
    .introducing-leaf {
        position: absolute;
        top: 120px;
        letter-spacing: 1px;
        width:100%;
        font-size: 1.4em;
        font-family: 'RionaSans-Light';
        color:#333333;
        padding-left: 0;
        text-align: center;
    }

    .introducing-font {
        font-size: 1.7em;
        letter-spacing: 5px;
    }

    .leaf-image {
        width: 150%;
        margin-top: 40%;
        margin-left: -45%;
    }

    .mobile-leaf {
        margin-top: -10px;
        margin-bottom: 0;
    }

    .facebook-twitter {
        display: table;
        text-align: center;
        margin: auto;
    }

    /*.leaf-launch {*/
    /*margin-top: {{getWinHeight()/3-100}}px;*/
    /*margin-right: auto;*/
    /*margin-left: auto;*/
    /*}*/

    .sneak-button {
        width: 300px;
        height: 30px;
    }

    .sneak-container {
        margin-top: 20px;
    }

    .mobile-facebook {
        margin-top: 4px;
        margin-left: 38%;
    }

    .facebook-twitter {
        display: table;
        text-align: center;
        width: 100%;
    }

    .leaf-launch {
        display:none;
    }

    .leaf-reg-input {
        width:200px;
        margin-top: 10px;
        margin-bottom: 10px;
        height:30px;
        border: 0;
        vertical-align: top;
    }

    .leaf-reg-button {
        width:100px;
        height:30px;
        border: 0;
        vertical-align: top;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .leaf-quote {
        width: 100%;
        position: absolute;
        bottom: 70px;
        height: 60px;
        display: table-cell;
        text-align: center;
        font-family: 'RionaSans-Light';
        letter-spacing: 3px;
        font-size: 1.4em;
    }

    .quote {
        /*margin-left:-30px;*/
        width: 100px;
    }

    .fontPortrait{
        font-size: 1.1em;
    }

    .footer1 {
        height:100px;
    }

    .green-footer-msg {
        height:40px; line-height: 40px;
    }

    .footer2 {
        width:100%;
        height: 100px;
    }

    .slide2a {
        height: 66%;
        position: absolute;
        bottom: 0;
    }

    .slide2a-img {
        content:url("assets/images/slide2a.jpg");
        height:100%;
    }

    .health-companion {
        height: 40%;
        font-family: 'RionaSans-Light';
        color:#333333;
        letter-spacing: 4px;
        text-align: center;
        padding-top: 10%;
        font-size:1.1em;
    }

    .slide2b {
        height: 60%;
    }

    .slide2b-img {
        content:url("assets/images/slide2b.jpg");
        height:100%;
        float: right;
    }

    .slide2c-img {
        content:url("assets/images/slide2c.jpg");
        height:100%;
        float: right;
    }

    .makes-you-feel {
        margin-left: auto;
        width:100%;
        position: absolute;
        top:7%;
    }

    .rethinking-design {
        position: absolute;
        margin: auto;
        top: 15%;
        font-family: 'RionaSans-Light';
        font-size:2.5em;
        width: 100%;
        text-align: center;
        letter-spacing: 4px;

    }

    .design {
        padding-bottom: 10px;
        font-size:1.2em;
    }

    .flip-screen {
        display:none;
    }

    .pic-stretch {
        width: 150%;
        margin-left: -50%;
        position:  absolute;
        bottom:0;
    }

    .pic-stretch2 {
        width: 150%;
        margin-left: -25%;
        position: absolute;
        bottom: 50px;
    }

    .pic-stretch3 {
        width: 150%;
        margin-left: -15%;
    }

    .register-div {
        height: 60px;
        padding-top:2px;
    }

    .register-align {
        display: block;
    }

    .register-input {
        padding: 1px;
        margin-bottom: 10px;
        width: 192px;
        font-size: 1.5em;
        text-align: center;
    }

    .column-text {
        padding-left:25px;
        padding-right:25px;
        margin-top: 5px;
        font-size: 0.9em;
        margin-bottom: 20px;
    }

    .column-text-head {
        font-family: 'RionaSans-Bold';
        font-size:1.2em;
    }

    .pictograms {
        width: 100%;
        margin-bottom:10px;
    }

    .mobile-pull-up{
        margin-top: 0px;
        border-top: 1px solid #eeeeee;
    }

    .meaningful-insights {
        bottom:56%;
        position:absolute;
        font-family: 'RionaSans-Bold';
        font-size: 1.4em;
        color:white;
        letter-spacing: 4px;
        margin-left: 10%;
        text-align: center;
    }

    .mobile-portrait-last {
        margin-top: -60px;
    }

    .fashion-text-mobile {
        font-size: 3em;
        margin-left: 20px;
        padding-right: 20px;
    }

    .mobile-footer {
        display:table;
        margin: 0 auto;
        text-align: center;
    }

    .footer3 {
        padding-left: 10px;
    }

    .footer3-height {
        height: 118px;
    }

    .popup-item {
        width: 220px;
    }

    .social-icon {
        text-decoration: none;
        display:block;
        width:45px;
        height:50px;
        float: left;
        margin-top: 8px;
    }

    .social-div-desktop {

        background-color: #333333;

        margin-left:20px;
        top:-70px;
        background-repeat: no-repeat;
        width:320px;
        height:70px;
        background-image: url('assets/images/social-icons-bigger.png');
        background-size: 70% 70%;
    }
    .blog {
        line-height: 50px;
        font-family: 'RionaSans-Bold';
        color: #ffffff;font-size: 1.9em;
        text-decoration: none;
        margin-left: -50px;
    }

    .social-div-mobile {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 100px;
        background-color: rgba(51, 51, 51, 0.4);
    }

    .social-div-mobile-inner {
        margin:auto;
        background-repeat: no-repeat;
        width:200px;
        height:40px;
        background-size: 100% 100%;
        background-image: url('assets/images/social-buttons.png');
        padding-left:10px;
        padding-top:4px;
    }

    .youtube {
        width:680px;
        height:462px;
        padding:4px;
    }

    .iframe-youtube {
        width:672px;
        height:454px;
    }

    input::-webkit-input-placeholder { text-align: center; color: white;  }
    #reg-input::-webkit-input-placeholder { text-align: center; color: white;  }
    #reg-input:-moz-placeholder { text-align: center; color: white; }
    #reg-input::-moz-placeholder { text-align: center; color: white;  } /* firefox 19+ */
    #reg-input:-ms-input-placeholder { text-align: center; color: white;  } /* ie */
}

/*and (orientation:portrait) */
@media screen
and (max-device-width : 767px)
and (max-aspect-ratio: 13/9) {
    body {
        font-size: 0.81em;
    }

    .win-font-size {
        font-size: 2em;
    }

    .mobile-border {
        border-top: 1px solid #f2f2f2;
    }

    /* Portrait styles */
    /*hide your main content and display message */
    .introducing-leaf {
        position: absolute;
        top: 40px;
        letter-spacing: 1px;
        width:100%;
        font-size: 1.1em;
        font-family: 'RionaSans-Light';
        color:#333333;
        padding-left: 0;
        text-align: center;
    }

    .introducing-font {
        font-size: 1.7em;
        letter-spacing: 5px;
    }

    .leaf-image {
        width: 150%;
        margin-top: 60%;
        margin-left: -45%;
    }

    .fashion-text {
        display:none;
    }

    .mobile-leaf {
        margin-top: -10px;
        margin-bottom: 0;
    }

    .facebook-twitter {
        display: table;
        text-align: center;
        margin: auto;
    }

    /*.leaf-launch {*/
    /*margin-top: {{getWinHeight()/3-100}}px;*/
    /*margin-right: auto;*/
    /*margin-left: auto;*/
    /*}*/

    .sneak-button {
        width: 200px;
        height: 30px;
    }

    .sneak-container {
        margin-top: 10px;
        height: 50px;
    }

    .mobile-facebook {
        margin-left: 70px;
        margin-top: -10px;
    }

    .leaf-launch {
        display:none;
    }

    .leaf-reg-input {
        width:200px;
        margin-top: 10px;
        margin-bottom: 10px;
        height:30px;
        border: 0;
        vertical-align: top;
    }

    .leaf-reg-button {
        width:100px;
        height:30px;
        border: 0;
        vertical-align: top;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .leaf-quote {
        width: 100%;
        position: absolute;
        bottom: 70px;
        height: 60px;
        display: table-cell;
        text-align: center;
        font-family: 'RionaSans-Light';
        letter-spacing: 3px;
        font-size: 1.4em;
    }

    .quote {
        /*margin-left:-30px;*/
        width: 100px;
    }

    .fontPortrait{
        font-size: 1.1em;
    }

    .footer1 {
        height:70px;
    }

    .green-footer-msg {
        height: 40px;
        font-size:0.85em;
        padding-top: 5px;
        padding-left:10px;
        padding-right:10px;
    }

    .footer2 {
        width:100%;
        height:70px;
    }

    .slide2a {
        height: 50%;
        position: absolute;
        bottom: 0;
    }

    .slide2a-img {
        content:url("assets/images/slide2a.jpg");
        height:100%;
    }

    .health-companion {
        height: 33%;
        font-family: 'RionaSans-Light';
        color:#333333;
        letter-spacing: 4px;
        text-align: center;
        padding-top: 40px;
        font-size:1.1em;
    }

    .slide2b {
        height: 33%;
    }

    .slide2b-img {
        content:url("assets/images/slide2b.jpg");
        height:100%;
        float: right;
    }

    .slide2c-img {
        content:url("assets/images/slide2c.jpg");
        height:100%;
        float: right;
    }

    .makes-you-feel {
        margin-left: auto;
        width:100%;
        position: absolute;
        top:10%;
    }

    .rethinking-design {
        position: absolute;
        margin: auto;
        top: 15%;
        font-family: 'RionaSans-Light';
        font-size:1.7em;
        width: 100%;
        text-align: center;
        letter-spacing: 4px;

    }

    .design {
        padding-bottom: 10px;
        font-size:1.3em;
    }

    .flip-screen {
        display:none;
    }

    .pic-stretch {
        width: 150%;
        margin-left: -50%;
        position:  absolute;
        bottom:0;
    }

    .pic-stretch2 {
        width: 150%;
        margin-left: -25%;
        position: absolute;
        bottom: 50px;
    }

    .pic-stretch3 {
        width: 150%;
        margin-left: -15%;
    }

    .register-div {
        height: 60px;
        padding-top:2px;
    }

    .register-align {
        display: block;
    }

    .register-input {
        padding: 1px;
        margin-bottom: 10px;
        width: 192px;
        font-size: 1.5em;
        text-align: center;
    }

    .column-text {
        padding-left:25px;
        padding-right:25px;
        margin-top: 5px;
        font-size: 0.9em;
        margin-bottom: 20px;
    }

    .column-text-head {
        font-family: 'RionaSans-Bold';
        font-size:1.2em;
    }

    .pictograms {
        width: 100%;
        margin-bottom:10px;
    }

    .mobile-pull-up{
        margin-top: 0px;
        border-top: 1px solid #eeeeee;
    }

    .meaningful-insights {
        bottom:56%;
        position:absolute;
        font-family: 'RionaSans-Bold';
        font-size: 1.4em;
        color:white;
        letter-spacing: 4px;
        margin-left: 10%;
        text-align: center;
    }

    .mobile-portrait-last {
        margin-top: -60px;
    }

    .fashion-text-mobile {
        padding-left: 10px;
        padding-right: 30px;
        padding-top: 25px;
        font-size: 1.5em;
    }

    .mobile-footer {
        height: 118px;
        display:table;
        margin: 0 auto;
        text-align: center;
    }

    .footer3 {
        padding-left: 10px;
    }

    .footer3-height {

    }


    .popup-item {
        width: 220px;
    }

    .social-icon {
        text-decoration: none;
        display:block;
        width:45px;
        height:50px;
        float: left;
        margin-top: 8px;
    }

    .social-div-desktop {

        background-color: #333333;

        margin-left:20px;
        top:-70px;
        background-repeat: no-repeat;
        width:320px;
        height:70px;
        background-image: url('assets/images/social-icons-bigger.png');
        background-size: 70% 70%;
    }
    .blog {
        line-height: 50px;
        font-family: 'RionaSans-Bold';
        color: #ffffff;font-size: 1.9em;
        text-decoration: none;
        margin-left: -50px;
    }

    .social-div-mobile {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 100px;
        background-color: rgba(51, 51, 51, 0.4);
    }

    .social-div-mobile-inner {
        margin:auto;
        background-repeat: no-repeat;
        width:200px;
        height:40px;
        background-size: 100% 100%;
        background-image: url('assets/images/social-buttons.png');
        padding-left:10px;
        padding-top:4px;
    }

    input::-webkit-input-placeholder { text-align: center; color: white;  }
    #reg-input::-webkit-input-placeholder { text-align: center; color: white;  }
    #reg-input:-moz-placeholder { text-align: center; color: white; }
    #reg-input::-moz-placeholder { text-align: center; color: white;  } /* firefox 19+ */
    #reg-input:-ms-input-placeholder { text-align: center; color: white;  } /* ie */

}

/*  landscape */
@media screen and (min-aspect-ratio: 13/9) and (max-width : 800px){

    .win-font-size {
        font-size: 1em;
    }



    .introducing-font {
        font-size: 2.1em;
        letter-spacing: 12px;
    }

    .introducing-leaf {
        position:absolute;
        font-family: 'RionaSans-Light';
        color:#333333;
        bottom:120px;
        letter-spacing: 1px;
        padding-left: 12%;
        font-size:0.5em;
    }

    .leaf-image {
        margin-top: 5%;
        width:55%;
        margin-left: 40%;
    }

    .fashion-text {
        display:none;
    }

    .leaf-launch {
        display:none;
    }

    .leaf-quote {
        width: 100%;
        position: absolute;
        bottom: 120px;
        height: 60px;
        display: table-cell;
        text-align: center;
        font-family: 'RionaSans-Light';
        letter-spacing: 3px;
        font-size: 1.4em;
    }

    .leaf-reg-input {
        width:360px;
        height:30px;
        padding-top: 0;
        border: 0;
        vertical-align: top;
        border:0;
    }

    .leaf-reg-button {
        width:140px;
        height:30px;
        vertical-align: top;
    }

    .mobile-leaf {
        margin:0;
    }

    .world-smartest {
        margin:0;
    }

    .sneak-container{
        height:40px;
    }

    .sneak-button {
        width:250px;
        height:30px;
    }


    .play-button {
        position: absolute;
        top: calc(50% - 10px);
        left: 50%;
    }

    .footer1 {
        height: 60px;
        padding-top: 8px;
        font-size: 0.6em;
    }

    .footer2 {
        height: 60px;
        font-size: 0.6em;
    }
    .green-footer-msg {
        height:40px;
        font-size:0.7em;
        padding-left:10px;
        padding-right:10px;
    }

    .fontPortrait{

    }

    .slide2a {
        position:absolute;
        top: 0;
        height:100%;
        width: 100%;
        overflow: hidden;
    }

    .slide2a-img {
        height:100%;
        margin-left: -5%;
    }

    .health-companion {
        bottom:40%;
        position:absolute;
        font-family: 'RionaSans-Light';
        font-size: 1.2em;
        color:#333333;
        letter-spacing: 4px;
        text-align: center;
        right:20%;
    }

    .helps-you {
        padding-top:8%;
        margin-bottom:5%;
        width:100%;
        font-family: 'RionaSans-Light';
        font-size: 0.9em;
        color:#333333;
        letter-spacing: 4px;
        width:100%;
        text-align: center;

    }

    .slide2b {
        display: none;
    }


    .slide2b-img {
        content:url("assets/images/slide2b.jpg");
        height:100%;
        float: right;
        margin-right: -5%;
    }

    .slide2c-img {
        content:url("assets/images/slide2c.jpg");
        height:100%;
        float: right;
        margin-right: -10%;
    }

    .makes-you-feel {
        margin-left: 15%;
        position: absolute;
        top: 24%;
        font-size: 1.2em;
    }

    .pic-stretch {
        width: 100%;

    }
    .pic-stretch2 {
        width: 100%;

    }

    .pic-stretch3 {
        width: 100%;

    }

    .flip1:hover p span {
        display:none;
    }

    .flip1:hover p:after {
        font-size: {{(0.8*getWinWidth())/1900}}em;
        font-family: 'RionaSans-Light';
        content: "When your breathing becomes shallow and weak, the Leaf sends a notification and prompts you with a short breathing exercise.";
    }

    .flip2:hover p span {
        display:none;
    }

    .flip2:hover p:after {
    font-size: {{(0.8*getWinWidth())/1900}}em;
    font-family: 'RionaSans-Light';
    content: "It tracks your activity by monitoring every movement you make.";
    }

    .flip3:hover p span {
        display:none;
    }

    .flip3:hover p:after {
    font-size: {{(0.8*getWinWidth())/1900}}em;
    font-family: 'RionaSans-Light';
    content: "By measuring how long you spend in each stage of sleep, it can tell you not only how long, but how well you've slept.";
    }

    .register-div {
        height: 48px;
        padding-top:9px;
    }
    .register-align {
        display: inline;
    }

    .register-input {
        width: 250px;
        font-size: 1em;
        padding: 5px;
        margin-right:20px;
    }

    .column-text {
        padding-left:4%;
        padding-right:4%;
        margin-top: 50px;
        font-size:0.8em;
    }

    .column-text-head {
        font-family: 'RionaSans-Bold';
        font-size:1.2em;
    }

    .pictograms {
        margin: auto;
        padding-top:50px;
        margin-bottom:120px;
    }

    .pictogram-row {
        margin-left: 15%;
        margin-right: 15%;
    }

    .crop-pics {
        height:{{getWinHeight()}}px;
        overflow: hidden;
    }

    .rethinking-design {
        position: absolute;
        margin: auto;
        top: 15%;
        font-family: 'RionaSans-Light';
        font-size:0.9em;
        width: 100%;
        text-align: center;
        letter-spacing: 4px;
    }

    .design {
        padding-bottom: 30px;
        font-size:1.3em;
    }

    .fashion-text-mobile {
        display: none;
    }

    .footer3 {
        margin: auto;
        height: 40px;
        padding-top: 5px;
    }

    .footer3-height {
        height: 68px;
        font-size: 0.6em;
    }

    .mobile-footer {
        background-color: #333333;
    }

    .popup-item {
        width: 360px;
    }

    .social-icon {
        text-decoration: none;
        display:block;
        width:58px;
        height:50px;
        float: left;
        margin-top: 8px;
    }

    .social-div-mobile {
        display: none;
    }

    .social-div-desktop {
        position: absolute;
        background-color: rgba(21,21,21,0.7);
        bottom:40px;
        margin-top:-5px;
        background-repeat: no-repeat;
        width:100%;
        height:70px;
        background-image: url('assets/images/social-icons-bigger.png');

    }

    .blog {
        margin-left:40px;
        line-height: 60px;
        font-family: 'RionaSans-Bold';
        color: #ffffff;font-size: 1.9em;
        text-decoration: none;
    }

    .meaningful-insights {
        bottom:40%;
        position:absolute;
        font-family: 'RionaSans-Bold';
        font-size: 2.1em;
        color:white;
        letter-spacing: 4px;
        margin-left: 15%;
        text-align: center;
    }

    .youtube {
        width:433px;
        height:298px;
        padding:4px;
    }

    .iframe-youtube {
        width:425px;
        height:290px;
    }

}


@media screen and (orientation:landscape) and (min-width : 801px){
    /* Landscape styles */
    /* show your content*/

    .win-font-size {
        font-size: 2em;
    }
    .introducing-font {
        font-size: 2.1em;
        letter-spacing: 12px;
    }

    .introducing-leaf {
        position:absolute;
        font-family: 'RionaSans-Light';
        color:#333333;
        /*bottom:{{getWinHeight()/2.5}}px;*/
        bottom: 33%;
        letter-spacing: 1px;
        padding-left: 12%;
    }

    .leaf-image {
        margin-top: 5%;
        width:75%;
        /*margin-top:-70px;*/
        float:right;
        margin-right:10%;
    }

    .leaf-launch {
        display:none;
    }

    .leaf-quote {
        width: 100%;
        position: absolute;
        bottom: 120px;
        height: 60px;
        display: table-cell;
        text-align: center;
        font-family: 'RionaSans-Light';
        letter-spacing: 3px;
        font-size: 1.4em;
    }

    .leaf-reg-input {
        width:360px;
        height:50px;
        padding-top: 0;
        border: 0;
        vertical-align: top;
        /*border:1px solid #555555;*/
    }

    .leaf-reg-button {
        width:140px;
        height:50px;
        vertical-align: top;
        margin-bottom: 10px;
    }

    .sneak-button {
        width:350px;
        height:50px;
        padding-bottom:10px;
    }

    .sneak-container {
        margin-top: 20px;
        margin-bottom: 20px;
        height: 50px;
    }

    .play-button {
        position: absolute;
    top: {{(getWinHeight())/2-10}}px;
    left: 50%;

    }

    .footer1 {
        height: 100px;
        padding-top: 8px;
    }

    .footer2 {
        height: 100px;
    }

    .green-footer-msg {
        height:40px; line-height: 40px;
    }

    .fontPortrait{

    }

    .slide2a {
        position:absolute;
        top: 0;
        height:100%;
        width: 100%;
        overflow: hidden;
        /*height:{{getWinHeight()}}px;*/
        /*overflow: hidden;*/
    }

    .slide2a-img {
        content:url("assets/images/slide2a.jpg");
        height:100%;
        margin-left: -5%;
        /*content:url("assets/images/slide2-b.png");*/
        /*width:100%;*/
    }

    .health-companion {
        bottom:40%;
        position:absolute;
        font-family: 'RionaSans-Light';
        font-size: 1.2em;
        color:#333333;
        letter-spacing: 4px;
        /*width:100%;*/
        text-align: center;
        right:20%;
    }

    .helps-you {
        padding-top:8%;
        margin-bottom:5%;
        width:100%;
        font-family: 'RionaSans-Light';
        font-size: 1.9em;
        color:#333333;
        letter-spacing: 4px;
        /*width:100%;*/
        text-align: center;

    }

    .slide2b {
        display: none;
    }
    /*.slide2b {*/
    /*position:absolute;*/
    /*top: 0;*/
    /*height: 100%;*/
    /*width: 100%;*/
    /*overflow: hidden;*/
    /*}*/

    .slide2b-img {
        content:url("assets/images/slide2b.jpg");
        height:100%;
        float: right;
        margin-right: -5%;
    }

    .slide2c-img {
        content:url("assets/images/slide2c.jpg");
        height:100%;
        float: right;
        margin-right: -10%;
    }

    .makes-you-feel {
        margin-left: 15%;
        position: absolute;
        top: 24%;
        font-size: 1.2em;
    }

    .pic-stretch {
        width: 100%;

    }
    .pic-stretch2 {
        width: 100%;

    }

    .pic-stretch3 {
        width: 100%;

    }

    .flip-row {
        font-size: 1.7em;
    }

    .flip1:hover p span {
        display:none;
    }

    .flip1:hover p:after {
    font-size: {{(0.8*getWinWidth())/1900}}em;
    font-family: 'RionaSans-Light';
    content: "When your breathing becomes shallow and weak, the Leaf sends a notification and prompts you with a short breathing exercise.";
    }

    .flip2:hover p span {
        display:none;
    }

    .flip2:hover p:after {
    font-size: {{(0.8*getWinWidth())/1900}}em;
    font-family: 'RionaSans-Light';
    content: "It tracks your activity by monitoring every movement you make.";
    }

    .flip3:hover p span {
        display:none;
    }

    .flip3:hover p:after {
    font-size: {{(0.8*getWinWidth())/1900}}em;
    font-family: 'RionaSans-Light';
    content: "By measuring how long you spend in each stage of sleep, it can tell you not only how long, but how well you've slept.";
    }

    .register-div {
        height: 48px;
        padding-top:9px;
    }
    .register-align {
        display: inline;
    }

    .register-input {
        width: 250px;
        font-size: 1em;
        padding: 5px;
        margin-right:20px;
    }

    .column-text {
        padding-left:4%;
        padding-right:4%;
        margin-top: 50px;
        font-size:0.8em;
    }

    .column-text-head {
        font-family: 'RionaSans-Bold';
        font-size:1.2em;
    }

    .pictograms {
        margin: auto;
        padding-top:50px;
        margin-bottom:120px;
    }

    .pictogram-row {
        margin-left: 15%;
        margin-right: 15%;
    }

    .crop-pics {
        height:{{getWinHeight()}}px;
        overflow: hidden;
    }

    .rethinking-design {
        position: absolute;
        margin: auto;
        top: 15%;
        font-family: 'RionaSans-Light';
        font-size:1.7em;
        width: 100%;
        text-align: center;
        letter-spacing: 4px;
    }

    .design {
        padding-bottom: 30px;
        font-size:1.3em;
    }

    .fashion-mobile-container{
        background-color: #333333;
    }

    .fashion-text-mobile {
        display: none;
    }

    .footer3 {
        float:right;
        margin-right:15%;
    }

    .footer3-height {

    }

    .mobile-footer {
        height: 68px;
    }

    .popup-item {
        width: 360px;
    }

    .social-icon {
        text-decoration: none;
        display:block;
        width:42px;
        height:50px;
        float: left;
        margin-top: 8px;
    }

    .social-div-mobile {
        display: none;
    }

    .social-div-desktop {
        margin-left:50px;
        margin-top:10px;
        background-repeat: no-repeat;
        width:300px;
        height:70px;
        background-image: url('assets/images/social-icons-bigger.png');
        background-size: 70% 70%;
    }

    .blog {
        margin-left:5px;
        line-height: 50px;
        font-family: 'RionaSans-Bold';
        color: #ffffff;font-size: 1.5em;
        text-decoration: none;
    }

    .meaningful-insights {
        bottom:40%;
        position:absolute;
        font-family: 'RionaSans-Bold';
        font-size: 2.1em;
        color:white;
        letter-spacing: 4px;
        margin-left: 15%;
        text-align: center;
    }

    .youtube {
        width:866px;
        height:496px;
        padding: 8px;
    }

    .iframe-youtube {
        width:850px;
        height:478px;
    }

}

a:hover {
    color:white;
    text-decoration: none;
}


.fb-like {
    /*-webkit-filter: grayscale(100%) brightness(90%) contrast(170%);*/
    /*-moz-filter: grayscale(100%) brightness(90%) contrast(170%);*/
    /*-o-filter: grayscale(100%) brightness(90%) contrast(170%);*/
    /*-ms-filter: grayscale(100%) brightness(90%) contrast(170%);*/
    /*filter:grayscale(100%) brightness(90%) contrast(170%);*/
    position: absolute;
    top: 0;
}

.tweet-button {
    /*-webkit-filter: grayscale(100%) brightness(80%) contrast(180%);*/
    /*-moz-filter: grayscale(100%) brightness(80%) contrast(180%);*/
    /*-o-filter: grayscale(100%) brightness(80%) contrast(180%);*/
    /*-ms-filter: grayscale(100%) brightness(80%) contrast(180%);*/
    /*filter:grayscale(100%) brightness(80%) contrast(180%);*/
    position: absolute;
    left: 90px;
    top: 0;
}


input.ng-dirty.xt-error.ng-invalid.ng-invalid-email,
select.ng-dirty.xt-error.ng-invalid.ng-invalid-email,
textarea.ng-dirty.xt-error.ng-invalid.ng-invalid-email {
border: 1px solid red;
}

input.ng-dirty.xt-error.ng-invalid.ng-invalid-required,
select.ng-dirty.xt-error.ng-invalid.ng-invalid-required,
textarea.ng-dirty.xt-error.ng-invalid.ng-invalid-required {
    border: 1px solid red;
}

/*.ng-invalid-mail {*/
    /*border: 1px solid red;*/
    /*color: red;*/
/*}*/

/*.ng-invalid-mail:focus {*/
    /*border: 1px solid red;*/
    /*box-shadow: 0 0 2px red;*/
/*}*/