<style>
@charset "utf-8";
 #demo2_1
 {
	width: 200px;
	
 }
 #mo{
  display: none;/*隐藏*/
  width: 500px;
  height: 450px;
  position: fixed;
  background-color: rgba(251, 251, 251, 1.0);
  top: 180px;
  left: 450px;
  z-index: 1;
  border-radius:7px;
  border: #cbcbcb solid 0.8px;
  box-shadow: 10px 10px 80px #afafaf;
  
 }
 
 #motitle{
 	display: block;
	width: 498px;
	height: 34px;
	background-color: rgba(40, 40, 40, 0.9);
	color: white;
	font-size: 100;
	border-top-left-radius: 7px;
	border-top-right-radius: 7px;
 	box-shadow: 0px 10px 10px #d5d5d5;
 }
 
 #moimg{
  display: block;
  margin:60px auto;
  width: 230px;
  height: 230px;
  -webkit-animation: first 0.5s;
  -o-animation: first 0.5s;
  animation: first 0.5s;
  box-shadow: 0px 0px 20px #b8b8b8;
 }


 @keyframes first{
   from{transform: scale(0.1);}
   to{transform: scale(1);}
  }
  #tool{
	width: 300px;
	height: 63px;
	background-color: rgba(40, 40, 40, 0.9);
	margin-bottom: -1px;
	margin-left: 100px;
	border-top-left-radius: 8px;
	border-top-right-radius: 8px;
	box-shadow: -5px -10px 20px #d5d5d5;
	
  }
  #close:{
	 
  }
  #close:hover{
	-webkit-filter: brightness(130%);
	filter: brightness(130%);
  }
  
  
  #picdownload{
	  opacity: 0.6;
  }
  #picdownload:hover{
  	  opacity: 1;
  }
  #piczoomin{
  	  opacity: 0.6;
  }
  #piczoomin:hover{
	  opacity: 1;
  }
  #piczoomout{
  	  opacity: 0.6;
  }
  #piczoomout:hover{
  	  opacity: 1;
  }
  
 
 #mo2{
   display: none;/*隐藏*/
   width: 702px;
   height: 550px;
   position: fixed;
   background-color: rgba(255, 255, 255, 1.0);
   top: 130px;
   left: 400px;
   z-index: 1;
   border-radius:5px;
   border-bottom: #b3b3b3 solid 0.8px;
   border-left: #b3b3b3 solid 0.8px;
   border-right: #b3b3b3 solid 0.8px;
   box-shadow: 5px 5px 35px #848484;
  }
  #motitle2{
  	display: block;
	position: fixed;
	top: 130px;
	left: 400px;
  	width: 700px;
  	height: 35px;
  	background-color: rgba(40, 40, 40, 0.9);
	color: whitesmoke;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	box-shadow: 0px 10px 10px #b9bab9;
	background-image: linear-gradient(to bottom, rgba(40, 40, 40, 0.9),rgba(54, 54, 54, 0.9),rgba(40, 40, 40, 0.9));
	
  }
  #minititle2{
	  position: inherit;
	  font-size: 13px; 
	  font-weight: 500px;
	  margin-left: 250px;
	  margin-top: 9px;
	  margin-bottom: 10px;
  }
  #close2:hover{
  	-webkit-filter: brightness(130%);
  	filter: brightness(130%);
  }
  
  #mopic{
	  overflow: auto;
	  margin-top:30px;
	  width: 700px;
	  height: 520px;
  }
  
 
  @keyframes first{
    from{transform: scale(0.1);}
    to{transform: scale(1);}
   }
   
  .example{
	 opacity: 1;
  }
 .example:hover{
 	  border: 2px solid #b2b2b2;
 	  border-radius: 3px;
 	  opacity: 2;
 }
 .example1{
 	 opacity: 1;
  }

  .example2{
  	 opacity: 1;
  }
 .example2:hover{
 	  border: 2px solid  #4d48b4;
 	  border-radius: 3px;
 	  opacity: 2;
 }
  /* 
     example--picchosen 
     example--secchosen
  */
  .picchosen{
	  border:2px solid #454547;
	  border-radius: 3px;
	  opacity: 1;
  }
  .setchosen{
	  border: 2px solid #323232;
	  border-radius: 3px;
	  opacity: 1;
  }
  
  .layershow{
	  width: 115px;
	  height:720px;
	  border: 1px solid #dedede;
	  border-radius: 5px;
	  box-shadow: 0px 0px 10px #c0c0c0;
	  
	  position: absolute;
  }
  .layer{
	  width: 115px;
	  height:720px;
	  border: 0px solid #dedede;
	  border-radius: 5px;
	  box-shadow: 0px 0px 0px #e5e5e5;
	  position: absolute;
	  
  }
  .layertext{
	  width: 50px;
	  height:25px;
	  font: 13px 'Arial';
	  color: #757575;
	  border: 0px solid #e5e5e5;
	  margin-left: 5px;
  }
  .layertextchosen{
  	  width: 50px;
  	  height:25px;
  	  font: 13px 'Arial';
  	  color: #757575;
  	  border: 2px solid red;
  	  margin-left: 5px;
	  border-radius: 5px;
  }
  .layernodenum{
  	  width: 60px;
  	  height:22px;
  	  background-color: lightyellow;
  	  border: 1px solid #e5e5e5;
  	  border-radius: 5px;
  	  box-shadow: 0px 0px 5px #e5e5e5;
  	  position: absolute;
  	  text-align: left;
	  display: none;
	  font: 13px 'Arial';
	  color: #757575;
  }
  
  
  .secdiv{
	  height:40px;
	  width: 65px;
	  border: 1px solid #c7c7c7;
	  position: absolute;
	  border-radius: 5px;
	  box-shadow: 2px 2px 5px #e5e5e5;
  }
  .secdivnone{
	  height:40px;
	  width: 65px;
	  border: 0px solid #c7c7c7;
	  position: absolute;
	  border-radius: 5px;
	  box-shadow: 0px 0px 0px #e5e5e5;
  }
  .secdescip{
	  width: 65px;
	  height:22px;
	  background-color: lightyellow;
	  border: 1px solid #e5e5e5;
	  border-radius: 5px;
	  box-shadow: 0px 0px 5px #e5e5e5;
	  position: absolute;
	  text-align: left;
	  display: none;
	  font: 13px 'Arial';
	  color: #757575;
	  	  
  }
  .pictext{
	  width: 115px;
	  height: 30px;
	  color: #8c8c8c;
	  font-size: 12px;
  }
  .active{
	  width:20px;
	  height:20px;
	  position: absolute;
  }
  .inactive{
	  width:20px;
	  height:20px;
	  position: absolute;
  }
  
  
  .down{
  	  width:110px;
  	  height:50px;
  	  position: fixed;
  	  right: 12px;
  	  top:50px;
  	  border: 0px solid #c8c8c8;
  	  
  }
  .down:hover{
  	  opacity: 0.8;
  }
 
  
  .uploadfile{
	  width:110px;
	  height:50px;
	  border: 0px solid #c8c8c8; 
	  color: #000000;
	  
  }
  .uploadfile:hover{
  	  opacity: 0.8;
  }
  .uploadfileshow{
	  width:280px;
	  height:200px;
	  display:none;
	  position: fixed;
	  top:320px;
	  left: 600px;
	  background-color: #ffffff;
	  border: 1px solid #e3e4e3;
	  box-shadow:0px 0px 30px #e6e6e6 ;
	  border-radius: 8px; 
  }

  .uploadimgshow{
  	  width:280px;
  	  height:200px;
  	  display: none;
  	  position: fixed;
  	  top:320px;
  	  left: 600px;
  	  background-color: #ffffff;
  	  border: 1px solid #e3e4e3;
  	  box-shadow:0px 0px 30px #e6e6e6 ;
  	  border-radius: 8px; 
	  
  }
  #imgsub:hover{
	  opacity: 0.8;
  }
  #imgclose:hover{
  	  opacity: 0.9;
  }
  #filesub:hover{
	  opacity: 0.8;
  }
  #fileclose:hover{
  	  opacity: 0.9;
  }
  .alert{
	height:70px;
	width:500px;
	background-color: #ffffdf;
	position: fixed;
	left:450px;
	top:350px;
	display: none;
	border: #b5b5b5 solid 1px;
	box-shadow:0px 0px 20px #a1a1a1 ;
	opacity: 1;
  }
  
  .warning
  {
	  height:100px;
	  width:500px;
	  background-color: #feb7ae;
	  position: fixed;
	  left:450px;
	  top:350px;
	  display: none;
	  border: #b5b5b5 solid 1px;
	  box-shadow:0px 0px 20px #a1a1a1 ;
	  opacity: 1;
  }
  .warntext{
	  height: 100px;
	  width: 400px;
	  position: absolute;
	  margin-top: 20px;
	  margin-left:30px; 
	  margin-right:20px; 
	  color: #212121;
	  
  }

  .uppic{
	  height:38px;
	  width: 38px;
	  border-radius: 3px;
	  border: #b1b1b1 solid 2px;
	  opacity: 0.5; 
  }
  .uppic:hover{
	  border: #909090 solid 0px;
	  opacity: 1;
  }
  .uppicno{
	  height:38px;
	  width: 38px;
	  border-radius: 3px;
	  border: #b1b1b1 solid 2px;
	  opacity: 0.5; 
	  
  }
  .uppicno:hover{
  }
  .uppicchosen{
  	  height:38px;
  	  width: 38px;
  	  border-radius: 3px;
  	  border: #dddddd solid 0px;
  	  opacity: 1;
  }
  .zu{
	  display: none;
	  height:20px;
	  width:20px;
	  position: fixed;
	  
  }
  
  
  
</style>