.msg_aguarde {
  margin: 0;
    position: absolute;
    top: 45%;
    left: 50%;
    width:250px;
    margin-right: -50%;
    transform: translate(-50%, -50%);
      border-radius: 30px 30px ;
      color:white;
 }


.loader {
  border: 16px solid  silver;
  border-radius: 50%;
  border-top: 16px solid  #F5F5F5;
  border-bottom: 16px solid  silver;
  width: 100px;
  height: 100px;
  -webkit-animation: spin 4s linear infinite;
  animation: spin 6s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}






@media only screen and (max-width: 700px) {
    /* For tablets: */



.img_cartas {
          width: 57px;
         height: 80px;
	        border-radius: 15px 15px;        
  }

.container_fundo {
background: rgb(2,0,36);
background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(254,0,0,1) 91%, rgba(0,0,0,1) 100%);
  position:  relative;
  top:0;
  width: 360px;
 height: 362px;

 margin:auto;
    }




.container_mesa {
 background: rgb(34,82,13);
background: linear-gradient(0deg, rgba(34,82,13,1) 24%, rgba(0,0,0,1) 34%, rgba(13,36,12,1) 43%, rgba(1,3,1,1) 44%, rgba(2,5,2,1) 100%, rgba(0,0,0,0.15727699530516437) 100%, rgba(0,0,0,1) 100%);   
  top:0;
 position:  relative;
  width: 360px;
 height: 362px;
 margin:auto;

    }

.fundo_mandala { 
background-image: url('../imagens/mobile/Mandala_fundo_transparente.png') ;
 background-repeat:no-repeat;
  top:0;
         position: relative;
        width:360px;
        height: 362px;

        margin:auto;

}

.container_mandala {
  top:0;
 background-image: url('../Imagens/mobile/fundo_mandala.jpg');
 background-repeat:no-repeat; 
  position:  relative;
  width: 360px;
 height: 362px;
 margin:auto;
    }

.container_backgound {
  top:0px;


  position:  relative;
  width: 360px;
 height: 362px;
  margin:auto;


    }


.iframe_jogo_manutencao {
	  	position: relative;
	  	top:0px;
	    left:0px;
		width:360px;
		height:362px;
			 border:0px;
		margin:auto;
	}

	.iframe_cartas_manutencao {
		position: relative;
 	   	top:0px;
 	   	left:0px;
		width:360px;
		height:225px;
		margin:auto;
		}


.iframe_jogo {
	   position:  relative;
    	  top:0px;
    	  left:0px;
		width:360px;       	  
	 height:362px;
	 border:0px;
  	   margin:auto;       	  
	}
	
.iframe_cartas {
 	 position:  relative;
        top:0px;
	  left:0px;
 	    width:360px;
	   height:225px;
  	   margin:auto;
  	}







  

    
     
.body {
    margin: 0px;
       }

/* ---------------[  checkmark Seleciona as cartas - INICIO */
.checkmark {
  position: relative;
  height: 40px;
  width: 20px;
  -webkit-appearance:button;
   border-radius: 15px 15px;
}
	input[type=checkbox]:checked {
	    background-color:    orange;
	}


/* ---------------[  checkmark Seleciona as cartas - FIM */

.hora_inicio 
    {
      position:   relative;
      margin: 0px;
      left: 0px;
      top: 20px;
      width: 50%;
      margin:  auto;
      width: 360px;
      color: #336699;
      font-style: normal;
      font-size: 20px;
      text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      color: orange;
      font-family:Verdana, Geneva, sans-serif;
}

.Nome_cliente
   {
      position:  relative;
      margin: 0px;
      top: 250px;
      width: 50%;
      margin: auto;
      width: 360px;
      color:  white;
      font-style: normal;
      font-size: 30px;
      text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      color:   white;
      font-family:Verdana, Geneva, sans-serif;
    }

.Tempo
   {
      position:   relative;
       margin: 0px;
       left: 0px;
      top: 235px;
      width: 50%;
      margin:  auto;
      width: 360px;
      color: #336699;
      font-style: normal;
      font-size: 16px;
      text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      -moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
      color: orange;
      font-family:Verdana, Geneva, sans-serif;
    }


