* {
    box-sizing: border-box;
    margin: 0;
    padding: 1px;
}

body {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

html {
    width: 100%;
}

/* contenedor de todos los componentes*/
.container {
    border-radius: 60px;
    width: 100%;
    margin-top: 28%;
    padding: 10px;
}

/* encabezado logo*/
header {
    background-image: url(../img/cx_img_0001.jpg);
    width: 99%;
    height: 12%;
    position: fixed;
}

/* imagen */
img {
    width: 23%;
}

.cx_001 {
    width: 100%;
    margin-left: 5%;
}

h1 {
    color: #215a9d;
    font-size: 15px;
    font-weight: bolder;
}

h2 {
    color: #215a9d;
    margin: 1%;
    font-weight: bolder;
    font-size: small;
}

p {
    margin: 1%;
    text-align: justify;
    font-size: x-small;
}

b {
    font-size: 12px;
    text-align: justify;
}

ol {
    font-size: small;
}

td {
    width: 25%;
    font-size: x-small;
}

footer {
    width: 100%;
    margin: 0;
    background-color: white;
    color: #215a9d;
    text-align: center;
    font-size: 8px;
    bottom: 0;
    position: fixed;
}

@media screen and (min-width: 576px) {
    .container-sm, .container {
        max-width: 540px;
        margin-top: 12%;
    }

    header {
        width: 99.4%;
        height: 13%;
    }

    img {
        margin-top: 0%;
        width: 15%;
    }

    .cx_001 {
        margin-left: 10%;
    }

    h1 {
        color: #215a9d;
        font-size: 15px;
        font-weight: bolder;
    }

    h2 {
        color: #215a9d;
        margin: 1%;
        font-weight: bolder;
        font-size: small;
    }

    p {
        margin: 1%;
        text-align: justify;
        font-size: small;
    }

    b {
        font-size: 12px;
        text-align: justify;
    }

    ol {
        font-size: small;
    }

    .table {
        width: 95%;
        margin-left: 5%;
    }

    td {
        font-size: x-small;
    }

    footer {
        font-weight: bolder;
        font-size: 10px;
    }
}

@media screen and (min-width: 768px) {
    .container-md, .container-sm, .container {
        max-width: 720px;
    }

    header {
        width: 99.5%;
        height: 12.5%;
    }

    img {
        margin-top: 0%;
        width: 15%;
    }

    .cx_001 {
        margin-left: 17%;
    }

    h1 {
        color: #215a9d;
        font-size: 20px;
        font-weight: bolder;
    }

    .table {
        margin-left: 5%;
        width: 90%;
    }

    td {
        width: 40%;
        font-size: small;
    }

    footer {
        font-weight: bolder;
        font-size: 12px;
    }
}


@media screen and (min-width: 992px) {
    .container-lg, .container-md, .container-sm, .container {
        max-width: 960px;
    }

    header {
        width: 99.8%;
        height: 15.5%;
    }

    img {
        margin-top: 0%;
        width: 15%;
    }

    .table {
        margin-left: 15%;
        width: 65%;
    }

    td {
        width: 50%;
        font-size: small;
    }

    footer {
        font-weight: bolder;
        font-size: 12px;
    }
}

@media screen and (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1140px;
        margin-top: 8%;
    }

    header {
        width: 99.7%;
        height: 17.5%;
    }

    img {
        margin-top: 0%;
        width: 10%;
    }

    .cx_001 {
        width: 100%;
        margin-left: 40%;
    }

    h1 {
        font-size: 25px;
    }

    .table {
        margin-left: 20%;
        width: 60%;
    }

    td {
        width: 50%;
        font-size: small;
    }

    footer {
        font-weight: bolder;
        font-size: 12px;
    }
}

@media screen and (min-width: 1400px) {
    .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1320px;
    }

    .container {
        margin-top: 9%;
    }

    header {
        width: 99.8%;
        height: 16.5%;
    }

    img {
        margin-top: 0%;
        width: 10%;
    }

    .cx_001 {
        width: 100%;
        margin-left: 40%;
    }

    h1 {
        font-size: 35px;
    }

    h2 {
        color: #215a9d;
        margin: 1%;
        font-weight: bolder;
        font-size: medium;
    }

    p {
        margin: 1%;
        text-align: justify;
        font-size: small;
    }

    b {
        font-size: 12px;
        text-align: justify;
    }

    ol {
        font-size: small;
    }

    .table {
        margin-left: 20%;
        width: 60%;
    }

    td {
        width: 30%;
        font-size: medium;
    }

    footer {
        font-weight: bolder;
        font-size: 14px;
    }
}