.proyectos {
	background-color: brown;
	width: 90%;
	margin: auto;
	padding: 1%;
}

.divContenedorProyectos {
	background-color: yellow;
	position: relative;
	width: 85%;
	margin: 2% auto;
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-rows: auto;
	gap: 15px;
}

.proyecto {
	display: grid;
	grid-template-columns: 40% 60%;
	grid-template-rows: auto;
	grid-template-areas: 
		"titulo titulo"
		"img desc"
		"img tecnologias"
		"img buttons";
	border: solid 2px black;
	border-radius: 10px;
	align-items: center;
	padding: 1%;
}

.proyecto h4{
	background-color: red;
	grid-area: titulo;
	text-align: center;
	padding: 1%;
}

.proyecto img.imgProyecto{
	background-color: white;
	grid-area: img;
	width: 98%;
	margin: 5% auto;
}

.proyecto p{
	grid-area: desc;
	padding: 1%;
}

.proyecto .divTecnologias{
	grid-area: tecnologias;
}

.proyecto  .divButtonsProyecto{
	background-color: blue;
	grid-area: buttons;
	align-self: end;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 20px;
}

.proyecto  .divButtonsProyecto a.aButtonIrProyecto {
	display: flex;
    align-items: center;
    justify-content: flex-start;

	border: none;
	border-radius: 5px;
	padding: 2% 5%;

	font-size: 17px;
	font-family: 'Source Sans Pro', sans-serif;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	white-space: nowrap;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: #04AA6D;
	color: #ffffff;
}

.proyecto .divButtonsProyecto a.aButtonIrCodigo{
	width: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    flex-wrap: nowrap;

	border: none;
	border-radius: 5px;
	padding: 2% 5%;

	font-size: 17px;
	font-family: 'Source Sans Pro', sans-serif;
	text-decoration: none;
	text-align: center;
	cursor: pointer;
	white-space: nowrap;

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	background-color: green;
	color: #ffffff;
}

.proyecto .divButtonsProyecto a.aButtonIrCodigo .divContainerIcon {
    width: 15px;
/*    width: 20%;*/
    display: flex;
    justify-content: center;
    align-items: center;
}

.proyecto .divButtonsProyecto a.aButtonIrCodigo .divContainerIcon img.icon {
	width: 100%;
    height: auto;
    filter: invert(1);
}