.Mandala_Carta_12 {
  position: absolute;
  left: 46px;
  top: 120px;
}
.Mandala_Carta_11 {
  position: absolute;
  left: 83px;
  top: 61px;
}
.Mandala_Carta_10 {
  position: absolute;
  left: 140px;
  top: 27px;
}
.Mandala_Carta_9 {
  position: absolute;
  left: 193px;
  top: 27px;
}
.Mandala_Carta_8 {
  position: absolute;
  left: 254px;
  top: 61px;
}
.Mandala_Carta_7 {
  position: absolute;
  left: 291px;
  top: 120px;
}
.Mandala_Carta_6 {
  position: absolute;
  left: 291px;
  top: 186px;
}
.Mandala_Carta_5 {
  position: absolute;
  left: 254px;
  top: 242px;
}
.Mandala_Carta_4 {
  position: absolute;
  left: 193px;
  top: 274px;
}
.Mandala_Carta_3 {
  position: absolute;
  left: 140px;
  top: 274px;
}
.Mandala_Carta_2 {
  position:  absolute;
  left: 83px;
  top: 242px;
}
.Mandala_Carta_1 {
  position:   absolute;
  left: 46px;
  top: 186px;
}



}





@media only screen and (min-width: 700px) {
    /* For desktop: */

.img_cartas{
border-radius: 5px;
   width: 77px;
         height: 111px;
          border-radius: 15px 15px;
      
  }
    
    
.container_fundo {
         position:  relative;
	  top:0px;         
background: rgb(2,0,36);
background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(254,0,0,1) 91%, rgba(0,0,0,1) 100%);
        width:700px;
        height: 491px;
        margin:auto;
       
    }

    
.container_mesa {
 background: rgb(34,82,13);
background: linear-gradient(0deg, rgba(34,82,13,1) 24%, rgba(0,0,0,1) 34%, rgba(13,36,12,1) 43%, rgba(1,3,1,1) 44%, rgba(2,5,2,1) 100%, rgba(0,0,0,0.15727699530516437) 100%, rgba(0,0,0,1) 100%);   

         position: relative;
        width:700px;
        height: 491px;
        margin:auto;
       
    }



.fundo_mandala { 
background-image: url('../imagens/Pc/Mandala_fundo_transparente.png') ;
 background-repeat:no-repeat;
  top:0;
         position: relative;
        width:700px;
        height: 491px;
        margin:auto;

}

.container_mandala {
 background-image: url('../imagens/Pc/fundo_mandala.jpg') ;
 background-repeat:no-repeat;
	  top:0;
         position: relative;
        width:700px;
        height: 491px;
        margin:auto;
    
    }

.container_backgound {
  position:  relative;
 background-image: url('../imagens/Pc/fundo_mesa.jpg') ;
  background-repeat:no-repeat;
  top:0px;
  width: 700px;
 height: 491px;
    }


.iframe_jogo_manutencao {
	  	position: relative;
	  	top:0px;
	    left:0px;
		width:760px;
		height:507px;
			 border:0px;
		margin:auto;
	}

	.iframe_cartas_manutencao {
		position: relative;
 	   	top:0px;
 	   	left:0px;
		width:760px;
		height:150px;
		margin:auto;
		}




.iframe_jogo {
	  	position: relative;
	  	top:0px;
	    left:0px;
		width:700px;
		height:491px;
			 border:0px;
		margin:auto;
	}
	
	.iframe_cartas {
		position: relative;
 	   	top:0px;
 	   	left:0px;
		width:700px;
		height:150px;
		margin:auto;
		}



.quadro {
position:  absolute;
left:0px;
top:0px;

  width: 77px;
   height: 111px;  
 border: 1px solid gray;
    border-radius: 15px 15px;

  }




.body {
    margin: 0px;
       }



/* ---------------[  checkmark Seleciona as cartas - INICIO */
.checkmark {
position:relative;
  width: 1px;
         height: 1px;
  -webkit-appearance:button;
   border-radius: 15px 15px;
}

	input[type=checkbox]:checked {
	    background-color:    orange;
	}

/* ---------------[  checkmark Seleciona as cartas - FIM */
	
	
	


/* Anima a carta */
.animate {
    -webkit-animation: animatezoom 0.6s;
    animation: animatezoom 0.6s
}

@-webkit-keyframes animatezoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}
    
@keyframes animatezoom {
    from {transform: scale(0)} 
    to {transform: scale(1)}
}



.hora_inicio {
  position:   relative;
  margin: 0px;
  left: 0px;
  top: 50px;
  width: 50%;
   margin:  auto;
     width: 700px;
     color: #336699;
     font-style: normal;
font-size: 30px;
text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
color: orange;
font-family:Verdana, Geneva, sans-serif;}


.Nome_cliente {
  position:  relative;
  margin: 0px;
  left: 0px;  
  top: 340px;
  width: 50%;
   margin: auto;
     width: 700px;
     color:  white;
     font-style: normal;
font-size: 30px;
text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
color:   white;
font-family:Verdana, Geneva, sans-serif;}


