html, body, h2, h3, h4, div, p, input {
  font-family: normal, sans-serif;
  color: #012A3A;
}
#fb-img {
    display: none;
}
#hero-text-1 {
  font-family: normal;
  font-size: 500%;
  color: white;
  position: absolute;
  left: 1em;
  top: 5em;
  letter-spacing: -2px;
}
#hero-text-2 {
  font-family: normal;
  font-size: 500%;
  color: white;
  position: relative;
  left: 10%;
  top: 5em;
  letter-spacing: -2px;
  max-width: 80%;
}
div.divisiones {
  margin: 0;
  padding: 0;
  width: 100%;
  z-index: 0;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
#aviso-programa {
    height: 10em;
    width: 100%;
    background: #0c2e44;
    position: fixed;
    z-index: 5;
    text-align: center;
}
#aviso-programa a {
    position: relative;
    z-index: 6;
}
#aviso-programa a img {
    height: 100%;
    width: auto;
}
#top {
    min-height: 926px;
    background-image: url('../img/top.jpg');
}
#medio {
    background-image: url('../img/medio.jpg');
    min-height: 1133px;
    position: relative;
    top: -12em;
    z-index: 0;
}
#medio2 {
    background-image: url('../img/medio2.jpg');
    min-height: 1132px;
    position: relative;
    top: -14em;
    z-index: 1;
}
#bottom {
    min-height: 742px;
    background-image: url('../img/bottom.jpg');
}
#logo-bottom {
    position: relative;
    top: 20em;
    left: 5%;
}
#logo-bottom-phone {
    display: none;
}

