body {
    font-family: "robotoregular", Arial, Helvetica, sans-serif;
    font-size: 16px;
    line-height: 1.75;
    color: #285B72;
    background: #fff;
}

a {
    text-decoration: none;
}

p {
    margin-bottom: 20px;
}

h1, h2, h3, h4, h5 {
    color: #002249;
    font-family: "robotobold", Arial, Helvetica, sans-serif;
}

h1 {
    font-size: 45px;
    line-height: 1.2;
    margin-bottom: 40px;
}

h2 {
    font-size: 35px;
    line-height: 1.25;
    margin: 0 0 30px;
}

h3 {
    font-size: 30px;
    line-height: 1.20;
    margin: 0 0 20px;
}

h4 {
    font-size: 20px;
    line-height: 1.20;
    margin: 0 0 20px;
}

ul, ol {
    padding: 0;
}

.btn,
.btn.filled {
    font-family: "robotobold", Arial, Helvetica, sans-serif;
    text-decoration: none;
    padding: 10px 20px;
    display: inline-block;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.btn {
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
    background: transparent;
}

.btn:hover {
    background: var(--primary-color);
    color: #fff;
}

.btn.filled {
    border: 1px solid var(--primary-color);
    background: var(--primary-color);
    color: #fff;
}

.btn.filled:hover {
    background-color: transparent;
    color: var(--primary-color);
}

.section--primary .btn {
    border: 1px solid #fff;
    color: #fff;
    background: transparent;
}
.section--primary .btn.filled {
    background-color: #fff;
    color: var(--primary-color);
}

/** FOOTER **/
.footer-holder {
    background-color: #101028;
    color: #B3B3B4;
    padding: 150px 0 80px;
}

.footer-holder .footer-title {
    font-size: 22px;
    line-height: 1.45;
    color: #fff;
    margin-bottom: 25px;
}

.footer-holder .footer-menu {
    list-style: none;
}

.footer-holder .footer-menu a,
.copyright a {
    color: #B3B3B4;
}

.copyright {
    margin-top: 20px;
    text-align: center;
}

table {
    width: 100%;
    border: 1px solid #e4e2da;
    margin: 20px 0;
}

table td,
table th {
    padding: 10px 15px;
    border: 1px solid #e4e2da;
}

table th {
    font: 17px "robotobold", Arial, Helvetica, sans-serif;
}

table tbody tr:nth-child(odd) {
    background: #f7f7f7;
}

table tbody tr:nth-child(even) {
    background: #fff;
}

table thead tr  {
    color: #fff;
    background: var(--primary-color);
}


@media only screen and (min-width: 768px) {
    .hero-image-holder {
        text-align: right;
    }
}

@media only screen and (max-width: 767px) {
    h1 {
        font-size: 30px;
    }

    
    h2 {
        font-size: 24px;
    }

    h3 {
        font-size: 20px;
    }
    
    h4 {
        font-size: 18px;
    }

    .footer-holder {
        padding: 80px 30px 80px;
    }

    table td,
    table th {
        padding: 10px 5px;
    }
}