/*卡片样式*/
	.cards-deck-container{
            position:relative;
            width:100%;
            height:180px;
            margin:0 auto;
     }
     
     .card{
           position:absolute;
           left:0;top:0;
           width:100px;
           height:150px;
           cursor:pointer;
           transform-style:preserve-3d;
           transition:transform .6s,left .8s cubic-bezier(.4,0,.2,1),top .8s cubic-bezier(.4,0,.2,1);
           transform: translateY(0);    
     }

	.card:hover,.card:active {
		  transition: transform 0.15s ease-out, box-shadow 0.15s ease-out;
		  transform: rotateY(180deg) translateY(calc(-10%));		  
		  box-shadow: 0 12px 20px rgba(0, 0, 0, 0.35);
	 }
     .card-face{
         position:absolute;
         width:100%;height:100%;
         backface-visibility:hidden;
         border-radius:8px;
         box-shadow:0 4px 10px rgba(0,0,0,.35);
         display:flex;
         align-items:center;
         justify-content:center;
         font-size:26px;
         font-weight:bold;
         color:#fff;
     }
     .card-back{background:linear-gradient(135deg,#ff6b6b,#ee5a24);}
     .card-front{background:linear-gradient(135deg,#4834d4,#686de0);}

/* 初始状态：背面朝上（已翻转180） */
     .card{transform:rotateY(180deg)}
     .card .card-back{transform:rotateY(180deg)}
     .card .card-front{transform:rotateY(0deg)}
     
 /* 展开后正面朝上 */
 /*       .card.show{transform:rotateY(0deg)}
        .card.show .card-front{transform:rotateY(0deg)}
        .card.show .card-back{transform:rotateY(-180deg)}
*/
	 .slot{
         width:120px;
         height:180px;
         
         /*border:3px dashed rgba(255,255,255,.6);*/
         border-radius:10px;
         position:relative;
         background:rgba(255,255,255,.1);
         transition:border .3s;
     }
     .slot.filled{border:none;background:transparent}	


	 /* 选中后移动到上方并翻回背面 */
        .card.moving{
            z-index:999;
            transition:left .8s cubic-bezier(.4,0,.2,1),
                       top .8s cubic-bezier(.4,0,.2,1),
                       transform .8s;
        }
        .card.moving.flipped{
            transform:rotateY(0deg) translateX(0) translateY(0) !important;
        }

        .card.disabled{pointer-events:none;opacity:.4}
        
        
        
        
        
        
    /*按钮样式*/    
    .is-button-icon-backgrayhover,.is-button-icon-backgrayhover-backgreenactive{
		color: rgba(32, 40, 45);
		cursor: pointer;
		width:35px;
		height:35px;
		font-size:30px;
		text-align: center; 
		display: flex;
    	align-items: center;
    	justify-content: center;
    	background-color:#ffffff;
     	
	}
	
	
	
	.is-button-icon-backgrayhover:hover,.is-button-icon-backgrayhover-backgreenactive:hover{
		background-color:rgba(248, 249, 250);/*#e9e9ea*/
	}
	button, .button {
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  #ffffff 0%, #b5b5b5 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #ffffff 0%,#b5b5b5 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #ffffff 0%,#b5b5b5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#b5b5b5',GradientType=0 ); /* IE6-9 */
  color: #141018;
  display: inline-block;
  text-transform: uppercase;
  font-family: 'Open Sans', sans-serif;
  font-size: 1.6rem;
  letter-spacing: 0.35rem;
  font-weight: 600;
  padding: 1.5rem 2rem;
  border: 1px solid #fff;
  vertical-align: middle;
  width: auto;
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
      -ms-border-radius: 5px;
          border-radius: 5px;
  -webkit-transition : 0.4s ease 0s;
     -moz-transition : 0.4s ease 0s;
      -ms-transition : 0.4s ease 0s;
       -o-transition : 0.4s ease 0s;
          transition : 0.4s ease 0s;
}
 .button:hover, .button:focus, .button:active {
  background: #b5b5b5; /* Old browsers */
  background: -moz-linear-gradient(top,  #b5b5b5 0%, #ffffff 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #b5b5b5 0%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #b5b5b5 0%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b5b5b5', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}