@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100;200;300;400;500;600;700;800;900&family=Quicksand:wght@300;400;500;600;700&display=swap');

:root{
  --antiFlash: #f0f0f0;
  --eearieBlack: #181818;
  --dimGray: #707070;
  --silver: #c6c6c6;
  --emphasisColor: #B0E09F;
}
html,body{
  background-color: var(--antiFlash);
}

.header{
  font-family: 'Quicksand', sans-serif;
  width: calc(100% - 40px);
  max-width: 512px;
  padding: 16px 20px;
  z-index: 1;
}

.container{
  font-family: 'Quicksand', sans-serif;
  width: calc(100% - 40px);
  max-width: 512px;
  padding: 16px 20px;
  z-index: 1;
}

.glassContainer{
  font-family: 'Quicksand', sans-serif;
  width: calc(100% - 40px);
  max-width: 512px;
  padding: 16px 20px;
  border-radius: 32px;
  border: 1px solid #FFF;
  background: rgba(255, 255, 255, 0.25);
  box-shadow: 2px 5px 16px 0px rgba(0, 0, 0, 0.18);
  backdrop-filter: blur(6px);
  z-index: 1;
}

.imgBr{
  border-radius: 16px;
  border: 1px solid #181818;
  background: lightgray;
}

.fixedBg{
  position: relative;
}

.fixedBg img{
  position: absolute;
  top: -60px;
  left: calc(50% - 180px);
  z-index: 0;
}

.fixedBg .welcome{
  position: absolute;
  font-size: 20px;
  top: -28px;
  left: -16px;
  z-index: 1;
}

.fixedBg .floatingText{
  position: absolute;
  width: 180px;
  font-size: 20px;
  top: 86px;
  left: -16px;
  z-index: 1;
}

.iconBtn{
  display: flex;
  padding: 8px;
  justify-content: flex-end;
  align-items: center;
  background-color: var(--antiFlash);
  border: 2px solid var(--emphasisColor);
  border-radius: 12px;
}

.iconBtn:hover{
  cursor: pointer;
  background-color: var(--emphasisColor);
}

button{
  display: flex;
  padding: 8px 12px;
  font-family: 'Outfit', sans-serif;
  font-size: 18px;
  font-weight: 500;
  align-items: center;
  gap: 6px;
  border-radius: 12px;
  border: 1px solid var(--emphasisColor);
  background: var(--emphasisColor);
  box-shadow: 2px 5px 16px 0px rgba(0, 0, 0, 0.18);
}
button:hover{
  cursor: pointer;
  background: var(--antiFlash);
}

h1,h2,h3,h4,h5,h6,ul,li,a,b,p{
  font-family: 'Outfit', sans-serif;
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: var(--eearieBlack);
}
h3{
  font-size: 20px;
  font-weight: 700;
  font-style: normal;
}
ul{
  padding: 0px 16px;
}
p,b{
  font-size: 18px;
}

.galery{
  padding: 0;
  width: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
  z-index: 1;
}

.galery img{
  width: 196px;
  height: 345px;
  border-radius: 16px;
  border: 1px solid #181818;
  background: lightgray;
}
