/*@font-face {
  font-family: 'Brandon-Reg';
  src: url('../assets/fonts/UniversLTStd-LightCn.woff') format('woff'), 
       url('../assets/fonts/UniversLTStd-LightCn.ttf')  format('truetype'), 
       url('../assets//fonts/UniversLTStd-LightCn.svg#UniversLTStd-LightCn') format('svg');
}*/

body{
  padding:0;
  margin: 0;
  cursor: pointer;
}

*{
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

#wrapper{
	width: 1024px;
	height: 278px;
	float: left;
	color: #f3f5f8;
	position: relative;
	overflow: hidden;
	font-family: 'Brandon-Reg',Arial;
  background: #FF5B5A;
}	

#bgImg{
    width: 1034px;
    margin: -49px auto 0 -6px;
    opacity: 0;
}

#bgImg img{
    width: 100%;
}

#bgImg,#phone, #pic1{
    opacity: 0;
}

.logo, .welcome, .experience, .learn-more{
    opacity: 0;
}

#pic1, #mask{
    opacity: 0;
    position: absolute;
    width: 90px;
    top: 59px;
    left: 466px;
}

#mask{
    overflow: hidden;
    height: 160px;
}

#mask img{
    width: 270px;
}

#pic1 img{
        width: 100%;
}

#phone{
    position: absolute;
    top: 17px;
    width: 134px;
    left: 444px;
}

#phone img{
    width: 100%;
}

.logo, .welcome, .experience, .learn-more{
    opacity: 0;
}

#adVideo{
    width: 100%;
}

#videoWrap{
    width: 108px;
    height: 220px;
    position: absolute;
    top: 43px;
    left: 677px;
    opacity: 0;
}

#replayBtn{
    position: absolute;
    top: 123px;
    left: 692px;
    display: none;
    width: 79px;
}

#replayBtn img{
    width: 100%;
}


.second-half {
    width: 490px;
    text-align: center;
    color: #fff;
    position: absolute;
    top: -8px;
    left: 117px;
}
.second-half div {
    margin-left: auto;
    margin-right: auto
}
.second-half div img {
    width: 100%
}
.second-half .logo {
       opacity: 0;
    width: 10%;
    margin-top: 40px;
}
.second-half .welcome {
    opacity: 0;
    width: 44%;
    margin-top: 14px;
}

.second-half .experience {
        opacity: 0;
    width: 70%;
    margin-top: 15px;
}

.second-half .learn-more {
        opacity: 0;
    width: 114px;
    margin-top: 3%;
    position: relative;
    z-index: 1;
}
 .second-half .learn-more img:hover {
    opacity: .5
}

#muteUnmute{
     opacity: 0; 
    position: absolute;
    top: 192px;
    left: 741px;
    width: 37px;
}

#muteUnmute img{
    position: absolute;
    width: 100%;
}

#mute{
    display: none;
}