/* Estilo foro */


@import url('https://fonts.googleapis.com/css?family=Montserrat:400,800'); /* Montserrat font */
@import url("https://fonts.cdnfonts.com/css/gg-sans-2");


/* Fuentes de iconos -----------------------*/
@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?jq957v');
  src:  url('fonts/icomoon.eot?jq957v#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?jq957v') format('truetype'),
    url('fonts/icomoon.woff?jq957v') format('woff'),
    url('fonts/icomoon.svg?jq957v#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-RPro.otf');
  font-style: normal;
  font-weight: normal;
}
@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-ItPro.otf');
  font-style: italic;
}
@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-BdPro.otf');
  font-weight: 300;
}
@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-BdItPro.otf');
  font-style: italic;
  font-weight: bold;
}
@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-ExtraCond.otf');
  font-weight: 800;
}
@font-face{
  font-family: 'acumin';
  src: url('fonts/Acumin-Bold.ttf');
  font-weight: bold;
}



[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-monedas:before {
  content: "\e906";
}
.icon-discord:before {
  content: "\e900";
}
.icon-face:before {
  content: "\e901";
}
.icon-diagrama:before {
  content: "\e902";
}
.icon-usuario:before {
  content: "\e903";
}
.icon-herramientas:before {
  content: "\e904";
}
.icon-magia:before {
  content: "\e905";
}





/* color */
:root {
  --main-color1: #2a3faa;
  --main-color2: #303030;
  --main-color2a: #1d1d1d;
  --main-color3: #121212;
  --main-color4:#2a3faa;
  /* #312356 */

  --colorAzul: #001370;
  --colorRosa: #D200B6;

  --primary: #2a3faa;
  --secondary: #282b33;
  --main-color2a: #1b1c22;
  --dark: #0c0d0dec;
  --mor: #413989;

  --colorAzul: #001370;
  --colorRosa: #D200B6;
}


/** Bootstrap open dropdown on hover */
.dropdown:hover .dropdown-menu {
  display: block;
  margin-top: 0;
}

/** Iconos de categorias */
.categories > li .content .icon {
  background-color: var(--colorRosa) !important;
}

#panel {
    padding-top: 10rem !important;
    background-color: transparent !important;
}

.gta-nav-base{
  margin: 0;
  padding: 0;
  width: 100%;
}


.fixed-top {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  
}

.h-100{
  height: 100%!important;
}

.boton-home{
  /* border: 1px solid red; */
  height: 80%;
}

.navbar-default {
  background-color: transparent;
  border-color: transparent;
  z-index: 100 !important;
}

.nav-notifications {
    background: #1C1C1C;
    border-radius: 5px;
    margin: 0 1rem;
}

.nav-chats {
    background: #1C1C1C;
    border-radius: 5px;
    margin: 0 1rem;
}

.nav-not i {
    position: absolute;
    width: 0;
    height: 0;
    right: 0;
    top: 0;
 }

.unread-count::after {
    border-radius: 50%;
    width: 2rem;
    height: 2rem;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-user {
    /* width: 14rem; */
}

.nav-user-profile .avatar{
    height: 5rem;
    width: 5rem;
    border-radius: 5px !important;
    font-size: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-user-name {
    margin-left: 1rem;
}

.men-derecha .dropdown-menu.nav-container-options {
    background: #111111;
    border-radius: 5px;
    border: 1px solid #252525;
    padding: 1rem;
}

.men-derecha .dropdown-menu.nav-container-options > li > a {
    border-radius: 5px;
    transition: background .3s ease;
    cursor: pointer;
    user-select: none;
}

.men-derecha .dropdown-menu.nav-container-options > li > a:hover {
    background: #d9d9d90a;
}


.dropdown-menu .divider {
    background-color: #2f2f2f;
}

.nav-status {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 20rem;
}

.nav-status li {
    width: 50%;
    margin: 1rem 0;
    line-height: 1rem;
}

.nav-status li a,
.nav-options li a {
  background: transparent;
  border-radius: 5px;
  transition: background .3s ease;
  cursor: pointer;
  user-select: none;
  font-size: 1rem;
  color: var(--text-gray2);
  padding: .5rem 1rem;
}

.nav-status li a:hover,
.nav-options li a:hover {
    background: #d9d9d90a;
    color: #fff;
}

.nav-options li {
  font-size: 1.3rem;
  margin: 1.5rem 0;
}


.contenedor-menu {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  /* justify-content: space-between; */
}

.container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}



 .collapse-g:not(.show) {
  display: none;
}
.navbar-expand-lg .navbar-collapse-g {
  
}
/*
.h-100 {
  height: 100%!important;
}
*/
.navbar-collapse-g {
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-align: center;
  align-items: center;

  height: 100%!important;
} 


.navbar-expand-lg .gta-navbar-nav {
  -ms-flex-direction: column;
  flex-direction: column;
}
.ml-auto, .mx-auto {
  margin-left: auto!important;
}





.gta-navbar-dark {

  background: #121212;
  height: 60px;
  box-shadow: 0 2px 10px #000000;
  transition: all 0.5s;
  
}


.gta-navbar {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 0;
}



.gta-navbar-nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;

  height: 100%;
  align-items: center;

  font-weight: normal!important;
  margin-left: auto;
}
.gta-navbar-nav li{
  margin-left: 5px;
  margin-right: 5px;
}
.gta-navbar-dark .gta-navbar-nav .nav-link {
  /* color: rgb(197, 197, 197);
  text-shadow: 1px 2px 0 #000; */
  font-size: 17px;
  transition: all 0.2s;

  display: block;
  padding: .5rem;

}
/* .gta-navbar-dark .gta-navbar-nav .nav-link:hover {
  color: white;
  box-shadow: inset 0 -4px 0 0 #2a3faa;
}

.gta-navbar-dark .gta-navbar-nav .nav-link:focus {
  color: #fff;
  text-decoration: none;
} */


.gta-navbar-bold{
  color: white;
  box-shadow: inset 0 -4px 0 0 #2a3faa;
}


