/*------------------------------------------------------------------
[Table of contents]

1. h1
2. h2
3. h3
4. h4
5. p
6. get-started-btn
7. padding-top
8. padding-bottom
9. dotted-img

-------------------------------------------------------------------*/

h1{
    font-size: 70px;
    color: var(--primary--color);
    line-height: 70px;
}
h2{
    font-size: 50px;
    line-height: 50px;
}
h3{
    font-size: 36px;
}
h4{
    font-size: 24px;
    line-height: 50px;
}
p{
    font-size: 18px;
    line-height:26px;
    color: var(--text-color);
}
h3{
    font-size: 36px;
    color: var(--primary--color);
    line-height: 40px;
}
.get-started a{
    padding: 17px 51px 16px 52px;
    background: var(--accent-color);
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    color: var(--secondary--color);
    text-decoration: none;
    box-shadow: 1px 1px 30px 0px rgb(0 0 0 / 20%);
    border-radius: 0 30px 30px 30px;
    transition-duration: .3s;
    transition-property: transform;
    transition-timing-function: ease-out;
}
.get-started a:hover{
    background: var(--text-color);
    transform: translateY(-8px);
}
.padding-top{
    padding-top: 120px;
}
.padding-bottom{
    padding-bottom: 120px;
}
.generic a{
    padding: 15px 49px 14px 50px;
    display: inline-block;
    font-weight: 500;
    font-size: 18px;
    text-decoration: none;
    border: 2px solid var(--text-color);
    border-radius: 0 30px 30px 30px;
    color: var(--text-color);
    transition-duration: .3s;
    transition-property: transform;
    transition-timing-function: ease-out;
}
.generic a:hover{
    border-color: var(--accent-color);
    background: var(--accent-color);
    color: var(--secondary--color);
    transform: translateY(-8px);
}
.genric-heading h2,
.help-right-con h2{
    font-weight: 700;
    margin-bottom: 28px;
    display: inline-block;
}
.genric-heading h2:after,
.help-right-con h2 span::after,
.work-portfolio-box-content h3::after,
.testimonials-content h2 span:after,
.project-con h2 span:after{
    content: "";
    position: absolute;
    width: 100%;
    height: 7px;
    background: #cef2e5;
    bottom: 6px;
    left: 0;
    z-index: -1;
}
.genric-heading p{
    font-weight: 400;
}
.genric-heading{
    margin-bottom: 76px;
}
.dotted-img::before{
    content: "";
    width: 916px;
    height: 659px;
    background: url(../image/dotted-img.png) no-repeat top left;
    background-size: cover;
    position: absolute;
    top: 0;
    left: -495px;
    z-index: -1;
}
.overflow{
    overflow: hidden;
}
