* {

  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

body {
  margin: 0;
  padding: 0;
}

.whole,
.next,
.topu,
.logo,
.sec,
.sec>a,
.name,
.img,
.btn,
.btn>a,
.why,
.q1 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.whole,
.next {
  width: 100%;
  padding-bottom: 30vh;
  justify-content: flex-start;
}

.whole {
  color: rgb(255, 255, 255);
  background-image: url("./img/c5.jpeg");
  object-fit: cover;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
}

.next {
  color: rgb(149, 149, 149);
  background-image: url("./img/i9.jpg");
  object-fit: cover;
  background-position: top;
  background-size: cover;
  background-attachment: fixed;
}
.fooding{
  background-image: url("./img/a71.jpg");
}
.placing{
  background-image: url("./img/v15.jpeg");
}
.topu {
  z-index: 2;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgb(255, 255, 255);
  width: calc(100% - 30px);
  padding: 10px 20px 10px 10px;
  flex-direction: row;
  justify-content: space-between;

}

.logo {
  width: 130px;
  flex-direction: row;
}

.imglogo {
  width: 40px;
  aspect-ratio: 1/1;
  border-radius: 50%;
}

.logo>p {
  margin: 0;
  font-size: 25px;
  color: rgb(71, 71, 71);

}

.sec {
  width: calc(100% - 135px);
  justify-content: flex-end;
  flex-direction: row;
  gap: 10px;

}

.sec>a {
  padding:5px 10px 8px 10px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  color: rgb(45, 45, 45);

}
.sec> .in{
  background-color: rgb(255, 60, 0);
  color: rgb(255, 255, 255);
}

.name {
  width: 100%;
  margin: 55vh 0;
}

.name>h2 {
  margin-bottom: 5px;
}

.name>p {
  margin: 0;
  font-size: 17px;

}

.img {
  width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 5px;
}

.img>img {
  flex: 1 1 400px;
  aspect-ratio: 2/1.5;
  object-fit: cover;
}

.info {
  width: 90%;
  color: rgb(241, 241, 241);
  text-align: center;
}

.btn {
  width: calc(100% - 20px);
  padding: 10px;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 10px;
}

.btn>a {
  text-decoration: none;
  cursor: pointer;
  width: 200px;
  aspect-ratio: 2/1;
  background-color: rgb(221, 221, 221);
  background-position: center;
  color: rgb(255, 255, 255);
  text-shadow: 0px 0px 5px black;
  background-size: cover;
  border-radius: 10px;
}
.hom{
  background-image: url("./img/i1.jpg");
}
.cul {
  background-image: url("./img/c2.jpg");
}

.food {
  background-image: url("./img/c3.jpg");
}

.place {
  background-image: url("./img/i2.jpg");
}

.pees {
  text-align: center;
  width: calc(90% - 60px);
  padding: 10px 20px;
  margin: 10px;
  border-radius: 10px;
}

.pees>p {
  color: rgb(255, 255, 255);
}

.why {

  border-radius: 20px;
  justify-content: space-between;
  width: calc(90% - 60px);
  padding: 10px 20px;
  margin: 10px;
  background-color: rgba(255, 255, 255, 0.68);
  flex-direction: row;
  margin-bottom: 50px;
}

.q1 {
  align-items: flex-start;
}

.q1>h3,
.q1>p,
li {
  margin: 5px 0;
  color: rgb(64, 64, 64);
}

/*____________________________________________________________culture______________________________________________________ */
.head,
.allcard,
.onecard {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.next {
  min-height: 100vh;
}

.head {
  width: 100%;
  margin: 40vh;
}

.next>.head>h2 {
  color: rgb(255, 102, 0);
}

.cltp {
  width: 90%;
  text-align: center;
  color: rgb(255, 211, 184);
}
.allcard{
  width:calc(100% - 50px);
  padding:10px;
  flex-direction: row;
  flex-wrap: wrap;
  gap:10px;

}
.onecard {
  overflow: hidden;
  border-radius: 10px;
  position: relative;
  background-position: center;
  flex :.5 .5 400px;
  aspect-ratio: 2/1;
  background-size: cover;

}
.o1{
  background-image: url("./img/c6.jpg");
}
.o2{
  background-image: url("./img/c7.jpg");
}
.o3{
  background-image: url("./img/c8.jpg");
}
.o4{
  background-image: url("./img/c9.jpg");
}
.o5{
  background-image: url("./img/c10.jpg");
}
.o6{
  background-image: url("./img/c11.jpg");
}
.o7{
  background-image: url("./img/i13.avif");
}
.o8{
  background-image: url("./img/c14.avif");
}
.o9{
  background-image: url("./img/c15.jpg");
}
.o11{
  background-image: url("./img/a7.webp");
}
.o12{
  background-image: url("./img/a10.jpg");
}
.o13{
  background-image: url("./img/a2.jpg");
}
.o14{
  background-image: url("./img/a1.jpg");
}
.o15{
  background-image: url("./img/a6.jpg");
}
.o16{
  background-image: url("./img/a4.jpg");
}
.o17{
  background-image: url("./img/a8.jpg");
}
.o18{
  background-image: url("./img/a9.jpg");
}
.o19{
  background-image: url("./img/a12.jpg");
}
.o111{
  background-image: url("./img/v1.avif");
}
.o112{
  background-image: url("./img/v2.png");
}
.o113{
  background-image: url("./img/v3.webp");
}
.o114{
  background-image: url("./img/v4.webp");
}
.o115{
  background-image: url("./img/v5.webp");
}
.o116{
  background-image: url("./img/v6.JPG");
}
.o117{
  background-image: url("./img/v7.jpg");
}
.o118{
  background-image: url("./img/v8.jpg");
}
.o119{
  background-image: url("./img/v9.jpg");
}
.o120{
  background-image: url("./img/v10.jpg");
}
.o121{
  background-image: url("./img/v11.webp");
}
.o122{
  background-image: url("./img/v12.png");
}
.onecard>p{
  bottom:0;
  left:0;
  width:calc(100% - 20px);
  padding: 10px;
  margin:0;
  position: absolute;
  color:white;
  background:linear-gradient(180deg , rgba(255, 0, 0, 0),rgb(16, 16, 16));
}