@charset "utf-8";

/* 
----------------------------------------
reglas de estilo organizadas
de lo general a lo particular,
de "arriba" a "abajo",
"módulo" por "módulo",
y "layout" para celulares

DESPUÉS, a través de "puntos de quiebre"
(mediaqueries) van las reglas de estilos
que cambian cuando la ventana
del navegador se ensancha
----------------------------------------
*/

* {
    /* "obligatorio" */
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    outline: none;
}
@font-face{
    font-family: "Roboto";
    src: url('https://fonts.googleapis.com/css?family=Roboto:300,400,700,900&display=swap');

}
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(https://example.com/MaterialIcons-Regular.eot); /* For IE6-8 */
  src: local('Material Icons'),
    local('MaterialIcons-Regular'),
    url(https://example.com/MaterialIcons-Regular.woff2) format('woff2'),
    url(https://example.com/MaterialIcons-Regular.woff) format('woff'),
    url(https://example.com/MaterialIcons-Regular.ttf) format('truetype');
}

body {
    font-family: "Roboto", sans-serif;
    
    
    /*  declaraciones para que el footer
        quede SIEMPRE abajo,
        aun en documentos con poco contenido */
    
    min-height: 100vh;

    /* caja flexible */
    display: flex;

    /* dirección de sus elementos */
    flex-direction: column;
    
    /* organización de los elementos según el eje principal
        (vertical por la propiedad anterior) */
    justify-content: space-between;
    
}

footer{
    background-color: rgb(203, 21, 21);
    color: white;
    font-size: .85em;
    text-align: left;
    text-transform: none;
}

/* footer caracteristicas especificas */
.footer-title{
    padding: 1em;
}


/*
----------------
encabezado
----------------
*/

header {   
    background-color: rgb(203, 21, 21)
    color: #fff;
    padding-top: 30px;
    margin-left: 0px;
    min-height: 50px;
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 1em;
    text-transform: uppercase;
    text-align: center;
    padding: 1em;
	margin-bottom: 1em;
}

#headerslider {
	margin-bottom: 0;
}

/* ----REGISTRO ----- */

.fondo {
	background-color: lightgrey;
}
.sesion{
    border-radius: .2em;
    padding: 1em;
    margin-left: 10%;
    margin-right: 10%;
}
.sesion form{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.ingresar {
    text-decoration: none;
    font-family: 'Roboto',sans-serif;
    display:flex;  /* para que se vea como un bloque los links */
    background-color: #67a4c9;
    color: #262424;
    justify-content: center;
    border-radius: .2em;
    padding: .9em;
    padding-left: 4em;
    padding-right: 4em;
    font-size: .9em;
    font-weight: 700;
    margin:auto;
    margin-top: 1em;
    
}
.datos{
    text-decoration: none;
    font-family: 'Montserrat',sans-serif;
    display:flex;
    background-color:rgb(188, 188, 188);
    justify-content: flex-start;
    border-radius: .2em;
    font-size: 1em;
    margin: .25em;
}
.datos input{
    color: black;
    text-decoration: none;
    display: block;
    flex-grow: 1;
    background-color:rgb(188, 188, 188);
	border-color: rgb(188, 188, 188);
    text-align: left;
    margin-left: .5em;
    width: 14em;
    height: auto;
}
i {
  width: 24px;
  float: left;
  text-align: center;
}
.escudo{
    height: 10em;
    margin-top: 20vh;
    
}
.registro{
    font-family: 'Montserrat', sans-serif;
    font-size: .8em;
    color: rgb(46, 46, 46);
    text-decoration: underline;
}


main {

    /* crece para "llenar" la caja contenedora */
    flex-grow: 1;
}


/*
----------------
menu desplegable
----------------
*/

header {
    background-color: rgb(203, 21, 21);
    padding: 1em;
}
header > ul {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
}
#submenu ul{
    margin-top: 1em;
    text-align: left;
}

#logonombre {
    display: flex;
    color: #f0f0f0;
    font-size: 1em;
    align-items: center;
    justify-content: space-between;
    width: 10em;
}
#logonombre p {
    padding: 0;
    font-size: 0.9em;
    font-weight: 600;
}
#nombreclub {
    padding: 0.6em;
    font-size: 1em;
    font-weight: 700;
    text-align: left;
}
header ul li a{
    color: #f0f0f0;
    text-decoration: none;
    display: flex;
    align-items: center;
    font-weight: 600;
    text-align: left;
}
header nav {
    background-color: #191818;
    color: #f0f0f0;
    position: fixed;
    right: -50vw;
    top: 0;
    height: 100vh;
    width: 45vw;
    transition: all .5s ease;
    z-index: 999;  
    transition: all .5s ease;
    padding-top: 0.8em;
}
header nav:target {
    right: 0;

}
  
