@media only screen and (max-height:800px) and (min-height:500px){
    #four section.img img {
        width: 50%;
    }
    .section section.description>h1 {
        font-size: 3.5em;
    }
}

@media only screen and (max-width:82em) and (min-width:61em) {
    #elem2,#elem1,#elem3{
        bottom: 0px;
    }
    #four section.img img{
        margin-top: 25%;
    }
	.section.sec2 section.img,
	.section.sec2 section.description{
		left:5%;
	}.section section.description{
		left: 5%;
	}
	.dialog-main{
		width: 60%;
		height: auto;
	}
}

@media only screen and (max-width:61em) {
    .section section.description,
    .section section.img{
        padding-top: 20%;
    }
	.dialog-main{
		width: 70%;
		height: auto;
	}
    .section section.description>h1, 
    .section section.description>p{
        width: 90%;
    }
    .section.sec2 section.description>h1, 
    .section.sec2 section.description>p{
        width: 90%;
    }
    .logo{
        width: 20%;
    }
    #four .img{
        padding-top: 35%;
    }
    #four .img>img{
        padding-left: 5%;
    }
    .form-base-two{
        width: 90%;
    }
	.form-base-one>form>input:last-child{
		margin-top: .9em;
	}
	.section.sec2 section.img,
	.section.sec2 section.description{
		left:0;
	}
	.section section.description{
		left: 0;
	}
}
@media only screen and (max-width:24em) {
    #elem2,#elem1,#elem3{
        display: none;
    }
	.dialog-main{
		width: 95%;
		height: auto;
	}
    #scroll-btn{
        margin: 7px auto 0;
    }
    .elment{
        height: 1em;
    }
    /*#footer>p{
        display: none;
    }*/
    .footer p {
        display: none;
    }
    .footer .email-form{
        float: left;
    }
    .footer>.fb-btn{
        position: absolute;
        top: 13px;
        font-size: 0;
        height: 19px;
        right: 10px;
        width: 5%;
    }
    .fb-btn:before{
        left: 50%;
        margin-left: -10px;
    }
    #one h1{
        font-size: 3.5em;
    }
    #one p{
        font-size: 1.2em;
        padding: 0 15%;
    }
    #scroll-btn>p{
        padding: 0;
        left: -5px;
    }
    .section section.description>h1{
        font-size: 2.2em;
    }
    .section section.description>p{
        font-size: 1.2em;
        line-height: 1.2;
    }
    .section section.description, .section section.img {
        padding-top: 0;
    }
    .section section.img{
        padding-top: 10%;
    }
    .section section.img>img{
        width: 100%;
        margin-left: 20%;
    }
    .section.sec2 section.img>img{
        width: 100%;
        margin-left: -10%;
    }
    #four section.description>h1{
        margin-top: 30%;
        font-size: 2em;
    }
    #four .img{
       padding-top: 30%;
    }
    .appstore img{
        width: 70%;
    }
    .form-base-one{
        position: absolute;
        width: 150%;
        padding-left: 15%;
        left: 0;
    }
    .form-base-one>p{
        width: 100%;
        text-align: center;
        display: block;
    }
    
    .form-base-two{
        float: left;
    }
    .form-base-two {
        float: left;
        position: absolute;
        left: 15%;
        bottom: -60%;
    }
    .form-base-two>a.fb-btn {
        width: 50%;
    }
    .form-base-one>form>input:first-child {
        width: 100%;
    }
    .form-base-two>a.fb-btn:before{
        left: 2em;
    }
    .appstore img{
        left: 0;
    }
    
    
}

@media only screen and (max-width:350px) {
    #one h1{
        font-size: 2.8em;
    }
    .section section.description>h1{
        margin-top: 10px;
    }
    .section section.img{
        padding-top: 0px;
    }
    .section.sec2 section.img>img,
    .section section.img>img{
        width: 90%;
    }
    #four section.description>h1{
        margin-top: 10px;
    }
    .form-base-one>p{
        display: none;
    }
    .section section.description>p.appstore{
        font-size: 0px;
    }
    .form-base-two {
        bottom: -120%;
    }
    #scroll-btn>p{
        display: none;
    }
}


