/* Artfully masterminded by ZURB  */

/* --------------------------------------------------
   Table of Contents
-----------------------------------------------------
:: Shared Styles
:: Page Name 1
:: Page Name 2
*/


/* -----------------------------------------
   Shared Styles
----------------------------------------- */
html {
	scroll-behavior: smooth;
}
p  { color: #ffffff}
h1 { color: #ffffff}
h2 { color: #ffffff}
h3 { color: #ffffff}
h4 { color: #ffffff}
h5 { color: #ffffff}
ul { color: #ff0000; font-size: 18px !important;font-weight: bold}
a  { color: #ff0000;}
li { color: #ff0000; margin-left: 5%;}
hr { border: solid #ffffff;}
hr.header {border: solid #ffffff }

.background-black {background: black;}
.background-tuxedo {background: #3b3b3b;}
.background-light {background: #acacac;}
.background-normal {background: #333333;}
.background-logo {
   background: url("/images/background.png") no-repeat center center;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}
.background-logo-fixed {
   background: url("/images/background.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.full-width {
   width: 100%;
   padding: 0px 0px 0px 0px;
}
.two-third-width {
   max-width: 70%;
}
.no-top-margin {
   margin-top: 0px;
}
.no-bottom-margin {
   margin-bottom: 0px;
}
.bg {
	background: #333333;
}
/*estilo propio*/
.center{
    text-align: center;
}
@media only screen and (max-width: 767px) { 
   .center-vertical {text-align: center;}
   .two-third-width { max-width: 50%;}
}


.intro{
    margin-top: 0;
    margin-bottom: 0;
}
.nav-bar { background: #000000; width:fit-content; width:-moz-fit-content; display:table; margin-left: auto; margin-right: auto; margin-top: 0px;}
.nav-bar > li {border-color: #000000 #000000 #000000 #000000;}
.nav-bar > li:first-child { border-color: #000000 #000000 #000000 #000000;}
.nav-bar > li:last-child {  border-color: #000000 #000000 #000000 #000000;}
.nav-bar > li.active { background: #434343; border-color: #222F38; }
.nav-bar > li.active:hover { background: #999999;}
.nav-bar > li:hover { background: #bbbbbb; }
.nav-bar > li a { color: #e6e6e6; }
.nav-bar > li.has-flyout > a:first-child:after {border-color: #000000 #000000 #000000 #000000;}
.nav-bar.vertical > li.has-flyout > a:first-child:after { border-color: #000000 #000000 #000000 #000000; }

dl.nav {
   width: auto;
   margin: 18px 0;
   font-size: 18px !important;
   font-weight: bold;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   gap: 6px;
}

dl.nav dt {
   color: rgb(255, 255, 255);
   font-weight: normal;
   margin-right: 12px;
   flex-shrink: 0;
   align-self: center;
}

dl.nav dd {
   margin: 0;
}

dl.nav dd a {
   display: inline-block;
   padding: 5px 12px;
   text-decoration: none;
   border-radius: 12px;
   background: transparent;
   color: inherit;
}

dl.nav a:hover {
   background: #ff7171;
   color: #fff;
}

dl.nav dd.active a {
   background: #ff0000;
   color: #fff;
}

/* 🎯 Responsive per mòbils */
@media (max-width: 600px) {
   dl.nav {
      flex-direction: column;
      align-items: flex-start;
   }

   dl.nav dt {
      margin-bottom: 8px;
   }

   dl.nav dd a {
      width: 100%;
   }
}

/* -------------------------------------------
   Game Styles
--------------------------------------------*/
.small-icon {
   width: 64px;
   height: 64px;
}

.avatar {
   width: 256px;
   padding: 25px;
}

.box3d {
   width: 100%;
   min-height: 400px;
}

/* -------------------------------------------
   Pop Up Styles
--------------------------------------------*/
#modalTitle, .lead, .modalBody{
   color: #1f1f1f
}

/* -----------------------------------------
   Games
----------------------------------------- */
.background-games-fixed {
   transition: background 0.5s linear;
}

/* -----------------------------------------
   ChainBreak
----------------------------------------- */

.chainbreak-background1 {
   background: url("/images/chainbreak/chainbreak_background1.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.chainbreak-background2 {
   background: url("/images/chainbreak/chainbreak_background2.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.chainbreak-background3 {
   background: url("/images/chainbreak/chainbreak_background3.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.chainbreak-background4 {
   background: url("/images/chainbreak/chainbreak_background4.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

/* -----------------------------------------
   Coloco
----------------------------------------- */

.coloco-background1 {
   background: url("/images/coloco/coloco_background1.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.coloco-background2 {
   background: url("/images/coloco/coloco_background2.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.coloco-background3 {
   background: url("/images/coloco/coloco_background3.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

/* -----------------------------------------
   Gotris
----------------------------------------- */

.gotris-background1 {
   background: url("/images/gotris/gotris_background1.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.gotris-background2 {
   background: url("/images/gotris/gotris_background2.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.gotris-background3 {
   background: url("/images/gotris/gotris_background3.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

/* -----------------------------------------
   Alter Ego
----------------------------------------- */

.alterego-background1 {
   background: url("/images/alterego/alterego_background1.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.alterego-background2 {
   background: url("/images/alterego/alterego_background2.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.alterego-background3 {
   background: url("/images/alterego/alterego_background3.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

/* -----------------------------------------
   Coloco DX
----------------------------------------- */


.colocodx-background1 {
   background: url("/images/colocodx/colocodx_background1.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.colocodx-background2 {
   background: url("/images/colocodx/colocodx_background2.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}

.colocodx-background3 {
   background: url("/images/colocodx/colocodx_background3.png") no-repeat center center fixed;
   -webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
   background-size: cover;
   background-color:#b7b8b2
}
/* -----------------------------------------
   Page Name 2
----------------------------------------- */