*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html{
    height: 100%;
}
body, header, footer, main, section{
    background: #557B83;
    color: black;
    font-family: 'Roboto', sans-serif;
    border: 7px #39AEA9;
}
article, aside{
    background:#E5EFC1;
    border: 7px black;
}

/* Tamaño de las Imagenes , para que todas tengan el mismo alto*/
.carousel-item {
    height: 65vh;
    min-height: 100px;
    min-width: 300px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
  
  .card-columns .card {
    display: inline-block;
    width: 100%;
  }
  
  .card-img-top {
    width: 100%;
    height: 100px !important; 
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
  }
/*

.cabeza > div {
    display: block;
    padding: 3px;
    color: rgb(13, 4, 1);
    background: #A2D5AB;
    box-shadow: 5px 5px 10px rgba(0,0,0,.25);
} */
.izq {/*movimiento*/
    animation-duration: 4s;
    animation-name: mueveizq;
      }
  
  @keyframes mueveizq {
    from {margin-left: 100%; width: 0%; }
    to {margin-left: 0%;width: 100%; }
        0%   {color: red;}
        25%  { color: blue;}
        50%  {color: yellow;}
        75%  {color: green;}
        100% {color: brown;}
  }
.der {
    animation-duration: 4s;
    animation-name: mueveder;
}
  
  @keyframes mueveder
   { 
     from { margin-right: 0%; width: 0% ; }
     to {margin-right: 100%; width: 100%;}
        0%   {color: red;}
        25%  { color: blue;}
        50%  {color: yellow;}
        75%  {color: orange;}
        100% {color: purple;}
    }