body {
    max-width:100%;
    background:url('images/home2.jpg') no-repeat center center fixed;
    background-size:cover;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    /*width:100%;*/
    min-height: 768px;
    /*position: relative;*/
    overflow-y: hidden;
}
.logo {
    background: url('images/logo.png') no-repeat center center;
    width:310px;
    height: 200px;
    margin-left: 30px;
    margrin-top:8px;
    -ms-transform: scale(0.7,0.7);
    -webkit-transform: scale(0.7,0.7);
    transform: scale(0.7,0.7);
    margin-left: -15px;
    margin-top: -25px;
}

.khungvideo {
    width: 380px;
    height: 220px;
    background-color: #ff7602;
    border-radius:10px;
    border:5px solid #ffdc00;
    margin-top: 165px;
    margin-left: 50px;
    position: absolute;
    top:0;
}
.khungvideonnho {
    width: 364px;
    height: 205px;
    border-radius: 10px;
    border: 5px solid #1e599f;
    margin-top: 3px;
    margin-left: 3px;
    background-color: white;
}
.kenji {
    background: url('images/kenji.png') no-repeat center center;
    width:265px;
    height: 400px;
    position: absolute;
    top: 35px;
    left: 34%;
    -webkit-animation-name: kenzi;
    -moz-animation-name: kenzi;
    -o-animation-name: kenzi;
    animation-name: kenzi;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    transform:translateZ(0);
    -webkit-transition: all 2s;
    -moz-transition: all 2s;
    -ms-transition: all 2s;
    -o-transition: all 2s;
    transition: all 2s;
}
.kenji:hover {
    -ms-transform: translate(-20px,50px); /* IE 9 */
    -webkit-transform: translate(-20px,50px); /* Safari */
    transform: translate(-20px,50px);
}
.classtextgame:hover {
    -ms-transform: scale(1.1,1.1);
    -webkit-transform: scale(1.1,1.1);
    transform: scale(1.1,1.1);
}
.classtextgame {
    position: absolute;
    top: 17%;
    left: 46%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    transform:translateZ(0);
}
.nero {
    background: url('images/nero.png') no-repeat center center;
    width:183px;
    height: 402px;
    position: absolute;
    top: 185px;
    left: 50%;
    -webkit-animation-name: nero;
    -moz-animation-name: nero;
    -o-animation-name: nero;
    animation-name: nero;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    transform:translateZ(0);
}
.nero:hover {
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}
.bangve {
    background: url('images/bangve.png') no-repeat center center;
    width:370px;
    height: 114px;
    position: absolute;
    bottom:0%;
    left: 43%;
}
.hana {
    background: url('images/hana.png') no-repeat center center;
    width:247px;
    height: 460px;
    position: absolute;
    top: 3%;
    left:82%;
    margin-top: 13%;
    cursor: pointer;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-name: hana;
    -moz-animation-name: hana;
    -o-animation-name: hana;
    animation-name: hana;
    animation-iteration-count: infinite;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    transform:translateZ(0);
}

.txthoathinh {
    margin-left: -60px;
    margin-top: 20px;
    position: absolute;
    top:3%;
    left:77%;
    cursor: pointer;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    transform:translateZ(0);
}
.txthoathinh:hover {
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}
.txthoasi {
    position: absolute;
    bottom: 85px;
    /* right: 43px; */
    left: 35%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    transform:translateZ(0);
}
.txthoasi:hover{
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}
.jazzmin {
    background: url('images/Jazzmin.png') no-repeat center center;
    width:420px;
    height: 417px;
    position: absolute;
    top: 0%;
    right: 12%;
    -webkit-animation-name: jazzmin;
    -moz-animation-name: jazzmin;
    -o-animation-name: jazzmin;
    animation-name: jazzmin;
    -webkit-animation-duration: 1.5s;
    -moz-animation-duration: 1.5s;
    -o-animation-duration: 1.5s;
    animation-duration: 1.5s;
    transform:translateZ(0);
}
.jazzmin:hover {
    -ms-transform: skew(5deg); /* IE 9 */
    -webkit-transform: skew(5deg); /* Safari */
    transform: skew(5deg); /* Standard syntax */
}
.tivi {
    background: url('images/playhana.png') no-repeat center center;
    width:247px;
    height: 211px;
    position: absolute;
    top: 58%;
    right: 11%;
}
.sanpham {
    background: url('images/product_01.png') no-repeat center center;
    width:283px;
    height: 178px;
    position: absolute;
    top:60%;
    left:115px;
    cursor: pointer;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -ms-transform: scale(0.8,0.8);
    -webkit-transform: scale(0.8,0.8);
    transform: scale(0.8,0.8);
}
.sanpham:hover {
    -ms-transform: scale(0.9,0.9);
    -webkit-transform: scale(0.9,0.9);
    transform: scale(0.9,0.9);
}

