body{
    background:url("../assets/bg-img.jpg");
    background-position:left;
    background-attachment:fixed;
    background-size:cover;
    font-family:'Raleway', sans-serif
}
.pt-7{
    padding-top:7rem
}
.th100{
    max-height:100%
}
.my15{
    margin-top:3rem;
    margin-bottom:3rem
}
.fw500{
    font-weight:500
}
.fw600{
    font-weight:600
}
.mt-5-c{
    margin-top:5em
}
.mx-6{
    margin-left:6rem
}
.mt03{
    margin-top:.3em
}
a.text-orange,.text-orange{
    color:#ff6000
}
p.text-dark-blue,.text-dark-blue{
    color:#01223f
}
.bg-light-gray{
    background:#dadada
}
.bg-gray{
    background:#aed2da
}
.bg-blue{
    background:#124a6b
}
.text-blue{
    color:#124a6b
}
.bg-opacity{
    background-color:rgba(255,255,255,0.9)
}
.register{
    /*background:rgba(255,255,255,0.5)*/
}
.text-shadow{
    text-shadow:1px 1px 2px #0A0000
}
.btn-secondary2{
    color:#fff;
    background-color:#ff6000;
    border-color:#ff6000
}
.btn-secondary2:hover{
    background-color:#f3bba1;
    border-color:#fe6b22
}
.shadow-l{
    -webkit-box-shadow:-1px 0px 16px -1px #4f4d4f;
    -moz-box-shadow:-1px 0px 16px -1px #4f4d4f;
    box-shadow:-1px 0px 16px -1px #4f4d4f
}
.typed-cursor{
    opacity:1;
    font-weight:800;
    font-size:2em
}
#hexagon{
    width:250px;
    height:158px;
    background:#fff;
    position:relative;
    border-radius:.3em
}
#hexagon:before{
    content:"";
    position:absolute;
    top:-64px;
    left:0;
    width:0;
    height:0;
    border-left:125px solid transparent;
    border-right:125px solid transparent;
    border-bottom:65px solid #fff
}
#hexagon:after{
    content:"";
    position:absolute;
    bottom:-64px;
    left:0;
    width:0;
    height:0;
    border-left:125px solid transparent;
    border-right:125px solid transparent;
    border-top:65px solid #fff
}
.r-hex{
    overflow:hidden;
    display:inline-block;
    margin:4em 0;
    width:20em;
    height:17.32em;
    transform:rotate(-30deg) skewX(30deg);
    border-radius:.5em;
    margin-bottom:-68%;
    margin-left:-11%
}
.r-hex *,.r-hex *:before{
    display:block;
    overflow:hidden;
    width:inherit;
    height:inherit;
    border-radius:inherit
}
.r-hex-inner{
    transform:skewX(-30deg) rotate(60deg) skewX(30deg)
}
.r-hex:first-child .r-hex-inner:before{
    transform:skewX(-30deg) rotate(60deg) skewX(30deg);
    background:white;
    content:''
}
#hexa-nobg{
    margin-left:8%;
    margin-top:-8%
}
.navbar{
    padding:.8rem 0rem
}
.nav-link{
    font-weight:500
}
.page-link,.navbar-light .navbar-nav .nav-link:focus,.navbar-light .navbar-nav .nav-link:visited,.navbar-light .navbar-nav .nav-link,.link-text a,.dropdown-item{
    color:#124a6b
}
.dropdown-item:hover,.navbar-light .navbar-nav .nav-link:active,.navbar-light .navbar-nav .nav-link:hover,.active{
    color:#ff6000
}
.navbar-brand{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    background:#124a6b;
    padding:.6em;
    top:.3em
}
.ml-md-6{
    margin-left:6rem
}
.dropdown-menu{
    background:rgba(255,255,255,0.9);
    border:0px solid rgba(0,0,0,0.15);
    color:#124a6b;
    margin:.825rem 0 0;
    border-radius:0rem
}
.dropdown-item:active{
    background:rgba(255,255,255,0.9)
}
.dropdown-divider{
    border-top:1px solid #a2cbd8dd
}
@media (max-width: 767.98px){
    .navbar-brand{
        left:85% !important;
        top:11% !important
    }
    body{
        background-position:center
    }
    .my15{
        margin-top:5rem;
        margin-bottom:5rem
    }
    .mt-sm-1{
        margin-top:1rem
    }
    .p-sm-2{
        padding:.9rem
    }
    .ml-sm-3{
        margin-left:1rem
    }
    .mx-sm-3{
        margin-left:1rem;
        margin-right:1rem
    }
    .display-3{
        font-size:2.5rem
    }
    #hexa-nobg{
        margin-left:20%;
        margin-top:-35%
    }
}
.bg-blue-dark{
    background:#01223f;
    color:#fff
}
.form-control#selCampeonato{
    color:#fafbfd;
    background-color:#fff0
}
.form-control.form-input{
    border:1px solid #ff6000
}
.form-control#codigoPosicion,.form-control#codigoFecha,.form-control#selCodigo{
    color:#ff6000;
    border:1px solid #ff6000
}
.input-group-text.form-icon{
    color:#124a6b;
    background-color:#f7f7f7;
    border:1px solid #ff6000
}


[data-title]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}

[data-title]:after {
    content: attr(data-title);
    background-color: #333;
    color: #fff;
    font-size: 12px;
    position: absolute;
    padding: 5px 10px;
    /*bottom: -1.6em;*/
    bottom: -34px;
    left: 20%;
    white-space: nowrap;
    box-shadow: 1px 1px 3px #222222;
    opacity: 0;
    border: 1px solid #111111;
    z-index: 99999;
    visibility: hidden;
    border-radius: 6px;
}

[data-title] {
    position: relative;
    cursor: help;
}