/* Dropdown Menu */
/* .navbar-collapse-g .dropdown-menu {
	margin-top: 10px;
	border: none;
	border-radius: 4px;
  background-color: rgba(0,0,0,0.6); 
  height: 100%;
}
.navbar-collapse-g .dropdown-item {
	color: #fff;
	text-decoration: none;
}
.navbar-collapse-g .dropdown-item:hover {
	background: none; 
}
.navbar-collapse-g .dropdown-item .item-text {
	font-size: 0.875rem;
}
.navbar-collapse-g .dropdown-item:hover .item-text {
	color: #0000ff;
}
.navbar-collapse-g .dropdown-items-divide-hr {
	width: 100%;
	height: 1px;
	margin: 0.25rem auto 0.25rem auto;
	border: none;
	background-color: #b5bcc4;
	opacity: 0.2;
} */


.navbar-nav {
  margin: 0;
}

.contenedor-menu{
  height: 100%;
  width: auto;
  position: relative;
  z-index: 1;
}


#main-logo {
  /* width 200px, height auto */
  height: 100%!important;
  width: auto!important;
  transition: all 0.5s;
}

.gta-nav-item{
  background-color: transparent;
  padding: 13px 10px;
  transition: all 0.4s;
  height: 100%;
}

.nav-social li{
  margin: 0;
}


.dev{
  position: absolute;
  color: #fba042;
  font-size: 8px;
  display: block;
  top: 0;
  opacity: 0;
  transition: all 0.4s;
}
.dev-link {
  color: rgb(197, 197, 197);
  text-shadow: 1px 2px 0 #000;
  font-size: 17px;
  transition: all 0.4s;
  display: block;
  padding: .5rem 1rem;
  padding-right: .5rem;
  padding-left: .5rem;
}
.dev-link:hover {
  color: #fff;
  text-shadow: 1px 1px 3px #ec9834;
}

.dev-link:hover + .dev {
  opacity: 1;
}

.soc-icono{
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 50%;
  transform: translateY(-50%);
}


.gta-navbar-dark .gta-navbar-nav .nav-link-soc {
  color: #ffffff;
  font-size: 15px;
  transition: all 0.3s;
}
.gta-navbar-dark .gta-navbar-nav .nav-link-soc:hover{
  color: #3e25ff;
  box-shadow: 0 0 10px 1px #303030;
  background-color: #e8e8e8;
}
.nav-social li{
  margin: 0;
}

.nav-social li .fab{
    font-family: "Font Awesome 5 Free";
    font-weight: 900;

    box-shadow: unset;
    background-color: transparent;
    border: none;
    border-radius: 0;
    cursor: pointer;
    line-height: 0;
    vertical-align: unset;
    height: auto;
    width: auto;
}

.nav-icon {
    margin-right: 1rem; 
}


.btn-rojo:hover {
  color: #c21111!important;
}

.btn-social {
  display: inline-block;
  position: relative;
  width: 30px;
  height: 30px;
  background-color: rgba(197, 197, 197, 0.34);
  border-radius: 5px;
  transition: all 0.6s;
  box-shadow: 0 5px 13px -3px #383838;
  margin: 10px;
  margin-top: 20px;
  font-size: 5px;
  text-align: center;
}



.deb{
  border: 1px solid red;
}


.social-icono{
  height: 15px;
  width: 15px;
  margin: 0 auto;
}

.social-icono2{
  height: 20px;
  width: 20px;
}

.social-icono3{
  width: 15px;
}


/* Sub menus */
/* ---------------------------------------------------------------------------------------------------------------------- */
.navbar-right {
  margin-right: 0;
}

.gta-sub-log{
  color: #fff;
}



.navbar-default .navbar-nav > li > a:hover span{
  /* color: #fff; */
  /* text-shadow: 0px 0px 5px #3e25ff, 0px 0px 10px #3e25ff, 0px 0px 15px #3e25ff; */
}
.navbar-default .navbar-nav > li > a:hover i{
  /* color: #fff;
  box-shadow: 0 0 10px 7px #3e25ff;
  border-radius: 50%; */
}


.navbar-default .navbar-nav > li > a {
  color: #fff;
  font-size: 12px;
  transition: all 0.3s;
  height: 4rem;
  padding: 1rem;
  display: flex;
}

.navbar-default .navbar-nav > li > a > svg {
  width: 2rem;
  height: 2rem;
}


.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: white;
  /* box-shadow: inset 0 -4px 0 0 #2a3faa; */
  text-shadow: 0 0 2rem #000;
}

/* .navbar-default .navbar-nav > li > a:focus i */

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  background-color: #00000040;
  color: #fff;
}


/* Buscar */
.navbar-form {
  padding: 0;
}

/* Boton menu */
.boton-menu{
  background-color: transparent !important;
  border: transparent !important;
  border: unset;
  color: #ebebeb !important;
  font-size: 17px;
  display: block;
  padding: .5rem;
  box-shadow: unset !important;

  transition: all 0.2s !important;
}

.boton-menu:hover {
  color: white;
  box-shadow: inset 0 -4px 0 0 #2a3faa;
  border: transparent !important;
}

.btn:focus,.btn:active {
  outline: none !important;
  box-shadow: none;
}

.dropdown-menu {
  left: unset;
}

@media (min-width: 750px){
  .boton-menu:hover + ul {
    display: block !important;
    margin-top: -5px !important;
    
  }

}




.boton-menu-lista {
  margin-top: -1px;
}


.menu-section > ul > div > .boton-menu-lista {
  background-color: rgba(0, 0, 0, 0.85) !important;
}

.menu-section > ul > div > .boton-menu-lista > li > .navigation-link{
  width: 100%;
}

.boton-menu-item{
  display: inline-block !important;
}


.gta-perfil{
  position: absolute;
  right: 0;
}




.navbar-toggler {
  border: none;
  cursor: pointer;
  position: absolute;
  right: 40px;

  /* position: absolute; */
  background-color: transparent;

  display: none;
}
.navbar-toggler:hover,
.navbar-toggler:focus{

  border: unset;
}

