@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;900&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@900&display=swap'); */

:root {
   --yellow: #f2c94c;
   --blue: #95b2d8;
   --lightblue: #f0f6fe;
   --lightGray: #a7a7a7;
   
   --liberty: #f2c94c;
   --moonstone: #51616D;
   --seaSerpent: #59C1D9;
   --slateGray: #74818C;
   --white: #F2F2F2;
   --navyBlue: #162C3C;
}

html {
   overflow-x: hidden !important;
}

body {
   overflow-x: hidden !important;
   font-family: Inter !important;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

input[type=number] { 
   -moz-appearance:textfield; 
}

a, a:visited {
   text-decoration: none;
}

.container-fluid {
   padding: 0 !important;
}

/** COLORS */
.text-warning {
   color: var(--yellow) !important;
}

.text-liberty {
   color: var(--liberty) !important;
}

.text-moonstone {
   color: var(--moonstone) !important;
}

.text-gray {
   color: var(--slateGray) !important;
}

.bg-white-25 {
   background: linear-gradient(to bottom, rgba(226,0,0,0) 0%,rgba(226,0,0,0) 24.9%,white 25%,white 100%) !important;
}

.bg-lightblue {
   background-color: var(--lightblue) !important;
}

.bg-liberty {
   background-color: var(--liberty) !important;
}

.bg-navyBlue{
   background-color: var(--navyBlue) !important;
}

.carousel-item {
   max-height: 50rem;
}

.carousel-item img  {
   width: 100%;
   height: auto;
   object-fit: cover;
   /* object-fit: cover;
   aspect-ratio: 4/3; */
}

.carousel-item.backdrop-img::before {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: var(--navyBlue) !important;
   opacity: .8;
}

.carousel-control-circle {
   width: 3rem;
   height: 3rem;
   border-radius: 50%;
   background-color: #4b62a6d3;
   background-size: 60%;
}

/** PILL IMAGES */
.pill-left {
   border-top-left-radius: 35% 50%;
   border-bottom-left-radius: 35% 50%;
}

.pill-right {
   border-top-right-radius: 35% 50%;
   border-bottom-right-radius: 35% 50%;
}

.pill-left.border-white {
   border-top: solid white .5rem;
   border-left: solid white .5rem;
   border-bottom: solid white .5rem;
}

.pill-right.border-white {
   border-top: solid white .5rem;
   border-right: solid white .5rem;
   border-bottom: solid white .5rem;
}

/** BUTTONS */
.btn {
   border: none !important; 
}

.btn-primary {
   color: black;
   background-color: var(--liberty) !important;
}

.btn-primary:hover {
   background-color: var(--lightblue) !important;
   color: var(--blue) !important;
}

.btn-secondary {
   background-color: var(--moonstone) !important;
}

.btn-secondary:hover {
   background-color: transparent !important;
   color: var(--seaSerpent) !important;
}

.btn-outline-light {
   border: 2px solid whitesmoke !important;
}

.input-group-text {
   border: solid 3px #95b2d838 !important;
}

.form-control {
   font-size: .9rem;
   border: solid 3px #95b2d838 !important;
}

.form-control:focus {
   box-shadow: 0 0 0 0.25rem #95b2d838 !important;
}

.form-control::placeholder {
   color: var(--lightGray);
   font-size: .9rem;
}

textarea.form-control {
   resize: none;
}

/** SCROLLBAR */
html *::-webkit-scrollbar {
   -webkit-appearance: none;
}

html *::-webkit-scrollbar:vertical {
   width: .4rem;
}

html *::-webkit-scrollbar-thumb {
   background-color: var(--navyBlue);
   border-radius: 1rem;
}

.modal-body {
   background-image: url("/assets/bgLightBlue.webp") ;
}

/** IMAGE STYLES */
.img-gradient {
   position: relative !important;
}

.img-gradient::before {
   content: "";
   position: absolute;
   background: linear-gradient(to bottom, rgba(0, 0, 0, 0.158) 0%,rgba(255, 255, 255, 0) 30%,rgba(255, 255, 255, 0) 65%,rgba(0, 0, 0, 0.158) 100%) !important;
   width: 100%;
   height: 100%;
}

/** FOOTER */
footer .fs-5 {
   font-size: .8rem !important;
}

footer .fs-6 {
   font-size: .6rem !important;
}