.Tempo {
   position:   relative;
  margin: 0px;
  left: 0px;
  top:295px;
  width: 50%;
   margin:  auto;
     width: 360px;
     color: #336699;
     font-style: normal;
font-size: 16px;
text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-webkit-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
-moz-text-shadow:1px 1px 0 rgb(25,76,101),2px 2px 1px rgba(0,0,0,0);
color:   white;
font-family:Verdana, Geneva, sans-serif;}





.Mandala_Carta_1 {
  position:  absolute;
  left: 165px;
  top: 240px;
  border-radius: 30px;
}
.Mandala_Carta_2 {
  position: absolute;
  left: 205px;
  top: 320px;
  border-radius: 30px;  
}
.Mandala_Carta_3 {
  position: absolute;
  left: 283px;
  top: 360px;
    border-radius: 30px;
}
.Mandala_Carta_4 {
  position: absolute;
  left: 365px;
  top: 360px;
    border-radius: 30px;
}
.Mandala_Carta_12 {
  position: absolute;
  left: 165px;
  top: 158px;
    border-radius: 30px;
}
.Mandala_Carta_11 {
  position:  absolute;
  left: 205px;
  top: 75px;
    border-radius: 30px;
}
.Mandala_Carta_10 {
  position:  absolute;
  left: 283px;
  top: 41px;
    border-radius: 30px;
}
.Mandala_Carta_9 {
  position: absolute;
  left: 365px;
  top: 41px;
    border-radius: 30px;
}
.Mandala_Carta_8 {
  position: absolute;
  left: 448px;
  top: 75px;
    border-radius: 30px;
}
.Mandala_Carta_7 {
  position: absolute;
  left: 485px;
  top: 158px;
    border-radius: 30px;
}
.Mandala_Carta_6 {
  position: absolute;
  left: 485px;
  top: 240px;
    border-radius: 30px;
}
.Mandala_Carta_5 {
  position: absolute;
  left: 448px;
  top: 320px;
    border-radius: 30px;
}

 
 
 
 
.Carta_78_78 {
  position: absolute;
  left: 643px;
  top: 402px;

}
.Carta_78_77 {
  position: absolute;
  left: 592px;
  top: 402px;

}
.Carta_78_76 {
  position: absolute;
  left: 538px;
  top: 402px;

}
.Carta_78_75 {
  position: absolute;
  left: 489px;
  top: 402px;

}
.Carta_78_74 {
  position: absolute;
  left: 438px;
  top: 402px;

}
.Carta_78_73 {
  position: absolute;
  left: 386px;
  top: 402px;


}
.Carta_78_72 {
  position: absolute;
  left: 333px;
  top: 402px;

}
.Carta_78_71 {
  position: absolute;
  left: 280px;
  top: 402px;

}
.Carta_78_70 {
  position: absolute;
  left: 227px;
  top: 402px;

}
.Carta_78_69 {
  position: absolute;
  left: 174px;
  top: 402px;

}
.Carta_78_68 {
  position: absolute;
  left: 121px;
  top: 402px;

}
.Carta_78_67 {
  position: absolute;
  left: 71px;
  top: 402px;

}
.Carta_78_66 {
  position: absolute;
  left: 21px;
  top: 402px;
}

.Carta_78_65 {
  position: absolute;
  left: 645px;
 top: 335px;
}
.Carta_78_64 {
  position: absolute;
  left: 592px;
 top: 335px;

}
.Carta_78_63 {
  position: absolute;
  left: 538px;
 top: 335px;

}
.Carta_78_62 {
  position: absolute;
  left: 489px;
 top: 335px;
}
.Carta_78_61 {
  position: absolute;
  left: 438px;
 top: 335px;
}
.Carta_78_60 {
  position: absolute;
  left: 386px;
 top: 335px;
}
.Carta_78_59 {
  position: absolute;
  left: 333px;
 top: 335px;
}
.Carta_78_58 {
  position: absolute;
  left: 280px;
 top: 335px;
}
.Carta_78_57 {
  position: absolute;
  left: 227px;
 top: 335px;
}
.Carta_78_56 {
  position: absolute;
  left: 174px;
 top: 335px;
}
.Carta_78_55 {
  position: absolute;
  left: 121px;
  top: 335px;
}
.Carta_78_54 {
  position: absolute;
  left: 71px;
  top: 335px;
}
.Carta_78_53 {
  position: absolute;
  left: 21px;
  top: 335px;
}


.Carta_78_52 {
  position: absolute;
  left: 645px;
  top: 260px;
  }
  
