*{
  margin:0;
  padding:0;
}

body{
  font-family: 'Ubuntu', sans-serif;
  background-color: #000000;
  color:white;
  font-size: 22px;
}

#container{
  display:grid;
  border: 1px solid red;
  grid-template-columns: 1fr 1fr 1fr 1fr     ;
  grid-template-rows: 10vh 7vh 35vh 3vh 7vh 35vh 3vh 7vh 35vh 3vh 7vh 35vh 30vh 1vh 200vh ;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  padding-left: 30px;
  padding-right: 30px;

}
#container .titulo{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/5;
  grid-row:1/2;
  grid-template-rows: 30px 2fr;
  margin: auto;
}

#container .titulo1{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:2/3;
  grid-template-rows: 30px 2fr;
}

#container .titulo2{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:2/3;
  grid-template-rows: 30px 2fr;
}

#container .titulo3{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:2/3;
  grid-template-rows: 30px 2fr;
}

#container .titulo4{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:2/3;
  grid-template-rows: 30px 2fr;
}
#container .celda1{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:3/4;
  grid-template-rows: 30px 2fr;
}

  #container .celda1 img{
  height: 100%;
  width: 100%;
  border-radius:22px;

}



#container .celda2{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:3/4;

}
  #container .celda2 img{
  height: 100%;
  width: 100%;
  border-radius:22px;

}



#container .celda3{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:3/4;
}
  #container .celda3 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}

#container .celda4{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:3/4;
}
  #container .celda4 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}
#container .titulo5{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:5/6;
  grid-template-rows: 30px 2fr;
}

#container .titulo6{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:5/6;
  grid-template-rows: 30px 2fr;
}

#container .titulo7{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:5/6;
  grid-template-rows: 30px 2fr;
}

#container .titulo8{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:5/6;
  grid-template-rows: 30px 2fr;
}


#container .celda5{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:6/7;
}
  #container .celda5 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda6{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:6/7;
}
  #container .celda6 img{
  height: 100%;
  width: 100%;

  border-radius:22px;
}



#container .celda7{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:6/7;
}
  #container .celda7 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda8{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:6/7;
}
  #container .celda8 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}
#container .titulo9{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:8/9;
  grid-template-rows: 30px 2fr;
}

#container .titulo10{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:8/9;
  grid-template-rows: 30px 2fr;
}

#container .titulo11{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:8/9;
  grid-template-rows: 30px 2fr;
}

#container .titulo12{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:8/9;
  grid-template-rows: 30px 2fr;
}
#container .celda9{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:9/10;
}
  #container .celda9 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda10{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:9/10;
}
  #container .celda10 img{
  height: 100%;
  width: 100%;

  border-radius:22px;
}



#container .celda11{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:9/10;
}
  #container .celda11 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda12{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:9/10;
}
  #container .celda12 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}


#container .celda13{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row: 12/13;
}
  #container .celda13 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda14{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row: 12/13;
}
  #container .celda14 img{
  height: 100%;
  width: 100%;

  border-radius:22px;
}



#container .celda15{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row: 12/13;
}
  #container .celda15 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}



#container .celda16{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row: 12/13;
}
  #container .celda16 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
}

#container .titulo13{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:1/2;
  grid-row:11/12;
  grid-template-rows: 30px 2fr;
}

#container .titulo14{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/3;
  grid-row:11/12;
  grid-template-rows: 30px 2fr;
}

#container .titulo15{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:3/4;
  grid-row:11/12;
  grid-template-rows: 30px 2fr;
}

#container .titulo16{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:4/5;
  grid-row:11/12;
  grid-template-rows: 30px 2fr;
}

#container .bunnytitulo {
  padding: 9px;
  margin: auto;
  background-color:none;
  border-radius: 5px;
  grid-column:2/4;
  grid-row: 14/15;
  grid-template-rows: 30px 2fr;
}
#container .bunnyfucker{
  padding: 9px;
  background-color:none;
  border-radius: 5px;
  grid-column:2/4;
  grid-row: 15/16;
}
  #container .bunnyfucker img{
  padding: inherit;
  height: 100%;
  width: 100%;
  border-radius:22px;
}

#container .dobletexto1{
  padding: 9px;
  background-color: none;
  border-radius: 5px;
  grid-column:2/4;
  grid-row:8/9;
}

#container .doble1{
  padding: 9px;
  background-color: none;
  border-radius: 5px;
  grid-column:2/4;
  grid-row:9/10;
}
  #container .doble1 img{
  height: 100%;
  width: 100%;
  border-radius:22px;
  }






  #cumtainer {
  display: grid;
  grid-template-columns: 1fr 2fr 1fr;
  grid-template-rows: 15vh 100vh;
  }

  #cumtainer .tituloarnau{
  grid-column: 1/4;
  grid-row: 1/2;
  margin: auto;
  text-align: center;
  }
  .textotituloarnau{
  font-size: 30px;

  }
  #cumtainer .loreoarnau{
  grid-column: 2/3;
  grid-row: 2/3;
  text-align: left;
  margin-top: 45px;
  margin-left: 50px;
  }
  #cumtainer .cartaoarnau img{
  grid-column: 1/2;
  grid-row: 2/3;
  border-radius: 12px;
  margin-left: 40px;
  margin-top: 30px;
  }