@import url('fonts.css');
@import url('header.css');

/* BASE
------------------------------------- */
html,
body {
    color: #313a3c;
    font-family: 'Montserrat';
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'URW Form Expand';
    color: #161a1b;
    font-style: normal;
    font-weight: 700;
}

h1 {
    font-size: 64px;
    line-height: 120%;
}

h2 {
    font-size: 45px;
    line-height: 124%;
}

h3 {
    font-size: 32px;
    font-weight: 700;
    line-height: 130%;
}

h4 {
    font-size: 23px;
    line-height: 138%;
}

a[class*='main-btn'],
a[class*='btn'],
button[class*='btn'],
.modal .main-btn {
    font-family: 'Montserrat';
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 160%;
    letter-spacing: 1.15px;
    text-transform: uppercase;
    padding: 10px 35px;
    border-radius: 0;
    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
    background: transparent;
}

.data-modal a,
.main-btn,
a.main-btn,
.bp-forms-btn,
a.bp-forms-btn,
.bp-submit-wrap button[type='submit'] {
    color: #af8229;
    border: 3px solid;
    border-image-slice: 1;
    border-width: 3px;
    border-image-source: linear-gradient(to right, #af8229, #c4993c, #a77720);
}

.data-modal a:hover,
.main-btn:hover,
a.main-btn:hover,
.bp-forms-btn:hover,
a.bp-forms-btn:hover,
.bp-submit-wrap button[type='submit']:hover {
    border: 0;
    background: linear-gradient(to left, #00acd7 17.94%, #004e7d 91.55%);
    color: #fff;
    padding: 13px 38px;
    transition: color ease-in-out 0.5s;
}

.main-btn:visited,
.bp-submit-wrap button[type='submit']:visited {
    color: #af8229;
}

.main-btn2,
a.main-btn2 {
    border: 0;
    background: linear-gradient(to left, #00acd7 17.94%, #004e7d 91.55%);
    color: #fff;
    padding: 13px 38px;
}

.main-btn2:hover,
a.main-btn2:hover {
    color: #af8229;
    border: 3px solid;
    background: transparent;
    border-image-slice: 1;
    border-width: 3px;
    border-image-source: linear-gradient(to right, #af8229, #c4993c, #a77720);
    padding: 10px 35px;
    transition: color ease-in-out 0.5s;
}

.main-btn2:visited {
    color: #fff;
}

.main-btn3,
a.main-btn3 {
    border: 3px solid white;
    color: #fff;
    background: transparent;
}

.main-btn3:hover,
a.main-btn3:hover {
    color: #af8229;
    border: 3px solid;
    background: transparent;
    border-image-slice: 1;
    border-width: 3px;
    border-image-source: linear-gradient(to right, #af8229, #c4993c, #a77720);
    transition: color ease-in-out 0.5s;
}

.main-btn3:visited {
    color: #fff;
}

.main-btn4,
a.main-btn4 {
    background: #fff;
    border: 3px solid #fff;
    color: #004e7d;
}

.main-btn4:hover,
a.main-btn4:hover {
    color: #fff;
    background: transparent;
    transition: color ease-in-out 0.3s;
}

.main-btn4:visited {
    color: #004e7d;
}

.modal .main-btn.transition {
    transition: color ease-in-out 0.3s;
}

.secondary-link {
    color: #768286;
    font-weight: 600;
}

article a,
a:visited {
    color: #00acd7;
}

@media (max-width: 767px) {
    html,
    body {
        font-size: 18px;
    }

    h1 {
        font-size: 38px;
    }

    h2 {
        font-size: 32px;
    }

    h3 {
        font-size: 24px;
    }

    h4 {
        font-size: 23px;
    }

    a[class*='main-btn'],
    a[class*='btn'],
    button[class*='btn'],
    .modal .main-btn {
        font-size: 15px;
        letter-spacing: normal;
        line-height: 1.7;
    }
}

@media (max-width: 600px) {
    .main-btn,
    a.main-btn,
    .secondary-btn,
    a.secondary-btn,
    .main-btn + .secondary-link,
    .main-btn + .secondary-btn {
        max-width: 400px;
    }
}
