﻿body {
    background-color: #fff;
}
.bg_hapvida_intro{
    background-color:#efeee7;
    padding:50px 0;
}
.hapvida_intro .img1{
    width:70.82%;
    max-width:942px;
    margin-top:82px;
}
.hapvida_intro .img2{
    width:24.43%;
    max-width:325px;
}

.bg_hapvida_intro2{
    background-color:#ffffff;
    padding:50px;
}
.bg_hapvida_intro2 .img1{
    width:100%;
    max-width:777px;
    margin:0 auto;
    display: block;
}
.hapvida_intro2 img{
    width:25%;
    max-width:351px;
}
.appintro {
    z-index: 0;
    position: relative;
    width: 100%
}

.appbts {
    z-index: 1;
    left: 11.5%;
    bottom: 15%;
    position: absolute;
    width: 23%;
    height: auto;
    max-width: 298px;
    display: block;
}

.appbts .img1{
    width:100%;
    border:0;
    display:block;
}
.appbts .img2{
    width:50%;
    display:block;
    float: left;
}
.appbts .img2 img{
    width:100%;
    border:0;
    display:block;
}
.video_home{
    margin-top:7%;
}
@media screen and (max-width: 815px) {
    .appbts {
        display: block;
        margin-bottom: 0;
        max-width: 201px;
        width: 100%;
    }
}
@media screen and (max-width: 768px) {
    .hapvida_intro .img1, .hapvida_intro .img2, .hapvida_intro2 img{
        width:100%;
        float:none;
        display:block;
        margin:0 auto;
    }
    .hapvida_intro .img2{
        margin-top:50px;
    }
}
@media screen and (max-width: 600px) {
    .appbts {
        bottom: 5%;
    }
}
@media screen and (max-width: 400px) {
    .appbts {
        bottom: 0;
    }
}

@media screen and (max-width: 420px) {
    .appbts {
        margin-bottom: 10px;
        max-width: 160px;
    }
}