.Carta_78_51 {
  position: absolute;
  left: 592px;
  top: 260px;
}
.Carta_78_50 {
  position: absolute;
  left: 538px;
  top: 260px;
}
.Carta_78_49 {
  position: absolute;
  left: 489px;
  top: 260px;
}
.Carta_78_48 {
  position: absolute;
  left: 438px;
  top: 260px;
}
.Carta_78_47 {
  position: absolute;
  left: 386px;
  top: 260px;
}
.Carta_78_46 {
  position: absolute;
  left: 333px;
  top: 260px;
}
.Carta_78_45 {
  position: absolute;
  left: 280px;
  top: 260px;
}
.Carta_78_44 {
  position: absolute;
  left: 227px;
  top: 260px;
}
.Carta_78_43 {
  position: absolute;
  left: 174px;
  top: 260px;
}
.Carta_78_42 {
  position: absolute;
  left: 121px;
  top: 260px;
}
.Carta_78_41 {
  position: absolute;
  left: 71px;
  top: 260px;
}
.Carta_78_40 {
  position: absolute;
  left: 21px;
  top: 260px;
}

.Carta_78_39 {
  position: absolute;
  left: 645px;
   top: 184px;
}
.Carta_78_38 {
  position: absolute;
  left: 592px;
   top: 184px;
}
.Carta_78_37 {
  position: absolute;
  left: 538px;
   top: 184px;
}
.Carta_78_36 {
  position: absolute;
  left: 489px;
   top: 184px;
}
.Carta_78_35 {
  position: absolute;
  left: 438px;
   top: 184px;
}
.Carta_78_34 {
  position: absolute;
  left: 386px;
   top: 184px;
}
.Carta_78_33 {
  position: absolute;
  left: 333px;
   top: 184px;
}
.Carta_78_32 {
  position: absolute;
  left: 280px;
   top: 184px;
}
.Carta_78_31 {
  position: absolute;
  left: 227px;
   top: 184px;
}
.Carta_78_30 {
  position: absolute;
  left: 174px;
   top: 184px;
}
.Carta_78_29 {
  position: absolute;
  left: 121px;
   top: 184px;
}
.Carta_78_28 {
  position: absolute;
  left: 71px;
   top: 184px;
}
.Carta_78_27 {
  position: absolute;
  left: 21px;
  top: 184px;
}

.Carta_78_26 {
  position: absolute;
  left: 645px;
  top: 110px;
}
.Carta_78_25 {
  position: absolute;
  left: 592px;
  top: 110px;
}
.Carta_78_24 {
  position: absolute;
  left: 538px;
  top: 110px;
}
.Carta_78_23 {
  position: absolute;
  left: 489px;
  top: 110px;
}
.Carta_78_22 {
  position: absolute;
  left: 438px;
  top: 110px;
}
.Carta_78_21 {
  position: absolute;
  left: 386px;
  top: 110px;
}
.Carta_78_20 {
  position: absolute;
  left: 333px;
  top: 110px;
}
.Carta_78_19 {
  position: absolute;
  left: 280px;
  top: 110px;
}
.Carta_78_18 {
  position: absolute;
  left: 227px;
  top: 110px;
}
.Carta_78_17 {
  position: absolute;
  left: 174px;
  top: 110px;
}
.Carta_78_16 {
  position: absolute;
  left: 121px;
  top: 110px;
}
.Carta_78_15 {
  position: absolute;
  left: 71px;
  top: 110px;
}
.Carta_78_14 {
  position: absolute;
  left: 21px;
  top: 110px;
}


.Carta_78_13 {
  position: absolute;
  left: 645px;
  top: 35px;

}
.Carta_78_12 {
  position: absolute;
  left: 592px;
  top: 35px;

}
.Carta_78_11 {
  position: absolute;
  left: 538px;
  top: 35px;

}
.Carta_78_10 {
  position: absolute;
  left: 489px;
  top: 35px;

}
.Carta_78_9 {
  position: absolute;
  left: 438px;
  top: 35px;

}
.Carta_78_8 {
  position: absolute;
  left: 386px;
  top: 35px;

}
.Carta_78_7 {
  position: absolute;
  left: 333px;
  top: 35px;

}
.Carta_78_6 {
  position: absolute;
  left: 280px;
  top: 35px;

}
.Carta_78_5 {
  position: absolute;
  left: 227px;
  top: 35px;

}
.Carta_78_4 {
  position: absolute;
  left: 174px;
  top: 35px;

}
.Carta_78_3 {
 position: absolute;
  left: 121px;
  top: 35px;

}
.Carta_78_2 {
  position: absolute;
  left: 71px;
  top: 35px;

}
.Carta_78_1 {
  position: absolute;
  left: 21px;
  top: 35px;
}




    
}