.container{
	display: grid;
	grid-template-columns: 40% 30% 30%;
	grid-template-rows: 400px 400px;
	
}
.item1{
	background-color: red;
}

.item2{
	background-color: green;
}

.item3{
	background-color: blue;
}

.item1,.item2,.item3 {
	color: black;
	background-color: white;
	
}
.item1{
 grid-row: 1/3 ;
}
.item3{
	grid-row: 2/3;
	grid-column: 2/4;
}
.item2{
	grid-row: 1/2;
	grid-column: 2/3;
}
.item2 img{
	height: 100%;
	border-style: dashed;
	border-width: 10px;
	border-color: grey;
}

.item2 img:hover{
	height: 80%;
}

body{
	margin: 0;
	font-family:sans-serif ;
}
header{
	background-color: skyblue;
	color: white;
	padding: 20px;
	text-align: center
}
footer{
	background-color: #3bff18;
	color: white;
	text-align: center;
	padding: 10px;
}


body {
font-family: Arial;
text-align: center;
}
.container {
display: flex;
justify-content: center;
gap: 20px;
}
.box {
width: 200px;
padding: 10px;
border: 3px solid black;
}
.box1 { background-color: Lightgreen;
}
.box2 { background-color: red; }

.box3 { background-color: Lightgreen; }

.inner {
border: 3px solid black;
padding: 10px;
margin-top: 10px;
}
body{
  margin: 0;
  font-family: sans-serif;
  background-color: #4e8272;
}
header{
   font-size: 30px;
 line-height: ;
  color:blue ;
  padding: 20px ;
  text-align: center;
}

header:hover h1{
	color: black;
	font-size: 70px;
}

footer a{
	color: red;
	font-size: 20px;
}
.intro p{
	font-size: 30px;
}
.foto2{
	width: 500px;
}
.foto2:hover{
	width: 600px;
}
footer h1:hover{
	color: red;
}

.nostress{
	color:red ;
	font-size: 59px;
	text-shadow: 5px 5px 2px black;
}