#botonsociomenu {
    background-color: rgb(28,161,219);
    color: #f0f0f0;
    border-radius: 10%; 
    text-align: center;
    font-size: 1em;
    font-weight: 600;
    padding-top:15px 40px 15px 40px;
    border-radius:35px;
    justify-content: center;
    margin: 1em 1em 1.5em 1em;
}
#botonsociomenu a {
    color: #f0f0f0;
    
}
header nav a {
    color: #f0f0f0;
    display: block;
    padding: 0.7em 1em;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: 500;
    letter-spacing: 0.04em;
}
header nav a:hover {
    color: rgb(203, 21, 21);    
}
#x {
    padding-left: 8.5em;
    margin-bottom: 2em;
}
.atras i{
    margin-right: 1em;
}
#iconright{
    margin-left: 0.8em;
}
#submenu ul li a {
    color: rgb(28,161,219);
}
#submenu ul li a:hover {
    color: white;
}


/*
----------------
galeria
----------------
*/


.galeria {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    margin: 1em 0;
}
.galeria img {
    max-height: 50%;
    max-width: 50%;
    padding: 0.5em;
    
}

.cajavermas{
     max-width: 100%;
    display: flex;
    justify-content: center;
    margin: auto;
}
.vermas {
    background-color: rgb(203, 21, 21);
    color: #f0f0f0;
    padding-top:15px;
    padding-bottom:15px;
    padding-left:40px;
    padding-right:40px;
    border-radius:35px;
    margin-bottom: 2em;
    text-align: center;

    font-size: 0.8em;
    display: flex;
    margin-top: 2em;
    justify-content: center;
    
}

/*
----------------
noticias
----------------
*/

main#cajamadrenoticias{
    margin: 1em;
    flex-grow: 1;
}

.tituloprincipalnoticias, .tituloprincipalnoticias1, .tituloprincipalnoticias2{
    display: flex;
    align-items: center;
    margin-top: 2em;
}

.tituloprincipalnoticias1{
    margin-top: 1em;
}
.tituloprincipalnoticias2{
    margin-top: -1em;
}

.material-icons{
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 2em;
    margin-left: -.5em;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
}

h2.noticias-title{
    text-transform: capitalize;
    font-size: 2em;
    margin-top: 0;
    padding: .4em;
}

.infoextranoticias{
    font-style: italic;
    font-size: .89em;
    color: grey;
    line-height: 1.5em;
    margin-bottom: 3em;
    padding: 0;
}

.infoextrasecundarianoticias{
    margin-top: -1.5em;
    padding: 0;
}

a.none{
    text-transform: uppercase;
    color: aliceblue;
}
section.boton{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: 3em;
}

.hastag, .hastag1{
    font-size: 1.5em;
    padding: 0;
    margin: 1em 0 .5em;
}

.iconossociales, .iconossociales1{
    margin-left: 1em;
    margin-top: -2em;
    
}

.iconossociales1{
    margin-top: 1em;
}

#iconos-sociales{
    padding-right: 2.6em;
}

h6.infofecha{
    padding: 1.5em 0;
    margin: 0;
    font-style: italic;
}


/*
----------------
noticias1
----------------
*/

.infoextranoticias1, .infoextranoticias2, .infoextranoticias3, .infoextranoticias4{
    font-size: .9em;
    padding: 0;
}

