/*
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: #4169E1;
  --rgba-primary: rgba(65, 105, 225, 0.08);
  --rgba-secondary: rgba(65, 105, 225, 0.5);
  --delete: #dc3545;

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

  --star-color: #FF9E15;

  --gradient-primary: linear-gradient(180deg, #87CEEB 0%, #4169E1 100%);
  --gradient-primary-hover: linear-gradient(180deg, #4169E1 0%, #87CEEB 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-open: "Open Sans", sans-serif;
  --font-onest: "Onest", sans-serif;
  --font-rammetto: "Rammetto One", sans-serif;
  --font-paprika: "Paprika", system-ui;
} */



/* variable color code */
:root {
  --white: #ffffff;
  --black: #222222;
  /* --rgba-black: rgba(0, 0, 0, 0.4); */
  --rgba-black: rgba(34, 34, 34, 0.4);
  --rgba-black-bg: rgba(34, 34, 34, 0.44);
  /* --rgba-black-bg: rgba(0, 0, 0, 0.44); */
  /* --rgba-black-bg-inner: rgba(0, 0, 0, 0.60); */
  --rgba-black-bg-inner: rgba(34, 34, 34, 0.60);
  /* --primary: #24AB70; */
  --primary: #aa8453;
  /* --rgba-primary: rgba(65, 105, 225, 0.08); */
  --rgba-primary: #F8F5F0;
  /* --rgba-secondary: rgba(36, 171, 112, 0.5); */
  --rgba-secondary: rgba(170, 132, 83, 0.5);
  /* --rgba-secondary: rgba(65, 105, 225, 0.5); */
  --delete: #dc3545;
  
  --dark: #222222;
  --para: #555555;
  
  --star-color: #FF9E15;
  
  /* --gradient-primary: linear-gradient(180deg, #------- 0%, #24AB70 100%);
  --gradient-primary-hover: linear-gradient(180deg, #24AB70 0%, #------ 100%); */
  
  /* --gradient-primary: linear-gradient(180deg, #7DE5B8 0%, #24AB70 100%); */
  --gradient-primary: linear-gradient(180deg, #e1b57c 0%, #aa8453 100%);
  --gradient-primary-hover: linear-gradient(180deg, #aa8453 0%, #e1b57c 100%);
  
  /* --shadow-primary: rgba(36, 171, 112, 0.4); */
  /* --shadow-primary2: rgba(36, 171, 112, 0.25); */
  --shadow-primary: rgba(170, 132, 83, 0.4);
  --shadow-primary2: rgba(170, 132, 83, 0.25);
  /* --shadow-dark: 0px 0.7px 16.07px 0px rgba(0, 0, 0, 0.25); */
  --shadow-dark: 0px 0.7px 16.07px 0px rgba(34, 34, 34, 0.25);
  /* --shadow-main: 0 4px 12px rgba(0, 0, 0, 0.08); */
  --shadow-main: 0 4px 12px rgba(34, 34, 34, 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;
}

*{
  /* --gradient-primary: linear-gradient(180deg, #7DE5B8 0%, #24AB70 100%); */
    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;
}
