@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,700&display=swap')
*{
    margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;}




#noticiaspatinruedan{color: #128662;
                        padding: .4em;
                        padding-bottom: 0em;
                        padding-top: 0em;
                        margin-top: 0em;}




    .linea{margin-top: .5em;
            margin-left: .8em;
            margin-right: .8em;}



    .imgnoti{padding-top: 1.8em;
             padding-left: .8em}

.lineados{ padding-left: 1em;
            padding-right: 1em}

.fotoruedan{width: 100%;
            padding-right: 1.4em}

.calendario{padding: 0em;
            margin-left: 0em;
            margin-top: 0em}

/* NOTICIAS */


.borde{display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
        align-content: flex-start;}


#leermas{display: flex;
       
        padding-right: 17em ;
        margin-bottom: 1.2em;
        padding-bottom: em;
        font-size: .9em;}

.leermas{display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        align-content: flex-start;
        }



    figure{width: 98%;
        padding: .5em;
        padding-bottom: 0em;
        margin-bottom: 1.5em;
        margin-top: 0em;
        margin-right: 0em;
      
        
        }
    figure img { }
    .borde{display: flex;
            align-items: center;
           border-bottom: #cccccc 1px solid;
           padding: .2em;
            padding-top: .7em;
            padding-bottom: 0em;
            padding-right: 0em;
            margin-left: .7em;
            margin-right: .7em;
            background-color: rgba(240, 240, 240, 0)}


/* CONTACTO */

.button {display: flex;
        justify-content: center;
        padding-bottom: 1em}

.largo {width: 58.8%}

/* FIN CONTACTO */

/* FIXTURE */


.mes { color: #b1b1b1;
        padding: .5em;
        text-transform: uppercase;
        font-weight: 400;
        margin-bottom: 0em;
        padding-bottom: 0em
        }
.lineafina{margin-top: 2px; border-bottom: #cccccc 1px solid;
            border-color: #cccccc;
            margin-top: .5em;
            margin-left: .8em;
            margin-right: .8em; }


.dia {color: #cccccc;
      padding-left: .8em;
    text-transform: uppercase;
    margin-top: .4em;
    margin-bottom: 0em}

.numero{color: #cccccc;
        font-size: 5em;
        padding-left: .15em;
        padding-top: 0em;
        margin-top: 0em;
        margin-bottom: 0em;
        border-top: 0em;
        font-weight: 700}

.fixture{background-color: #e3e3e3;
            width: 90%;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            padding-bottom: 1em;
            padding-top: 1em;
            margin-top: 5px; border: #c7c7c7 5px solid;}

.contenedorfixture{ display: flex;
                    justify-content: center;
                    align-content: space-between;
                    padding-bottom: 1em;
                    
                    }

.logofixturedsl{width: 20%;
                height: 16%;
             padding-left: 1em}


.logofixturesar{width: 19%;
                height: 16% ;
             padding-left: 1.2em;
                padding-top: 0em}

.clubescontenedor{width: 70%;
                  padding-right: 0em;
                  height: 100%;
                  margin-right: 2px; border-right: #cccccc 1px solid;}

.lineafinafix{margin-top: 2px; border-bottom: #cccccc 1px solid;
            border-color: #cccccc;
            margin-top: .5em;
            margin-bottom: .5em;
            margin-left: .8em;
            margin-right: 1em; }

.alinearlogo{display: flex;}
.nombreclub{color: #8d8d8d;
            padding-left: 1em;
            font-size: .8em;
            display: flex;
            justify-content: center;
            align-items: center;}

.clubescontenedorder{ display: flex;
                      flex-direction: column;
                      align-content: flex-end;
                        align-items: ;
                        justify-content: center;
                        width: ;
                        padding-right: 1em}
.local{color: #39BC88;
        margin-bottom: .4em;}

.visitante{color: #4c96cc;
        margin-bottom: .4em;}

.horario{color: #8d8d8d;
        margin-top: 0em;
        margin-bottom: 0em;}

.horariocostado{display: flex;
                flex-direction: column;
                align-content: flex-end;
                align-items: flex-end;
                justify-content: flex-end;}



/* FIN FIXTURE */


/* VIDEOS */

.videos {width: 100%;
         display: flex;
        flex-direction: column;
        align-items: center;
        padding-top: 1em;
         border: none;
        padding-right: 0em;}





/* FIN VIDEOS */

/* 404 */

#deportes{margin-bottom: 0em;
            margin-top: .2em}

.sarmientodeportes{padding-top: 1em}

.fondocir{background-color: #128662;
          padding: 1em;
            width: 3em;
            height: 3em;
            
          border-radius: 3em;
            display: flex;
            justify-content: center;
            align-content: center;
            align-items: center;
          

            }

.logovisit1{ width: 2.5em;
            height: 3em}

.logovisit2{ width: 2.5em;
            height: 2.2em;
            padding: 0em;
            margin: 0em;}


.logovisit3{ width: 2.5em;
            height: 2em}

.logosec{display: flex;
            flex-direction: row;
            align-items: center;
            align-content: center;
            justify-content: space-between;
            padding-left: 1em;
            padding-right: 1em;
            padding-bottom: 1em;}

.secvisitadas{color: #8d8d8d;
                display: flex;
                align-content: flex-start;
                justify-content: ce;
                padding-left: .9em;
                padding-bottom: 0em;
                margin-bottom: 0em;
                font-weight: 400}

.secvisitadas2{color: #8d8d8d;
                display: flex;
                align-content: center;
                justify-content: center;}


.visitado{background-color: ;}

.titulosec{display: flex;
            flex-direction: column;
            justify-content: center;}

#titulosec{color: #8d8d8d;
            text-transform: uppercase;
            font-weight: 700;
            font-size: .75em;
            display: flex;
            align-content: center;
            justify-content: center;
            align-items: center;}