.infoextranoticias1, .infoextranoticias2, .infoextranoticias4{
    margin-bottom: 1em;
}

.infoextranoticias3{
    text-transform: uppercase;
    color: rgb(28,161,219);
    padding: 1em 0;
    font-weight: 700;
}


@media (min-width: 414px){
    .imagennoti, .imagennoti1{
        width: 340px;
        height: auto;
        margin-left: 2.5em;
    }
    .imagennoti1{
        margin: 1em 0 0 1em;
    }
    h3.nosotrostit3{
        margin-top: -1em;
    }
}

.infoextranoticias4{
    margin-top: -2em;
}

div.iconossociales{
    display: inline-block;
    justify-content: center;
}

h5.tituloemociones{
    font-size: 1em;
    text-transform: uppercase;
    margin-top: 2em;
    text-align: center;
}

.reaccion{
    display: flex;
    margin-left: -1.2em;
    padding: 0;
}

label.emoji{
    justify-content: center;
    display: flex;
    flex-direction: column;
}
#caritas{
    padding: 1.5em;
}
/*
----------------
contenidos
----------------
*/

	
}
	li {
	list-style: none;
	text-align: center;
}

	p {
	font-family: 'Roboto', sans-serif;
	font-weight: 200;
	padding: .5em;
	font-size: .9em;
}

	h1{
    font-family: "Roboto", sans-serif;
    font-size: 1.5em;
    font-weight: 900;
    text-transform: uppercase;
    color: white;
    text-align: center;
    letter-spacing: .05em;
}

	h2 {
	font-size: 1em;
    font-weight: 800;
    padding: 0rem 0em 0.5rem 0em;
    border-bottom: 1px solid #191818;
	letter-spacing: .1em;
	margin-top: 1em;
}

	h3 {
	font-size: .9em;
	font-weight: 400;
	letter-spacing: .1em;
	margin-top: 1.5em;
	text-align: center;
	margin-bottom: 1em;
	color: #464646;
}

	h5 {
    color: rgb(203, 21, 21);
    margin: 0.3rem 1.5em 0.8em 1.5em;
    font-size: 0.7rem;
}
	h6 {
    margin: 0 1.5rem;
    font-size: 0.7rem;
    color: gray;
}

    img {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

	.descripcion{
    font-family: "Roboto", sans-serif;
    font-size: 2em;
    font-weight: 700;
    color: #000;
    text-align: center;
    padding: 20px;
}

	.datos{
    font-family: "Roboto", sans-serif;
    font-size: 12px;
    font-weight: 300;
    color: #000;
    text-align: center;
    padding: 10px;
}

	#club {
  min-height: 400px;  
  background: rgb(255,255,255);
  background: white;
  float: center;    
  flex-direction: flex;
  align-items: center;
  justify-content: center;
}

	.clubbarrio{
  max-width: 20%;
  opacity: 100;
  float: left;
  
}

	.clubbarrio{
    display: block;
    margin-bottom: 1em;
}

	.titlegrupal{
    font-family: "Roboto", sans-serif;
    font-size: 25px;
    font-weight: 300;
    text-align: center;
    text-transform: uppercase;
    margin-top: 25px;
}

	#integrantes{
    display: block;
    text-align: center;
    font-family: "Roboto", sans-serif;
    font-size: 20px;
    font-weight: 300;
    line-height: 1.5em;
    text-transform: uppercase;
}

	.titlesecundario{
    font-family: "Roboto", sans-serif;
    font-size: 20px;
    font-weight: 300;
    text-align: center;
	margin-bottom: 1em;
	
}

	.card {
  box-shadow: 1em 0 1em rgba(0, 0, 0, 0.5);
  padding: 20px;
  margin-bottom: 1.5em;
}

	.card-img {
  max-width: 100%;
}

	.card-title {
  font-weight: 900;
  font-family: "Roboto", sans-serif;
  font-size: 18px;
  font-weight: 300;
  text-decoration: none;
  color: #1ca1db;
  text-align: center;
}

	.card-title a{
    text-decoration: none;
    color: #1ca1db;
}

	.card-content {
  font-family: "Roboto", sans-serif;
  font-size: 12px;
  font-weight: 100;
}

	main .card-img{
  display: block;
  width: 190px;
  margin-left: 30px;    
  padding: 30px;    
}

	.card-img-img{
    display: block;
    width: 130px;
    margin-left: 50px;
    padding: 30px;
}

	.card-content{
    font-family: "Roboto", sans-serif;
    font-size: 1em;
    font-weight: 400;
    text-align: center;
}

