@charset "utf-8";
/* CSS Document */

:root {--largura-img:115px; --altura-img:240px; --margem-direita:12px; --margem-baixo:15px;}

body {
  font-family: Open Sans;
  font-size: 1rem;
  background: #fff;
  color: #fff;
}

table tr td{
	padding-top: 5px;
	padding-bottom: 5px;
}

.center{
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	width: 100%;
	padding-top: 2px;
}

.center_cartas{
	width: 90%;
	display: flex;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	justify-content: center;
	align-items: center;
	padding-top: 20px;
	padding-bottom: 30px;
}

.horizontal{
	flex-direction: row;
}

.quebra{
	flex-wrap: wrap;
}

.lado{
	float:none;
}


.foto{
	width: 90px;
	margin: 0px;
	border: 2px solid;
	border-color: #181818;
	transition: all 3s ease;
}

.input{
	width: 320px;
	font-weight: 500;
	background-color: #fff;
	font-size: 1.2rem
}

.input::placeholder{	
	color: #181818;
}

.input_email{
	width: 320px;
	font-weight: 500;
	background-color: #D9D9D9;
	border: none;
	color: #181818;
	font-size: 1.2rem
}

.input_email::placeholder{	
	color: #181818;
}

.txt_cartas{
	font-family: "Ubuntu", sans-serif;
	font-weight: 500;
	font-size: 1rem;
	color: #fff;
	text-shadow: 1px 1px 2px #000;
	text-align: center;
}

.input_atena{
	background-color: #d4732a;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: 10px;
	margin-bottom: 15px;
	border-radius: 6px 6px 6px 6px;
}

.input_persefone{
	background-color: #54a4c1;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	border-radius: 6px 6px 6px 6px;
}

.input_demeter{
	background-color: #4b8f2b;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	border-radius: 6px 6px 6px 6px;
}

.input_afrodite{
	background-color: #bd671a;
	width: var(--largura-img);
	height: var(--altura-img);
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	float: left;
	border-radius: 6px 6px 6px 6px;
}

.input_artemis{
	background-color: #422259;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	border-radius: 6px 6px 6px 6px;
}

.input_hera{
	background-color: #f5833a;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	border-radius: 6px 6px 6px 6px;
}

.input_hestia{
	background-color: #faa61a;
	width: var(--largura-img);
	height: var(--altura-img);
	float: left;
	margin-right: var(--margem-direita);
	margin-bottom: var(--margem-baixo);
	border-radius: 6px 6px 6px 6px;
}

.input_resultado{
	background-color: #2b2b2b;
	width: 80px; 
	font-size: 0.875rem;
	color: #fff;
	float: left;
	margin-left: auto;
	margin-right: auto;
}

.input_resultado2{
	width: 80px;
	font-size: 0.875rem;
	float: left;
	margin-left: auto;
	margin-right: auto;
	color: #181818;
	font-weight: 600;
}

.t_resultado{
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
	align-items: center;
	justify-content: center;
	display: flex;
	margin-top: 40px;
	font-family: Helvetica; 
	color: #fff;	
	font-size: 0.875rem;
}

.tabela_deusa{	
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #181818;
	text-align: left;
	font-weight: 400;
}


.box{
	font-weight: 500;
	color: #000;
	float: right;
	margin: 5px;
	font-size: 1rem;
	background-color: #FAFAFA;
}

.borda{	
	border: 0;
	box-shadow: 0;
	outline: 0;	
	background: transparent;
	font-family: "Ubuntu", sans-serif;
	font-weight: 500;
	color: #fff;
	text-shadow: 1px 1px 2px #000;
	text-align: center;
	/*width: 100%;*/
}

.borda2{	
	border: none;
	font-weight: 500;
	color: #181818;
	text-align: center;
	font-family: "Ubuntu", sans-serif;
}

/* Efeito imagens */


.vencedora {
      transform: scale(1.2); /* 10% maior */
	/*width: 140px;*/
      filter: saturate(1);    /* saturação normal */
    }
    .perdedora {
      transform: scale(0.9); /* 10% menor */
      filter: saturate(0.2); /* 80% menos saturada */
    }

.ferido{
	transform: scale(0.7); /* 10% maior */
	filter: saturate(1);
   /* filter: sepia(3) saturate(0) hue-rotate(-2deg);	*/
}