/* CSS Document */
@import "compass/css3";

* {
    box-sizing: border-box;
    /*margin: 0;
   padding: 0;*/
}


/*@import url(http://fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Serif:400,700);*/
html {
  /*height: 
  width:99%;*/
  margin:1%;
  width:98%;
}
body {
  /*height: 
  width:99%;*/
  margin:0;
  padding:0;
  font-family:arial;
  width:100%;
  font-size: 1.1em;
}

h1,h2,h3{
	margin:0;
	color:#024EB5;
}
h1{
 font: 250% BebasNeueregular bold;
}
h2{
 font: 200% BebasNeueregular bold;
}
h3{
 font: 150% BebasNeueregular bold;
}
#cartas_zen {
/*	width:50%;
	margin-left:auto;
	margin-right:auto;*/
	}
.wrap {
  width:100%;
  text-align:left;
  color: #353535;
  margin-left:auto;
  margin-right:auto;
}
.wrap h1 {
	margin-bottom:10px;
}
.wrap h2 {
	color:#000000;
	font-size:150%;
}
.wrap ul {
	margin:0;
	text-decoration:none;
	padding:0;
}
.wrap ul li {
  float:left;
  width:19.8%;
  /*width:159px;*/
  text-align:center;
  border:1px solid #DDDCD8;
  list-style:none;
  margin:0;
  padding:0;
}
.table {
  background-color:#ffffff; 
  width:100%;
  margin-top:15px;  
}
.top {
  background-color:#EAE9E4;
  height:75px;
  h1 {
    padding-top:20px;
  }
}

.circle {
  width:90px;
  height:60px;
  border-radius:20px;
  font-size:0.8em;
  color:#fff;
  line-height:60px;
  text-align:center;
  background:#989A8F;
  margin-left:auto;
  margin-top:10px;
  margin-right:auto;
}

.charSelected{
text-align:center;
color:#063D92;
font-size:1.4em;
font-weight:bold;
opacity: 1;
filter:  alpha(opacity=100);
animation: parpadeo 4s;
-webkit-animation: parpadeo 4s;
-moz-animation: parpadeo 4s;
animation-iteration-count:infinite;
-webkit-animation-iteration-count:infinite;
-moz-animation-iteration-count:infinite;
}

.rdzen{
	visibility:hidden;
	float:left;
	position:absolute;
	}

.rota-horizontal{
    -webkit-transform: scaleX(-1);
    -moz-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.bottom {
margin-top:30px;
  p {
     font-size:1em;
     font-family: 'Droid Serif', sans-serif;
     padding:5px;
    span {
     font-weight:bold; 
    }
  }
}

.sign {
  margin-top:30px;
    .button {
   border: 1px solid #989A8F;
   padding: 10px 40px;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   color: #989A8F;
   font-size: 1em;
   text-decoration: none;
   vertical-align: middle;
    font-size:1.2em;
   }
}

.purple {
  background-color:#5D4660;   
}

.white {
 color:#FFFFFF; 
}

.pink {
  background-color:#BC9B94;
}

/********************************************/

input[type="radio"]:checked + label {
	border:solid 4px #1244E;
	}
	
form {
width: 100%; /*700px*/
margin: 0 auto;
	}

form img {
width: 10%;	
height: auto;
margin:5px;
/*height: 143px;
width: 100px;*/
/*margin: 15px 0;*/
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
	}
form img:hover {
	/*float:left;*/
	/*height: 183px;
	width: 135px;
margin-left: -50px;*/
-webkit-transform:scale(1.1); /*Webkit: Escala de aumento de la imagen 1.2x tamaño original*/
-moz-transform:scale(1.1); 
-o-transform:scale(1.1); 
-ms-transform:scale(1.1); 
-webkit-box-shadow: 0px 0px 15px 5px rgba(37,132,199,1);
-moz-box-shadow: 0px 0px 15px 5px rgba(37,132,199,1);
box-shadow: 0px 0px 15px 5px rgba(37,132,199,1);
cue-before: url("cartas_zen/efectos/nature020.wav");
	}

#form_test {
	text-align:center;
	}