#hamburger .icon-bar {
  display: block;
  height: 2px;
  width: 25px;
  background: #FFF;
  margin: 7px 0;
  transition: .3s ease-in-out;
}
/* - Mobile menu animation - */
#hamburger .icon-bar:nth-child(1) {
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#hamburger .icon-bar:nth-child(2) {
 -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#hamburger .icon-bar:nth-child(3) {
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#hamburger.open .icon-bar:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#hamburger.open .icon-bar:nth-child(2) {
  width: 0%;
  opacity: 0;
}
#hamburger.open .icon-bar:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}


/* Dropdown Menu */
.navbar-collapse .dropdown-menu {
	margin-top: 10px;
	border: none;
	border-radius: 4px;
	background-color: rgba(0,0,0,0.6); 
}
.navbar-collapse .dropdown-item {
	color: #fff;
	text-decoration: none;
}
.navbar-collapse .dropdown-item:hover {
	background: none; 
}
.navbar-collapse .dropdown-item .item-text {
	font-size: 0.875rem;
}
.navbar-collapse .dropdown-item:hover .item-text {
	color: var(--main-color1);
}
.navbar-collapse .dropdown-items-divide-hr {
	width: 100%;
	height: 1px;
	margin: 0.25rem auto 0.25rem auto;
	border: none;
	background-color: #b5bcc4;
	opacity: 0.2;
}


.gta-nav-item > ul > .btn-group{
  width: 90%;
}



/* etiquetas de hora de publicacion */
.posts-list .posts-list-item .post-info {
  width: auto;
}


/* Generales */
/* ---------------------------------------------------------------------------------------------------------------------- */
body{
    background-color: #0c0d0d;
    font-family: Montserrat, sans-serif;
    color: #b8b8b8;
}
a {
    color: #ebebeb;
}

a:hover,
a:focus {
    color: var(--pink);

}

/* Botones */

  .btn-primary {
    
    border: none;
    border-radius: 4px;
    transition: all 0.2s ease;
    cursor: pointer;
    text-align: center;
    background: var(--main-color4);
    color: #fcfcfe;

    border-color: #35104e;
  }
  .btn-primary:hover,
  .btn-primary:focus,
  .btn-primary.focus,
  .btn-primary:active,
  .btn-primary.active,
  .open > .dropdown-toggle.btn-primary {
    
    background: var(--main-color1);
  }
  .btn-primary:active,
  .btn-primary.active,
  .open > .dropdown-toggle.btn-primary {
    background-image: none;
  }
  .btn-primary.disabled,
  .btn-primary[disabled],
  fieldset[disabled] .btn-primary,
  .btn-primary.disabled:hover,
  .btn-primary[disabled]:hover,
  fieldset[disabled] .btn-primary:hover,
  .btn-primary.disabled:focus,
  .btn-primary[disabled]:focus,
  fieldset[disabled] .btn-primary:focus,
  .btn-primary.disabled.focus,
  .btn-primary[disabled].focus,
  fieldset[disabled] .btn-primary.focus,
  .btn-primary.disabled:active,
  .btn-primary[disabled]:active,
  fieldset[disabled] .btn-primary:active,
  .btn-primary.disabled.active,
  .btn-primary[disabled].active,
  fieldset[disabled] .btn-primary.active {
    background-color: var(--main-color4);
    border-color: #000000;
  }
  .btn-primary .badge {
    background-color: var(--main-color4);
    color: #fff;
  }


  /* Boton info */
  .btn-info {
    color: #fff;
    background-color: var(--main-color4);
    border-color: #000000;
  }
  .btn-info:hover,
  .btn-info:focus,
  .btn-info.focus,
  .btn-info:active,
  .btn-info.active,
  .open > .dropdown-toggle.btn-info {
    
    background-color: var(--main-color1);
  }
  .btn-info:active,
  .btn-info.active,
  .open > .dropdown-toggle.btn-info {
    background-image: none;
  }
  .btn-info.disabled,
  .btn-info[disabled],
  fieldset[disabled] .btn-info,
  .btn-info.disabled:hover,
  .btn-info[disabled]:hover,
  fieldset[disabled] .btn-info:hover,
  .btn-info.disabled:focus,
  .btn-info[disabled]:focus,
  fieldset[disabled] .btn-info:focus,
  .btn-info.disabled.focus,
  .btn-info[disabled].focus,
  fieldset[disabled] .btn-info.focus,
  .btn-info.disabled:active,
  .btn-info[disabled]:active,
  fieldset[disabled] .btn-info:active,
  .btn-info.disabled.active,
  .btn-info[disabled].active,
  fieldset[disabled] .btn-info.active {
    background-color: var(--main-color4);
    border-color: #000000;
  }
  .btn-info .badge {
    color: #e0e0e0;
    background-color: var(--main-color4);;
  }


  /* Boton default */
  .btn-default {
    color: #e0e0e0;
    background-color: var(--main-color1);;
    border-color: #000;

    border-radius: 5px;
    /* padding: 13px; */
    box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
  }
  .btn-default:hover,
  .btn-default:focus,
  .btn-default.focus,
  .btn-default:active,
  .btn-default.active,
  .open > .dropdown-toggle.btn-default {
    border-color: #000;
    background-color: var(--main-color4);
    color: #fff;
    
  }
  .btn-default:active,
  .btn-default.active,
  .open > .dropdown-toggle.btn-default {
    background-image: none;
  }
  .btn-default.disabled,
  .btn-default[disabled],
  fieldset[disabled] .btn-default,
  .btn-default.disabled:hover,
  .btn-default[disabled]:hover,
  fieldset[disabled] .btn-default:hover,
  .btn-default.disabled:focus,
  .btn-default[disabled]:focus,
  fieldset[disabled] .btn-default:focus,
  .btn-default.disabled.focus,
  .btn-default[disabled].focus,
  fieldset[disabled] .btn-default.focus,
  .btn-default.disabled:active,
  .btn-default[disabled]:active,
  fieldset[disabled] .btn-default:active,
  .btn-default.disabled.active,
  .btn-default[disabled].active,
  fieldset[disabled] .btn-default.active {
    background-color: var(--main-color4);
    border-color: #000;
  }
  .btn-default .badge {
    color: rgb(146, 146, 146);
    background-color: var(--main-color4);
  }


  .btn-success {
    color: #fff;
    background-color: var(--main-color1);
    border-color: var(--main-color2);
  }
  .btn-success:hover,
  .btn-success:focus,
  .btn-success.focus,
  .btn-success:active,
  .btn-success.active,
  .open > .dropdown-toggle.btn-success {
    color: #fff;
    background-color: var(--main-color4);
    border-color: var(--main-color2);
  }
  .btn-success:active,
  .btn-success.active,
  .open > .dropdown-toggle.btn-success {
    background-image: none;
  }
  .btn-success.disabled,
  .btn-success[disabled],
  fieldset[disabled] .btn-success,
  .btn-success.disabled:hover,
  .btn-success[disabled]:hover,
  fieldset[disabled] .btn-success:hover,
  .btn-success.disabled:focus,
  .btn-success[disabled]:focus,
  fieldset[disabled] .btn-success:focus,
  .btn-success.disabled.focus,
  .btn-success[disabled].focus,
  fieldset[disabled] .btn-success.focus,
  .btn-success.disabled:active,
  .btn-success[disabled]:active,
  fieldset[disabled] .btn-success:active,
  .btn-success.disabled.active,
  .btn-success[disabled].active,
  fieldset[disabled] .btn-success.active {
    background-color: var(--main-color4);
    border-color: #000;
  }
  .btn-success .badge {
    color: #5cb85c;
    background-color: #fff;
  }




  /* Boton link */
  .btn-link {
    color: #e0e0e0;
    font-weight: normal;
    border-radius: 0;
  }
  .btn-link,
  .btn-link:active,
  .btn-link.active,
  .btn-link[disabled],
  fieldset[disabled] .btn-link {
    background-color: transparent;
    box-shadow: none;
  }
  .btn-link,
  .btn-link:hover,
  .btn-link:focus,
  .btn-link:active {
    border-color: transparent;
  }
  .btn-link:hover,
  .btn-link:focus {
    color: #3039be;
    text-decoration: underline;
    background-color: transparent;
    font-size: 1.2rem;
  }
  .btn-link[disabled]:hover,
  fieldset[disabled] .btn-link:hover,
  .btn-link[disabled]:focus,
  fieldset[disabled] .btn-link:focus {
    color: #374149;
    text-decoration: none;
  }

  .dropdown-menu > li > form > button, .dropdown-menu > li > form > .btn-link {
    color: #e9e9e9;
  }
  .dropdown-menu > li > form > button, .dropdown-menu > li > form > .btn-link:hover {
    
  }

