* {padding: 0; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
html, body { background: #777 none repeat scroll 0 0; color: #333; font-family: Arial, Helvetica, sans-serif; font-size: 12px; height: 100%; margin: 0; padding: 0; width: 100%; overflow: hidden; }
a{text-decoration: none}
.dv-header { background: #222222 none repeat scroll 0 0; color: #b2d9e7; float: left; height: 55px; padding: 0; position: fixed; top: 0; transition: all .5s ease 0s; width: 100%; z-index: 100; }
.dv-header #logo { float: left; margin: 8px 10px; }
.dv-header #logo h1.logo { height: 100%; margin: 0; padding: 0; width: 100%; }
.dv-header #logo h1.logo a { height: 100%; text-indent: -9999px; width: 100%; }
.dv-header #logo h1.logo a img { display: block; height: 45px }
.dv-header .template_id { float: left; font-weight: bold; line-height: 25px; margin: 15px 30px 15px 25px; white-space: nowrap; text-transform: capitalize; }
.dv-header .template_id a { color: #fff; font-size: 14px}
.dv-header .template_id span { color: #32bb9d; margin-left: 6px}
.dv-header .devices { float: left; margin: 14px 10px; }
ul.responsive { display: block; float: left; margin: 0; }
ul.responsive li { display: block; float: left;  }
ul.responsive li a {opacity: .4;}
ul.responsive li a.active {opacity: 1;}
ul.responsive li.active { opacity: 1; }
.dv-header .devices a { display: block; float: left; font-size: 0; height: 26px; line-height: 0; margin: 0 10px; text-indent: -9999px; cursor: pointer; }
.dv-header .devices a.pc:hover, .dv-header .devices .active a.pc { background: rgba(0, 0, 0, 0) url("../images/icon_pc_h.png") no-repeat scroll center center; }
.dv-header .devices a.pc { background: rgba(0, 0, 0, 0) url("../images/icon_pc.png") no-repeat scroll center center; width: 30px; }
.dv-header .devices a.tablet_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_tablet_landscape.png") no-repeat scroll center center; width: 22px; }
.dv-header .devices a.tablet_portrait { background: rgba(0, 0, 0, 0) url("../images/icon_tablet_portrait.png") no-repeat scroll center center; width: 18px; }
.dv-header .devices a.phone_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_phone_landscape.png") no-repeat scroll center center; width: 20px; }
.dv-header .devices a.phone_portrait { background: rgba(0, 0, 0, 0) url("../images/icon_phone_portrait.png") no-repeat scroll center center; width: 12px; }
.dv-header .devices a.tablet_landscape:hover, .dv-header .devices  a.active.tablet_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_tablet_landscape_h.png") no-repeat scroll center center; }
.dv-header .devices a.tablet_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_tablet_landscape.png") no-repeat scroll center center; width: 22px; }
.dv-header .devices .active a.phone_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_phone_landscape_h.png") no-repeat scroll center center; }
.dv-header .devices a.phone_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_phone_landscape.png") no-repeat scroll center center; width: 20px; }
.dv-header .devices a.phone_portrait { background: rgba(0, 0, 0, 0) url("../images/icon_phone_portrait.png") no-repeat scroll center center; width: 12px; }
.dv-header .devices a.phone_portrait:hover, .dv-header .devices  a.active.phone_portrait { background: rgba(0, 0, 0, 0) url("../images/icon_phone_portrait_h.png") no-repeat scroll center center; }
.dv-header .devices a.tablet_portrait:hover, .dv-header .devices  a.active.tablet_portrait {background: rgba(0, 0, 0, 0) url("../images/icon_tablet_portrait_h.png") no-repeat scroll center center;}
.floatright { bottom: 28px; right: 75px; cursor: pointer; display: block; height: 20px; position: absolute; }
.btn-ttn a { font-size: 14px; border: 1px solid #32bb9d; text-align: center; cursor: pointer; text-decoration: none; padding: 0 16px; border-radius: 50px; color: #fff; text-transform: capitalize; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; background: #32bb9d; height: 32px; display: block; line-height: 32px; -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; margin-top: 6px; }
.dv-header span.trigger { background: rgba(0, 0, 0, 0) url("../images/icon-close-w.png") no-repeat scroll center center / 60%; border-top: 0 none; bottom: 17px; cursor: pointer; display: block; height: 20px; right: 14px; position: absolute; width: 20px; }
.dv-header span.trigger:hover { background: rgba(0, 0, 0, 0) url("../images/icon-close-hover.png") no-repeat scroll center center / 60%; }
.dv-header:before { display: block; width: 1px; height: 100%; position: absolute; background: #666666; right: 50px; top: 0; content: ''; }
.dv-header .devices a.phone_landscape:hover, .dv-header .devices  a.active.phone_landscape { background: rgba(0, 0, 0, 0) url("../images/icon_phone_landscape_h.png") no-repeat scroll center center; }
#iframelive { float: left; width: 100%; background: #777; margin-top: 55px; height: calc(100vh - 55px); }
#frameWrapper { background: transparent none repeat scroll 0 0; height: 100%; margin: 0; }
.pc { height: 100%; }
.srcoll { overflow-x: hidden; overflow-y: scroll; }
.ipadh { background-image: url("../images/pad-land.png"); background-repeat: no-repeat; height: 871px; margin: 30px auto; padding-left: 94px; padding-top: 43px; width: 1213px; }
.ipadv2 { background-image: url("../images/pad-port.png"); background-repeat: no-repeat; height: 1241px; margin: 30px auto; padding-left: 37px; padding-top: 104px; width: 837px; }
.iphoneh { background-image: url("../images/phone-land.png"); background-repeat: no-repeat; height: 395px; margin: 100px auto 30px; padding-left: 97px; padding-top: 17px; width: 763px; }
.iphonev { background-image: url(../images/phone-port.png); background-repeat: no-repeat; height: 790px; margin: 10px auto; padding-left: 15px; padding-top: 85px; width: 430px; background-size: 100% 100%; }
iframe{background: #fff}
.ipadh iframe{width: 1024px; height: 768px; display: inline-block;}
.ipadv2 iframe{width: 768px; height: 1024px; display: inline-block;}
.iphoneh iframe{width: 568px; height: 320px; display: inline-block;}
.iphonev iframe { width: 400px; height: 605px; display: inline-block; }
.pc iframe{width: 100%; height: 100%; display: inline-block;}
#frameBody{transition: all .5s}
.taoweb_class { width: 500px; height: 500px; border-radius: 5px; position: absolute; left: 50%; margin-left: -250px; z-index: 9999; }
.khungdeptaoweb{height: 70px}
@media only screen and (max-width: 999px){
    .dv-header #logo, ul.responsive{display: none}
    #frameBody, #frameBody iframe { background: none; width: 100%; height: 100%; padding: 0; margin: 0; }
    .dv-header .template_id { margin-left: 10px;}
    .btn-ttn a { font-size: 13px; padding: 0 11px; height: 35px; line-height: 33px; margin-top: 3px; }
    .floatright { right: 60px;}
}
@media only screen and (max-width: 767px){
	.taoweb_class { width: 96% !important; left: 0; margin-left: 2%; }
	.khungdeptaoweb {  font-size: 20px;   width: 150px !important;  }
	.xmall { font-size: 12px;  }
}