/* @import url('https://fonts.googleapis.com/css2?family=Lalezar&display=swap'); */
  @import url('https://fonts.googleapis.com/css2?family=Lalezar&family=Rubik:wght@300;400;500;600;700;800;900&display=swap');

/* common css color and space  */
:root{
    --blue: #4582FF;
    --orange: #FF7F46;
    --text: #636363;
    --heading-black: #0F2239;
    --white: #FFFFFF;
    
}
body {
    font-family: 'Rubik', sans-serif;
}
h1, h2, h3, h4, h5, h6{
    font-family: 'Lalezar', sans-serif;
    margin-bottom: 0;
}
.btn{
    border-radius: 30px;
    background: var(--orange);
    color: var(--white);
    border: 2px solid var(--orange);
    padding: 0.5rem 1.5rem;
    font-family: Rubik;
    font-size: 17px;
    font-style: normal;
    font-weight: 600;
    text-transform: uppercase;
}
.btn:hover{
    border: 2px solid var(--orange);
    background: transparent;
    color: var(--orange);

}
.pad-05{
    padding: 0.5rem 0;
}
.pad-1{
    padding: 1rem 0;
}
.pad-2{
    padding: 2rem 0;
}
.pad-25{
    padding: 2.5rem 0;
}
.pad-3{
    padding: 3rem 0;
}
.pad-4{
    padding: 4rem 0;
}
.pad-5{
    padding: 5rem 0;
}


.bg-purple{
    background-color: #8E56FF;
}
.bg-orange{
    background-color: #FF7F46;
}
.bg-blue{
    background-color: #5287F8;
}
.bg-green{
    background-color: #1AB69D;
}
.bg-pink{
    background-color: #FF5B5C;
}