.dropdown-menu > li > form > .btn-link:hover,
.dropdown-menu > li > form > .btn-link:focus {
  text-decoration: none;
  /* color: var(--main-color4); */
  color: var(--text-gray2);
  background-color: transparent;
}



.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  text-decoration: none;
  color: var(--main-color4);
  background-color: transparent;
}





.header .chat-list > li:hover,
.slideout-menu .chat-list > li:hover {
  background: transparent;
}






  /* Tarjetas de grupo */
.panel-default {
    border-color: var(--main-color3);
}
.panel {
    margin-bottom: 20px;
    background-color: var(--main-color3);
    border: 1px solid transparent;
    border-radius: 0;
}


  .panel-default > .panel-heading {
    color: #c3c3c3;
    background-color: var(--main-color2);
    border-color: #ddd;
  }
  .panel-default > .panel-heading + .panel-collapse-g > .panel-body {
    border-top-color: #ddd;
  }
  .panel-default > .panel-heading .badge {
    color: #f5f5f5;
    background-color: var(--main-color2);
  }
  .panel-default > .panel-footer + .panel-collapse-g > .panel-body {
    border-bottom-color: #ddd;
  }


  .panel-primary {
    border-color: var(--main-color1);
  }
  .panel-primary > .panel-heading {
    color: #fff;
    background-color: var(--main-color1);
    border-color: var(--main-color1);
  }
  .panel-primary > .panel-heading + .panel-collapse-g > .panel-body {
    border-top-color: var(--main-color1);
  }
  .panel-primary > .panel-heading .badge {
    color: #337ab7;
    background-color: #fff;
  }
  .panel-primary > .panel-footer + .panel-collapse-g > .panel-body {
    border-bottom-color: var(--main-color1);
  }




/* Alertas */
.alert-info {
    border-color: #4a96a5;
    color: #31708f;
  }

  .alert-warning {
    border-color: #c59f52;
    color: #8a6d3b;
  }

  .alert-danger {
    border-color: #ff7b91;
    color: #a94442;
  }

  .alert-success {
    border-color: #d6e9c6;
    color: #3c763d;
  }

  /* Formularios */
  .form-control {
    color: #a7a7a7;
    background-color: #464646;
    border: 1px solid #9a9a9a;
  }

  .input-group-addon {
    color: #989898;
    background-color: #464646;
    border: 1px solid #9a9a9a;
  }

  .form-control:focus {
    border-color: #6f66e9;
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(115, 102, 233, 0.6);
  }

  .form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
  background-color: rgb(32, 32, 32);
  color: rgb(81, 37, 102);
  opacity: 1;
}



/* Texto en linea */
.posts-list .posts-list-item a span {
    padding-left: 0;
}


/* links de usuarios */
.nav > li > a:hover{
  color: var(--main-color4);
  background-color: transparent;
}




  /* estilo del separador de widget */
  .wid-sep{
    height: 3px;
    width: 100%;
    border-radius: 40px;
    box-shadow: none;
    background-color: #191919;
    margin: 20px 0px;
    box-shadow: 1px 1px 3px #00000030;
  }



