/* CSS Document */
* {margin: 0; padding: 0;}

@import url(https://fonts.googleapis.com/css?family=Dosis:300,700,500,800);

img#banner{max-width: 54rem; margin-top: 2rem}

img#bannerLAT{
              border-radius: 10px 10px 10px 10px;
              border: 0px solid #000000;
              }

.icogran{margin: 6rem 0rem 0rem 0rem}

h3#titular{text-align: center; padding: 0.5rem; color: #B3DEE5}

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

nav { background-color:#E45d51; width: 100%;
      padding: 1rem 1rem 1rem 1rem;
      display: -webkit-flex;
      display: flex;
      -webkit-flex-flow: row wrap;
     flex-flow: row wrap}

nav ul {list-style-type: none;
        font-size: 0rem;}

nav ul li{display: inline-block;
        font-size: 0.9rem;
        letter-spacing: 0.1rem;
        font-weight: bolder;}

nav ul li a{color: #F3F6E1; 
            text-decoration: none;
            padding: 1rem;
            max-width: 23%;
            }

.titular{min-width: 20rem;
         max-width: 50rem;
         font-weight: 300}

.container {
    min-width: 20rem;
    max-width: 50rem;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}

@media (min-width: 37.5rem) {
  .container-inner { width: 100%; }
}

h3{font-size: 1.5rem}
p{font-size: 0.95rem}

.container-inner {
    
    display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
}

.col1{ border: 1rem; background-clip; margin: 0.5rem;
        margin-top: 3rem}
.col2{ margin: 3rem 0.5rem 3rem 0.5rem}
.col3{ margin: 0.5rem; margin-top: 3rem}


@media (min-width: 37.5rem) {
  .col1 { width: 97%; }
  .col2 { width: 30%; }
  .col3 { width: 57%; }
 }


@media (min-width: 50rem) {
  nav, footer, .container {
    width: 100%rem;
    margin-left: auto;
    margin-right: auto;
  }
}

footer { background-color:#E45d51;
         padding: 1rem 1rem 1rem 1rem;
         color:#F3F6E1;
         text-align: center;}