/*
----------------------------------------
 modificaciones de nosotros.html
----------------------------------------
*/

.nosotros {
	border: solid 1px rgba(100, 100, 100, 0.5);
	box-shadow: 0 .2em .2em rgba(100, 100, 100, 0.5);
	margin-bottom: 1em;	


}

.nosotroscont {
	font-size: 1.1em;
    margin-bottom: 1em;	
	text-align: center;
	width: 100%;
    font-weight: 700;
    line-height: 2em;
}
.nosotrostit, .nosotrostit1, .nosotrostit2, .nosotrostit3 {
	font-family: "Roboto", sans-serif;
    font-size: 1.4em;
    text-align: center;
	margin-bottom: 1em;
    text-transform: uppercase;
}
.nosotrostit1{
    color: rgb(203,21,21);
    text-align: left;
}
.nosotrostit2{
    font-size: 1.7em;
    margin-top: -1em;
    margin-bottom: 1.5em;
}
.nosotrostit3{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 3em;
    color: rgb(203,21,21);
}
p.histo{
    line-height: 1.5em;
    padding: 1em;
    
}

.fecha {
	text-decoration: none;
	margin-top: .5em;
	color: rgb(28,161,219);
	border-radius: .25em;
	text-align: center;
	font-size: 1.3em;
	font-weight: 800;
}
p.fechas{
    font-weight: 400;
    padding: 1em;
    margin-top: -1em;
}
.pp{
    font-size: 1em;
    padding: 1em;
}

/*
----------------------------------
  modificaciones de index.html
----------------------------------
*/

a{
 text-decoration: none;

}
div.slider{
    max-height: 46em;
}

/* slider fotos en background */
div.slider1{
    background: url(../imagenes/foto_slider_1.jpg) no-repeat;
    max-width: 100%;
    height: 45em;
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: column;
    align-items: center;
}
div.slider2{
    background: url(../imagenes/foto_slider_2.jpg) no-repeat;
    max-width: 100%;
    height: 45em;
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: column;
    align-items: center;
}
div.slider3{
    background: url(../imagenes/foto_slider_3.jpg) no-repeat;
    max-width: 100%;
    height: 45em;
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: column;
    align-items: center;
}
div.slider4{
    background: url(../imagenes/foto_slider_4.jpg) no-repeat;
    max-width: 100%;
    height: 45em;
    display: flex;
    margin: 0;
    padding: 0;
    flex-direction: column;
    align-items: center;
}

.slidertext, .slider1text, .slidertext2, .sliderh6{
    text-align: center;
    color: aliceblue;
    padding: .5em;
    width: 7.5em;
    
}
.slidertext, .slider1text, .slidertext2{
    font-size: 2em;
    background-color: rgb(203,21,21);
    margin-top: 7em;
}

.slider1text{
    text-transform: capitalize;
    background-color: rgb(33, 49, 92);
    margin-top: 1.5em;
}
.slidertext2{
    background: rgb(33, 49, 92);
    color: aliceblue;
    margin-top: 15em;
    text-align: center;
    width: 18em;
}

.sliderh6,.sliderhh6{
    font-size: 1.5em;
    background-color: rgb(33, 49, 92);
    margin-top: -.5em;
}