/* Contenedor */
#content {

    /* background-color: #191919; */
    background-color: #121212;
    border-radius: 5px;
    padding: 20px;
    /* z-index: 1;
    position: relative; */
    box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
    opacity: 0;
}


/* Menus */
.dropdown-menu {
    background-color: var(--dark);
    color: #eaeaea;
}


.dropdown-menu > li > a {
    display: block;
    position: relative;
    padding: 13px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #eaeaea;
    white-space: nowrap;
  }
  .dropdown-menu > li > a:hover,
  .dropdown-menu > li > a:focus {
    text-decoration: none;
    color: #f1f1f1;
    background-color: var(--main-color4);
  }
  .dropdown-menu > .active > a,
  .dropdown-menu > .active > a:hover,
  .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    outline: 0;
    background-color: var(--main-color4);
  }
  .dropdown-menu > .disabled > a,
  .dropdown-menu > .disabled > a:hover,
  .dropdown-menu > .disabled > a:focus {
    color: #515457;
  }


  .dropdown-header {
    color: #ffffff;
}


#men-lista {
  width: 100% !important;
  transition: all 0.3s;
  background-color: rgb(50 64 143) !important;

  position: absolute;
  left: 0;
  display: flex;
  justify-content: center;

  border: unset;

  height: 0px;
  padding: 0px;
  overflow: hidden;
}



  /* palomita */
  .fa-check{
    color: var(--main-color3);
  }

  /* numeros */
  .stats {
    color: #fff;
}


/* titulo de tema */
.topic h1 .topic-title {
    color: #fff;
}


/* perfil */
.account .profile {
    margin-bottom: 40px;
    margin-top: 80px;
}

.account .breadcrumb {
  margin-bottom: 80px;
}

.account .cover {
  top: 50px !important;
}


@media (min-width: 992px){
.account {
    margin-top: 380px;
}
}

/* Boton de menu */
.fab {
    background-color: var(--main-color1);
}



  /* Modal */
.modal-content {
  color: #eaeaea;
  background-color: #191919f1;
  width: 100%;
  height: 100%;
  /* display: flex;
  justify-content: center;
  align-items: center; */
}
.modal-cont-el{
  text-align: center;
  height: 100%;
  width: 45%;
}
.modal-cont-el img {
  height: 110%;
 }
 .modal-titu{
  font-size: 4rem;
 }
 .modal-sub{
  font-size: 1.5rem;
 }
.modal-header {
  border-bottom: 1px solid #444444;
}
.modal-footer {
  border-top: unset;
}

.modal-register {
  overflow: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1050;
  height: 100%;
  width: 100%;
  background-color: #191919d6;
  margin: auto;
  display: none;
}

.modal-register-cont{
  position: absolute;
  width: 80%;
  height: 80%;
  inset: 0px;
  margin: auto;
  overflow: hidden;
}

.modalClose{
  font-size: 5rem;
  height: 6rem;
  display: block;
  text-align: right;
  padding: 0 2rem;
  cursor: pointer;
  color: #dd0000;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
}

.discord-cont{
  height: 80%;
}
.discord-cont iframe {
  height: 100%;
}



.close {
  float: right;
  font-weight: bold;
  line-height: 1;
  color: #ababab;
  text-shadow: 0 1px 0 #000;
  filter: alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(100));
  filter: alpha(opacity = (100));
}
.close:hover,
.close:focus {
  color: #838383;
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  opacity: 0.9;
  -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=(90));
  filter: alpha(opacity = (90));
}


/* Chat box */

.expanded-chat .chat-content li.chat-message .message-body-wrapper:hover .message-body,
.chat-modal .chat-content li.chat-message .message-body-wrapper:hover .message-body {
  background: #232323;
}
.expanded-chat .chat-content li.chat-message[data-break="true"], .chat-modal .chat-content li.chat-message[data-break="true"] {
  border-top: 1px solid #353535;
}


.expanded-chat .chat-content li.system-message,
.chat-modal .chat-content li.system-message {
  color: #dcdcdc;
}
.expanded-chat .chat-content li.system-message::before,
.chat-modal .chat-content li.system-message::before,
.expanded-chat .chat-content li.system-message::after,
.chat-modal .chat-content li.system-message::after {
  display: none;
  /* width: 10%;
  content: '';
  border-top: 1px solid #eee;
  position: relative;
  top: -0.3rem;
  margin: 0 2rem; */
}

.expanded-chat .chat-content li.chat-message .chat-user a, .chat-modal .chat-content li.chat-message .chat-user a {
  color: #b9b9b9;
}

.expanded-chat .chat-content li.chat-message .message-body-wrapper .message-body, .chat-modal .chat-content li.chat-message .message-body-wrapper .message-body {
  color: #d0d0d0;
}



.header .chat-list, .slideout-menu .chat-list {
  color: #bdbdbd;
  background: #121212;
}


.header .notification-list, .slideout-menu .notification-list {
  background-color: #2f3d8a;
}
.header .notification-list li a:hover,
.slideout-menu .notification-list li a:hover {
  color: #8d97ce;
}

.header .notif-dropdown-link a {
  padding: 1em 0;
  font-weight: unset;
}


.header .notification-list li.unread, .slideout-menu .notification-list li.unread {
  background-color: #121212;
}

.header .chat-list li.unread, .slideout-menu .chat-list li.unread {
  background-color: #121212;
}
.chats-list > li.unread {
  background: #121212;
  border-bottom: 0;
}


.bg-info {
  background-color: transparent !important;
}








/* citas */
blockquote {
    border-left: 5px solid #585858;
    color: #8a8a8a;
}

.topic [component="post/parent"] {
    border: 0;
    font-size: 8px;
    background-color: var(--main-color4);
    border-color: #000;
    vertical-align: 1px;
  }



  /* Paginacion numeros */
  .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    z-index: 2;
    color: #fff;
    background-color: var(--main-color4);
    border-color: #ffffff;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #383838;
}
.pagination > li > a, .pagination > li > span {
    color: #000000;
}


