:root{

    --light-color: white;
    --medium-light-color: #F6F6F6;
    --blue-color: #303F5F;
    --gray-color: #9a8991;
    --light-gray-color: #e8e4e4; 
    --dark-gray-color: #534a4e;
    --orange-color: #FF7633;
    
    --fs-350: 0.833rem;
    --fs-400: 1.1rem;
    --fs-450: 1.2rem;
    --fs-500: 1.44rem;
    --fs-600: 1.728rem;
    --fs-700: 2.074rem;
    --fs-800: 2.488rem;
    --fs-900: 2.986rem;

    --fs-1000: 3.6rem;
}

@font-face {
    font-family: 'Jost';
    src: url('Jost/Jost-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

.jost-uniquifier {
    font-family: "Jost", sans-serif;
    font-optical-sizing: auto;
    font-weight: weight;
    font-style: normal;
  }


html{
    font-weight: 400;
    font-size: 17px;
    padding: 0;
    margin: 0;
}
body{
    padding: 0;
    margin: 0;
}
*{
    font-family: "Poppins",sans-serif;
    font-size: 17px;
    font-weight: 400;
    font-style: normal;
    padding: 0;
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Jost",sans-serif;
    font-weight: 700;
    color: var(--blue-color) ;
}


h1 {
    font-size: var(--fs-900); /* 2.986rem */
}

h2 {
    font-size: var(--fs-800); /* 2.488rem */
}

h3 {
    font-size: var(--fs-700); /* 2.074rem */
}

h4 {
    font-size: var(--fs-600); /* 1.728rem */
}

h5 {
    font-size: var(--fs-500); /* 1.44rem */
}

h6 {
    font-size: var(--fs-450); /* 1.2rem */
}

p {
    font-size: var(--fs-400); /* 1rem */
    color: var(--blue-color);
}

small{
    font-size: var(--fs-350);
}


.bg-light{
    background-color: var(--light-color) !important;
}
.bg-blue{
    background-color: var(--blue-color);
}
.bg-gray{
    background-color: var(--gray-color);
}
.bg-light-gray{
    background-color: var(--light-gray-color);
}
.bg-orange{
    background-color: var(--orange-color);
}


.text-light{
    color: var(--light-color) !important;
}
.text-blue{
    color: var(--blue-color);
}
.text-gray{
    color: var(--gray-color);
}
.text-light-gray{
    color: var(--light-gray-color);
}
.text-orange{
    color: var(--orange-color);
}

.text-gray-dark{
    color: var(--dark-gray-color);
}

.fs-400{
    font-size: var(--fs-400);
}


.h1{
    font-size: var(--fs-900);
}

.xxl-text{
    font-size: var(--fs-1000);
}
.big-text{
    font-size: var(--fs-800);
}
.medium-text{
    font-size: var(--fs-500);
}
.small-text{
    font-size: var(--fs-350);
}

.my-img-thumbnail{
    width: 100px;
    height: auto;
}


.error-message{
    color: red !important;
}

.success-message{
    color: green !important;
}


.btn-orange-rounded{
    text-decoration: none;
    color: var(--gray-color);
    border: 1px solid var(--gray-color);
    padding: 13px 20px;
    border-radius: 30px;
    font-size: var(--fs-400);
    font-weight: bold;

    transition: 0.3s color,0.3s background-color;
}

.btn-orange-rounded:hover{
    color: white;
    background-color: var(--orange-color);
    border: 1px solid var(--orange-color);
}

.mt-100{
    margin-top: 100px;
}

.mt-150{
    margin-top: 150px;
}

.mt-300{
    margin-top: 300px;
}






.poppins-thin {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .poppins-extralight {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: normal;
  }
  
  .poppins-light {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .poppins-medium {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
  }
  
  .poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
  }
  
  .poppins-black {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .poppins-thin-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .poppins-extralight-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: italic;
  }
  
  .poppins-light-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .poppins-regular-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .poppins-medium-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .poppins-semibold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: italic;
  }
  
  .poppins-bold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .poppins-extrabold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: italic;
  }
  
  .poppins-black-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: italic;
  }