/*
cuando la ventana del navegador mida
como mínimo 560px de ancho
*/
@media (max-width: 25.875em) {
    
    div.slider1{
    background: url(../imagenes/foto_slider_responsive_1.jpg) no-repeat;
    max-width: 100%;
    height: 22.5em;     
    }
    div.slider2{
    background: url(../imagenes/foto_slider_responsive_2.jpg) no-repeat;
    max-width: 100%;
    height: 22.5em;    
    }
    div.slider3{
    background: url(../imagenes/foto_slider_responsive_3.jpg);
    max-width: 100%;
    height: 22.5em;
    }
    div.slider4{
    background: url(../imagenes/foto_slider_responsive_4.jpg) no-repeat;
    max-width: 100%;
    height: 22.5em;    
    }
    .slidertext,.slider1text, .slidertext2{
        font-size: 1em;
    }
    .slider1text{
        margin-top: 3em;
    }
    .sliderh6,.sliderhh6{
        font-size: .85em;
    }
    .slidertext2{
        margin-left: 2em;
        margin-top: 18em;
    }
}


img {
    /* para que las imágenes nunca sean mayores que la caja que las contienen */
    max-width: 100%;
    height: auto;
}

ul {
    list-style: none;
}

li.size{
    font-size: 1.4em;
}

/* íconos */

.material-icons {
    padding-right: .25em;
}
#icono{
    margin-left: .1em;
}

#llamamenu .material-icons,
#ocultamenu .material-icons {
    padding-right: 0;
}


/* subtítulos con íconos */
h3,
h4,
.subir {
   align-items: center;
}

/* contenedor centrado y con ancho máximo */

.contenedor {
    max-width: 40em;
    margin: 0 auto;
    padding: 1em;
}

.videoresponsive {
position: relative;
padding-bottom: 56.25%; /* 16/9 ratio */
padding-top: 1em;
height: 0;
overflow: hidden;
margin: 1em;
}

.videoresponsive iframe,
.videoresponsive object,
.videoresponsive embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/* -------- noticias -------- */


.titulonoticia {
	font-size: 1.1em;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin-top: .5em;
	font-weight: 400;
}

.parrafo-noticia, .parrafo-noticia1{
    color: grey;
    font-size: .9em;
    text-align: center;
    line-height: 1.5em;
	padding: 1em;
}
.parrafo-noticia1{
    color: black;
    font-weight: 400;
    margin-top: -1.5em;
    margin-bottom: 2em;
}
#noticias{
    display: flex;
    justify-content: space-between;
}

a.hashtag {
	color: rgb(28,161,219);
    font-size: 1.1em;
}

	main {

    /* crece para "llenar" la caja contenedora,
    aun con poco contenido */
	
    flex-grow: 1;
}

/*horario y cancha de los versus del menu inicio*/

div.pelotalogo{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1em;
}


.vs {
    font-size: 1em;
    color: black;
	padding: 1em;
	margin-left: 1em;
	margin-right: 1em;
	background-color: rgba(135, 206, 235, 0.37);
	border-radius: .25em;
}

/*Mapa de ubicacion*/

div .iframe{
    width: 600px;
	margin:auto;
}

/* textos */

.textos > *,
.textos p:not(:last-child) {
  	margin-bottom: 1em;
}

/* textos > artículos */

.textos article {
    border: solid 1px red;
    padding: 1em;
    padding-top: 0;
    margin-bottom: 1em;
}

.textos article h4 {
    padding: 1em 0 .5em 0;
    margin-bottom: 1em;
    
    /* para salir del "flujo de información" del fondo 
    y colocase en una capa superior "pegajosa" */
    position: sticky;
    top: 0;
}





/*----------------
explorar
----------------
*/

.explorar {
    background-color: #54b4db;
    border: 4px red;
    border-radius: 50%;
    color: white;
    cursor: pointer;
    display: flex;
    width: 3rem;
    height: 3rem;
    text-decoration: none;
    
    /* para salir del "flujo de información" del fondo 
    y colocase en una capa superior fija */
    position: fixed;
    bottom: 1rem;
    right: 1rem;
    z-index: 9990;
    
    box-shadow: rgba(0,0,0, 0.8) 0px 0px 20px;
}

.explorar > i {
    
    width: 2rem;
    padding-top: .3rem;
    margin: auto;
    font-size: 2rem;
}

/*----------------
futsal.html
----------------
*/


#cajacontenedora{
    padding: 2em;
    margin: 0;
}