/* Linea separadora */
hr {
  border-top: 1px solid #232323;
}



/* listas */
.list-group-item {
  background-color: var(--main-color2);
  border: 1px solid #ddd;
}

a.list-group-item {
  color: #c3c3c3;
}


/* editar usuario  */
.well {
  background-color: var(--main-color2);
  border: 1px solid var(--main-color3);
}


a.list-group-item:hover,
a.list-group-item:focus {
  text-decoration: none;
  color: rgb(199, 199, 199);
  background-color: var(--main-color2a);
}



.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #212121;
}



/* mensajes en cola */
.panel-primary > .panel-heading {
  color: #fff;
  background-color: var(--main-color4);
  border-color: #3f33b7;
}



/* panel final */
.panel-footer {
  background-color: #000000;
  border-top: 1px solid #444;
}



/* Area de texto */
textarea {
  background-color: #000;
}



/* Areas de nuevos mensajes */

.composer {
  background: #1e2127;
  color: #fff;
}

.composer .formatting-bar .formatting-group li {
  color: #b5b5b5;
}
.composer .formatting-bar .formatting-group li:focus,
.composer .formatting-bar .formatting-group li:hover {
  outline: none;
  background-color: #000000;
}

.composer .formatting-bar span {
  color: inherit;
}

.composer .write {
  background-color: #18181b;
  color: #fff;
  border: unset;
}

.composer .preview {
  background-color: #100e0f;
}

.composer-submit{
  font-size: 120%;
  margin-left: 5px !important;
}

.bootstrap-tagsinput {
  background-color: #000;
}


/* Barra de paginacion */
.topic .pagination-block {
  height: 30px;
}

.topic .pagination-block .progress-bar {
  background-color: var(--main-color4);
}
.topic .pagination-block .wrapper {
  color: #ffffff;
  font-size: 9px;
  text-shadow: 1px 1px 3px #000, -1px -1px 3px #000, 0px 1px 3px #000;
}




/* Notificaciones en rojo */
.unread-count:after {
  right: 0px;
  left: unset;
  top: unset;
}


.chats-full [component="chat/nav-wrapper"] [component="chat/search/list"] li, .chat-modal [component="chat/nav-wrapper"] [component="chat/search/list"] li {
  color: #000;
}




/* barras de botones */
.post-bar{
  /* box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19); 
  background-color: #1d1d1d; */
  padding: 20px;
  margin: 25px 0 25px 0;
}

.post-bar > hr {
  display: none !important;
}

.posts > li:first-child > hr{
  display: none !important;
}

.topic .posts {
  list-style-type: none;
  padding: 0;
  box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
  background-color: #181818;
  padding: 25px;
  margin: 30px 0;
}

/* circulo avatar */

.topic .posts .icon .avatar {
  box-shadow: 0 8px 17px 0 rgba(0,0,0,.2), 0 6px 20px 0 rgba(0,0,0,.19);
}




/* Categorias */


.wait-text {
  font-size: 2rem;
  text-align: center;
  margin: 2rem 0;
  color: #fff;
}

#waitlist .overlay-botones .boton-rosa{
  border-radius: 10px;
  height: 60px;
  width: auto;
  font-size: 20px;
  margin: auto;
  color: #fff;
}
#waitlist .boton-rosa{
  background: var(--colorRosa);
  border: 5px solid #e804e8;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}
#waitlist .boton-rosa:hover{
  box-shadow: 0px 0px 15px 5px var(--colorRosa);
  letter-spacing: 1px;
}
#waitlist .boton-rosa-down{
  font-family: 'acumin';
  font-weight: 100;
}
#waitlist .overlay-landing-button-text{
  height: 1.2em;
  letter-spacing: 0px;
  margin-left: 1rem;
}

