/*Llamar fuente desde google fonts*/
@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

@import url('banner.css');
@import url('menu.css');
@import url('blog.css');
@import url('info.css');
@import url('contacto.css');
@import url('redes.css');

body {
  font-family: 'Roboto', sans-serif;
}

/* El * significa que todos los elementos se ven afectados
El padding mueve hacia adentro los elementos
El margin mueve los elementos hacia afuera
top hacia arriba
botton hacia abajo
left izquiera
right derecha*/
*{
  padding: 0;
  margin: 0;
}

header{
  width: 100%;
  height: 50px;
  /*colores forma 1*/
  /*background: #333333;*/
  /*colores forma 2*/
  /*background: rgb(10,10,10);*/
  /*colores forma 3, con transparencia*/
  background: white;
  /*colores forma 4*/
  /*background: black;*/
  color: #000000;

  /*Para que el header permanezca fijo*/
  position: fixed;
  top: 0;
  left: 0;

  /*colocar menu encima de la imagen cuando este tamaño pequeño.... AL FINAL*/
  z-index: 100;
}

.contenedor{
  width: 98%;
  margin: auto;
}

h1{
  float: left;
}

header .contenedor{
  display: table;
}

section{
  width: 100%;
  margin-bottom: 25px;
}

#bienvenidos p{
  text-align: justify;
}

#bienvenidos h2{
  text-align: center;
  margin: 10px;
}