#color{
    background: linear-gradient(135deg, rgba(255,255,255,1) 0%, rgba(17,160,217,1) 100%);
}


#tamaniotop{
    padding-top: 2em; 
}

.otracaja{
    height: 15em;
    margin-top: -3em;
    margin-bottom: 3em;
    text-align: center;
}

img.futsal{
    padding: 1em;
}

.contenedorer {
  width: 18em;
  height: 218px;
}

.contenedorer img {
  position: absolute;
  left: 0;
  padding: 1em;
  margin-top: -2em;    
  transition: opacity 1.5s ease-in-out;
}

.contenedorer img.imagennoti:hover {
  opacity: 0;
}

.content {
  width:100%;
  height: 43em;
}

.titulovideo, .titulovideo1{
    padding: 1em;
    font-size: 1.2em;
    height: 4em;
    text-align: center;
    color: #ffffff;
    background: rgb(209, 45, 31);
    display: block;
}
.titulovideo1{
    margin-top: -1em;
}

.subtitulovideo, .subtitulovideoo{
    margin-top: .8em;
    margin-left: .4em;
    margin-bottom: .8em;
    padding: .3em;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 1em;
    text-align: center;
    color: red;
}

.horarios{
    margin: 8em 0 0 -1em;
}

.areatitulos{
    width: 100%;
    background: rgb(28, 161, 219);
    height: 2.5em;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    border-radius: 8px 8px 0px 0px;
    box-shadow: rgba(0,0,0, 0.8) 0px 0px 10px;
    color: white;
}

.entrenamiento{
    margin-top: 2em;
}

/* Style the tab */
.tab {
  display: flex;       
  width: 100%;    
  background-color: rgb(28, 161, 219);
  box-shadow: rgba(0,0,0, 0.8) 0px 0px 10px;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  outline: none;
  cursor: pointer;
  transition: 0.3s;
  font-size: .9em;
  text-transform: capitalize;
  color: white;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: rgb(28, 161, 219);
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: rgb(203, 21, 21);
}

/* Style the tab content */
/* Style the tab content */
.tabcontent {
  width: 100%;    
  border: 1px solid #ccc;
  box-shadow: rgba(0,0,0, 0.8) 0px 0px 10px;     
  border-top: none;
  background-color: aliceblue;
}

button.tablinks{
    margin: 0;
    padding: 0;
}

/* Style the close button */
.topright {
  float: right;
  cursor: pointer;
  font-size: 1em;
}

.topright:hover {color: red;}

.dt, .hora{
    display: block;
    margin: auto;
}

.h3titulo{
    font-size: 1.2em;
    font-weight: 900;
    color: black;
    text-transform: uppercase;
    text-align: center;
    margin-top: 1em;
}

h4.h4titulo{
    font-size: 1.2em;
    font-weight: 700;
    color: black;
    text-transform: uppercase;
    display: block;
    text-align: center;
    line-height: 3em;
}

.psecundario{
    font-size: 1em;
    font-weight: 300;
    padding: 0;
    margin-bottom: 1em;
    text-align: center;
}

.titulos{
    text-transform: capitalize;
    font-size: .85em;
    padding: .5em;
}

.contacto{
    display: flex;
    justify-content: center;
    background-color: rgb(203, 21, 21);
}

.futsallogo{
    display: block;
    width: 2em;
    margin-bottom: 1em;   
}

i.fab.fa-facebook, i.fab.fa-twitter{
    color: rgb(28,161,219);
    font-size: 2em;
}


i.fab.fa-facebook{
    padding-right: 2em;
}

h6.redessociales{
    font-size: 1em;
    text-align: center;
    margin: 0;
    padding: 1em;
    text-transform: capitalize;
    color: aliceblue;
}

/*
----------------------------------------
 modificaciones torneomunicipal.html
----------------------------------------
*/

div.participar, .participar1, .participar2{
    padding: .5em;
    text-align: center;
    text-transform: uppercase;
    width: 7em;
    margin-left: -.5em;
    color: aliceblue;
    background-color: rgb(33, 49, 92);
}
.participar1{
    margin-left: 7em;
}
.participar2{
    margin-left: -4em;
}