.widgets {
  display: flex;
  flex-direction: column;
}
.widgetCustom {
  display: none;
  margin: 3rem 0;
  animation: anim-wait 0.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@keyframes anim-wait {
  0% {
    transform: rotateX(-80deg);
    opacity: 0;
  }
  100% {
    transform: rotateX(0);
    opacity: 1;
  }
}


.categories > li {
  padding: 10px;
  margin: 10px 0px 5px 0px;
}

.card > div > p > .permalink {
  color: #fff;
  text-decoration: none;
}
.categories > li .card .post-content {
  color: #b7b7b7;
}


.category-children{
  display: flex !important;
  flex-wrap: wrap;
  flex-direction: column;
}

.category-children-item {
  padding: 10px;
  /* flex-grow: 1; */
  /* width: 30%; */
  font-size: 17px;
}


.categories-title {
  color: #ffffff;
  font-size: 18px;
  text-align: center;
  font-weight: bold;
}


.categories > li .content .icon{
  margin-top: unset;
}

.catego-sep{
  height: 3px;
  width: 100%;
  border-radius: 20px;
  box-shadow: none;
  background-color: #191919;
  margin: 35px 0px 0px 0px;
  box-shadow: 1px 1px 3px #00000030;
}


.categories > li .content h2, .category > ul > li .content h2 {
  margin-top: 15px;
}

.categories > li .card, .category > ul > li .card {
  height: 55px;
}

.categories > li .card > *, .category > ul > li .card > * {
  padding-left: 25px;
  height: 100%;
  width: 100%;
}

.categories > li .card .post-content {
  color: #b7b7b7;
  margin-top: 5px;
}

.puntos{
  margin-top: -5px;
  padding-left: 30px;
}



/* boton perfil imagen */
.account .cover.active .save {
  display: inline-block;
  z-index: 101;
}

.account .cover .save, .account .cover .indicator {
  bottom: 50%;
  top: unset;
  background-color: #3f51b5;
  box-shadow: 1px 1px 5px #000;
}



.registro{
  margin-bottom: 50px;
}

.registro h1{
  font-size: 37px;
}

.registro-margen-inf{
  margin-bottom: 80px;
}

.flex-centro{
  display: flex;
  align-items: center;
  justify-content: center;
}

.registro-imagen{
  position: relative !important;
  width: 33.33333333% !important;
}
.registro-imagen > div > img {
  width: auto;
}



.separador-contenedor{
  overflow: hidden;
  width: 100%;
  position: absolute;
  height: 20px;
  bottom: 0;
}

.separador { 
  height: 20px;  
}  
.separador:before {  
  right: 50%;  
  border-right: 1000px solid transparent;  
  border-left: 1000px solid;  
}  
 .separador:after {  
   left: 50%;  
   border-left: 1000px solid transparent;  
   border-right: 1000px solid;  
 }  
 .separador:after,  
 .separador:before {  
   content: '';  
   position: absolute;  
   bottom: 0;  
   width: 50%;  
   /* z-index: 100;   */
   border-bottom: 15px solid #3f51b5;  
   -moz-transform: rotate(0.000001deg);  
   -webkit-transform: rotate(0.000001deg);  
   -o-transform: rotate(0.000001deg);  
   -ms-transform: rotate(0.000001deg);  
   transform: rotate(0.000001deg);  
 }  

/* ------------------------------------------------------------------------------------------ */
/* Custom botnes de menus laterales */

.lateral1{
  position: absolute;
  height: 40px;
  width: 20px;
  margin: auto;
  margin-left: 256px;
  bottom: 0;
  top: 0;
  background-color: var(--main-color2);
  display: flex;
  align-items: center;
  justify-content: center;
  /* flex-direction: column; */
  box-shadow: 3px 3px 5px #0000005e;
}
.lateral2{
  position: absolute;
  height: 40px;
  width: 20px;
  bottom: 0;
  top: 0;
  margin: auto;
  background-color: var(--main-color2);
  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: -3px 3px 5px #0000005e;
  /* right: 0; */
  left: 0px;
}

.lateral1 svg,
.lateral2 svg{
  height: 12px;
  width: 10px;
}

.svg-glow{
  filter: drop-shadow( 0px 0px 3px #3f51b5) drop-shadow( 0px 0px 5px #3f51b5);
  color: #fff;
} 

/* Ajustes de menu laterales */
.menu-lateral1{
  width: 256px;
  display: none;
}
.menu-lateral2{
  right: 0;
  position: absolute;
  display: none;
}
.menu-lat {
  /* display: none; */
  /* opacity: 0;
  pointer-events: none; */
}

#menu {
  width: 276px !important;
  background: unset;
  background-image: unset;
  background: linear-gradient(90deg, var(--main-color2)  256px, transparent 0px);
  
}


.menu-profile {
  width: 256px;
}

/* Menu lateral de chat  */
#chats-menu {
  width: 276px !important;
  background: unset;
  background-image: unset;
  background: linear-gradient(90deg, transparent 20px, var(--main-color2) 0px);

}

.slideout-menu{
  z-index: 1070 !important;
}
.slideout-menu .chat-list > li > a {
  text-align: left !important;
}

/* ------------------------------------------------------------------------------------------ */

/* Imagenes de fondo */

.imagen-foro{
    position: fixed;
    height: 60%;
    bottom: 0;
    opacity:0.4!important;
    z-index: -1;
}
.foro-fondo{
    position: fixed;
    z-index: -5 !important;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    background-image: url("/plugins/nodebb-plugin-gtahub-rutas/static/img/background-forum.avif");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.landing-background{
    background: linear-gradient(rgba(14, 14, 14, 0.91), rgba(14, 14, 14, 0.91)), url("/plugins/nodebb-plugin-gtahub-rutas/static/img/background.webp");
}

.f-fondo {
    position: fixed;
    z-index: -5;
    height: 100%;
    width: 100%;
    top: 0;
    background-image: url("/plugins/nodebb-theme-gtahub/images/foro_fondo.jpg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }



/* Etiqueta jugadores ------------------------- */
.gtahub-jugadores{
  padding-left: 20px;
  color: white;
  text-align: center;
  position: relative;
}


.gtahub-widget-cont{
  width: 80%;
  margin: 0 auto;
}

.gtahub-widget-icono{
  background: #d200b6;
  font-size: 40px;
  border-radius: 50%;
  width: 70px;
  height: 70px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-shadow: 2px 2px 0 #000, 2px -2px 0 #000, -2px 2px 0 #000, -2px -2px 0 #000, 2px 0px 0 #000, 0px 2px 0 #000, -2px 0px 0 #000, 0px -2px 0 #000, 2px 2px 2px rgba(0,0,0,0);
}

.gtahub-widget-titulo{
  color: #fff;
  font-size: 15px;
  margin: 7px;
}


/* Animacion de imagen */
:root{--animate-duration:1s;--animate-delay:1s;--animate-repeat:1}
.animate__animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-duration:var(--animate-duration);animation-duration:var(--animate-duration);-webkit-animation-fill-mode:both;animation-fill-mode:both}

.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}

@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translate3d(-2000px,0,0);transform:translate3d(-2000px,0,0)}to{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}}.animate__fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}


.register {
    position: absolute;
    left: 0;
    top: 0;
    background: linear-gradient(rgba(14, 14, 14, 0.91), rgba(14, 14, 14, 0.91)), url("/plugins/nodebb-plugin-gtahub-rutas/static/img/background.webp");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%;
    width: 100%;
    margin: 0;
}

.register-container {
    height: 100%;
    background: #0000006b;
}

.registro h1 {
    font-size: 2.5rem;
    font-weight: bold;
    color: var(--text);
    margin-top: 3rem;
}

.register .texto-simple {
    width: 75%;
    margin: 0 auto;
}

.register-cont {
    background: linear-gradient(0deg, rgba(18,18,18,1) 0%, rgba(28,28,28,1) 100%);
    border-radius: 20px;
    width: 45rem;
    box-shadow: 0 0 10rem #000000;
    margin-top: 8rem;
}

.register form input {
    background: #2E2E2E;
    border-radius: 12px;
    border: none;
    height: 6rem;
    padding-left: 6rem;
    padding-top: 3rem;
    color: var(--text);
}

.register form {
    padding: 0 3rem;
}