#form_test input{
	margin:0;
	width:250px;
	padding:5px;
	margin-bottom:15px;
	text-align:center;
	}
#form_test select{
	margin:0;
	width:260px;
	padding:5px;
	margin-bottom:15px;
	text-align:center;
	}
.tipo_carta {
	width:15%;
	}
.button{
/*	border: 1px solid #989A8F;
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
   font-size: 1.2em;
   text-decoration: none;
   margin-bottom:0;	
    background:#e5e5e5;
    display:inline-block;
    margin:0 6px;
    padding:7px 20px 7px;
    color:#333;
    text-decoration:none;
    text-shadow: 0 1px 1px #FFF;
    border:1px solid #ccc;*/
	text-align:center;
	margin-top:10px;
    border: 0px none;
    color: #FFF;
	font-weight:bold;
	display:block;
   /* width: 100%;
    padding: 10px 15px 10px 50px;*/
	padding:10px;
    font: 18px "Century Gothic",Verdana,sans-serif;
	text-decoration:none;
    text-transform: uppercase;
    cursor: pointer;
	background-color: #555659;
	margin-left:auto;
    margin-right:auto;
}
.button:hover{
	color: #FFFFFF;
	background-color: #928F8F;
}

.msg_select {
	font-weight:bold;
	margin:5px;
	text-align:center;
	font-size:1.2em;
	}

#test_realizado {
	text-align:center;
	font-size:1.4em;
	border: solid 1px #ACACAC;
	background-color:#E9E9E9;
	padding:10px;
	margin-top:10px;
	}

#test_tiradas_zen {
	margin:20px;
	padding:25px;
	border:solid 1px #D1D1D1;
	width:50%; 
	margin-left:auto;
	margin-right:auto;
	
	background-color:#F4F4F4;
}
#test_tiradas_zen p {
	font-size:1em; /*font-size:1.2em;*/
}
#test_tiradas_zen .reverso_zen {
	display:block;
	width:100%;
	height:auto;
	style="float:right; text-align:center;
}

#resultados{
	padding:5px;
	background-color:#B4C9D1;
	margin-bottom:15px;
	text-align:center;
	clear:both;
}
#resultados img{
	margin:2px;
}

#datos_actuales {
	display:block;
	float:left;
	margin-right:3%;
	width:60%;
	padding:15px;
	border-radius:5px;
	border:solid 1px #393939;
}
#datos_actuales p{
	margin-bottom:10px;
}

#carta {
	float:right;
	/*margin-right:10px;
opacity: 0.25;
filter:  alpha(opacity=50);	
    -webkit-transition: opacity 2s linear;
    -moz-transition: opacity 2s linear;
    -o-transition: opacity 2s linear;
    -ms-transition: opacity 2s linear;
    transition: opacity 2s linear;*/
}

#result_test_zen {
	padding:1%;
	margin-right:auto; 
	margin-left:auto; 
	border:solid 1px #ccc;
	width:98%;
	/*width:470px;*/
	}
#result_test_zen .mensage{
	color:green;
	font-size:1.2em;
}
	
#tiradas_realizadas {
	margin:1%;
	width:97%;
	text-align:center;
	}
#tiradas_realizadas .tiradas_resultados {
	text-align:center;
	cursor: pointer; 
	color:#fff; 
	/*margin:10px;*/
	width:75%;
	/*float:left; */
	border:solid 2px #555659; 
	padding:4px;
}

#tiradas_realizadas .tiradas_resultados img {
	width:60px;
	height:auto;
}

#tiradas_realizadas .tiradas_resultados p {
	text-align:center;
	padding:0;
	margin:0;
	margin-bottom:3px;
}

