/* Navegacion */
.navbar{
   min-height: 30px;
   font-size: 14px;
   margin-bottom: 20px;
   .navbar-toggle {
      background: lighten(@color02,90%);
      padding: 10px 15px;
      color: @bg_type;
      text-transform: uppercase;
      &:hover{
         color:@color01_h_type;
         background-color: @color02;
         text-decoration: none;
         cursor: pointer;
      }
   }
   .navbar-brand{
      padding: 11px;
      color: @color01_type;
      font-size: 17px;
      text-transform: uppercase;
      font-weight: bold;
      line-height: 37px;
      text-decoration: none;
      cursor: default;
      display: none;
			height:auto;
   }
   .first-level{
      color: @color02_type;
      background: @color02;
      width: 100%;
      display:block;
      z-index: 999;
      font-size: 14px;
      .border-radius(4px);
      >li{
         line-height: 30px;
         text-transform: uppercase;
         font-weight:bold;
         >a{
            text-decoration: none;
            color: @color02_type;
            line-height: 30px;
            padding: 0px 5px;
            position: relative;
            &:after{
               content: "";
               width: 1px;
               height: 40%;
               position: absolute;
               top: 30%;
               right: 0;
               background: @bg;
               //border-left: 1px solid @color02_type;
            }
         }
         &:first-child{
            >a:hover, &:hover >a, &.active, &.active >a{
               .border-radius(4px 0 0 4px);
            }
         }
         >a:hover, &:hover >a{
            color: @color01_type;
            background-color:@color01;
            text-transform:uppercase;
            cursor: pointer;
            position: relative;
            overflow: hidden;
            &:before{
               border-radius: 50%;
               bottom: -30px;
               box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
               content: "";
               height: 30px;
               left: 0;
               position: absolute;
               width: 100%;
            }
         }
         .second-level{
            &.dsk.current{
               display: block;
            }
         }
         >.subnav{
            position: absolute;
            left: 0;
            width: 100%;
         }
         &.active{
            background-color:@color01;
            &.spacing{
               margin-bottom: 30px;
            }
            &:after{
               width: 0px;
               background: none;
            }
            >a, >a:hover, >a:focus{
               color: @color01_type;
               background-color:@color01;
               text-transform:uppercase;
               position: relative;
               overflow: hidden;
               &:before{
                  border-radius: 50%;
                  bottom: -30px;
                  box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
                  content: "";
                  height: 30px;
                  left: 0;
                  position: absolute;
                  width: 100%;
               }
            }
            >a:hover{
               cursor: pointer;
            }
            .second-level{
               //display: block;
            }
            >.subnav{
               //display: block;
            }
         }
      }
   }
   .second-level{
      color: @color01_type;
      background: @color01;
      width: 100%;
      font-size: 14px;
      &.hide-show{
         position: absolute;
         top: -9999px;
         left: -9999px;
      }
      &.dsk{
         display: none;
         &.current{
            display: block;
         }
      }
      >li{
         position: static;
         font-weight:bold;
         height: 30px;
         line-height: 30px;
         padding: 0 10px;
         &:hover{
            color: @color01_type;
            background: @color01;
            >a{
               color: @color01_type;
               background-color:@color01;
            }
         }
         >a{
            text-decoration: none;
            color: @color01_type;
            line-height: 26px;
            padding: 0;
            &:after{
               content: "";
               width: 1px;
               height: 60%;
               position: absolute;
               top: 20%;
               right: -10px;
               border-right: 1px solid;
            }
            &:hover, &:focus{
               color: @color01_type;
               background-color:@color01;
               border-bottom: 4px solid;
               cursor: pointer;
            }
         }
         &.active{
            >a, >a:hover, >a:focus{
               color: @color01_type;
               background-color:@color01;
               border-bottom: 4px solid;
               &:after{
                  //border-right: 0px solid;
               }
            }
            >.subnav{
               // display: block;
            }
         }
      }
      .subnav{
         float: left;
         width: 100%;
         li{
            display: inline;
            float: left;
         }
         &:after{
            .G_divider_horizontal;
         }

      }
   }
   .subnav{
      color: @bg_type;
      margin-top: 5px;
      float: left;
      width: 100%;
      font-size: 14px;
			position:relative;
      &.hide-show{
         position: absolute;
         top: -9999px;
         left: -9999px;
      }
      &.dsk{
         display: none;
         position: relative;
         &.current{
            display: block;
         }
      }
      #gradient .vertical-three-colors( @bg, @bg, 20%,darken(@bg,10%));
      >li{
         text-transform: uppercase;
         font-size: 10px;
         float: left;
         line-height: 12px;
         font-weight:bold;
         height: 30px;
         line-height: 30px;
         position: relative;
         &:hover{
            color:@color02_type;
            background:@color02;
            a{
               color:@color02_type;
               background:@color02;
               &:after{
                  border: none;
               }
            }
         }
         a{
            text-decoration: none;
            cursor: pointer;
            color:@bg_type;
            line-height: 30px;
            padding: 0;
            padding: 0 10px;
            display:block;
            height:100%;
            &:after{
               content: "";
               width: 1px;
               height: 60%;
               position: absolute;
               top: 20%;
               border-right: 1px solid;
               padding-right:10px;
            }
            &:hover{
               cursor:pointer;
               color:@color02_type;
               background:@color02;
            }
         }
         &:last-child{
            a:after{
               border: none;
            }
         }
         &.active{
            color:@color02_type;
            background:@color02;
            a, a:hover, a:focus{
               background:@color02;
               color:@color02_type;
            }
            a:after{
               border: none;
            }
         }
      }
      &:after{
         .G_divider_horizontal;
      }
   }
   .dropdown-submenu{
      position:relative;
      > .dropdown-menu{
         top:0;
         left:100%;
         margin-top:-6px;
         margin-left:-1px;
         -webkit-border-radius:0 6px 6px 6px;
         -moz-border-radius:0 6px 6px 6px;
         border-radius:0 6px 6px 6px;
      }
      > a:after{
         content:" ";
         width:0 !important;
         border-left: 4px solid transparent;
         border-right: 4px solid transparent !important;
         border-top: 8px solid @bg;
         margin-top:5px;
         display: block;
         margin-right: 16px;
         position: absolute;
         height: 0 !important;
      }
      &.open {
         > .dropdown-menu{
            display:block;
         }
         > a:after{
            border-left: 4px solid transparent;
            border-right: 4px solid transparent !important;
            border-bottom: 8px solid @bg;
            border-top: 0;
            display: none;
         }
      }
      .pull-left{
         float:none;
      }
      &.pull-left > .dropdown-menu{
         left:-100%;
         margin-left:10px;
         -webkit-border-radius:6px 0 6px 6px;
         -moz-border-radius:6px 0 6px 6px;
         border-radius:6px 0 6px 6px;
      }
   }
   &.ie8{
       &.mobile{
         .navbar-collapse{
            &.in{
               display: block;
            }
         }
      }
   }
   &.mobileMenu{
     svg, canvas{
       display: none;
     }
   }
}
.navbar-right, .minSize-479 .navbar-right{
   float:right;
   margin-top: 5px;
   margin-bottom: 2px;
}
.navbar-top {
   font-family: @baseFontFamily;
   font-size: 12px;
   text-transform: uppercase;
   font-weight: bold;
   padding-left: 0px;
   line-height: 30px;
   text-indent: 0px;
   margin-bottom: 0;
   border-radius: 0;
   min-height: 30px;
   ul{
      width: 100%;
      #gradient .vertical-three-colors( @bg, @bg, 20%,darken(@bg,10%));
      &.mainHeaderSubmenu{
         width: 100%;
         background: @color02;
         min-height: 30px;
         font-weight: bold;
         display: block;
         font-size: 14px;
         li{
            float: left;
            display: block;
            line-height: 30px;
            text-transform: uppercase;
            margin-right: 4px;
            a{
               text-decoration: none;
               color: @color02_type;
               line-height: 30px;
               padding: 0px 5px;
               position: relative;
               display: block;
               &:after{
                  content: "";
                  width: 1px;
                  height: 40%;
                  position: absolute;
                  top: 30%;
                  right: 0;
                  background: @bg;
               }
               &:hover, &:focus{
                  color: @color01_type;
                  background-color:@color01;
                  text-transform:uppercase;
                  cursor: pointer;
                  position: relative;
                  overflow: hidden;
                  &:before{
                     border-radius: 50%;
                     bottom: -30px;
                     box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
                     content: "";
                     height: 30px;
                     left: 0;
                     position: absolute;
                     width: 100%;
                  }
                  &:after{
                     border-radius: 0;
                     bottom: 0;
                     box-shadow: 0 0 0 0 transparent;
                     height: 0;
                     width: 0;
                  }
               }
            }
            &.active{
               a, a:hover, a:focus{
                  color: @color01_type;
                  background:@color01;
                  text-transform:uppercase;
                  position: relative;
                  overflow: hidden;
                  cursor: pointer;
                  &:before{
                     border-radius: 50%;
                     bottom: -30px;
                     box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
                     content: "";
                     height: 30px;
                     left: 0;
                     position: absolute;
                     width: 100%;
                  }
                  &:after{
                     border-radius: 0;
                     bottom: 0;
                     box-shadow: 0 0 0 0 transparent;
                     height: 0;
                     width: 0;
                  }
               }
            }
         }
      }
   }
   .dropdown-menu{
      li{
         a{
            color:@color01_type;
         }
      }
   }
   li{
      line-height: 12px;
      margin: 0px;
      border-right: 0px;
      height: 30px;
   }
   .menu li{
      border-right: 1px solid lighten(@bg_type,85%);
   }
   li > a{
      color: @bg_type;
      padding: 0px 5px;
      line-height: 30px;
      &:hover,&:focus{
         color: @color01_h_type;
         background: @color01_h;
         position: relative;
         overflow: hidden;
         &:after{
            border-radius: 50%;
            bottom: -30px;
            box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
            content: "";
            height: 30px;
            left: 0;
            position: absolute;
            width: 100%;
         }
      }
   }
   .active{
      a,:hover,:focus {
         color: @color01_h_type;
         background: @color01_h;
         text-transform:uppercase;
         background-repeat:no-repeat;
         background-position:center bottom;
         position: relative;
         overflow: hidden;
         &:after{
            border-radius: 50%;
            bottom: -30px;
            box-shadow: 0 0 10px 8px rgba(255, 255, 255, 0.65);
            content: "";
            height: 30px;
            left: 0;
            position: absolute;
            width: 100%;
         }
      }
   }
}
.minSize-479 .navbar-nav > li > a{padding:0 5px;}
.btn{
   background-image:none;
   background-color: @color01;
   height: 33px;
   line-height: 30px;
   color: @color01_type;
   font-family: @baseFontFamily;
   text-shadow:none;
   padding:0px;
   .border-radius(4px);
   border-bottom: 3px solid darken(@color01, 20%);
   transition:all 0.5s ease;
   cursor: pointer;
   display: block;
   text-decoration: none;
   text-transform: uppercase;
   font-size: 11px;
   font-weight: bold;
   &:focus, &:hover, &:active{
      background-color: lighten(@color01, 5%);
      border-bottom-width: 0px;
		    color: @color01_type;
      height: 30px;
      margin-top: 3px;
      outline: 0;
   }
   &.plus{
      font-size: 20px;
      font-family: @type_Special;
   }
   &.playVideo, &.select, &.next, &.prev, &.up, &.down{
      width: 25px;
      height: 25px;
      line-height: 25px;
      &:after{
         width: 0;
         height: 0;
         display: block;
         content: " ";
         border: 6px solid transparent;
         border-left: 8px solid @color01_type;
         margin-top: 4px;
         margin-left: 8px;
         position: absolute;
      }
      &:focus, &:hover, &:active{
         height: 23px;
         line-height: 23px;
         margin-top: 2px;
      }
   }
   &.viewImage, &.audio{
      width: 25px;
      height: 25px;
      line-height: 25px;
      svg, canvas{
         margin: -2px 0 0 -3px;
         fill:@color01_type;
      }
      &:focus, &:hover, &:active{
         height: 23px;
         line-height: 23px;
         margin-top: 2px;
      }
   }
   &.select{
      width: auto;
      text-align: left;
      span{
         padding: 0 0 0 10px;
         font-family: @type_Special;
         font-weight: 200;
         font-size: 11px;
      }
      &:after{
         border-left: 6px solid transparent;
         border-top: 8px solid  @color01_type;
         top: 9px;
         right: 4px;
         margin: 0;
         transition:all 0.5s ease;
      }
      &:focus, &:hover, &:active{
         line-height: 25px;
         &:after{
            top: 12px;
         }
      }
   }
   &.prev{
      &:after{
         border-right: 8px solid @color01_type;
         border-left: 0;
      }
   }
   &.closeModule {
      font-weight: bold;
      position: absolute;
      right: 0;
      width: 100px;
      top: 0;
      span{
         &.close{
            -ms-transform: rotate(45deg);
            -webkit-transform: rotate(45deg);
            -moz-transform: rotate(45deg);
            -o-transform: rotate(45deg);
            transform: rotate(45deg);
            display: block;
            font-size: 40px;
            float: left;
            margin-left: 8px;
         }
      }
   }
   &.up{
      width: auto;
      &:after{
         border: 6px solid transparent;
         border-bottom: 8px solid @color01_type;
         left: 0;
         margin: 1px auto 0;
         right: 0;
      }
   }
   &.down{
      width: auto;
      &:after{
         border: 6px solid transparent;
         border-bottom: 6px solid transparent;
         border-top: 8px solid  @color01_type;
         left: 0;
         margin: 8px auto 0;
         right: 0;
      }
   }
}
.dis .btn, .btn.dis, .details.dis {
   background-color: desaturate(@color01, 50%);
   border-bottom-width: 0px;
   .opacity(50);
   cursor: default;
   pointer-events: none;
   &:focus, &:hover, &:active{
      height: 33px;
      margin-top: 0;
   }
}
.collapse.in {
   height: auto;
}
.menu-coord{
   .subnav{
      position: relative;
      width: 100%;
      &:after{
         .G_divider_horizontal;
      }
   }
}
.maxSize-479{
    .navbar{
      &.mobile{
        border-bottom:1px solid @bg;
        /* Navbar Header*/
        .navbar-header{
           background: @color02;
           height: 37px;
           float: none;
        }
        /* Navbar Brand*/
        .navbar-brand{
           display: inline-block;
           padding: 0 0 0 20px;
           color: @color02_type;
        }
        /* Navbar Toogle*/
        .navbar-toggle {
           background-color: @color02;
           margin: 0;
           display: block;
           .icon-bar{
              border: 1px solid @color02_type;
           }
           &:focus{
              outline: none;
           }
        }
        /* Navbar Collapse*/
        .navbar-collapse.in{
           overflow:visible;
           display: inline;
        }
        /* Navbar First level*/
        .first-level{
           >li{
              /*position:relative; */
              width: 100%;
              &:first-child{
                 a{
                    border-top: 1px solid lighten(@color02,75%);
                 }
              }
              &.active{
                 &.spacing{
                    margin-bottom: 0
                 }
              }
              >a{
                 background: @color02;
                 padding:5px 15px 5px 25px;
                 line-height: 25px !important;
                 border-bottom: 1px solid lighten(@color02,75%);
                 font-size: 14px;
                 color: @color02_type;
                 .caret{
                    margin-left: 2px;
                    margin-top: 7px;
                    border-width: 8px 4px 0;
                    border-bottom-color: @bg;
                    border-top-color: @bg;
                    border-right-color: transparent;
                    border-left-color: transparent;
                    vertical-align: top;
                    float: right;
                 }
                 &:after{
                    background:none;
                 }
              }
              &:hover > a{
                 &:before{
                    box-shadow: none;
                 }
                 .caret{
                    border-bottom-color: @bg;
                    border-top-color: @bg;
                 }
              }
              &.active >a{
                 background: @color01;
                 color: @color01_h_type;
                 outline: 0;
                 &:before{
                    box-shadow: none;
                 }
                 .caret{
                    border-bottom-color: @bg;
                    border-top-color: @bg;
                    border-width: 0 4px 8px;
                    border-bottom-color: @bg;
                    border-top-color: @bg;
                    border-right-color: transparent;
                    border-left-color: transparent;
                    display: none;
                 }
              }
              .subnav{
                 position: relative;
                 margin: 0;
                 padding: 0;
                 border-radius: 0;
              }
           }

           a.no-sub{
              &:focus{
                 border-bottom:none;
              }
           }
           > li.dropdown.active{
              > a{
                 background: @color02;
                 color: @color02_type;
              }
           }
           > li.dropdown-submenu.active{
              > a{
                 background: @color02;
                 color: @color02_type;
              }
           }
        }
        /* Navbar Second level*/
        .second-level{
           position:relative;
           top:0;
           font-size: 14px;
           float:none;
           left: 0;
           &.hide-show{
              position: relative;
              top: 0;
              left: 0;
              margin: 0;
              padding:0;
              border: none;
              width: 100%;
           }
           &.dsk.current{
              display: none;
           }
           >li{
              height:auto;
              padding: 0;
              width: 100%;
              &:hover:before, &:focus:before{
                 border-bottom-color: @color01_h;
                 border-top-color: @color01_h;
              }
              >a{
                 padding:5px 15px 5px 35px;
                 border-bottom:1px solid lighten(@color02,75%);
                 line-height: 20px;
                 background: no-repeat  right center  lighten(@color02, 30%);
                 color:@color02_type;
                 font-weight: bold;
                 &:after{
                    border-right: 0px;
                    width:0;
                    right: 0;
                 }
              }
              &.active{
                 >a, >a:hover, >a:focus{
                    border-bottom: 1px solid lighten(@color02,75%);
                    outline: 0;
                    background: @color01;
                    color: @color01_h_type;
                 }
              }
           }
           > li.dropdown-submenu.active{
              > a{
                 background: lighten(@color02, 30%);
                 color:@color02_type;
              }
           }
           &.mobile{
              display: block !important;
           }

        }
        /* Navbar Subnav level*/
        .subnav{
           position: relative;
           float:none;
           margin-top: 0px;
           background: lighten(@color02,50%);
           &.dsk.current{
              display: none;
           }
           &.hide-show{
              position: relative;
              top: 0;
              left: 0;
           }
           li{
              float:none;
              display:block;
              background:transparent;
              &:first-child{
                 a{
                    border-top: 0;
                 }
              }
              a{
                 padding:5px 15px 5px 45px;
                 display: block;
                 color:@color02_type;
                 line-height: 20px;
                 font-size: 14px;
                 background: lighten(@color02,50%);
                 background-image: none;
                 border-top: 1px solid #bfbfbf;
                 font-weight: bold;
                 &:after{
                    background-image: none;
                    position:relative;
                    border: none;
                 }
              }
              &:focus a, &.active a{
                 background: @color01;
                 color: @color01_h_type;
                 outline: 0;
              }
           }
           &:after{
              background-image: none;
              position:relative;
              border: none;
           }
           &.mobile{
              // display: block;
           }
        }
        /* Navbar Suvnav Numbers*/
        .subnav.numbers{
           min-height:31px;
           overflow:auto;
           li{
              float:left;
              min-width: 36px;
              text-align: center;
              &:hover a{
              }
              &.active{
                 a{
                 }
              }
              a{
                 padding: 5px 0;
                 border-top: 0;
                 &:after{
                    width:auto;
                    height:auto;
                    position:relative;
                    padding-right: 0 !important;
                    border-right: none;

                 }
              }
           }
        }
        .dropdown-submenu{
           > .dropdown-menu{
              margin-left: 0 !important;
           }
           > a:after{
              height: auto;
           }
        }
      }
      &.mobileMenu{
        margin: 0;
        ul {
          li{
            width: 25%;
            float: left;
            a{
              padding: 5px;
              &:after{
                width: 0;
              }
              svg, canvas{
                display: block;
                margin: 0 auto 5px;
                fill: @color02_type;
                height: 24px;
                font-size: 12px;
              }
              span{
                font-size: 9px;
                text-align: center;
                display: block;
                line-height: normal;
              }
            }
            &:nth-child(2){
              svg, canvas{
                font-size: 8px;
              }
            }
            &.active, &:hover, &:active, &:focus{
              a{
                svg, canvas{
                  fill: @color01_type;
                }
              }
            }
          }
        }
      }
   }
   .mas{
      font-size: 24px;
   }
   .select-menu {
      //display: none;
      width: 100%;
      -moz-appearance: none;
      text-indent: 0.01px;
      text-overflow: '';
      background: url('../images/arrow_select.png') no-repeat scroll right center @color02;
      color: @color02_type;
      height: 30px;
      line-height: 23px;
      margin-bottom: 1px !important;
      padding-left: 10px !important;
      font-weight: bold;
      text-align: left;
      -moz-appearance: none;
      -webkit-appearance: none;
      appearance: none;
      text-transform: uppercase;
      cursor:pointer;
      font-weight: bold;
      padding-top: 5px !important;
      border-radius: 0;
   }
   .select-menu option{
      background: @bg;
      color:@bg_type;
      cursor:pointer;
   }
   .select-menu:focus{
      outline:none;
   }
   .ie8 #mainHeader .navbar.torneos .navbar .nav  .dropdown-menu {
      right:120px;
   }
   .navbar-right {
     margin: 0;
     float: none;
     a {
       span{
          display:none;
       }
     }
   }
   .navbar-nav{
     .dropdown{
       &.tournaments{
         ul{
           background-color: @bg;
           &:after, &:before{
             display: none;
           }
         }
         >a{
            padding:0;
            position: absolute;
            right: 0;
            height: 30px;
            width: 40px;
            &:hover, &:focus{
               background:@color01;
               color: @color01;
               .caret{
                 border-bottom-color: @color01_type;
                 border-top-color: @color01_type;
               }
            }
            .caret{
              margin: 12px 16px 0;
            }
         }
         &.open{
           ul{
             min-width: 100%;
             margin-top: 30px;
           }
           >a{
             top: -30px;
             &:hover, &:focus{
               background:@color01;
               color: @color01;
             }
           }
           .dropdown-toggle{
             background-color: @color01;
           }
           &.active{
             .dropdown-toggle{
                background-color:@color01;
             }
           }
         }
       }
     }
   }

   .btn{
      font-size: 9px;
      &.closeModule {
         width: 68px;
         span{
            font-size: 9px;
            &.close{
               font-size: 20px;
            }
         }
      }
   }
   .navbar-nav{
      .dropdown{
         &.tournaments{
            > .dropdown-menu{
               min-width:225px;
               li{
                  a{
                     padding: 5px 5px 5px 18px;
                     white-space:normal;
                  }
               }
            }
         }
      }
   }
}
.maxSize-310{
  .navbar{
    &.mobileMenu{
      ul {
        li{
          a{
            span{
              font-size: 7px;
            }
          }
        }
      }
    }
  }
}
/* Fin navegacion */

