:root {
  --bs-bg-opacity: 0.6; /* Встановлення прозорості фону на 0 */
 --bs-tertiary-bg-rgb:rgba(255, 255, 255, 0.2)
}



html { overflow-x: hidden;}
body { overflow-x: hidden;}

a { text-decoration: none;}

.menu { position: fixed;
  padding-left: 90px;
  padding-right: 90px;
  background-color:  #fff6ff; ;
  opacity: 0.66;
  height: 90px;
width: 100%;
z-index: 1000;
top: 0;
}

.main-display {
  padding: 0 90px 0 90px}


.nav-item { 
    
color: var(--unnamed, #555);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.42px;
text-transform: uppercase;

padding-bottom: 25px;
}

.active:active { 

border-bottom: #555;


}


.side { margin-bottom: 26px;
}
.button-dropdown { 
  height: 30px;
padding-bottom: 32px;
background-color: transparent;
  border: none;
  
  color: #555; 
  font-size: 16px;
  cursor: pointer;
}


.tel { color: var(--unnamed, #555);
font-family: Inter;
display: block;
box-sizing: border-box;
padding-top: 8px;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 144.523%; /* 20.233px */
letter-spacing: 0.42px;
text-decoration: none;}





.main{
  background-image: url(../images/bg.png);
  background-size: cover; /* Розтягувати зображення на всю площу */
  background-repeat: no-repeat; /* Запобігати повторенню зображення */
  
 
}

.navbar .navbar-expand-lg .bg-body-tertiary { opacity: 0.6 !important;
    background-color: rgba(var(--bs-tertiary-bg-rgb),var(--bs-bg-opacity));
}


/* main display  */

.title-one { color: var(--unnamed, #555);
font-family: Inter;
font-size: 50px;
font-style: normal;
font-weight: 800;
line-height: 80px; /* 160% */
letter-spacing: 5px;
padding-top: 360px;}

.btn-1  { width: 350px;
height: 50px;
flex-shrink: 0;
border-radius: 227px;
fill: #D3D3D3;
border: none;
filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.10));
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
margin-left: 35px;
color: #555;}
.btn-2 { width: 350px;
height: 50px;
margin-left: 35px;
color: #555;
flex-shrink: 0;border: none;
border-radius: 227px;
background: rgba(255, 255, 255, 0.70);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;}

.media { margin-top: 175px;
text-align: center;
padding-bottom: 100px;

}
.media>a { margin: 0 17px 0 17px; 
 }





/*  section two */
.section-two { 
  padding: 0 90px 0 90px 0;
  position: relative;
}

.blue { background: rgba(0, 87, 184, 0.58); height: 340px;}
.white { opacity: 1;
  position: absolute;
border-radius: 40px;

width: 90%;
left: 50%;
transform: translateX(-50%) translateY(-50%);

flex-shrink: 0;
border: 1px solid #FFF;
background: #FFF;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10); }
.section-two-title { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 60px;
font-style: normal;
font-weight: 800;
line-height: 60px; /* 100% */
letter-spacing: 3px;
text-transform: uppercase;
margin: 100px auto 0 auto;
opacity: 0.4;
}
.white>h3 { 
  color: var(--unnamed, #555);
font-family: Inter;
font-size: 25px;
font-style: normal;
font-weight: 600;
line-height: 30px;
letter-spacing: 1.25px;
text-transform: uppercase;
margin-top: 40px ;
text-align: center;}
.white>button {width: 400px;
height: 50px;
flex-shrink: 0;
border-radius: 227px;
background: #555;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);
fill: #555555;
color: #FFF;
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 16px; /* 100% */
letter-spacing: 0.8px;
text-transform: uppercase;
text-align: center;
margin-top: 75px ;
margin-bottom: 100px;
margin-left: 50%;
transform: translateX(-50%)
}




.yellow { background: rgba(255, 215, 0, 0.58);
 height: 320px;}


 /* about us */

 .about-us>h3 { color: var(--unnamed, #555);
font-family: Inter;
font-size: 25px;
font-style: normal;
font-weight: 600;
line-height: 30px; /* 120% */
letter-spacing: 1.25px;
text-transform: uppercase;
text-align: center;
margin-top: 110px;}

.photos img:first-child{ margin-bottom: 20px;}
.photos>img { display: block;}
.photos { display: flex;
flex-direction: column;}

.cont-us { display: flex;

margin: 40px 220px 0 220px;}
.cont-us>p { display: block;
padding-left: 50px;
text-align: left;}





/*  section-three */



.section-three>div>div>img { 

width: 100%;

}

.section-three>h2 { color: var(--unnamed, #555);
  margin-top: 90px;
font-family: Inter;
font-size: 25px;
text-align: center;
font-style: normal;
font-weight: 600;
line-height: 80px; 
letter-spacing: 1.25px;
text-transform: uppercase;}

.section-three>.row { padding: 40px 0 0px 0p;
}

.section-three>.row {margin: 0;
  display: flex;

justify-content: space-evenly;}

.section-three>div>div {

  text-align: center;
  

width: auto;
height: 405px;
flex-shrink: 0;
}

.section-three>div>div>h3 { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
line-height: 20px; 
letter-spacing: 0.7px;
text-transform: uppercase;
margin-top: 24px;
margin-bottom: 15px;}

.section-three>div>div>button { 
 
  width: 100%;
  color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 40px; 
letter-spacing: 0.7px;
text-transform: uppercase;
height: 45px;
flex-shrink: 0;
  
  border-radius: 207px;
background: var(--unnamed, #555);
}




/* souvenirs */
.souvenirs { background-image: url(../images/bg-two.png);
background-size: cover; /* Розтягувати зображення на всю площу */
  background-repeat: no-repeat; /* Запобігати повторенню зображення */}

.souvenirs-logo {color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 60px;
text-align: center;
font-style: normal;
font-weight: 900;
line-height: 40px; /* 66.667% */
letter-spacing: 9px;
opacity: 0.5;
padding-top: 110px;
text-transform: uppercase;}
.read {
  display: none;
 color: var(--unnamed, #555);
text-align: justify;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 900;
border: none;
fill: none;
line-height: 25px; /* 156.25% */}

.sublogo { color: var(--unnamed, #555);
font-family: Inter;
font-size: 20px;
font-style: normal;
text-align: center;
font-weight: 400;
line-height: 40px;
margin-top: 20px;
letter-spacing: 1px;
text-decoration-line: underline;
text-transform: uppercase;}


#sourvenirs-text { color: var(--unnamed, #555);
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 25px;
letter-spacing: 0.8px;


margin-top: 40px;
margin-bottom: 60px;

text-align: left;

}

.item-slide { display: flex;
  width: inherit;
  
  
  justify-content: space-evenly;
padding: 0 20px 110px 20px;}

.row { margin: 0;}

.slider-block { 
border-radius: 10px;
box-sizing: border-box;
margin: 0 10px 0 10px;
padding: 12px;
opacity: 0.7;
background: #FFF;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10);}
.item-slide>.slider-block>img { display: block; width: 100%;
}
.get { width: 100%;
height: 45px;
flex-shrink: 0;
border-radius: 207px;
display: block;
opacity: 0.7;
background: var(--unnamed, #555);
color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 600;
line-height: 30px; 
letter-spacing: 0.7px;
text-transform: uppercase;}
.prev {
  position: absolute;
  z-index: 99;
  top: 40%;
  left: 0;
  transform: scaleY(-50%);
  width: 2rem;
  height: 2rem;
  background-color:#555555;
  background-image: url(../images/left.svg) ;
  background-size: 100%;
  left: 0;
}
.next {
  position: absolute;
  transform: scaleY(-50%);
  z-index: 99;
  top: 40%;
  right: 0;
  height: 2rem;
  width: 2rem;
  background-color:#555;
  background-image: url(../images/right.svg);
  background-size:100%;
}




/* questions ffffff
f
f
f
ffffffffffffffffff*/


.questions { border-bottom: 1px solid #D3D3D3 ;}
.questions>h2 { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 60px;
font-style: normal;
font-weight: 600;
line-height: 50px; /* 83.333% */
letter-spacing: 3px;
text-transform: uppercase;
margin-top: 210px;
margin-bottom: 25px;}
.questions-refs { display: flex;
flex-wrap: wrap;
padding-left: 90px;
margin-bottom: 130px;
margin-top: 25px;
}
.questions-refs>div { 
  position: relative;
  width: 450px;
height: 60px;
flex-shrink: 0;
border-radius: 207px;
background: var(--unnamed, #555);
margin-left: 40px;
margin-top: 30px;

}
.questions-refs>div>img {display: block; 
  position: absolute;
width: 35px;
height: 35px;
top: 10px;
right: 25px;
flex-shrink: 0;}
.questions-refs>div>a{
color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 10px;
font-style: normal;
font-weight: 600;
line-height: 20px; /* 200% */
letter-spacing: 0.5px;
text-transform: uppercase;
padding: 10px 0 6px 40px;text-decoration: none;
}
.questions-refs>div>a>span { color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 20px;
letter-spacing: 1.6px;
text-transform: uppercase;
margin-left: 40px;
text-decoration: none;}

.slider>img{ display: block;
grid-template-columns: auto auto auto;}





/* reports  */

.reports> h2 {
  color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 60px;
font-style: normal;
font-weight: 900;
line-height: 60px; /* 100% */
letter-spacing: 9px;
text-transform: uppercase;
opacity: 0.2;
text-align: center;
margin-top: 110px;
margin-bottom: 40px;
}

.slider { 
  display:grid;
  
  
}


/* donation */
.donation { background-image: url(../images/bg.png);
background-size: cover;

padding-top: 110px;
}
.form { width: 525px;

flex-shrink: 0;
border-radius: 10px;
background-color: rgba(255, 255, 255, 0.6);
text-align: center;
}
.form>h2 { color: var(--unnamed, #555);
font-family: Inter;
font-size: 24px;
font-style: normal;
font-weight: 800;
line-height: 20px; /* 83.333% */
letter-spacing: 1.2px;
margin-top: 30px;
text-transform: uppercase;}
.form>form { padding: 45px 45px 20px 45px;}
form>input { border:none;
  display: block;
  width: 400px;
  background: transparent;
  margin-top: 20px;
border-bottom: 1px solid #555 ;}
form>button { width: 125px;
height: 30px;
margin-top: 16px;
border: none;
flex-shrink: 0;
color: var(--unnamed, #555);
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 25px; /* 138.889% */
letter-spacing: 0.9px;
text-transform: uppercase;
border-radius: 10px;
}
form>button {margin-left: 4px;
margin-right: 4px; }
form>button>span{ color: #999;
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 25px;
letter-spacing: 0.9px;
text-transform: uppercase;}
.btn-donation {width: 400px;
  height: 40px;
  border-radius: 45px;
background: var(--unnamed, #555);
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.10); 
color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 25px; /* 178.571% */
letter-spacing: 1.4px;
margin-top: 60px;
margin-bottom: 30px;
text-transform: uppercase;}
form > div {width: 400px;
  height: 35px;
  display: flex;
align-items: center; 
justify-content: space-between;
 color: var(--unnamed, #555);
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 100% */
letter-spacing: 0.6px;
text-transform: uppercase;
   border-radius: 50px;
background: #FFF;
padding-left: 16px;
  padding-right: 8px;

margin-bottom: 15px;
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.10);}
form>div>b {display: block;
}
form>div>span { color: var(--unnamed, #555);
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 100% */
letter-spacing: 0.6px;
text-transform: uppercase;
}
.side-btns { padding-top: 110px;
padding-bottom: 150px;
padding-left: 90px;}
.side-btns> div { width: 518px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  
height: 80px;
flex-shrink: 0;
border-radius: 60px;
background: linear-gradient(0deg, rgba(255, 255, 255, 0.20) 0%, rgba(255, 255, 255, 0.20) 100%), rgba(255, 255, 255, 0.60);

color: var(--unnamed, #555);
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px;
letter-spacing: 0.6px;
text-transform: uppercase;
margin-top: 40px;
padding-left: 16px;
  padding-right: 12px;}
.side-btns>div>p {display: block;
margin-bottom: 0;}
.side-btns>div>span { display: block;
}
.donation>.menu { background-color: transparent;
margin-top: 40px;
position: static;}



.footer { display: flex;
justify-content: space-between;
align-items: center;
margin: 20px;
padding:0 90px 0 90px}
.footer>.media{padding: 0;margin: 0;}
.footer>.media>a { padding: 0;
margin: 0;}
.footer>p{display: block;color: var(--unnamed, #555);
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 144.523%; /* 17.343px */
letter-spacing: 0.36px;}




.donation>h3 { display: none;}

.donation>.menu>.navbar>.container-fluid>.navbar-toggler { display: none;}
.for-order { display: flex;flex-direction: column;
margin: 0;
padding: 0;}
@media ( max-width:991px) { 


  .donation>.menu>.side { display: none;}
  .side-btns { padding-left: 0;
  padding-right: 0px;}
    .main-display { padding: 0 0 0 0;}
    .menu { position: static;
    background-color: transparent;
  padding-left: 0;
padding-right: 0;}
.collapsed { padding-bottom: 10px;}

    .cont-us { flex-direction: column-reverse;
    padding-left: 5%;
  text-align: none;
width: 90%;}
.cont-us { margin-left: 40px;}

.white>button { width:100%;}
.side {margin-left: 50%;


}



  .donation{background-image: url(../images/bg-phone.png);
  background-size: cover;}
.svg { width: 360px;}
.slick-track { margin-right: 0;}
.section-three>.row { padding-top: 0;}
.photos{ padding-left: 5%;}
.cont-us { flex-direction: column-reverse;}
.cont-us>p { padding-left: 5%;
  text-align: none;
width: 90%;}
.cont-us { margin: 10px 0 10px 0;}
.questions-refs>div:nth-child(1) { background-color: #E8E0D1;}
.section-two-title { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 30px;
font-style: normal;
font-weight: 800;
line-height: 30px; /* 100% */
letter-spacing: 1.5px;
text-transform: uppercase;}
.white>h3 { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 12px; /* 100% */
letter-spacing: 0.6px;
text-transform: uppercase;}
.section-three>h2 { color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 25px; /* 156.25% */
letter-spacing: 0.8px;
text-transform: uppercase;}
.read { display: block;margin-left: 50%;transform: translateX(-50%);
background-color: transparent;}
.read>p{background-color: transparent;}
.for-hide { display: none;}
.about-us { order: 3;}
.button { margin-top: 50px;
margin-bottom: 50px;}
.section-three>div>div  
.reports>h2 {margin-top: 60px ;}


.btn-1 { margin-left: 5px;
  width: 250px;}
.btn-2 { margin-top: 25px;
margin-left: 5px;width: 250px;}
.title-one { color: var(--unnamed, #555);
font-family: Inter;
font-size: 18px;
font-style: normal;
font-weight: 800;
margin-left: 12px;
line-height: 30px; /* 166.667% */
letter-spacing: 0.18px;}
.main { background-image: url(../images/bg-phone.png);}
.questions-refs>div{ padding-left: 5%;
  margin-left: 15px;
 
width: 90%;} 


.donation>h3 { display: block;
text-align: center;color: var(--unnamed, #555);
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 0.48px;
text-transform: uppercase;}


.questions-refs { padding-left: 0;}
.questions>h2 { 
  color: var(--unnamed, #555);
text-align: center;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 600;
line-height: 25px; /* 156.25% */
letter-spacing: 0.8px;
text-transform: uppercase;
margin-top: 120px;}
.souvenirs-logo { color: var(--unnamed, #555);
padding-left: 5%;
font-family: Inter;
font-size: 55px;
font-style: normal;
font-weight: 900;
line-height: 40px; /* 72.727% */
letter-spacing: 8.25px;
text-transform: uppercase;}
.questions-refs>div>a { color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 10px;
font-style: normal;
font-weight: 600;
line-height: 20px; /* 200% */
letter-spacing: 0.5px;
text-transform: uppercase;
padding-left: 8px;
margin-left: 0;}
.questions-refs>div>a>span { color: var(--unnamed, #F0F0F0);
font-family: Inter;
font-size: 12px;
font-style: normal;
font-weight: 600;
line-height: 20px;
letter-spacing: 1.6px;
text-transform: uppercase;
padding-left: 8px;
margin-left: 0;}
form>input { width: 100%;}
.btn-donation { width:100%;}
form>div { width: 100%;
display: block;}
.side-btns>div { width: 100%;
height: 80px;
display: block;
text-align: center;
padding-top: 8px;}
.side-btns { justify-content: center;
flex-direction: column;}
.form>form { padding:20px 0 0 0 ;}

  .form>h2 { line-height: 36px;}
.footer  { flex-direction: column-reverse;
padding: 0;}
.footer > p { color: var(--unnamed, #555);
font-family: Inter;
font-size: 8px;
font-style: normal;
font-weight: 600;
line-height: 144.523%; /* 11.562px */
letter-spacing: 0.24px;
margin-top: 10px;}
.donation>.menu { position: relative;}
.footer>.media>a { padding: 0 10px 0 10px;}
.donation>.menu>.navbar>.container-fluid>.navbar-toggler { display: none;}
.donation>.menu>.navbar>.side


.white>button { width: 100%;
margin-top: 35px;
margin-bottom: 50px;}
.white>h2 { margin-top: 50px;}

.side { margin-left: 45%;}
}