.lazekenji {
    background: url('images/laze.png') no-repeat center center;
    width:307px;
    height: 233px;
    position: absolute;
    top:-28%;
    left:-57%;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    -o-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-name: lazeken;
    -moz-animation-name: lazeken;
    -o-animation-name: lazeken;
    animation-name: lazeken;
    animation-iteration-count: infinite;
}
.khungthongtin {
    width:355px;
    height: 50px;
    background-color: #ff7e02;
    border-radius:10px;
    border:5px solid #ffdc00;
    margin-left: -35px;
    /* margin-bottom: 9px; */
    position: absolute;
    bottom: -75px;
}
.khungthongtinnho {
    width:347px;
    height: 45px;
    background-color: #1e599f;
    margin-top: 2px;
    margin-left: 4px;
    font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif;
    font-style: italic;
    font-weight: 600;
    font-size: 28px;
    color:#38e1ff;

}
.pdtxt {
    position: absolute;
    top: 20%;
    left: 6%;
}


.kenji_info{
    position: absolute;
    width: 100px;
    height: 100px;
    top: 113px;
    left: -10px;
}
.kenji_info .one-name{
    background: url('images/kenji-name.png')  no-repeat;
    width: 57px;
    height: 33px;
}
.kenji_info .one-title{
    background: url('images/kenji-title.png')  no-repeat;
    width: 98px;
    height: 62px;
}


.nero_info{
    position: absolute;
    width: 150px;
    height: 30px;
    top: 290px;
    left: 122px;
}
.nero_info .one-name{
    background: url('images/nero-name.png')  no-repeat;
    width: 57px;
    height: 28px;
}
.nero_info .one-title{
    background: url('images/nero-title.png')  no-repeat;
    width: 122px;
    height: 27px;
}


.jazzmin_info{
    position: absolute;
    width: 150px;
    height: 30px;
    top: 50px;
    left: 52px;
}
.jazzmin_info .one-name{
    background: url('images/jasmin-name.png')  no-repeat;
    width: 87px;
    height: 29px;
}
.jazzmin_info .one-title{
    background: url('images/jasmin-title.png') no-repeat;
    width: 116px;
    height: 65px;
}

.hana_info{
    position: absolute;
    width: 150px;
    height: 30px;
    top: 370px;
    left: 92px;
}
.hana_info .one-name{
    background: url('images/hana-name.png')  no-repeat right center;
    width: 119px;
    height: 28px;
}
.hana_info .one-title{
    background: url('images/hana-title.png') no-repeat right center;
    width: 119px;
    height: 64px;
}
.one-title{
    display: none;
}






@keyframes lazeken {
    0% {opacity: 1}
    100% {opacity: 0}
}
@-webkit-keyframes lazeken {
    0% {opacity: 1}
    100% {opacity: 0}
}
@-moz-keyframes lazeken {
    0% {opacity: 1}
    100% {opacity: 0}
}
@keyframes hana {
    0% {top:3%}
    100%{top:4%}
}
@-webkit-keyframes hana {
    0% {top:3%}
    100%{top:4%}
}
@-moz-keyframes hana {
    0% {top:3%}
    100%{top:4%}
}
@keyframes jazzmin {
    0%{right:-5%}
    100%{right:12%}
}
@-webkit-keyframes jazzmin {
    0%{right:0%}
    100%{right:12%}
}
@-moz-keyframes jazzmin {
    0%{right:0%}
    100%{right:12%}
}
@keyframes kenzi {
    0%{left:0%}
    100%{left:34%}
}
@-webkit-keyframes kenzi {
    0%{left:-5%}
    100%{left:34%}
}
@-moz-keyframes kenzi {
    0%{left:-5%}
    100%{left:34%}
}
@keyframes nero {
    0%{top:-5px}
    100%{top:185px}
}
@-webkit-keyframes nero {
    0%{top:-5px}
    100%{top:185px}
}
@-moz-keyframes nero {
    0%{top:-5px}
    100%{top:185px}
}
@keyframes hoverkenji {
    0%{  -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);}
    100%{  -ms-transform: rotate(-2deg); /* IE 9 */
        -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
        transform: rotate(-2deg);}
}
@-webkit-keyframes hoverkenji {
    0%{  -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);}
    100%{  -ms-transform: rotate(-2deg); /* IE 9 */
        -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
        transform: rotate(-2deg);}
}
@-moz-keyframes hoverkenji {
    0%{  -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);}
    100%{  -ms-transform: rotate(-2deg); /* IE 9 */
        -webkit-transform: rotate(-2deg); /* Chrome, Safari, Opera */
        transform: rotate(-2deg);}
}







