html {
    font-size: 18px;
    scroll-behavior: smooth;
}

body {
    padding: 0;
    margin: 0;
    font-size: 18px;
    color: $body-color;
    line-height: $lh-p;
    overflow-x: hidden;
    font-family: $body;
    background: #f0f5fc;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
    color: $title-color;
    font-family: $heading;
    a {
        color: $title-color;
        &:hover {
            color: $theme-color;
        }
    }
}
h1 {
    font-size: 42px;
}
h2 {
    font-size: 36px;
    line-height: 46px;
    margin-top: -16px;
}
h3 {
    font-size: 28px;
    line-height: 38px;
    margin-top: -14px;
    font-weight: 600;
}
h4 {
    font-size: 24px;
    line-height: 28px;
    margin-top: -9px;
    font-weight: 600;
}
h5 {
    font-size: 20px;
    line-height: 26px;
    margin-top: -9px;
    font-weight: 600;
}
h6 {
    font-size: 18px;
    margin-top: -7px;
    font-weight: 500;
}
p {
    margin-top: -12px;
    &:last-child {
        margin-bottom: -7px !important;
    }
    a {
        color: $theme-color;
        &:hover {
            color: $theme-color;
        }
    }
    @include breakpoint(max-sm) {
        font-size: 16px;
    }
}

@include breakpoint (md) {
    h1 {
        font-size: 80px;
    }
    h2 {
        font-size: 54px;
        line-height: 64px;
        margin-top: -20px;
    }
    h3 {
        font-size: 36px;
        line-height: 46px;
        margin-top: -16px;
    }
    h4 {
        font-size: 28px;
        line-height: 38px;
        margin-top: -14px;
    }
    h5 {
        font-size: 24px;
        line-height: 28px;
        margin-top: -9px;
    }
    h6 {
        font-size: 20px;
        line-height: 26px;
        margin-top: -9px;
    }
}
a {
    display: inline-block;
    @include transition($transition);
    &:hover {
        text-decoration: none;
        color: inherit;
    }
}
ul {
    margin: 0;
    padding: 0;
    li {
        list-style: none;
        padding: 5px 0;
    }
}

select,
input,
textarea,
button {
    width: 100%;
    background-color: $white-color;
    border: 1px solid $border-color;
    outline: none;
}
textarea {
    height: 200px;
    resize: none;
    padding: 10px;
}
input,
button,
select {
    height: 50px;
    color: $body-color;
}
label,
button,
select {
    cursor: pointer;
}
input {
    background: #f4f4f4;
    border: 1px solid transparent;
    @include border-radius(5px);
    padding-left: 10px;
    &:focus {
        border: 1px solid $theme-one;
    }
    &[type="submit"] {
        cursor: pointer;
        background-color: $primary-color;
        color: $white-color;
        font-weight: 700;
        padding: 0;
    }
}
.bg_img {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}
.right_center {background-position: right center;}
.left_center {background-position: left center;}
.bottom_center {background-position: bottom center;}
.bottom_left {background-position: bottom left;}
.bottom_right {background-position: bottom right;}
.top_center {background-position: top center;}
.top_left {background-position: top left;}
.top_right {background-position: top right;}
.bg_contain {background-size: contain}