#leyenda .tipo{
padding:5px;
/*float:left;
display:block;*/
display: inline-block;
width:48%;
color:#fff;">
}
	
	
#result_test_zen .entrar_test{
/*	text-transform:uppercase;
	text-align:center;
	background:#e5e5e5;
    display:inline-block;
    margin:10px;
    padding:7px 20px 7px;
    color:#333;
    text-decoration:none;
    text-shadow: 0 1px 1px #FFF;
    border:1px solid #ccc;
	display:block;
	margin-left:auto;
	margin-right:auto;*/
	/*
	margin-top:10px;
    border: 0px none;
    color: #FFF;
	font-weight:bold;
    width: 100%;
    padding: 10px 15px 10px 50px;
	padding:10px;
    font: 18px "Century Gothic",Verdana,sans-serif;
    text-transform: uppercase;
    cursor: pointer;
	background-color: #555659;*/
	}
/*#result_test_zen .entrar_test:hover {
	color: #FFFFFF;
	background-color: #928F8F;
	}*/

@keyframes parpadeo {
/*0% {opacity: 0;}*/
50%{opacity: 0.5;}
100%{opacity: 1;}
/*0% {filter:  alpha(opacity=0);}*/
50% {filter:  alpha(opacity=50);}
100%{filter:  alpha(opacity=100);}
}

@-webkit-keyframes parpadeo {
/*0% {opacity: 0;}*/
50%{opacity: 0.5;}
100%{opacity: 1;}
/*0% {filter:  alpha(opacity=30);}*/
50% {filter:  alpha(opacity=50);}
100%{filter:  alpha(opacity=100);}
}

/*@keyframes parpadeo {
0% {background-color: white}
100%{background-color: #03a9f4}
}

@-webkit-keyframes parpadeo {
0% {background-color: white}
100%{background-color: #03a9f4}
}*/
/* ESTILOS NORMALES (para escritorios muy grandes) ========================================================================= /*/
 
/*body { ... }
p    { ... }*/
 
/*/ RESPONSIVE ========================================================================= /*/
 
/*/ Tablets en horizonal y escritorios normales ------------------------------------------------------------------------- /*/
@media (min-width: 768px) and (max-width: 1199px) { 

#test_tiradas_zen {
	width:98%;
	padding:3px;
}
#datos_actuales {
	width:100%;
	border:none;
}
#carta{
	display:block;
	float:none;
	width:200px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	}
#tiradas_realizadas td {
	float:left;
	display:block;
	width:200px;
	margin:10px;
	}
}
 
/*/ Móviles en horizontal o tablets en vertical ------------------------------------------------------------------------- /*/
@media (max-width: 767px) { 
         body{
            font-size:1em;
       }
#test_tiradas_zen {
	width:98%;
	padding:3px;
}
#datos_actuales {
	width:100%;
	border:none;
}
#carta{
	display:block;
	float:none;
	width:150px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	}
#tiradas_realizadas td {
	float:left;
	display:block;
	width:200px;
	margin:10px;
	}
}
/*/ Móviles en vertical ------------------------------------------------------------------------- */
@media (max-width: 480px) { 
html, body {
  margin:3px;
}

#tiradas_realizadas td {
	float:left;
	display:block;
	width:200px;
	margin:10px;
	}
	
#test_tiradas_zen {
	width:98%;
	padding:3px;
}
#test_tiradas_zen p {
	margin:3px;
	font-size:12px;
}
#datos_actuales {
	width:100%;
	border:none;
}
#carta{
	display:block;
	float:none;
	width:100px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	}
.charSelected{
font-size:1em;
}
form {
	width:100%;
}
#form_test input{
	width:95%;
}

#form_test select{
	width:95%;
}

#form_test img{
}
form img {
margin:3px;
	}

#cartas_zen {
	width:100%;
	
	}
.wrap {
 	width:100%;
}
.table {
	width:100%;
}
.wrap ul li {
  	width:100%;
	float:none;
}
.circle {
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
#result_test_zen .entrar_test{
	width:100%;
	}
}

@media print {
html, body {
  margin:0;
  padding:0;
/*  display: none;*/
  
}
h1, h2, h3, h4 {
	font-size:60%;
	color:#000000;
	}
}