/*
Table Of Contents
=========================
- Default Typography
- Custom Typography
=========================
*/

/*
--------------------------
- Default Typography
--------------------------
*/


/*
--------------------------
- Custom Typography
--------------------------
*/

@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Rammetto+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Onest:wght@100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Paprika&family=Rammetto+One&display=swap');

/* 
.onest {
  font-family: "Onest", sans-serif;
}
.open-sans {
  font-family: "Open Sans", sans-serif;
}
.rammetto {
  font-family: "Paprika", system-ui;
} 
.rammetto {
  font-family: "Rammetto One", sans-serif;
  font-weight: 400;
  font-style: normal;
} 
*/


body {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 400;
}


/* variable color code */
:root {
  --white: #ffffff;
  --black: #000000;
  --rgba-black: rgba(0, 0, 0, 0.4);
  --rgba-black-bg: rgba(0, 0, 0, 0.44);
  --rgba-black-bg-inner: rgba(0, 0, 0, 0.60);
  --primary: #893c73;
  --rgba-primary: rgba(137, 60, 115, 0.08);
  --rgba-secondary: rgba(137, 60, 115, 0.5);
  --delete: #dc3545;

  --dark: #222222;
  --para: #555555;

  --star-color: #FF9E15;

  --gradient-primary: linear-gradient(180deg, #E6C1D8 0%, #893c73 100%);
  --gradient-primary-hover: linear-gradient(180deg, #893c73 0%, #E6C1D8 100%);

  --shadow-dark: 0px 0.7px 16.07px 0px rgba(0, 0, 0, 0.25);
  --shadow-main: 0 4px 12px rgba(0, 0, 0, 0.08);

  /* font variable */
  --font-open: "Open Sans", sans-serif;
  --font-onest: "Onest", sans-serif;
  --font-rammetto: "Rammetto One", sans-serif;
  --font-paprika: "Paprika", system-ui;
}

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

html {
    scroll-behavior: smooth;
}
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-onest);
}
p {
  font-family: var(--font-open);
  margin: 0px;
  padding: 0px;
}
span {
  font-family: var(--font-open);
}
ul {
    margin: 0;
    list-style-type: none;
}
a,
a:visited {
    text-decoration: none;
    font-family: var(--font-open);
    font-weight: normal;
    transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -ms-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    outline: 0;
}
a {
    color: var(--black);
    transition: all .3s ease-in;
    -webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -ms-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
}
a:hover,
a:active {
    text-decoration: none;
    outline: 0;
}

a:focus {
    text-decoration: none;
    outline: 0;
}
button {
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
}


.container::after,
.container::before,
.row::after,
.row::before,
.navbar::after,
.navbar::before,
.nav::after,
.nav::before {
  display: none;
}