.vs {
    font-size: 0.7rem;
    color: black;
	text-align: center;
	font-weight: 800; 
}

#listadecalendario{
    font-size: 0.7rem;
    margin-top: 1em;   
    margin-bottom: 2em; 
}

.img-equipos{
   margin-left: -.8em;
}


#boton-formulario{
    width: 6em;
    height: auto;
    background-color: skyblue;
    border-radius: 2px;
    text-align: center;
    margin: auto;
    margin-top: 1.5em;    
}

#boton-formulario a{
    color: white;
    display: block;
    height: auto;
    width: 6em;
    text-decoration: none;
}

#boton-formulario a:hover{
    color: skyblue;
    background-color: white;
}

.calendario{
    background-color: whitesmoke;
    font-size: .6em;
    text-align: center;
    width: 100%;
    max-width: 80vh;
    margin: auto;
    border-collapse: collapse;
    text-transform: uppercase;
    margin-bottom: 2em;
    margin-top: 1em;
}
.barracalendario{
    background-color: skyblue;
    font-size: 1.5em;
}

.dom{
    color: red;
}

.seleccion{
    background-color: #30b5e0;
}

#listaeventos{
    font-size: .9em;
    text-align: left;
    padding-bottom: 2em;
    color: #30b5e0;
    width: 20em;

}
/*
----------------------------------------
 modificaciones torneodelclub.html
----------------------------------------
*/

#lista-torneodelclub{
    font-size: 0.8rem;
    text-align: left;
    margin-left: 1em;
}

.horarios{
    height: auto;
}

#coso{
    margin-top: 10px;    
    
}

/*posiciones de la tabla*/

.posiciones {
    margin: auto;
    width: 90%;
    height: auto
}
h3.posiciones{
    font-size: 1em;
    font-weight: 900;
    text-align: center;
    margin: 2em;
    margin-bottom: 2em;
    
}
.tabla {
    background-color: #e8edf0;
    font-size: .6em;
    text-align: left;
    width: 100%;
    border-collapse: collapse;
    text-transform: uppercase;
}
.tabla .barrasuperior {
    box-shadow: 0 .25em .25em 0; 
}
.equipo {
    padding-right: 6em
}

td {
    padding: .7em .5em .7em .5em
}
.puntos { 
    font-size: 1.5em;
    font-weight: 700;
}
.puntosestrella { 
    font-size: 1.5em;
    font-weight: 700;
    background-color: skyblue;
    color: rgb(203, 21, 21);
}
.nombre{
    display: inline-flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    font-weight: 700;
}

.nombre img {
    height: auto;
    width: 5em;
    padding: .5em;
}


/*
----------------------------------------
 modificaciones formulariotorneos.html y torneo simple
----------------------------------------
*/

.form{
    background-color: #C7E9FD;
    max-width: 300px;
    margin: auto;
    margin-top: 2em;
    margin-bottom: 2em;
    border-radius: 1em;
    padding: 1em;
    height: 26em;
}

.formulario{
    margin:auto;
    width: 250px;
    max-width: 30vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;

}

.radio{
    font-size: 0.8rem;    
    width: 250px;
    margin: 3em auto;
    text-align: center;
}

label{
   color: darkblue;
    font-size: 0.8rem;
    margin-bottom: 1em;
    margin-top: 1em;
}

.bordes{
    background-color: whitesmoke;
}

input{
    border: .5px solid dodgerblue;
    margin-bottom: .5em;
    padding: .4em;
    border-radius: 5px; 
    box-shadow: 1px 1px 1px dodgerblue;
}
input:focus{
    border-color:cyan;
    color: blue;
    box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.5);
}

button{
    background-color: #0e0e4a;
    color: aliceblue;
    width: 8em;
    height: auto;
    display: block;
    margin: 2em auto;
    text-align: center;
    padding: .7em;
    border-style: none;
}

button:hover{
    color: blue;
    background-color: white;
}

