html
{
}

body
{
margin: 0;
padding: 0;
background: #fff;
width:100%;
font-family:"Microsoft Yahei";
text-decoration:none;
}

.page
{
width: 100%;
margin: 0 0;
padding:20px 0;
background: #A7F6EE;
}
#page1
{
background:#C1F0EC;
background:url(../resource/IMG_3375.jpg);
background-size:cover;
}

#page2
{
position:relative;
background:url(../resource/IMG_2956.jpg);
background-size:cover;
background-attachment: fixed;

}

#page3
{
position:relative;
background:url(../resource/IMG_2600.jpg);
background-size:cover;
background-attachment: fixed;

}

#page4
{
position:relative;
background:url(../resource/IMG_3025.jpg);
background-size:cover;
background-attachment: fixed;

}

#page5
{
position:relative;
background:url(../resource/IMG_3245.jpg);
background-size:cover;
background-attachment: fixed;

}

#page6
{
position:relative;
background:url(../resource/IMG_3631.jpg);
background-size:cover;
background-attachment: fixed;

}


#page7
{
position:relative;
background: #000;

}
#page8
{
position:relative;
background: #000;
height:100vh;
width:100%;

}
#maintitle{
width:80%;
margin: 10px auto;
font-size:10vw;
text-align: center;

}
#ticket{
width:80%;

margin: 10px auto;


}
#daylist{
width:100%;
height: 10%;
Z-index:999;
background: rgba(255,255,255,0.7);
}

.day{
float:left;
width:16.6%;


text-align:center;
line-height:10vh;
transition: all 0.3s ease;
}
.day:hover{

background: rgba(168,168,168,0.7);
transition: all 0.3s ease;
}
#day1{
background:url(../resource/logo2.png);
background-position:center;
background-repeat:no-repeat;
background-size:80% auto;
}
.clear
{
clear: both;
}
#burst-12 {
float:left;
background: #fff; 
width: 3vw;
height: 3vw;
position: relative;

text-align: center;
margin: auto;
margin-left:48.5%;
}
#burst-12:before, #burst-12:after {
content: "";
position: absolute;

top: 0;
left: 0;
height: 3vw;
width: 3vw;
background: #fff; 
}
#burst-12:before {
-webkit-transform: rotate(30deg);
-moz-transform: rotate(30deg);
-ms-transform: rotate(30deg);
-o-transform: rotate(30deg);
}
#burst-12:after {
-webkit-transform: rotate(60deg);
-moz-transform: rotate(60deg);
-ms-transform: rotate(60deg);
-o-transform: rotate(60deg);
}
.line
{
float:left;
margin: 0 auto;
width:45%;
height:3vw;
font-size:3vw;
color:#fff;
line-height:3vw;
}
.verticalline
{
height:100px;
width:1px;
border: solid 2px #ffffff;
border: solid 0.15vw #ffffff;

background:#fff;
margin: 0 auto;
}

#photo
{
width:80%;

margin: 0 auto;
border: solid 0.3vw #ffffff;
padding: 0 0;
text-align:center;
background: rgba(255,255,255,0.9);
}
#circle {
width: 3vw;
height: 3vw;
box-sizing: border-box;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
border: solid 0.75vw #ffffff;
margin: 0 auto;
margin-left:48.5%;
float:left;
border-width: 0.75%;

}

.caption
{
width:94%;
height:4vw;
line-height:100%;
padding:3%;
font-size:4vw;
color:#FFF;

}
.left
{
float:left;
width:50%;
height:3vw;
line-height:100%;
font-size:3vw;
color:#FFF;
text-align: right;
}
.right
{
float:left;
width:50%;
height:4vw;
line-height:100%;
font-size:3vw;
color:#FFF;
text-align: left;
}
#thank
{
height:50vh;
width:100%;

 display: table-cell;
   vertical-align: bottom;

}
#thanks
{

height:5vw;
width:100vw;
font-size:5vw;
text-align: center;
color:#FFF;


}
#sponsor
{
height:50vh;
width:100%;
text-align: center;
color:#FFF;
font-size:2vw;
}

#brief
{
width:100%;
text-align: center;
color:#FFF;
font-size:2vw;
margin-bottom:2vw;
}

.avatar
{
max-width:705px;
max-height:705px;
margin: 0 auto;
}
.middle
{

text-align: center;
}