/* Box */
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

/* Open Sans Font Family*/
@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/open-sans/OpenSans-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Open Sans';
  src: url('../fonts/OpenSans/OpenSans-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}

/* Plus Jakarta Sans Font Family*/
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-ExtraLight.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-ExtraLightItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-LightItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-MediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-SemiBoldItalic.ttf') format('truetype');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-BoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('../fonts/Plus_Jakarta_Sans/PlusJakartaSans-ExtraBoldItalic.ttf') format('truetype');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}


:root {
    --bs-font-heading: "Plus Jakarta Sans", sans-serif;
    --bs-font-body: "Open Sans", sans-serif;
    --bs-font-ExtraLight: 100;
    --bs-font-Light: 300;
    --bs-font-regular: 400;
    --bs-font-medium: 500;
    --bs-font-semibold: 600;
    --bs-font-bold: 700;
    --bs-font-extrabold: 800;
    --bs-heading-color: #031621;
    --bs-body-color: #505050;
    --bs-Netural-White: #FFFFFF;
    --bs-Yellow-50: #FFFCEB;
    --bs-Yellow-100: #FFF5BE;
    --bs-Yellow-200: #FFEE91;
    --bs-Yellow-300: #FFE864;
    --bs-Yellow-400: #FFE137;
    --bs-Gray-50: #F8F8F8;
    --bs-Gray-100: #E4E4E4;
    --bs-Gray-200: #D0D0D0;
    --bs-Gray-300: #BBBBBB;
    --bs-Gray-400: #A7A4A4;
    --bs-Gray-500: #928E8E;
    --bs-Gray-600: #7E7878;
    --bs-Gray-700: #6A6363;
    --bs-Gray-800: #554E4E;
    --bs-Blue-Primary-50: #EDF6FF;
    --bs-Blue-Primary-100: #CEE6FF;
    --bs-Blue-Primary-200: #AFD5FF;
    --bs-Blue-Primary-300: #90C5FF;
    --bs-Blue-Primary-400: #71B5FF;
    --bs-Blue-Primary-500: #51A5FF;
    --bs-Blue-Primary-600: #3288E4;
    --bs-Blue-Primary-700: #1666BB;
    --bs-Blue-Primary-800: #034892;
    --bs-Blue-Primary-900: #003369;
    --bs-Green-Primary-50: #F4FFF9;
    --bs-Green-Primary-100: #D3FFE9;
    --bs-Green-Primary-200: #B2FFD8;
    --bs-Green-Primary-300: #91FFC8;
    --bs-Green-Primary-400: #7CE7B1;
    --bs-Green-Primary-500: #66CA98;
    --bs-Green-Primary-600: #52AD7F;
    --bs-Green-Primary-700: #3F9067;
    --bs-Green-Primary-800: #2F7251;
    --bs-Green-Primary-900: #20553B;
    --bs-Pink-Primary-50: #FFEAF3;
    --bs-Pink-Primary-100: #FFBCD7;
    --bs-Pink-Primary-200: #FF8EBC;
    --bs-Pink-Primary-300: #FF5FA0;
    --bs-Pink-Primary-400: #FF3185;
    --bs-Pink-Primary-500: #DD1F6C;
    --bs-Pink-Primary-600: #BB1056;
    --bs-Pink-Primary-700: #990541;
    --bs-Pink-Primary-800: #770031;
    --bs-Pink-Primary-900: #550023;
    --bs-Violet-50: #FCF8FF;
    --bs-Violet-100: #EDD9FF;
    --bs-Violet-200: #DFBAFF;
    --bs-Violet-300: #C7A3E5;
    --bs-Violet-400: #AF8DCC;
    --bs-Violet-500: #9777B2;
    --bs-Violet-600: #806399;
    --bs-Violet-700: #6A5080;
    --bs-Violet-800: #543E66;
    --bs-Violet-900: #3E2D4D;
    --bs-Orange-50: #FFF6EC;
    --bs-Orange-100: #FFE3C2;
    --bs-Orange-200: #FFD099;
    --bs-Orange-300: #FFBD6F;
    --bs-Orange-400: #FFAA45;
    --bs-Orange-500: #DD8E31;
    --bs-Orange-600: #BB7420;
    --bs-Orange-700: #995C13;
    --bs-Orange-800: #774509;
    --bs-Orange-900: #552F02;
}

/* heading Styling */
h1.large01{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-bold);
  line-height: 1.2em;
  font-size: 92px;
  color: var(--bs-heading-color);
}

