*{ 
	box-sizing:border-box 
}

@font-face {
    font-family: 'EchotopiaRegular';
	src: url('EchotopiaRegular.otf') format('opentype');
    font-weight: 300;
    font-style: normal
}

html, body{
	width:100%;
	/* height:100%; */
	min-height: 100vh;
	/* overflow: auto; */	
	margin:0;
	padding:0;
	font-size:16px
}

body{
	color:wheat;
	background: linear-gradient(to top,#00284a,black);
	text-align:center;
	font-family: Tahoma, sans-serif;
}

	.bodybwb{
		background: linear-gradient(to bottom,#01001c,#202020);
		font-family: 'EchotopiaRegular', Arial;
	}
	.bodygensorteos{
		background: linear-gradient(to top,#649d00,#011500);
	}
	.bodybdt{
		background: linear-gradient(to top,#F7FF00,#FFBF00);
		color:black
	}	
	
/* #################### */

.textcenter{
	text-align:center
}

.visibleON{ 
	visibility: visible !important;
}
.visibleOFF{
	visibility:hidden
}

.displayON{
	display:block !important
}
.displayOFF{
	display:none !important
}

.opacidadON{
	opacity: 1 !important
}

.toggleflex{
	display:flex !important
}

.scrollOFF{
	overflow:hidden 
}

.POSfixedON{
	position: fixed;
}

/* #################### */

.imglang{
	position:fixed;
	top:10px;
	left:10px
}

	.imglang a{
		margin-right:20px;
		width:32px;
		height:auto;
		display:inline-block
	}
	
	.imglang img{
		width:32px;
		height:auto;
		cursor:pointer
	}

.contenedor{
	/* position:relative; */
	margin:auto;
	/* padding:20px; */
	/* width:60%; */
	height:100%;
	/* border-left:1px solid #333232;
	border-right:1px solid #333232; */	
}
		.buy{
			width: 58%;
			margin: 0 auto 40px;
			border: 2px solid #9afff6;
			border-radius: 20px;
			background: linear-gradient(to bottom right,#0b0a1d,#274a82);			
		}
		.buybdt{
			color:wheat
		}
			.avaliable{
				font-size:2em;	
			}
		.logosplatform{
			width:20px;
			height:20px
		}
		
.cabecera{
	padding:60px 20px 20px 20px
}
	.logo{
		width:100%;
		max-width:256px;
		height:auto
	}
	.logobwb{
		width:100%;
		max-width:80%;
		height:auto
	}
	img[data-tipomedia='vid']{
		width:50%;
		height:auto;
		cursor:pointer
	}
.contenido{
	/* margin:40px 0 */
	padding: 20px;
}
	.contenido h1{
		border-bottom: 1px solid #666;
		margin: 20px auto;
		padding: 14px 0;
		width: 90%;
	}
	
	.contenido img[data-tipomedia]{
		cursor:pointer
	}
	
	.juego{
		color:wheat;
		background: linear-gradient(to bottom,#01001c,#202020);
		border: 1px solid #333232;
		margin: 0 auto 60px;
		padding: 6px;
		width:66%;
		border-radius: 10px
	}
	.juego[data-app="gensorteos"], .juego[data-app="dados"]{
		border:none;
		background:initial
	}	
		.juego img{
			width:100%;
			height:auto
		}
		.juego img[title="Gensorteos"], .juego[data-app="dados"] img{
			width:60%;
			border-radius:20px
		}
	.bwbbloquefeatures{
		display:flex;
		flex-direction:row;
		align-items:center;
		justify-content:center;	
		flex-wrap:wrap;		
	}
	
	.bwbbloquefeatures div{
		/* display:inline-block */
		flex-basis:40%
	}
		/* .bwbbloquefeatures div:nth-of-type(2){
			margin-left:20px
		} */

	.ostbwb{
		margin: 40px 0 40px 0;
		padding: 60px 0;
		border-top: 1px solid #003959;
		border-bottom: 1px solid #003959;
	}
		/* .ostbwb button{
			font-size:0.9em
		}	 */
		.ostbwb img{
			width:50%;
			border-radius: 20px;
		}
		.ostbwb audio{
			background: linear-gradient(lightblue,blue);
			/* width: 40%; */
			/* transform: scale(1.4); */
			/* margin-top: 20px;	 */		
		}

	.ostbwblinks a{
		background: #ffc965;
		padding: 2px;
		color: black;
		border-radius: 2px;		
	}
	
	.bwbbloquespecs{
		display:flex;
		flex-direction:row;
		align-items:center;
		justify-content:center;	
		flex-wrap:wrap;	
	}
	.bwbbloquespecs div{
		/* display:inline-block;
		vertical-align: middle; */
		flex-basis:45%
	}	
		/* .bwbbloquespecs div:nth-of-type(2){
			margin-left:20px;
		} */
		
.botonsource{
	margin: 10px auto;
	padding: 10px;
	font-size: 1.2em;
	border: 1px solid #b0b0b0;
	border-radius: 4px;
	background: linear-gradient(to bottom,#f4f4f4,#888);
	cursor:pointer	
}

.botoninfo{
	background: linear-gradient(to bottom,#f4f4f4,#ffff90);
}

.botonvolver{
	display: block;
	margin: 90px auto 0 auto;
	font-size: 2em;
}

.botoncontactar, .botoncontactarb{
	display: block;
	margin: 10px auto;
	font-size: 2em;
	padding: 8px;
}

a{
	text-decoration:none
}


.ppolicy{
	width:70%;
	margin:40px auto;
	border: 1px solid #282828;
	border-radius: 8px;
	padding: 10px;	
}

	.ppolicy p, .ppolicy ul{
		text-align:left
	}
	.ppolicy img{
		width:32px;
		height:auto;
		cursor:pointer
	}


.pie{
	/* position:absolute;
	bottom:0; */
	width:100%;
	padding: 40px 20px;
	/* border:1px solid gray */
}
	.pie p{
		margin:0
	}



	
#modal{
	position:fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	/* background-color: rgba( 0, 0, 0, 0.8); */
	display:none;
	/* visibility:hidden; */
	opacity:0;
	overflow:auto;
	transition: opacity 0.5s /* fade */
}
.modalzindex{
	z-index:500 !important;
}
	.modalcontenedor{
		position:relative;
		/* margin:2% auto; */
		/* padding:20px; */
		width:100%;
		height:100%;
		/* max-width: 860px; */
		/* min-width: 300px; */
		background-color: rgba( 0, 0, 0, 0.9);
		/* background-color:black; */
		/* border:1px solid #292929; */
		/* z-index:201 */
		text-align:center;
		overflow:auto
	}
	.modalcerrar{
		position: fixed;
		top: 4px;
		right:24px;
		color: yellow;
		font-size: 2.5em;
		/* font-weight: bold; */
		cursor: pointer;
		background: linear-gradient(black,#393939);
		border-radius: 2px; 
		/* background-color: #333; */
		/* border: 1px solid #474747; */
		padding: 0 12px
	}
/* 		.modalcerrar:hover{
			background-color:#363636;
		} */

	.modaldatos{
		display:flex;
		flex-wrap:wrap;
		justify-content:center;
		align-items:center;
		height:100%
	}
	
		.modaldatos .imgzoom{
			position: fixed;
			top: 10px;
			right:74px;			
			/* width:100%; */
			text-decoration:none;
			font-size: 2em;
		}
		.modaldatos img{
			max-width:100%
		}
		.modaldatos p{
			width:96%;
			color:white;
			position: fixed;
			bottom: 0;
			background-color: rgba(57, 57, 57, 0.5);
			margin: 0;	
			padding: 6px;			
		}
		.modaldatos video{
			/* height:80%; */
			max-width:96%
		}


		
@media only screen and (max-width: 700px){

	.cabecera .logo{
		width:50%;
		max-width:256px;
		height:auto
	}
		img[data-tipomedia='vid']{
			width:90%;
		}
	
	.juego{
		width:96%
	}
		.juego img[title="Gensorteos"]{
			width:90%
		}
		
	.buy{
		width:96%
	}
	
	.bwbbloquefeatures div, .bwbbloquespecs div{
		flex-basis:100%
	}
}