@charset "UTF-8";
/* CSS Document */

/*Fuente Roboto, fonts-wights: 300 (light), 400 (regular), 700 (bold)*/
@font-face {
    font-family: 'robotobold';
    src: url('../Fuente/roboto-bold-webfont.woff2') format('woff2'),
         url('../Fuente/roboto-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotolight';
    src: url('../Fuente/roboto-light-webfont.woff2') format('woff2'),
         url('../Fuente/roboto-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotoregular';
    src: url('../Fuente/roboto-regular-webfont.woff2') format('woff2'),
         url('../Fuente/roboto-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/*------------------Reglas CSS------------------*/
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
	font-family: sans-serif;
}

body{
    font-family: 'robotoregular' sans-serif;
    color: red;
}

.logo {float: left;justify-content: flex-start;align-content: flex-start;background:silver;padding: 8px;}


/*---------header---------*/

header{
	height: 50px;
	background: silver;
	color:red;
	display: flex;
	justify-content: flex-end;
	padding: 10px;
	margin-bottom: 50px;
	overflow: hidden;
}

#btn-menu{
	display: none;
	float: left;
	
}

header label{
	font-size: 30px;
	cursor: pointer;
	display: none;
}

.menu ul{
	background: silver;
	display: flex;
	list-style: none;
	
}


.menu a{
	display:block;
	padding: 5px 5px;
	color:white;
	text-decoration: none;
}

.menu a:hover{
	background: rgba(241,0,4,0.61)
}

@media(max-width:700px){
	header label{
		display:block;
	}
	.menu{
		position: absolute;
		top:50px;
		left: 100%;
		width: 30%;
		position: fixed;
		transform: translateX(-100%);
		transition: all 0.3s;
		overflow: scroll;
		
	}
	
	
	
	#btn-menu:checked ~ .menu{
		transform: translateX(0%);
	}
	
	.menu ul{
		display: block;
		background: silver;
	}
}



/*
nav{
    margin: 0; 
    padding: 0; 
    width: 100%;
    background:#DCDCDC;
    margin-bottom: 50px;
}

nav li{
    display: inline-block;
    font-size: 12px;
}

nav li a{
    padding: 10px 20px;
    display: inline-block;
    justify-content: space-between; 
    align-content: space-between; 
    align-items: center; 
    flex-direction: row; 
    flex-wrap: nowrap;
    font-family: 'robotobold', sans-serif;
	text-decoration: none;
	color: orange;
}
nav li a:hover{color: yellow;}----*/


/*---------main---------*/
.presentacion {
    text-align: justify;
    width: 50%;
    margin: auto;
    margin-top: 2em;
    color: black;
    font-family: 'robotolight', sans-serif;
    font-size: .8em;
}

.Fotos{
    width: 100%;
}

.Fotosintegrantes{
    display: block;
    margin: auto;
    border-radius: 30px;
    margin-bottom: 2em;
}

.club{letter-spacing: 2px;}

h2{
    text-align: center;
    font-size: 15px;
}

.Nombres{
    font-family: 'robotoregular', sans-serif;
	
}

.integrantes a{text-decoration: none;color: orangered;}
.integrantes a:hover{color: grey;}

 main h1{
     text-align: center;
     display: flex;
     justify-content: center;
     align-content: center; 
     flex-direction:row; 
     flex-wrap:nowrap; 
     align-items: center; 
     margin-bottom: 30px;
}

h1{
    background-color: #DCDCDC;
    padding: 10px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 40px;
    text-align: center;
    font-family: 'robotobold', sans-serif;
}


#Grupo{
    background-color: #DCDCDC;
    padding: 10px;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 40px;
    font-size: 25px;
    margin-top: 2em;
    font-family: 'robotobold', sans-serif;
    margin-bottom: 1em;
}




.Grupo{
    background-color: #DCDCDC;
    padding: 10px;
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    border-radius: 40px;
    font-size: 25px;
    margin-top: 2em;
    font-family: 'robotobold', sans-serif;
    margin-bottom: 1em;
}

h3{
    text-align: center;
    font-size: 1.3em;
    font-family: 'robotoregular', sans-serif;
}


/*---------Info UBA---------*/
.contenedor2{
    display: flex;background: #DCDCDC;
    padding: 0;
    padding-top: 1em;
    width: 100%; 
    justify-content:center; 
    flex-wrap: nowrap; 
    word-wrap: break-word;
    margin-top: 50px;
}

.contenedor2 li a, .uno img{
    width: 50px;
}

.contenedor2 li a, .dos img{
    width: 240px;
}

.contenedor2 li a, .tres img{
    width: 60px
}

.contenedor2 li{
    display:flex; 
    justify-content:flex-start;
    align-content: flex-start; 
    align-items: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
    font-size: 10px; 
    color: black;
    padding: 10px;
    word-wrap: break-word;
}

.contenedor2 h3{
    color: black;
}

.img1{width: 50px;}
.img2{width: 50px;}
.img3{width: 50px;}




/*------------------------------------mapa------------------*/


figure img{max-width: 100%; height: auto;display: block;
    margin: auto;
    margin-bottom: 2em;}





/*---------footer---------*/
footer{
    display: flex; 
    background: #0F0E0E; 
    padding: 20px;
    text-align: center; 
    font-size: 9px;
    word-wrap: break-word;
    justify-content: center;
    align-content: center; 
    align-items: center;
    flex-wrap: nowrap;
}