.register-item {
    width: 100%;
    position: relative;
}

.register-item .button-pink {
    width: 100%;
    color: var(--text);
}

.register-item .button-pink:hover {
    background: var(--pink);
    color: var(--text);
}

.register-label {
    font-weight: normal;
    font-size: 1rem;
    position: absolute;
    left: 6rem;
    top: 1rem;
    pointer-events: none;
}

.form-horizontal .form-group {
    margin-left: 0; 
    margin-right: 0;
}

.form-icon {
    background: var(--yellow);
    width: 4rem;
    height: 4rem;
    position: absolute;
    left: 1rem;
    top: 1rem;
    pointer-events: none;
    border-radius: 6px;
}

.form-redirect p {
    margin: 2rem 0;
    text-align: center;
    color: var(--text-gray2);
}

.form-redirect a {
    font-weight: bold;
    color: var(--text);
}

.form-check {
    display: flex;
    flex-direction: row;
    height: 5rem;
    align-items: center;
}

.form-check input {
    width: 2.5rem;
    margin-right: 0rem;
    background: var(--pink);
}

.form-pass {
    margin-top: 1rem;
    display: inline-block;
}

.navbar-default .navbar-nav > li > a.button-nav {
    display: flex;
    justify-content: center;
    align-items: center;
}


.nav-button-play .icon-play {
  width: 1rem !important;
  height: 1rem !important;
  margin-right: .5rem;
}



/* ----------------------------------------------------------- */
@media (max-width: 750px){
  .gta-navbar-dark {
      height: auto;
      /* background-color: rgba(0,0,0,0.8); */
  }
  .navbar-toggler {
    display: block;
  }
  .nav-social {
    flex-direction: row !important;
    justify-content: center;
  }
  .boton-menu-lista {
    background-color: rgb(50 64 143) !important;
    position: relative;
  }
  .boton-menu-lista > li > a {
    color: #dadada !important;
    width: 70%;
    margin: 0 auto;
    font-size: 12px;
  }
  .btn-toolbar {
    display: flex;
    flex-direction: column;
  }
  .btn-toolbar > .btn, .btn-toolbar > .btn-group, .btn-toolbar > .input-group {
    margin-left: auto;
  }
 
  .esconder-set-menu{
    display: none !important;
  }

  .catego-sep{
    display: none;
  }


  /* Propiedades del nav en mobile  */
  .navbar-expand-lg .gta-navbar-nav {
    flex-direction: row;
    justify-content: space-between;
  }
  .hidden-sm{
    display: none;
  }
  .gta-nav-item {
    width: 100%;
    text-align: center;
  }
  .nav-social {
    position: absolute;
    right: 0;
    top: 0;
  }
  .btn-social {
    width: 25px;
    height: 25px;
    margin: 3px;
  }
  .boton-home {
    width: 100%;
  }
  .contenedor-menu {
    width: 100%;
    padding: 0;
  }
  .dropdown-menu > li > a {
    padding: 3px 20px;
  }

  #gtaHub .xmas-img {
    width: 8rem !important;
    right: 15% !important;
    top: -5rem !important;
  }
  #gtaHub .xmas-title-base {
    font-size: 3rem !important;
    font-weight: bold !important;
    text-shadow: 5px 0 15px, -5px 0 15px, 0 5px 15px, 0 -5px 15px !important;
    color: #00000054 !important;
  }

}


@media (max-width: 767px){
  .categories > li, .category > ul > li {
      border-top: 1px solid #4a4a4a;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #555;
    background-color: #000;
  }
}

@media (min-width: 750px){
  .navbar-expand-lg .navbar-collapse-g {
    display: -ms-flexbox!important;
    display: flex!important;
    -ms-flex-preferred-size: auto;
    flex-basis: auto;
  }
  .navbar-expand-lg .gta-navbar-nav {
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .esconder-barras-l{
    display: none !important;
  }
  
  #main-logo {
    height: 35px!important;
    margin: 0 auto;
    display: block;
  }
  #men-lista {
    width: 100% !important;
    column-count: 2;
    overflow: hidden;
  }
  .gta-navbar-dark .gta-navbar-nav .nav-link::after {
    margin: inherit;
  }

  .gtahub-jugadores{
    width: 100%;
    position: relative;
  }

  #main-logo {
    height: 55px!important;
    display: none;
  }

  .gtahub-jugadores{
    position: absolute;
    right: 10px;
    top: 70px;
  }
  
  .cambio-800{
    right: unset;
    left: 0;
    top: 55px;
  }
  .men-izquierda{
    display: block;
  }
  .men-derecha{
    /* display: none !important; */
  }
}

@media (max-width: 810px){
  .registro-imagen{
    position: absolute !important;
    width: 200px !important;
  }
  .registro-imagen > div > img {
    width: 100%;
  }

  .gta-navbar-nav li {
    margin-left: 0px; 
    margin-right: 0px;
  }
}

@media (min-width: 1280px){
  .men-izquierda{
    /* display: none !important; */
  }
  .men-derecha{
    display: block;
  }

  .gtahub-jugadores{
    position: absolute;
    max-width: 200px;
    padding-left: 10px;
    text-align: left;
    top: 65px;
  }
  .gta-perfil {
    top: 65px;
  }

  .gtahub-jugadores{
    /* top: 10px; */
    top: 12px;
    width: 150px;
    right: 20px;
    padding-left: 0;
  }
  .cambio-800{
    top: 7px;
  }
}

@media (min-width: 1600px){
  .cambio-800 {
    right: 0;
  }
  .men-derecha {
    display: block !important;
  }
  .men-izquierda {
    display: none !important;
  }

  .gtahub-jugadores {
    right: unset;
    left: 10px;
    max-width: 300px;
    width: 250px;
    top: 20px;
  }
}

@media(min-width: 1920px){
  .gtahub-jugadores{
    max-width: fit-content;
    position: absolute;
    top: unset;
  }
  .gta-perfil {
    top: unset;
  }
}

/* ----------------------------------------------------------- */