.lista-alquiler{
    list-style: circle;
    padding-top: 1em;
    padding-bottom: 1em;
    font-size: .8rem;
    color: skyblue;
    text-align: left;
    width: 300px;
    margin-left: 1.8em;
}

/*
----------------------------------------
 modificaciones anotado.html
----------------------------------------
*/


#confirmacion{
    text-align: center;
    font-size: .8em;
    margin-top: .5em;
	padding: 2em;
	background-color: #e8e8e8;
	margin-left: 1em;
	margin-right: 1em;
	border: solid .1em grey;
}

#contenedor{
    margin-top: 2em;
  	margin-bottom: 1em;
	text-align: center;
}


#inicio{
    color: white;
	text-align: center;
  	border-radius: 2px;
    padding: .5em;
    display: flex;
    justify-content: center;
    align-items: center;
}

#inicio:hover{
    color: skyblue;
    background-color: white;
}

/*
----------------------------------
 modificaciones al css del plugin
----------------------------------
*/

.bx-wrapper {
    background: none;
    border: none;
    margin-bottom: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    z-index: 0;
    height: 37.5em;
}

@media (max-width: 25.875em) {
    .bx-wrapper{
    height: 23em;    
    }
}

.bx-wrapper .bx-controls-direction a {
    top: 10px;
    margin: 0;
}

@media (min-width: 55em) {
    
    .bx-wrapper .bx-controls-direction a {
        top: 50%;
        margin-top: -16px;
    }
    
    .bx-wrapper .bx-prev { left: -38px; }
    .bx-wrapper .bx-next { right: -38px }
    
}

/*
-------------------------------------
galeria
-------------------------------------
*/

.galeriafotos {
    width: 100%;
    margin: auto;
    list-style: none;
    padding: .5em;
    box-sizing: border-box;
    
    border: solid 1px rgba(100, 100, 100, 0.5);
	box-shadow: 0 .2em .2em rgba(100, 100, 100, 0.5);
}

li.galeriafotos{
    margin: .5em;
}

img.galeriafotos{
    width: 9em;
    height: 9em;
}

/*Estilos del modal*/

.modal {
    display: none;
     align-items: center;
}

.modal:target {
    
    display: block;
    position: fixed;
    background: rgba(0,0,0,0.8);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
   
}

.modal h3 {
    color: #fff;
    font-size: 2em;
    text-align: center;
    margin: 1em 0;
}

.imagengaleria {
    width: 100%;
    
    
    display: flex;
    justify-content: center;
    align-items: center;
}

.imagengaleria a {
    color: #fff;
    font-size: 2em;
    text-decoration: none;
    margin: 0 .2em;
}

.imagengaleria a:nth-child(2) {
    margin: 0;
    height: 100%;
    flex-shrink: 2;
}

.imagengaleria img {
    width: 15em;
    height: 100%;
    max-width: 100%;
    border: .2em solid #fff;
    box-sizing: border-box;
}

.galeriacerrar {
    display: block;
    background: #fff;
    width: 1.2em;
    height: 1.2em;
    margin: 1em auto;
    text-align: center;
    text-decoration: none;
    font-size: 1.6em;
    color: #000;
    padding: .1em;
    border-radius: 50%;
    line-height: 1em;
}

/*
-------------------------------------
hashtag
-------------------------------------
*/

	.hashtag {
		color: skyblue;
		text-align: center;
		font-size: 1em;
		font-weight: 400;
        
}



/*
-------------------------------------
contacto
-------------------------------------
*/

	iframe {
		max-width: 100%;
    	height: auto;
}

	.contactodatos {
    	margin: 0.2;
    	padding: 0.9em;
  
}

.dejanostuconsulta2 {
    

		padding: 1em;
    margin:auto;
    width: 20em;
    max-width: 30vh;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
		
    
}

	.dejanostuconsulta {
    	max-width: 100%;
		padding: 1em;
		text-align: center;
        
       
}


	textarea {
       
	text-align: center;
           color: darkblue;
    font-size: 1rem;
  
        border: .2em solid dodgerblue;
    margin-bottom: .em;
    padding: .7em;
    border-radius: 1em;
}


   
        

        




		
