:root{
    /* COLORS */
    --primary-color: #BD0000;
}

/* LINK TEXT WITH TAG <a> */
a{
    outline: none;
    text-decoration: none;
    cursor: pointer;
    color: inherit;
}

/* STYLING ERRORS */
body{
    margin:0;
    font-size: 16px;
    color: #333;
    line-height: 1.4em;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 400;
    background: #ececec;
}

main, section, article, aside, nav, header, footer {
    display: block;
}

main, section, article, aside, nav, header, footer, div, input, label {
    position: relative;
    height: auto;
    overflow: hidden;
}

img{
    border: none;
    display: block;
}

h1 {
    line-height: 1.4em;
}

p {
  margin: 0 0 10px;
}

/* Margenes */

.mt-20 { margin-top: 20px; }

/* Colores */
.primary { color: var(--primary-color); }
.red { color: red; }

/* genericos */
.left{ float: left; }
.none { display: none; }
.bold{ font-weight: 600; }
.underline { text-decoration: underline; }


#content, #header, #footer {
    width: 100%;
    min-width: 320px;
}

/* PAGINA */

header {
    background: #333;
    color: #FFF;
}

.panel-logo {
    padding: 1em 2em;
}

.panel-cab, .panel-cuerpo{
    max-width: 100%;
    padding: 1em 2em;
    margin: 3em auto 0 auto;
    color: #FFF;
    background: #333;
}
.panel-cab h1 {
    font-size: 2em;
    margin: 0.5em 0;
    font-weight: 300;
}
.panel-cuerpo {
    background: #FFF;
    color: inherit;
    margin: 0 auto 50px auto;
    padding: 1em 2em 1em 2em;
    border: 1px solid #d0d0d0;
}

@media (min-width: 660px) {
    .panel-cab, .panel-cuerpo{
        max-width: 80%;
    }
}