/* tablet.css
   hoja de estilo para tablet
   Ejercicio tema3 curso html5-css3-Javascript */

.marcoprincipal {
  display: flex;
  flex: row wrap;}

.fotocarnet {
  width: 30%;
  background-color: brown;
  margin: 0px;}

.titulo {
  width: 30%;
  background-color: beige;
  margin: 0px;
  padding: 20px;}

.navegacion {
  width: 40%;
  background-color: beige;
  margin: 0px;}

.curriculum {
  padding: 10px;
  background-color: blueviolet;}

ul {
  padding-left: 0px;
  list-style: none;}

li {
  border: solid;
  border-color: white;
  padding: 3px;}

a {
  text-decoration: none;
  color: white;
  display: block;
  padding: 4px;
  background-color: brown;
  border: solid;
  border-width: 2px;
  border-color: brown;}

a:hover {
  color: brown;
  background-color: white;}

img {
  width: 100%;}

.foto-main, .cancion-main, .video-main, .web-main {
  padding: 10px;}

.foto-main {
  background-color: violet;}

.fotos {
  display: flex;
  flex: row nowrap;}

.cancion-main {
  background-color: burlywood;}

.canciones {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;}

.video-main {
  background-color: mintcream;}

.videos {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;}

.foto, .cancion, .video {
  margin: 3px;
  align-self: center;}

.web-main {
  background-color: skyblue;}

.webincrus {
  width: 100%;}