* {
  padding: 0;
  margin: 0;
}

body {
  background-color: black;
}

body, html, main {
  height: 100% !important;
  overflow: hidden;
  /* overflow: scroll !important; */
}

#container {
  width: 100vh;
  height: 100vh;
  position: relative;
}

#buttonlogin {
  width: 100vh;
  height: 100vh;
  position: relative;
}

.log {
  width: 100vh;
  height: 100vh;
  position: fixed;
}

.dheader {
  position:relative;
  
}

.banner {
  
  position: fixed;
}

.banner1 {
  
  position: fixed;
  z-index: 0;
}

/* audio {
  position: fixed;
  padding: 10px;
  right: 0;
  z-index: 20;
  outline: none;
} */

#scene {
  position: fixed;
  top: 0;
  left: 0;
  
}

#scene1 {
  position: fixed;
  top: 0;
  left: 0;
  
  z-index: 1000;
}

#scene2 {
  position: fixed;
  top: 0;
  left: 0;
  
}

#scene3 {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1002;
}

/* .foot {
  position:absolute;
  left:0;
  bottom:0vh;
} */



.img {
  width: 100vw;
  height:100vh;
  border: none; 
  
  background-repeat:no-repeat;
  background-size: cover;
  background-position:center;
  z-index: 100;
}

/*.logo0 {*/
/*  width: 300px;*/
/*  height: 60px; */
/*  background-image: url("../IMG/logo2.png");*/
/*  position:center,fixed;*/
/*  margin-top: 3vh;*/
/*  margin-left: 10vw;*/
/*}*/

/*.cloud {*/
/*  background-image: url("../IMG/cloud.png");*/
/*  margin-top: 4vh;*/
/*}*/

.bg {
  width: 110vw;
  height: 110vh;
  margin-top: 0vh;
  background-image: url("../IMG/bg0.webp");
}

.bg1 {
  width: 80vw;
  height: 80vh;
  background-image: url("../IMG/bg1.webp");
  margin-left: -30vh;
}

/*.bg2 {*/
/*  width: 110vw;*/
/*  height: 110vh;*/
/*  background-image: url("../IMG/bg2.webp");*/
/*  margin-top: 0vh;*/
/*}*/

/*.bg3 {*/
/*  width: 110vw;*/
/*  height: 110vh;*/
/*  background-image: url("../IMG/bg3.webp");*/
/*  margin-top: -5vh;*/
/*}*/

/*.mountain1 {*/
/*  background-image: url("../IMG/mountain1.webp");*/
/*}*/

/*.mountain2 {*/
/*  background-image: url("../IMG/mountain2.webp");*/
/*}*/

.png1 {
  /* width: 100vw;
  height: 100vh; */
  background-image: url("../IMG/png1.webp");
  margin-top: 13vh;
}

.png2 {
  /* width: 90vw;
  height: 90vh; */
  background-image: url("../IMG/png2.webp");
  margin-left: 0vh;
  margin-top: 9vh;
}

.png3 {
  /* width: 90vw;
  height: 90vh; */
  background-image: url("../IMG/png3.webp");
  margin-left: 1vh;
  margin-top: 9vh;
}

/*.front {*/
/*  width: 100vw;*/
/*  height: 100vh;*/
/*  */
/*  margin-left: -15vw;*/
/*  margin-top: 20vh;*/
/*  background-image: url("../IMG/front.webp");*/
/*  !* filter: blur(); *!*/
/*}*/

.light {
  width: 50vw;
  height: 50vh;
  
  margin-left: 76vw;
  margin-top: -9vh;
  background-image: url("../IMG/light.webp");
}

/* .login {
  margin-top: 19vh;
  margin-left: 16vw;
  width: 80vw;
  height: 80vh;
  background-image: url("../IMG/login.png");
  filter: blur();
  display: none;
  transition: all 3s ease 0s;
} */

.login1 {
  width: 80vw;
  height: 80vh;
  margin-top: 15vh;
  margin-left: 10vw;
  background-image: url("../IMG/login1.webp");
  /* filter: blur(); */
  transition: all 0.6s ease 0.1s;
}

.buttons {
  width:35vw;
  height:35vh;
  margin-top: 17vh;
  margin-left:50vw;
  
  position: fixed;
  z-index: 1;
  /* filter: blur(); */
}

.buttons:hover {
  margin-top: 15vh;
  margin-left:45vw;
  
  position: fixed;
  z-index: 1;
  /* filter: blur(); */
}
.buttons:hover .login1 {
  /* display: none; */
  width: 90vw;
  height: 90vh;
  margin-top: 9vh;
  margin-left: 0vw;
  transition: all 0.3s ease 0s;
  filter:brightness(110%);
  filter:saturate(130%);
}


/* .buttons:hover .login {
  margin-top: 3vh;
  margin-left: -8vw;
  width: 120vw;
  height: 120vh;
  display:inline-block;
  transition: all 3s ease 0s;
} */

.f_link a .dengbao{
  position: relative;
  margin-bottom: -100px;
  margin-left:50vh;
  width: 0px;
  height: 0px;
  z-index: 100;
  transition: all 1s ease 0.5s ;
}

.f_link a:hover .dengbao{
  position: relative;
  margin-bottom: 100px;
  margin-left:50vh;
  width: 1123px;
  height: 795px;
  z-index: 100;
  transition: all 1s ease 0.5s ;
}