body{font-family: 'Nunito', sans-serif;}
.header-bg{background: rgb(5,88,225);background: radial-gradient(circle, rgba(5,88,225,1) 0%, rgba(3,48,123,1) 100%); padding:10px 0;}


.carousel-control-next,
.carousel-control-prev {
	width: 8%
}


.carousel-hero-text {
	font-size: 18px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 10px
}

.carousel-hero-title {

	text-transform: uppercase;
	font-size: 30px;
	font-weight: 600;
	line-height: 36px;
	margin-bottom: 10px;
}

.carousel-hero-title .text-gradient {
	color:#ff9214;
	  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.carousel-hero-description {
	text-align: center;
}
.pattern-trend{background: url(../images/pattern-trend.png) repeat;}

.carousel-control-prev-icon {
   background-image:url(../images/arrow-left.svg);
	filter:invert(1);
	width: 32px;
    height: 32px;
}
.carousel-control-next-icon {
    background-image:url(../images/arrow-right.svg);
	filter:invert(1);
	width: 32px;
    height: 32px;
}
.carousel-control-next, .carousel-control-prev{height:60%;z-index:99}
#carousel-hero .game-img{border-radius:20px;}


.owl-carousel .item {
    background: #4DC7A0;
    padding: 30px 0;
    margin: 5px;
    color: #FFF;
    text-align: center;
}

/* Ocultar items específicos en móvil */
@media (max-width: 991.98px) {
  .owl-carousel .item.d-none.d-lg-block {
    display: none !important;
  }
}

.bg-blur-game {
	position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-size: cover;
    filter: blur(10px);
    opacity: 0.5;
	background-repeat:no-repeat;
	top:0;
	
}
.game-z{position:relative;z-index:2}
#carousel-hero.owl-carousel .owl-stage-outer{border-radius:20px}
@media(min-width:992px){
#carousel-hero .game-img{border-radius:20px;margin: 20px;width:auto;height:auto}
.carousel-hero-description{text-align:left;}

}

footer{background:#fff url('../images/bg-footer.png') bottom center no-repeat;color:#000;}

footer a{color:#0558E1}
#navbar {font-size:14px;font-weight:800; text-transform:uppercase;}
#navbar.navbar-light .navbar-nav .nav-link{color:#fff;}
#navbar.navbar-light .navbar-nav .active>.nav-link, #navbar.navbar-light .navbar-nav .nav-link.active, #navbar.navbar-light .navbar-nav .nav-link.show, #navbar.navbar-light .navbar-nav .show>.nav-link {
color: #FF8613;
}
#navbar .navbar-nav{padding-right:0px!important; flex-direction:row; justify-content:space-between; gap: 2%;}
.icon-home{width:32px;height:30px;background:url('../images/icon-home.svg') no-repeat center;float:left;background-size: contain;}
.icon-notas{width:32px;height:37px;background:url('../images/icon-notas.svg') no-repeat center;float:left;background-size: contain;}
.icon-video{width:44px;height:37px;background:url('../images/icon-video.svg') no-repeat center;float:left;background-size: contain;}
.icon-game{width:50px;height:37px;background:url('../images/icon-game.svg') no-repeat center;float:left;background-size: contain;}
.icon-trivias{width:42px;height:37px;background:url('../images/icon-trivias.svg') no-repeat center;float:left;background-size: contain;}
.icon-account{width:28px;height:28px;background:url('../images/icon-account.svg') no-repeat center;float:left;}
#navbar.navbar-light .navbar-nav .nav-link span{ }
#navbar.navbar-light .navbar-nav .active>.nav-link span{ filter: invert(100%) invert(67%) sepia(93%) saturate(3178%) hue-rotate(349deg) brightness(101%) contrast(102%);}
#navbar.navbar-light .navbar-nav .nav-link:hover{color:#FF8613}
#navbar.navbar-light .navbar-nav .nav-link:hover span{ filter: invert(100%) invert(67%) sepia(93%) saturate(3178%) hue-rotate(349deg) brightness(101%) contrast(102%);}
.my-account{color:#fff;}
.my-account:hover{color:#FF8613;}
.my-account:hover span{ filter: invert(100%) invert(67%) sepia(93%) saturate(3178%) hue-rotate(349deg) brightness(101%) contrast(102%);}
.h1-white {color:#fff;font-size:20px;font-weight:800}
.grid{grid-row-gap: 30px;}
.grid .card{
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 20px;
overflow:hidden;
height: 100%;
-webkit-transition: .3s ease-in-out;
transition: .3s ease-in-out;
border:none;
border-bottom-right-radius: 0;
border-bottom-left-radius: 0;
}
.grid .card .card-title	{
font-weight: 600;
font-size: 18px;
line-height: 22px;
color: #0558E1;
margin-bottom:0px;
display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; 
overflow:hidden; 
height:44px 
}

.grid .card .card-sub{text-transform:uppercase; color:#000; font-size:80%}


.grid .card:hover {text-decoration:none;}
.grid .card:hover img {text-decoration:none; opacity:0.9}
.load-content {
display: none;
}
.bg-blue-stars{background:#ccecfa url('../images/bg-blue-stars.jpg') no-repeat top center;}
.pattern-orange{background:#FFA901 url('../images/pattern-orange.png') repeat;}
.bg-videos{background:#5E17EB}
.bg-videos-pattern{background:#5d19e2 url('../images/bg-videos-pattern.png') repeat;}
.bg-games{background:#0558E1}

.bg-games-more-played{
background: url('../images/triangle-bottom.png') no-repeat top center, url('../images/bg-more-played.png') no-repeat top center, ;

  background-image: url('../images/triangle-bottom.png'),
radial-gradient(circle, rgba(5, 88, 225, 1) 0%, rgba(3, 48, 123, 1) 100%);
  background-repeat: no-repeat, no-repeat;
  background-position:
    top center


}
.video-card .card-sub{text-transform:uppercase;}
.section-title{font-size:20px; font-weight:800;color:#414042;}
.dark-blue{color:#0F3764;}
.dark-blue > span{filter: invert(13%) sepia(54%) saturate(2544%) hue-rotate(197deg) brightness(98%) contrast(90%);}
.video{position:relative;}
.video:before{width:44px;height:34px;background:url('../images/icon-video-2.svg') no-repeat center center; content:""; display:inline;
background-size: contain;
position: absolute;
content: " ";
top:20px;
right: 20px;
z-index:3;
}
.trivia{position:relative;}
.trivia:before{width:44px;height:34px;background:url('../images/icon-trivias.svg') no-repeat center center; content:""; display:inline;
background-size: contain;
position: absolute;
content: " ";
top:20px;
right: 20px;
z-index:3;
}

.orange-icon{filter: invert(100%) invert(72%) sepia(43%) saturate(5965%) hue-rotate(350deg) brightness(101%) contrast(101%);}

.card-img-height{height:60%;overflow:hidden;position:relative; z-index:1}
.card-img-height:after {
    content: "";
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    top: 0;
    left: 0;
    z-index: 2;
}
.btn{border-radius:150px}
.btn-warning, .btn-warning.focus, .btn-warning:focus, .btn-warning:not(:disabled):not(.disabled):active {
background-color:#fff;
border-color: #fff;
color:#F49E21!important;
}

.btn-warning:hover{
background-color:#fff;
border-color: #fff;
color:#000!important;
}

.btn-outline-primary, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle{
color: #0F3764;
border-color: #0F3764;
}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show>.btn-outline-primary.dropdown-toggle{ background: #0F3764;color:#fff}
.btn-outline-primary.focus, .btn-outline-primary:focus {
box-shadow: 0 0 0 0.2rem rgb(32, 74, 117,.25);
}
.btn-outline-primary:not(:disabled):not(.disabled).active:focus, .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-primary.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgb(32, 74, 117,.25);
}
.btn-outline-primary:hover {
background: #0F3764;
border-color: #0F3764;
color:#fff;
}
/**/
.btn-outline-warning, .btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, .show>.btn-outline-warning.dropdown-toggle{
color: #F49E21;
border-color: #F49E21;
}
.btn-outline-warning:not(:disabled):not(.disabled).active, .btn-outline-warning:not(:disabled):not(.disabled):active, .show>.btn-outline-warning.dropdown-toggle{ background: #F49E21;color:#fff}
.btn-outline-warning.focus, .btn-outline-warning:focus {
box-shadow:0 0 0 0.2rem rgb(255, 134, 19, 0.25);
}
.btn-outline-warning:not(:disabled):not(.disabled).active:focus, .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .show>.btn-outline-warning.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem rgb(255, 134, 19, 0.25);
}
.btn-outline-warning:hover {
background: #F49E21;
border-color: #F49E21;
color:#fff;
}
.card-games{height:auto;}
.card-games img{border-radius:20px;}
.grid .card.card-games{box-shadow:none;border-radius:0}
.card-games .card-body{padding:0;color:#000}
.list-A{list-style-type: upper-alpha;}
.videos{background: linear-gradient(180deg, rgba(75, 186, 232, 0.9) 0%, #FF8613 100%);padding:4px;}
.videos ~ .card-title{background:#FD8615;color:#fff; font-size:16px;padding-left: 4px;margin-bottom:0px;padding-bottom: 10px;}
.videos video{
padding:4px;
background:#000;
}
.article-inner .more-articles h3{color:#FA7600;font-weight:800; position:relative;background:#fff; padding:0 20px}
.article-inner .more-articles:before{content:""; width:98%; height:48%; border-bottom:1px solid #FA7600;display:block; position:absolute;}
.article-inner h2, .article-inner h3{font-weight:600}



.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{background:#fff!important;}

.owl-carousel.owl-theme .owl-nav [class*='owl-']:hover{background:#fff!important;}
.owl-carousel button.owl-prev:focus, .owl-carousel button.owl-next:focus{outline: none;}
.owl-carousel .disabled{opacity:0!important;}
.owl-carousel .owl-nav button.owl-prev {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 45%;
    margin-left: -80px!important;
    display: block !important;
	border-radius: 150px;
	box-shadow: 0px 0px 8px rgb(0 0 0 / 50%);
}

.owl-carousel .owl-nav button.owl-next {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 45%;
    right: -80px!important;
    display: block !important;
	border-radius: 150px;
	    box-shadow: 0px 0px 8px rgb(0 0 0 / 50%);
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: #fff!important;
	border:1px solid #fff;
}
.owl-theme .owl-dots .owl-dot span {
    width: 40px!important;
    height: 12px!important;
    margin: 5px 7px;
    background: transparent!important;
	border:1px solid #fff;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 200ms ease;
    border-radius: 30px;
}

.owl-carousel button:focus {
    outline: none;
}
.carrusel-games.owl-carousel .owl-nav button.owl-prev,.carrusel-games.owl-carousel .owl-nav button.owl-next{top: 30%;}
.carrusel-games img{border-radius:10px}

.games-categories, .filters{width:100%; overflow-x: scroll; grid-gap:10px;}
.game-category{display: flex; flex-direction:column; text-align:center; color:#fff;}
.game-category:hover {color:#FF8613;text-decoration:none;}
a.game-category, .game-category a:ctive; .game-category a:focus, .game-category a:hover{color:#fff;}
.card-news{border-radius:20px; border:none;overflow:hidden;}
.card-news .card-top{}
.card-news .card-top-blue{background:#003FA8}
.news-content img{max-width:80%;margin:0 auto; border-radius:20px; display:block;}
.filters {gap:10px;display: inline-flex;}
.filters .btn{color:#fff; border:1px solid #fff;text-transform:uppercase;font-size:12px}
.filters .active.btn{color:#5E17EB; border:1px solid #fff;background:#fff;}
.black{font-weight:900}
#parent{width:100%}
.box{  width: 100%;
  float: left;
  margin: 10px 0;
 }

@media (max-width: 768px) {
.section-title ~ .btn, .card-body .btn{font-size:12px}
.no-padding-mobile{padding:0!important;}
#logo{max-width:200px; padding:10px 0}
.nav-item span{height:20px!important}

.owl-carousel .owl-nav button.owl-prev {
    margin-left: -30px!important;
}

.owl-carousel .owl-nav button.owl-next {
    right: -30px!important;
}
.games-categories img{width:80px;height:80px}
.header-bg{padding:0}
.video-card h1{font-size:1.3em;}
.card-news h1{font-size:1.4em;text-align:center;}
.card-top-blue{padding-top:30px;}
.card-top img{margin: 0 auto 0 auto; display:block; border-radius:10px}
.news-content h2{font-size:1.2em;}
.news-content h3{font-size:1.1em;}
.news-content p{font-size:0.9em;}
.news-content iframe{width:100%}
.news-content img{max-width:90%;margin:0 auto; border-radius:10px; display:block;}
}
@media (min-width: 580px) and (max-width:767px) {
.card-img-height{height:53%;}
.card-img-height.video{height:40%;}
}
@media (min-width: 768px) {
.bg-blue-stars{background:url('../images/bg-blue-stars-desktop.jpg') no-repeat top center; background-size:cover; height:40vh;}
.bg-article{background:#fff url('../images/bg-article.jpg') no-repeat top center; background-size:contain;}
.videos video{
padding:4px;
background:#000;
height:380px;
}

}
@media (min-width: 992px) {
	
	.games-categories, .filters{justify-content:center;overflow:hidden;}
}
@media (min-width: 1024px) {
.h-videos{height:70vh;background:#000}
.h-videos video{height:100%}

.box{  width: calc(33% - 10px);
  float: left;
  margin: 5px;
 }
 .filters .btn{font-size:16px}
}
@media (min-width: 1200px) {
#navbar {font-size:24px; }
.h1-white {font-size:45px;}
.section-title{font-size:40px; }
.grid .card .card-title	{
font-size: 18px;
line-height: 22px;
}
.grid .card.card-games .card-title	{
font-size: 24px;
line-height: 26px;
color:#414042;
}	
.video:before{width:44px;height:34px;}
.bg-blue-stars{background:url('../images/bg-blue-stars-desktop.jpg') no-repeat top center; background-size:cover; height:60%;}
.videos ~ .card-title{font-size:22px}
.article-inner p{font-size:20px}
.article-inner .more-articles h3{font-size:35px}
.games-categories{width:100%;    grid-gap: 20px;
    justify-content: center;overflow: hidden;
	}
	
	
	
}

@media (min-width: 1024px) and (max-width:1440px) {
#logo {max-width:400px;}
}
@media (min-width: 1600px) {
.container {max-width:1400px;}

}