@color-1: #ff9800;
@color-2: #f57c00;
@color-3: #ef6c00;


.plusNav {
  position: relative;
  min-width: 220px;
  #gradient .vertical-three-colors( @bg, @bg, 20%,darken(@bg,10%));
  ul{
    width: auto;
  }
  .contButton {
    position: absolute;
    right: 0;
    padding: 0 15px;
    top: 2px;
    z-index: 1;
    .btn{
      position: absolute;
      right: 2px;
      width: 24px;
      height: 24px;
      line-height: 20px;
      font-size: 14px;
      &:focus, &:hover, &:active{
        height: 21px;
        margin-top: 3px;
      }
    }
  }
  .visibleLinks {
    li {
      display: table-cell;
      float: none;
      a{
        white-space: nowrap;
      }
    }
  }
  .hiddenLinks {
    position: absolute;
    right: 0px;
    top: 100%;
    .dropdown-menu();
    li {
      > a{
        font-weight: bold;
        color:lighten(@bg_type,25%);
        padding: 1px 15px;
        text-transform: uppercase;
        display: block;
        clear: both;
        line-height: 1.42857143;
        white-space: nowrap;
        font-size: 14px;
        text-decoration: none;
        &:hover, &.active, &:focus{
          background:@color02;
        }
      }
    }
    &::after{
      right: 7px;
    }
    &::before{
      right: 6px;
    }
  }
}