/* FIN 404 */cli#ente

/* ACTIV DEPORT */

.conoceactiv{color: #8d8d8d;
            display: flex;
            align-content: center;
            justify-content: center;
            }
.actividades{padding-top: 1em;
             padding-bottom: 1em;
            background-color: white}


/* [THE ENTIRE TAB] */
.tab {
  position: relative;
  max-width: 600px;
    width: 300px;
    display: block;
    margin: auto;
    margin-top: 0.3em;
    margin-bottom: 0.3em;
    text-align: left;
}

/* [THE LABEL] */
.tab input {
  display: none;
}
.tab label {
  display: flex;
  justify-content: flex-start;
    align-items: center;
  background-color: #39BC88;
  color: #ffffff;
  font-weight: bold;
  padding: 10px;
  cursor: pointer;
    height: 1.5em;
}
.tab label::after {
  content: "\25b6";
  position: absolute;
  right: 10px;
  top: 10px;
  display: block;
  transition: all 0.4s;
}
.tab input[type=checkbox]:checked + label::after,
.tab input[type=radio]:checked + label::after {
  transform: rotate(90deg);
}

/* [THE CONTENTS] */
.tab-content {
  overflow: hidden;
  background: #f0f0f0;
  /* CSS animation will not work with auto height */
  /* This is why we use max-height */
  transition: max-height 0.4s; 
  max-height: 0;
}
.tab-content p {
  margin: 20px;
}
.tab input:checked ~ .tab-content {
  /* Set the max-height to a large number */
  /* Or 100% viewport height */
  max-height: 100vh;
}

.negrita{font-weight: 700;
         color: #585858;}
.subcalendario{color: #838383;
                margin-bottom: 0em;
                padding-left: 1em;
                margin-top: 1em}
P.horariosclases{margin-top: 0em;
                 padding-top: 0em;
                margin-bottom: 0em;
                color: #838383}

.logodeportes{width: 1.5em;
              height: 1.5em;
              padding-right: .5em;
                padding-bottom: .1em}



/* ASOCIATE */

.datosasociar{color: #128662;
                font-size: 2em;
                font-weight: 400;
                margin-bottom: .2em;
                padding-top: 1em}

#asociatetit{font-size: 2.2em;
             color:#128662;
             font-family: "Avenir Next", "Avenir", sans-serif;
              font-weight: 700;
            padding-left: .4em;
            padding-top: 0em;
            margin-top: .5em}

#sociostit{font-size: 1.2em;
             color:#128662;
            padding-left: .8em;}

.imgnoti2{padding-top: 1.8em;
             padding-left: 1.1em}

.promo{margin-top: 1em}




/* VISTA CELU */


@media (max-width:768px) {
    .explorar{margin-right: 0;}
    .sarmiento{margin-top: 3.5em}
    header label { width:  
        display: block;
        padding-top: .5em;
    }
    .menu {
         position: absolute;
          background-color:#39BC88;
         width: 70%;
        height: 100%;
        margin-left: -80%; 
        transition: all 0.5s;
        z-index: 999;
        
    }
   header {
       position: relative;
       z-index: 9999;
    }
    .menu ul { flex-direction: column;}
    .menu li:hover {
        background-color: #39BC88;}
    
    #boton-menu:checked ~ .menu{ margin: 0;}

    
  
    
    .menu .submenu {

 display: flex;
position: relative;
}

     .submenu {
        background-color: rgb(14, 55, 118);
        color: #39BC88;}
    
    .menu .submenu a{
        background-color: #F2F2F2;
        color: #128662;}
    .menu .submenu a:hover{ background-color: #cecece}
    nav ul li ul {
        position: static; 
    
    
  
    }
    
   


    

    
    .titulosecnone {display: none;}    


}


@media (min-width:720px) 
                        {                           
                            body{background-color: #ffffff
                            }

                            main{position: relative;
                                 left: 25%;
                                 width: 50%;
                                 background-color: white}

                          

                            .demo{width: 50%;
                                    position: relative;
                                    left: 17%;}

                            .titulosecnone {display: flex;
                                            flex-direction: column;
                                            justify-content: center;}

                                .secvisitadas{padding-bottom:  2em;
                                                font-size: 1.5em;}
                            .explorar{right: -55em;
                                        bottom: 13em}

   figure{width: 90%;
        padding: .5em;
        padding-bottom: 0em;
        margin-bottom: 1.5em;
        margin-top: 0em;
        margin-right: 0em;
        
        }
    figure img { }
    .borde{display: flex;
            align-items: center;
           border-bottom: #cccccc 1px solid;
           padding: .2em;
            padding-top: .7em;
            padding-bottom: 0em;
            padding-right: 0em;
            margin-left: .7em;
            margin-right: .7em;
            background-color: rgba(240, 240, 240, 0)}
}