.contenido {
    max-width: 1280px;
    margin-left: auto;
    margin-right: auto;
    background: white;
    padding-left: 3em;
    padding-right: 1em;
}
h2 {
    font-size: 180%;
    color: #012A3A;
}
#menu-contacto-phone {
    display: none;
}
#menu {
    list-style-type: none;
    position: fixed;
    right: 2em;
    top: 0.5em;
    z-index: 5;
}
#menu-contacto {
    list-style-type: none;
    position: fixed;
    right: 2em;
    bottom: 0.5em;
    z-index: 4;
}
#menu li, #menu-contacto li {
    margin-bottom: 0.5em;
    cursor: pointer;
}
#form-contacto {
    display: none;
    background: #012A3A;
    position: fixed;
    width: 40em;
    top: 20%;
    margin-left: 30%;
    margin-right: 30%;
    z-index: 5;
    padding-top: 5em;
    padding-bottom: 5em;
}
#cerrar-form {
    position: relative;
    right: 1em;
    width: 100%;
    text-align: right;
    cursor: pointer;
    bottom: 3.5em;
}
#pensando {
    color: #FFCE00;
    float: right;
    font-size: 140%;
    margin-top: 1em;
    display: none;
}
#form-contacto input[type=text] {
    margin-bottom: 0.6em;
    width: 100%;
    padding: 1em;
}
#form-contacto input[type=button] {
    font-weight: bold;
    background: #FFCE00;
    color: #012A3A;
    float: right;
    width: 8em;
    border-radius: 25px;
    font-size: 120%;
    margin-top: 1em;
}
#form-contacto form {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}
#form-contacto h2 {
    color: #FFCE00;
}
#facts {
    max-height: 60em;
    background: transparent;
    margin-top: -8em;
    clear: both;
}
#federaciones {
    max-width: 40em;
}
#federaciones img {
    width: 64px;
    margin-left: auto;
    margin-right: auto;
}
#container-mapa {
    padding-left: 12em;
    padding-top: 1em;
    margin-left: auto;
    margin-right: auto;
}
.descripcion-ca {
    font-size: 140%;
    color: #012A3A;
    width: 8em;
    text-align: left;
}
.dato-ca {
    font-size: 220%;
    color: #FFCE00;
    margin-top: -0.5em;
    text-align: left;
}
#fact-ventas {
    text-align: center;
    width: 25%;
    position: relative;
    bottom: 16em;
    right: 8em;
}
#fact-jugadores {
    text-align: center;
    width: 20%;
    position: relative;
    left: 22em;
    bottom: 35em;
}
#fact-contratos {
    text-align: center;
    width: 25%;
    position: relative;
    left: 9em;
    bottom: 24em;
}
#presentacion {
    text-align: center;
    color: #012A3A;
    position: relative;
    top: -16em;
    background: transparent;
}
#presentacion p {
    clear: both;
    text-align: left;
    font-size: 140%;
}
#marca-awatz {
    color: #012A3A;
    text-align: left;
    font-size: 220%;
    margin-bottom: 1em;
    position: relative;
    right: 0.5em;
}
    #marca-awatz img {
        float: left;
        margin-right: 0.3em;
        position: relative;
        bottom: 0.3em;
    }
    img.bullet-pelota {
        float: left;
        width: 1em;
        height: 1em;
        margin-right: 0.2em;
        position: relative;
        top: 0.1em;
    }
    #boton-contactenos {
        padding: 1em;
        font-size: 120%;
        background: #012A3A;
        color: white;
        border-radius: 25px;
        margin-top: 3em;
    }
    #bio {
        padding-bottom: 0em;
        position: relative;
        top: -14em;
        z-index: 1;
        color: #012A3A;
        background: transparent;
    }
    #descripcion-bio {
        padding-top: 6em;
        max-width: 59%;
    }
    .descripcion-bio {
        font-size: 120%;
    }
    #container-foto-bio {
        background: #E6E6E6;
        margin-right: 1em;
    }
    #foto-bio {
        margin: 1em;
        padding: 1em;
        text-align: center;
    }
    #foto-bio img {
        width: 80%;
        margin-top: 2em;
    }
    #bio p, #foto-bio p {
        font-size: 140%;
    }
    #foto-bio span {
        position: relative;
        bottom: 1.4em;
        font-size: 120%;
    }
    #jugadores-awatz {
        margin-bottom: -18em;
        position: relative;
        top: -20em;
        background: transparent;
        z-index: 2;
        width: 80%;
    }
    #jugadores-awatz h2 {
        font-size: 150%;
    }
    div.jugador {
        background: #E6E6E6;
        padding: 0;
        padding-top: 1em;
        padding-bottom: 1em;
        margin: 0.5em;
        text-align: center;
        font-size: 100%;
    }
    div.jugador img {
        width: 95%;
    }
    div.jugador a {
        text-decoration: none;
        font-weight: bold;
        color: #012A3A;
    }
    div.nombre-jugador {
        font-size: 120%;
        height: 2.7em;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
    div.linea {
        margin-top: 1em;
        margin-bottom: 1em;
        height: 3px;
        background: #FFCE00;
    }
    img.con {
        width: 64px;
        height: 64px;
    }
    #direccion {
        color: white;
        font-size: 140%;
        position: relative;
        top: 16em;
        left: 8%;
        width: 80%;
    }
    @media all and (max-width: 1024px) {
        /*
           RESET
         */
        html, body, .contenido, #facts, #container-mapa, #logo, #img-logo, #nombre-logo, #texto-logo, #hero-text-1, #hero-text-2, #fact-ventas, #fact-jugadores, #fact-contratos, .dato-ca, .descripcion-ca, #presentacion, #jugadores-awatz, #marca-awatz, #marca-awatz img, #bio, #bio span, #container-foto-bio {
            max-width: 100%;
            padding: 0;
            margin: 0;
            width: auto;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            font-size: 100%;
        }
        #menu, #menu-contacto {
            display: none;
        }
        #top, #medio, #medio2, #bottom {
            position: static;
        }
        #aviso-programa {
            height: 5em;
        }
        #aviso-programa a {
        }
        #aviso-programa a img {
            max-width: 400px;
            width: 100%;
        }
        /*
           AJUSTE
         */
        #top {
            background-image: url('../img/top-phone.jpg');
            min-height: 390px;
        }
        #medio {
            background-image: url('../img/medio-phone.jpg');
            min-height: 430px;
        }
        #medio2 {
            background-image: url('../img/medio2-phone.jpg');
            min-height: 430px;
            width: 100%;
        }
        #bottom {
            background-image: url('../img/bottom-phone.jpg');
            min-height: 270px;

        }
        #logo {
            text-align: center;
            max-height: 30%;
            margin-top: 4.5em;
        }
        #img-logo {
            width: 5em;
            height: auto;
            float: none;
            position: absolute;
            top: 1.2em;
            left: 2em;
        }
        #nombre-logo {
            width: 7.5em;
            height: auto;
            position: absolute;
            top: 2.5em;
            left: 7.4em;
        }
        #texto-logo {
            height: 10%;
            width: 10em;
            position: absolute;
            top: 3.8em;
            left: 5.2em;
            font-size: 110%;
            letter-spacing: -1px;
        }
        #hero-text-1 {
            font-size: 200%;
            letter-spacing: -2px;
            position: absolute;
            left: 1em;
            top: 5.5em;
            height: 4em;
        }
        #facts, #presentacion {
            max-width: 90%;
            margin-left: auto;
            margin-right: auto;
        }
        #facts {
            margin-top: -3em;
        }
        #facts h2 {
            font-size: 160%;
            text-align: center;
        }
        #federaciones img {
            padding-bottom: 1em;
            width: 48px;
        }
        #fact-ventas {
            margin-top: 1em;
            margin-bottom: 1em;
            width: 100%;
        }
        #fact-jugadores {
            margin-bottom: 1em;
            width: 100%;
        }
        #fact-contratos {
            width: 100%;
        }
        .descripcion-ca {
            float: left;
            width: 70%;
        }
        .dato-ca {
            float: right;
            text-align: right;
        }
        #hero-text-2 {
            font-size: 200%;
            letter-spacing: 0;
            max-width: 90%;
            position: relative;
            top: 4.5em;
            left: 10%;
        }
        #marca-awatz {
            font-size: 115%;
            font-weight: bold;
        }
        #marca-awatz img {
            margin-right: 0.3em;
            position: relative;
            top: -1em;
        }
        #presentacion p{
            font-size: 90%;
        }
        #container-foto-bio {
            margin-left: auto;
            margin-right: auto;
            width: 80%;
            margin-top: 2em;
        }
        #foto-bio {
            margin: 1em;
        }
        #descripcion-bio {
            margin: 0;
            padding: 0;
            margin-top: 1em;
            margin-left: auto;
            margin-right: auto;
            font-size: 80%;
            width: 80%;
            max-width: 100%;
        }
        .descripcion-bio {
            margin-bottom: 1em;
            text-align: center;
        }
        #jugadores-awatz h2 {
            font-size: 150%;
            text-align: center;
        }
        div.jugador {
            padding: 5%;
            padding-bottom: 10%;
            padding-top: 0;
            margin: 5%;
        }
        div.jugador img {
            width: 100%;
        }
        #menu-contacto-phone {
            list-style-type: none;
            display: block;
            position: relative;
            top: 6.5em;
            left: -0.5em;
        }
        #menu-contacto-phone li {
            margin-bottom: 0.3em;
            cursor: pointer;
        }
        #menu-contacto-phone img {
            width: 42px;
            text-align: center;
        }
        #logo-bottom {
            display: none;
        }
        #logo-bottom-phone {
            width: 50%;
            position: relative;
            top: -6em;
            left: 30%;
            display: block;
        }
        #direccion {
            font-size: 100%;
            position: relative;
            top: -5em;
            left: 30%;
            width: 12em;
            margin: 0;
        }

        #form-contacto {
            display: none;
            background: #012A3A;
            position: fixed;
            width: 100%;
            top: 20%;
            margin: 0;
            padding-top: 1em;
            padding-bottom: 4em;
            z-index: 5;
        }
        #cerrar-form {
            position: relative;
            text-align: right;
            cursor: pointer;
            top: 1.5em;
        }
        #pensando {
            color: #FFCE00;
            float: right;
            font-size: 140%;
            margin-top: 1em;
            display: none;
        }
        #form-contacto input[type=text] {
            margin-bottom: 0.6em;
            width: 100%;
            padding: 1em;
        }
        #form-contacto input[type=button] {
            font-weight: bold;
            background: #FFCE00;
            color: #012A3A;
            float: right;
            width: 8em;
            border-radius: 25px;
            font-size: 120%;
            margin-top: 1em;
        }
        #form-contacto form {
            width: 80%;
            margin-left: auto;
            margin-right: auto;
        }
        #form-contacto h2 {
            color: #FFCE00;
        }

    }