h1.large02{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.1em;
  font-size: 80px;
  color: var(--bs-heading-color);
}

h1.large03{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.11em;
  font-size: 72px;
  color: var(--bs-heading-color);
}

h1{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.07em;
  font-size: 56px;
  color: var(--bs-heading-color);
}

h2.large{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.17em;
  font-size: 48px;
  color: var(--bs-heading-color);
}

h2{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.2em;
  font-size: 40px;
  color: var(--bs-heading-color);
}

h3{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.22em;
  font-size: 36px;
  color: var(--bs-heading-color);
}

h4{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.25em;
  font-size: 32px;
  color: var(--bs-heading-color);
}

h5{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.33em;
  font-size: 24px;
  color: var(--bs-heading-color);
}

h6{
  font-family: var(--bs-font-heading);
  font-weight: var(--bs-font-semibold);
  line-height: 1.2em;
  font-size: 20px;
  color: var(--bs-heading-color);
}

/* Body Font Styling */
p.small{
    font-family: var(--bs-font-body);
    font-size: 14px;
    line-height: 1.43em;
    font-weight: var(--bs-font-regular);
    color: var(--bs-body-color);
}
p{
    font-family: var(--bs-font-body);
    font-size: 16px;
    line-height: 1.5em;
    font-weight: var(--bs-font-regular);
    color: var(--bs-body-color);
}
p.medium{
    font-family: var(--bs-font-body);
    font-size: 18px;
    line-height: 1.44em;
    font-weight: var(--bs-font-regular);
    color: var(--bs-body-color);
}
p.large{
    font-family: var(--bs-font-body);
    font-size: 20px;
    line-height: 1.4em;
    font-weight: var(--bs-font-regular);
    color: var(--bs-body-color);
}
p.extraLarge{
    font-family: var(--bs-font-body);
    font-size: 24px;
    line-height: 1.33em;
    font-weight: var(--bs-font-regular);
    color: var(--bs-body-color);
}

/* button style*/
a.btn.btn-primary{
    display: flex;
    align-items: center;
    width: max-content;
}
a.btn.btn-primary:hover{
    color: var(--bs-Netural-White);
}
.btn-primary {
    color: var(--bs-Netural-White);
    background: linear-gradient(180deg, var(--bs-Pink-Primary-200), var(--bs-Pink-Primary-400));
    border: none;
    outline: none;
    font-family: var(--bs-font-heading);
    font-weight: var(--bs-font-semibold);
    font-size: 16px;
    border-radius: 10px;
    padding: 1em 2.5em;
    height: 60px;
    cursor: pointer;
    position: relative;
    transition: color 0.3s ease;
    overflow: hidden;
    z-index: 0;
}
.btn-primary:before{
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(180deg, #F12B7C, #D40056);
    transition: left 0.4s ease;
    z-index: -1;
}
.btn-primary:hover:before{
    left: 0;
}

/* section */
.section-spacing {
    padding: 6.2em 0;
}
section .container{
    position: relative;
}
.section-spacing-large{
    padding: 8em 0;
}
.heading_spacing {
    padding-bottom: 0.8em;
}

/* Extras */
h2 span{
    color:var(--bs-Pink-Primary-400);
}

/* Media queries for container */
@media screen and (max-width:576px){
    .container{
        max-width: 100%;
    }
}
@media screen and (max-width:767.5px) and (min-width:577px){
    .container{
        max-width: 540px;
    }
}
@media screen and (max-width:992px) and (min-width:768px){
    .container{
        max-width: 740px;
    }
    .btn-outline-extraLg,.btn-exLarge {
        font-size: 18px;
        line-height: 26px;
        padding: 10px 14px;
        min-width: 160px;
        height: 48px;
    }
     
}
@media screen and (max-width:1200px) and (min-width:993px){
    .container{
        max-width: 920px;
    }
}
@media screen and (max-width:1440px) and (min-width:1201px){
    .container{
        max-width: 1140px;
    }
}
@media screen and (min-width:1441px){
    .container{
        max-width: 1320px;
    }

}