@import url('https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100;0,300;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo+2:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@200;300;400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300&display=swap');

/* barra superior  */
header { background-color: black;
        padding: 0.8rem; text-align: center; font-family: 'Mukta', sans-serif;
         }

.boton-barra { text-decoration: none; 
                color: white; 
                padding: 1rem;  
                
 }
/* fin barra superior */



/* foto perfil */
.foto {
border-radius: 100%;
margin: auto;
display: block;
margin-top: 4rem;
margin-bottom: 2rem;
width: 200px;
height: 200px;
    }
/* fin foto perfil*/


/* epigrafe */ 
body h1{font-family: 'Exo 2', sans-serif; color:black; text-align: center; margin: 0.5rem }
body h2 { font-family: 'Source Code Pro', monospace; color:black; text-align: center; font-size: 0.9rem; margin: 0.1rem}
/* fin epigrafe*/


/* materias cursadas */
body h3{font-family: 'Mukta', sans-serif; font-weight: 500; font-size: 1.4rem; color:black; margin-bottom: 2rem; margin-top: 6rem; }
/* fin materias cursadas */

body{background: #ded6d6; }

/* ambos listados de materias */

section {font-family: 'Mukta', sans-serif; font-weight: 300; font-size: 1rem;}
section p {font-family: 'Mukta', sans-serif; font-weight: 500; font-size: 1.2rem;}

/*borre columnas porque en mbile no uso*/
/* fin ambos listados de materias */

/* catedra cuatrimestre */

h4 {font-family: 'Mukta', sans-serif; font-weight: 600; font-size: 1rem; text-align: center; padding-bottom: 0rem; padding-top: 3rem;}



/* compa */
.compa { text-decoration: none; 
                color: black; 
                padding: 2rem; }

.ex-ol {list-style-type: none; }

/* fin compa */

footer {font-size: 0.7rem; color: darkslategray;  text-align: center;}

.ubadgpc {font-family: 'Mukta', sans-serif; font-weight: 300; font-size: 1rem; color: black;  text-align: center; margin-bottom: 5rem;}

.logo {
margin: auto;
display: block;
margin-top: 0;
margin-bottom: 0;
width: 200px;
height: 200px;
    align-content: center;
    }


.integrantes {font-family: 'Mukta', sans-serif; font-weight: 500; background: grey; 
    display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: stretch;
	align-content: stretch;}

.ex-ol li {font-family: 'Mukta', sans-serif; font-weight: 400; text-align: center;}

footer p {font-family: 'Roboto Condensed', sans-serif; }



/* !!!!!!!!!!!!!!!!!!!!!!de acá en adelante igual que mobile pero en desktop va a haber estas modificaciones!!!!!!!!!!!!!! */






@media (min-width:576px) {

    
    header { background-color: black;
        padding: 0.8rem; 
        text-align: center; }

.boton-barra { text-decoration: none; 
                color: white; 
                padding: 5rem; }
    
    
    
    
    body {background: #ded6d6; }
    /* materias cursadas */
body h3{color:black; margin-bottom: 2rem; margin-top: 6rem; }
/* fin materias cursadas */

body{ background: #ded6d6; }

/* ambos listados de materias */
section {display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: stretch;
	align-content: stretch;}

article { margin: 0 0 0 3rem; }


ul li {text-align: left; }


/* fin ambos listados de materias */
    
    /* INTEGRANTES*/
    .integrantes  {display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: stretch;
	align-content: stretch;}



  

.ex-ol li { display: inline-block; width: 15%; text-align: center; padding: 1%;   }
.ex-ol { text-align: center; padding: 0; }

.compa { text-decoration: none; 
                color: black; 
                padding: 2rem; }
    /*FIN INTEGRANTES*/
    
    
    
    }