/* :root{
--Blue: #003049;;
--white:#FFF;
--whitefaded:#F1ECEC;
--black:#000;
--lightblue:#427A9D;
--DARK-OVERLAY: rgba(0, 0, 0, 0.35);
--cta:#C1121F;
--bright-blue:#7BD2FF;
--light-white:#FDF0D5;
--bright-effect:rgba(255, 255, 255, 0.25);
--ctahoverr:#780000;
--linecolor:rgba(0, 0, 0, 0.19);
--box-shadow-header:rgba(0, 0, 0, 0.25);
--blue2:#052433;
--blue3:#0b4a67;
--faded-circle-sec2-clubs:rgba(66, 122, 157, 0.33);
--darkred:#780000;
} */

:root{
  --Blue: #003049;
  --white:#FFF;
  --whitefaded:#F1ECEC;
  --black:#000;
  --lightblue:#427A9D;
  --DARK-OVERLAY: rgba(0, 0, 0, 0.35);
  --cta:#DB1928;
  --bright-blue:#7BD2FF;
  --light-white:#FDF0D5;
  --bright-effect:rgba(255, 255, 255, 0.25);
  --ctahoverr:#780000;
  --linecolor:rgba(0, 0, 0, 0.19);
  --box-shadow-header:rgba(0, 0, 0, 0.25);
  --blue2:#052433;
  --blue3:#0b4a67;
  --faded-circle-sec2-clubs:rgba(66, 122, 157, 0.33);
  --darkred:#960909;

  --filterr: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.57) 29.81%, var(--ctahoverr) 100%);
  --filterr1: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.57) 29.81%, var(--Blue) 100%);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}












@font-face {
    font-family: "Koh Santepheap";
    src: url(fonts/KohSantepheap-Bold.ttf)}

  
.body2{    background-color: var(--Blue);
    width: 1280px;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;}





a , li{
list-style-type: none;
text-decoration: none;
}
.nav{
width: 1280px;
    height: 120px;
    flex-shrink: 0;
    box-sizing: border-box;
    position: fixed;
    padding: 0 100px;
    display: flex
;    top: 0;
    z-index: 1111;
    justify-content: space-between;
    align-items: center;
    background: var(--white);
    box-shadow: 0 13px 15.6px 0 var(--box-shadow-header);
}
.nav-box{
    width: auto;
    height:60px ;
    display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 32px;
    
}
.logo{
    width: 77px;
    height: auto;
    margin: 0;
}
.nav-link {
  position: relative;
  color: var(--blue2);
  font-family: Jost;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  padding-bottom: 5px; 
  transition: color 0.3s ease;
}


.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height:4px;
  background: var(--cta);
  
  transition: width 0.4s ease;
}

.nav-link:hover::after {
  width: 100%;
}

.nav-link:hover {
  color: var(--blue3);
  transform: translateY(-2px);
  transition: transform 0.3s ease, color 0.3s ease;
}

.cta{
display: flex
;
    width: 151px;
    height: 49px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 35px;
    background: var(--cta);
    color: var(--white);
    font-family: Jost;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;}
.cta:hover{
    background-color: var(--ctahoverr);
}

.header{width: 1280px;
height: 120px;}







.sec1-tour{width: 1280px;height: 784px;background-color: var(--Blue);
background-image: url(pic/img1.svg);
display: flex;    justify-content: center;position: relative;
       margin-top: 120px;
        background-attachment: fixed;
    background-position: center ;
    background-repeat: no-repeat;
    /* background-size: contain; */
    background-size: cover;
    
}






.container-text-hero-page{display: flex;
flex-direction: column;gap: 31px;margin-top: 336.92px;
}

.header-hero-tour{color: var(--white);
font-family: "Koh Santepheap";
font-size: 100.992px;margin: 0;
font-weight: 700;height: 128px;
line-height: normal;}

.small-text-hero{color: var(--whitefaded);
text-align: center;
margin: 0;
font-family: Jost;
font-size: 30.943px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.decoration-hero{position: absolute;top: 456.13px;}

.sec2-tour{height: 918px;background-color: var(--white);position: relative;
padding: 110px 100px 0 100px;box-sizing: border-box;}

.sec2-tour-cont-info{display: flex;flex-direction: column;
gap: 72px;}

.header-sec2-tour{color: var(--black);
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;height: 21px;
line-height: normal;}

.card-continer-sec2-tour{display: flex;flex-direction: row;
gap: 20px;}

.card1-sec2-tour{display: flex;flex-direction: column;
    width: 622px;
height: 628.64px;
border-radius: 25px;    overflow: hidden;
border: 2px solid var(--lightblue);
transition: all 300ms linear;
}

.img1-card1-sec2-tour{
    width: 622px;position: relative;
height: 437.884px;background-image: url(pic/img3.svg);
}

.over-lay-dark-color-sec2-tour{position: absolute; width: 622px;
height: 100%;opacity: 0;}


.card1-sec2-tour:hover .over-lay-dark-color-sec2-tour{
  background: var(--DARK-OVERLAY);opacity: 1;

}

.card1-sec2-tour:hover .circle-big-cta{opacity: 1;}

.circle-big-cta{display: flex;
width: 71.778px;margin: 0;
height: 71.778px;position: absolute;top: 29px;right: 29px;
justify-content: center;
align-items: center;
gap: 10px;border-radius: 50px;
background: var(--cta);opacity: 0;transition: all 300ms linear;
flex-shrink: 0;}

.arroww{background-image: url(pic/img6.svg);width: 38.75px;
height: 41px;}


.circle-big-cta:hover{border: 2px solid var(--cta);background-color: transparent;}

.circle-big-cta:hover .arroww{background-image: url(pic/img7.svg);}


.text-card1-sec2-tour{    display: flex
;
    justify-content: center;
    align-items: center;
    padding: 41px 31px;}

.big-part-card1-sec2-tour{display: flex;flex-direction: column;
gap: 28px;width: 100%;}

.row-card1-sec2-tour{    display: flex
;
    justify-content: space-between;
    align-items: center;
    width: 100%;}

.haeder-cards-sec2{color: var(--black);
margin:0 ;
font-family: Jost;
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 33.88px */}

.DATE-CARDS-SEC2-TOURS{color: var(--Blue);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 121%; /* 21.78px */}




.row2-card1-sec2-tours{display: flex;flex-direction: column;
    gap: 15px;
}

.row3-sec2-tours{display: flex;flex-direction: row;
    gap: 18px;align-items: center;
}
.small-text-cards-sec2-tours{color: var(--black);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 121%; /* 21.78px */}

.container-cards-verticall-sec2-tours{display: flex;
    flex-direction: column;
    gap: 20px;
}

.card2-sec2-tours{width: 438px;
height: 196.215px;overflow: hidden;
flex-shrink: 0;border-radius: 25px;
border: 2px solid var(--lightblue);gap: 20px;
display: flex;flex-direction: row;}

.img-card2-sec2-tours{width: 163px;
height: 196.215px;background-image: url(pic/img8.svg);
position: relative;
transition: all linear 300ms;}

.cont-info-card2-sec2-tours{display: flex;
    flex-direction: column;gap: 28px;justify-content: center;
}

.main-cont-card2-sec2-tours{display: flex;
flex-direction: column;gap: 20px;width: 219px;
}


.circle-small-cta{display: flex;
width: 49.18px;margin: 0;
height: 49.18px;position: absolute;bottom: 13px;right: 13px;
justify-content: center;
align-items: center;
gap: 10px;border-radius: 50px;z-index: 1;
background: var(--cta);opacity: 0;transition: all 300ms linear;
flex-shrink: 0;transition: all linear 300ms}

.arroww-small{background-image: url(pic/img10.svg);width: 26.55px;
height: 28px;}

.circle-small-cta:hover{border: 2px solid var(--cta);background-color: transparent;}

.circle-small-cta:hover .arroww-small{background-image: url(pic/img11.svg)}
.over-lay2-dark-color-sec2-tour{position: absolute; width: 163px;
height: 100%;opacity: 0;}
.img-card2-sec2-tours:hover .over-lay2-dark-color-sec2-tour{opacity: 1;  background: var(--DARK-OVERLAY)}

.img-card2-sec2-tours:hover .circle-small-cta{opacity: 1;}

.linkk{width: fit-content;}

.sec2-tours-img-dec1{position: absolute;right: 0;
top: 68px;}

.sec2-tours-img-dec2{position: absolute;left: 0;z-index: 1;
top: 429px;}

.sec2-tours-img-dec3{position: absolute;right: 0;
bottom: -58px;}

.sec3-tour{height: 1384.39px;width: 1280px;background-color: var(--white);
    background-image: url(pic/img17.svg);    position: relative;

    padding-top: 191px;box-sizing: border-box;justify-content: center;
}


.all-cont-sec3{display: flex;flex-direction: column;
gap: 108px;    align-items: center;}

.part1-sec3-tour{display: flex;flex-direction: column;gap: 74px;
        align-items: center;
}

.header-se3-tour{color: var(--white);
text-align: center;
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.all-cards-sec3-tour{display: flex;flex-direction: row;
    gap: 20px;    width: 1081px;
    flex-wrap: wrap;

}

.card1-sec3-tour{display: flex;
width: 347px;flex-direction: column;
height: 380.804px;
padding: 19px 21px;box-sizing: border-box;
justify-content: center;
align-items: flex-start;
gap: 30px;
border-radius: 24px;
border: 2px solid var(--lightblue);}


.card1-sec3-tour:hover{box-shadow: -3px 11px 34px 0 var(--bright-effect);}


.img-cards-sec3-tours{margin: 0;padding: 0;height: 183.409px;
width: 305px;border-radius: 15px;
background-image: url(pic/img18.svg);}

.text-info-sec3-tour{display: flex;flex-direction: column;
gap: 17px;}

.date-sec3-tourr{color: var(--bright-blue);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 121%; /* 21.78px */}

.card-title-sec3-tourr{color: var(--white);
margin: 0;
font-family: Jost;
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 33.88px */}

.para-sec3{
color: var(--light-white);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; 
display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cta-sec3-tour{display: flex;
width: 250px;
height: 49px;
justify-content: center;
align-items: center;
border-radius: 35px;border-color: transparent;
background: var(--cta);
transition: all 300ms linear;}

.link-button-sec3-tour{width: 100%;
height: 100%;text-decoration: none;
display: flex;justify-content: center;
align-items: center;}

.small-text-cta-sec3-tour{color: var(--white);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.cta-sec3-tour:hover{background-color: var(--ctahoverr);}

.sec4-tour{width: 1280px;height: 891.38px;background-color: var(--white);
padding: 115px 100px 0 100px;box-sizing: border-box;}

.header-sec4{color: var(--black);
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.container-info-sec4-tour{display: flex;flex-direction: column;
gap: 73px;}

.container-row-sec4-tour{display: flex;gap: 70px;
flex-direction: column;    align-items: center;}

.row1-sec4-tour{display: flex;flex-direction: row;
gap: 92px;transition: all 300ms linear;    width: 100%;
    flex-direction: column;}

.line-plus-info-sec4-to:hover .bg-img-sec4-tour{width: 143.839px;
height: 143.255px;}





.number-sec4-tour{color: var(--black);
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 29.04px */}

.name-sec4-tour{color: black;
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;width: 219.51px;
font-weight: 600;
line-height: 121%; /* 29.04px */}

.bg-img-sec4-tour{width: 99.197px;
height: 98.794px;background-image: url(pic/img24.svg);
background-size: cover;border-radius: 10px;
}

.para-sec4-tour{
color: var(--black);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 121%; 
display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;    height: 41px;
    text-overflow: ellipsis;width: 303.827px;
}


.circle-small-cta-sec4{display: flex;
width: 49.18px;margin: 0;
height: 49.18px;;bottom: 13px;right: 13px;
justify-content: center;
align-items: center;background-color: var(--cta);
gap: 10px;border-radius: 50px;z-index: 1;
background: var(--cta);transition: all 300ms linear;
flex-shrink: 0;transition: all linear 300ms}

.arroww-small-sec4{background-image: url(pic/img10.svg);width: 26.55px;
height: 28px;}

.circle-small-cta-sec4:hover{border: 2px solid var(--cta);background-color: transparent;}

.circle-small-cta-sec4:hover .arroww-small-sec4{background-image: url(pic/img11.svg)}


.line-plus-info-sec4-to{display: flex;flex-direction: column;gap: 27px;
width: 100%;}

.cont-info-hori-sec4{display: flex;flex-direction: row;
gap: 92px;}

.line-sec4-tour{
background: var(--linecolor);width: 100%;
height: 1px;}

.footer{    height: fit-content;;width: 1280px;
background-color: var(--Blue);
display: flex;flex-direction: column;
gap: 115.55px;
}

.container-footer{display: flex;
flex-direction: row;margin: 0;padding: 0;
gap: 85px;
padding: 110px 100px 0 100px;
box-sizing: border-box;}

.container-footer2{display: flex;
flex-direction: column;width: 186px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}


.container-footer3{display: flex;
flex-direction: column;width: 123px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}


.container-footer4{display: flex;
flex-direction: column;    width: 188px;

gap: 48px;list-style-type: none;
margin: 0;padding: 0;}

.container-footer5{display: flex;
flex-direction: column;width: 329px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}









.title-footer{color: var(--white);
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.small-list-footer{display: flex;
flex-direction: column;
list-style-type: none;margin: 0;
padding: 0;
gap: 28px;}

.link-footer{text-decoration: none;}

.small-navs-footer {
  color: var(--white);
  margin: 0;
  font-family: Jost;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}


.small-navs-footer::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px; 
  width: 0;
  height: 1px;
  background-color: var(--whitefaded);
  transition: width 0.3s ease;
}


.small-navs-footer:hover::after {
  width: 100%;
}

.row-contact-us-footer{display: flex;
flex-direction: row;gap: 22px;
list-style-type: none;
margin: 0;padding: 0;}



.small-navs-footer2 {
  color: var(--white);
  margin: 0;
  font-family: Jost;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}

.list-icons-footer{display: flex;
flex-direction: row;padding: 0;
gap: 24px;margin: 0;}

.lastpart-footer{height: 64.938px;
width: 1280;background-color: var(--blue2);
padding: 0 100px;box-sizing: border-box;
display: flex;align-items: center;}

.container-last-part-footer{
    display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}

.last-text-footer{
    color: var(--white);
font-family: Jost;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 15px */
}

.list-final-part-footer{    display: flex
;
    flex-direction: row;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 489px;
    gap: 11px;
    align-items: center;}



.small-navs-footer2-small {
  color: var(--whitefaded);
  margin: 0;
  font-family: Jost;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}


.small-navs-footer2-small::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px; 
  width: 0;
  height: 1px;
  background-color: var(--whitefaded);
  transition: width 0.3s ease;
}


.small-navs-footer2-small:hover::after {
  width: 100%;
}

.rect-footer{width: 1px;
height: 13.503px;
background: var(--whitefaded);}





























.section1-club{width: 1280px;
  height: 784px;
  background-color: var(--Blue);
background-image: url(pic/img33.svg);
display: flex;  
  justify-content: center;
position: relative;
 margin-top: 120px;

        background-attachment: fixed;
    background-position: center ;
    background-repeat: no-repeat;
    /* background-size: contain; */
      background-size: cover;
    
}

.sec2-club{width: 1280px;height: 772.5px;background-color: var(--white);
padding: 115px 100px 0 100px;box-sizing: border-box;
position: relative;}

.cont-info-sec2-clubs{display: flex;
flex-direction: column;gap: 48px;}

.part1-sec2-club{display: flex;flex-direction: row;
justify-content: space-between;}

.header-sec2-clubs{color: var(--black);
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.arrows-sec2-clubs{display: flex;
  flex-direction: row;gap: 30px;
}

.circle-sec2-clubs{display: flex;
justify-content: center;align-items: center;
;width: 54.878px;
height: 54.878px;border-radius: 50px;
border: 2px solid var(--lightblue);}

.circle-sec2-clubs:hover {
  border: 2px dashed var(--lightblue);
  border-style: dashed;
  border-width: 2px;
}




.row-part2-sec2-club {
  display: flex;
  flex-direction: row;
  gap: 20px;
  position: relative;
  animation: scrollLeft 14s ease-in-out infinite; 
}

@keyframes scrollLeft {
  0%, 20% {
    transform: translateX(0); 
  }
  35%, 55% {
    transform: translateX(-1097px); 
  }
  70%, 100% {
    transform: translateX(-2197px); 
  }
}



.small-circle-sec2-clubs,
.small2-circle-sec2-clubs,
.small3-circle-sec2-clubs {
  width: 25px;
  height: 25px;
  border-radius: 50px;
}


.small-circle-sec2-clubs {
  background-color: var(--lightblue);
  animation: colorChange1 14s ease-in-out infinite;
}

.small2-circle-sec2-clubs {
  background-color: var(--faded-circle-sec2-clubs);
  animation: colorChange2 14s ease-in-out infinite;
}

.small3-circle-sec2-clubs {
  background-color: var(--faded-circle-sec2-clubs);
  animation: colorChange3 14s ease-in-out infinite;
}


@keyframes colorChange1 {
  0%, 20% {
    background-color: var(--lightblue);
  }
  35%, 55% {
    background-color: var(--faded-circle-sec2-clubs);
  }
  70%, 100% {
    background-color: var(--faded-circle-sec2-clubs); 
  }
}


@keyframes colorChange2 {
  0%, 20% {
    background-color: var(--faded-circle-sec2-clubs);
  }
  35%, 55% {
    background-color: var(--lightblue); 
  }
  70%, 100% {
    background-color: var(--faded-circle-sec2-clubs);
  }
}


@keyframes colorChange3 {
  0%, 20% {
    background-color: var(--faded-circle-sec2-clubs);
  }
  35%, 55% {
    background-color: var(--faded-circle-sec2-clubs);
  }
  70%, 100% {
    background-color: var(--lightblue); 
  }
}








.card-sec2-part2-clubs{height: 378.25px;
width: 346.29px;position: relative;
display: flex
;
    align-items: flex-end;
}

.main-cont-card-sec2-club{width: 346.291px;
height: 293.797px;border-radius: 21px;
border: 2px solid var(--lightblue);
position: relative;    padding-left: 33px;
    padding-right: 33px;
display: flex
;flex-direction: column;
    align-items: flex-end;    justify-content: end;
  padding-bottom: 34px;box-sizing: border-box;}

.text-cards-sec2-clubs{display: flex;
flex-direction: column;gap: 28px;
align-items: center;}


.title-cards-sec2-clubs{color: var(--black);
text-align: center;
margin: 0;width: 220.861px;
font-family: Jost;
font-size: 28px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 33.88px */}


.para-cards-sec2-clubs{
color: var(--black);
text-align: center;
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; 
display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}


.club-imgg{position: absolute;
left: 83.27px;    top: -84px;
width: 180.086px;margin: 0;padding: 0;
height: 180.086px;background-image: url("pic/img36.svg");
    background-position: center;
    background-repeat: no-repeat;
}

.containerr-part22-sec2-clubs{
  display: flex;flex-direction: column;
  gap: 37px;overflow: hidden;
  
}
.scircles-sec2-clubs{display: flex;
  flex-direction: row;gap: 23px;justify-content: center;

}



.pic-dec0-sec2-clubs{position: absolute;
bottom: 0;left: 0;}



.sec3-clubs{width: 1280px; height: 792.36px;
background-color: var(--white);    align-items: center;
background-image: url(pic/img40.svg);
display: flex;}

.red-sec3-clubs{
  width: 1247.202px;
height: 744.36px;
border-radius: 0 441px 441px 0;
background: var(--darkred);
padding-left: 100px;box-sizing: border-box;
}

.pic-plus-cont-sec3-clubs{display: flex;
flex-direction: row;}

.img-sec3-clubs{
  width: 481.857px;
height: 744.36px;margin: 0;padding: 0;
background-image: url(pic/img41.svg);
  background-attachment: fixed; 

  background-size: auto;         
    background-position: 400px 100px;
    background-size: contain;
    background-attachment: fixed;
  
    background-position: 30% top;
    background-repeat: no-repeat;
    background-size: contain;
}

.cont-text-sec3-clubs{width: 668.16px;
height: 744.36px;
padding: 114px 141px 0 70px;box-sizing: border-box;
display: flex;flex-direction: column;
gap: 76px;}

.container-info-sec3-club{display: flex;
flex-direction: column;gap: 76px;}

.header-sec3-club{color: var(--light-white);
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;height: 21.35px;
line-height: normal;}


.para-sec3-clubs{
color: var(--light-white);
margin: 0;padding: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 25.2px */
display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}


.text-partt1-sec3-clubs{display: flex;
flex-direction: column;gap: 50px;}

.container-icons-plustext-sec3-clubs{
  display: flex;flex-direction: column;
  gap: 20px;
  
}

.row-small-part-sec3-clubs{
  display: flex;flex-direction: row;
align-items: center;
gap: 27px;
}

.circle-sec3-clubss{
  width: 65.868px;
height: 65.868px;border-radius: 50px;
background-color: var(--light-white);
background-image: url(pic/img42.svg);
background-position: center;
background-repeat: no-repeat;

}

.small-titleee-sec3-club{color: var(--light-white);
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: normal;}



.sec4-clubs{height: 739.49px;width: 1280px;
background-color: var(--white);
padding: 117px 100px 0 100px;box-sizing: border-box;}

.cont-info-sec4-clubs{display: flex;
flex-direction: column;gap: 72px;}

.header-sec4-clubs{color: var(--black);
margin: 0;
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.rectangle-cont-sec4-club{
  width: 1080.709px;
height: 411.369px;
border-radius: 25px;
border: 2px solid var(--lightblue);
background: var(--white);
padding: 67px 0 0 47px;box-sizing: border-box;
position: relative;
}

.rext-box-sec4-club{display: flex;flex-direction: column;
gap: 58px;width: 507.29px;}

.main-rec-box2-sec4-club{display: flex;
  flex-direction: column;gap: 40px;
  
}

.sub-title-sec4-club{color: var(--black);
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: normal;}

.para-sec4-clubb{
color: var(--black);
margin: 0;

font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 25.2px */
display: -webkit-box;
    display: box;
    display: flexbox;
    line-clamp:4;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}



.ctas-sec4-clubb{display: flex;
width: 214px;
height: 49px;
justify-content: center;
align-items: center;
gap: 10px;
border-radius: 35px;border-color: transparent;
background: var(--cta);}


.link-cta-sec4-clubb{text-decoration: none;
width: 100%;height: 100%;display: flex;
justify-content: center;align-items: center;
}

.cta-text-sec4-club{color: var(--white);
margin: 0;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.ctas-sec4-clubb:hover{background-color: var(--ctahoverr);}

.img-sec4-club{position: absolute;bottom: 0;right: 0;}




















































































































































body{
   width: 1280px;
height: auto;
    margin: 0 auto;
    position: relative;
  overflow-x: hidden;
    background-color: var(--Blue);

}
a , li{
list-style-type: none;
text-decoration: none;
}
.mainn{
    background-color: var(--white);
    position: relative;
    top:119px;
    z-index: 0;
      width: 1280px;
height: auto;
}
.nav{
   width: 1280px;
height: 120px;
flex-shrink: 0;
    box-sizing: border-box;
    padding: 0 100px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--white);
box-shadow: 0 13px 15.6px 0 var(--box-shadow-header);
z-index: 999;
position: fixed;
}
.nav-box{
    width: auto;
    height:60px ;
    display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 32px;
    
}
.logo{
    width: 77px;
    height: auto;
    margin: 0;
}
.nav-link {
  position: relative;
  color: var(--blue3);
  font-family: Jost;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
  padding-bottom: 5px; 
  transition: color 0.3s ease;
}


.nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height:4px;
  background: var(--cta);
  
  transition: width 0.4s ease;
}

.nav-link:hover::after {
  width: 100%;
}

.nav-link:hover {
  color: var(--blue3);
  transform: translateY(-2px);
  transition: transform 0.3s ease, color 0.3s ease;
}

.cta{
display: flex
;
    width: 151px;
    height: 49px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 35px;
    background: var(--cta);
    color: var(--white);
    font-family: Jost;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;}
.cta:hover{
    background-color: var(--ctahoverr);
}

.section1{
     width: 1280px;
    height: auto;
    padding: 40px 100px;
    display: flex
;position: relative;
    justify-content: flex-start;
    align-items: center;
    background-color: var(--white);
   
    gap: 99px;
        margin-bottom: 77px;

}
.section1-box{
    width: 530px;
  height: 500px;
  
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
    gap: 25px;
      
    

}
.section1-title{
    color: var(--darkred);

font-family: "Koh Santepheap";
font-size: 49px;
font-style: normal;
font-weight: 900;
line-height: 146%; 
}
.section1-text{
    color: var(--black);
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 146%; /* 35.04px */
}
.section1-cta-box{
    width: auto;
height: 60px;
display: flex;
align-items: center;
gap: 25px;
    position: relative;
    top: 50px;
}

.cta1{
    display: flex;
    width: 164px;
    height: 54px;

justify-content: center;
align-items: center;
gap: 10px;
border-radius: 35px;
border: 3px solid var(--cta);
color: var(--black);
font-family: Jost;
font-size: 21px;
font-style: normal;
font-weight: 700;
line-height: normal;
}
.cta1:hover{
    background-color: #9e101c;
    color: var(--white);
}
.section1-img{
    width: 450px;
    height: auto;
    margin: 0;
}
.bounce-circle {
  width: 145px;
  height: 145px;
  background-color: var(--cta); 
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  animation: bounce 2.5s ease-in-out infinite;
  transition: background-color 0.4s ease;
  position: absolute;
  z-index: 2;
  left: 390px;
  bottom: 30px;
}


.bounce-circle .arrow {
  width: 50px;  
  height: auto;
  transition: 0.4s ease;
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}


.bounce-circle:hover {
  background-color: var(--white);
border: 3px solid var(--cta);

}

.bounce-circle:hover .arrow {
  content: url("img/a1.png");
}
.section2{
    width: 1280px;
    height: 454px;
    display: flex;
    justify-content: center;
align-items: center;
    background-image: url(img/pg.png);
   background-size: cover;
    background-position: center;
    background-repeat: repeat;
    overflow: hidden;
    position: relative;
  

}
.section2-bg{
    
width: 1280px;
    height: 700px;
    background-image: url(img/pp.png);
    background-attachment: fixed;
    background-position: top;
    background-repeat: repeat;
    position: absolute;

    z-index: -2;
    display: flex
; padding: 0 100px;

    justify-content: space-between;
    align-items: center;


}
.section2-text{
    color: var(--light-white);

font-family:  "Koh Santepheap" ;
font-size: 46px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.section2-img{
    width: 178.064px;
    height: auto;
    margin: 0;
}
.section3{
  width: 1280px;
  height: 550px;
  padding: 40px 100px;
  display:flex ;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 25px;  
  position: relative;
}

.section3-title{
    color: var(--Blue);

font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: normal;
margin-bottom: 20px;
}
.section3-text{
   color: var(--black);
   width: 1100px;
   font-family: Jost;
   font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 146%; 
}
.section3-text1{
   color: var(--black);
   width: 927px;
   font-family: Jost;
   font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 146%; 
margin-bottom: 50px;
}
.section3-img{
width: 302px;
    position: absolute;
    height: auto;
    right: 0;
    top: 206px;
}
.section4{
  width: 1280px;
  height: 1044px;
  flex-shrink: 0;
  background-color:var(--Blue) ;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  padding: 100px ;
  margin-top: 55px;
  gap: 25px;
}
.section4-title{
  color: var(--light-white);
font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 68.6px */

}
.section4-text{
  color: var(--white);
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 140%; /* 33.6px */
}
.section4-box{
width:1080px;
height: auto;
display: flex;
justify-content: flex-start;
align-items: flex-start;
gap: 20px;
margin-top: 20px;
}
.section4-box1{
  width:530px;
  height: auto;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 20px;
  }
  .section4-img {
    width: 530px;
    height: 659px;
    border-radius: 25px;
   
    background: url(img/im1.jpeg) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .section4-img1 {
    width: 530px;
    height: 319px;
    border-radius: 25px;
  
    background: url(img/im2.jpg) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .section4-img2 {
    width: 530px;
    height: 319px;
    border-radius: 25px;
 
    background: url(img/im3.jpg) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .section4-img,
.section4-img1,
.section4-img2 {
  position: relative;
  overflow: hidden;
}

.section4-img::before,
.section4-img1::before,
.section4-img2::before {
  content: "";
  position: absolute;
  inset: 0;
  background:var(--filterr);
  opacity: 0;
  transition: opacity 0.4s ease;
  border-radius: 25px;
}

.img-hover-title,
.img-hover-text {
  opacity: 0;
  position: relative;
  z-index: 2;
  text-align: left;
  width: 90%;
  transition: opacity 0.4s ease, transform 0.4s ease;
  transform: translateY(20px);
}

.section4-img:hover::before,
.section4-img1:hover::before,
.section4-img2:hover::before {
  opacity: 1;
}

.section4-img:hover .img-hover-title,
.section4-img1:hover .img-hover-title,
.section4-img2:hover .img-hover-title,
.section4-img:hover .img-hover-text,
.section4-img1:hover .img-hover-text,
.section4-img2:hover .img-hover-text {
  opacity: 1;
  transform: translateY(0);
}
 .img-hover-title{
  color: var(--white);

font-family: Jost;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 146%; 
margin-bottom: 10px;
margin-left: 20px;
}
.img-hover-text{
  color: var(--white);
  font-family: Jost;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 146%; /* 29.2px */
  margin-bottom: 30px;
  margin-left: 20px;
}
.section5{
  width: 1280px;
  height:auto ;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 100px;
  gap: 30px;
  flex-direction: column;
  
}
.section5-title{
color: var(--Blue);

font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 68.6px */
}
.section5-text{
  color: var(--black);
width: 1065px;
font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 400;
line-height: 146%; /* 35.04px */
margin-bottom: 20px;
}
.section5-box{
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
  align-items: center;
}
.section5-cric{
  width: 20px;
height: 20px;
border-radius: 100px;
background-color: var(--darkred);
}
.section5-text1{
  color: var(--black);

font-family: Jost;
font-size: 20px;
font-style: normal;
font-weight: 700;
line-height: 146%; /* 46.72px */
}
.horse{
  width: 100px;
  height: auto;
  position: absolute;
  top: 260px;
  right: 0;
}
.section6{
  width: 1280px;
  height: 800px;
background: url(img/f.png);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;

}
.section6-title{
  color: var(--light-white);

font-family: "Koh Santepheap";
font-size: 40px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 68.6px */
}
.section6-text{
 color: var(--white);
text-align: center;

font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 140%; /* 33.6px */ 
    margin: 20px 0 50px 0;
}
.section6-box{
    width: 549px;
    height: auto;
    display: flex
;
    align-items: center;
    gap: 87px;
}
.section6-box1{
  width: 295px;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
}
.section6-pr {
  width: 212px;
  height: auto;
  margin: 0;
  transition: transform 0.4s ease, border 0.4s ease;
}

.section6-pr:hover {
  transform: scale(1.1);
  border-radius: 212px;
  border: 3px solid var(--white);
filter: brightness(0.9);
}

.section6-title1{
color: var(--light-white);
text-align: center;

font-family: Jost;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 121%; /* 39.736px */  
}
.section6-text1{
color: var(--white);
text-align: center;

font-family: Jost;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 121%; /* 24.2px */
}
.section7-box{
  width:1080px;
height: auto;
display: flex;
justify-content: flex-start;
align-items: flex-start;
gap: 20px;

}
.section7-box1{
  width:530px;
  height: auto;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 20px;

}
.section7-box2{
  width:530px;
  height: auto;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  
  gap: 20px;

}

  .section7-img {
    width: 530px;
    height: 810px;
    border-radius: 25px;
   
    background: url(img/ig1.jpeg) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
   flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .section7-img1 {
 width: 530px;
height: 296px;
    border-radius: 25px;
  
    background: url(img/ig2.jpg) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  
  .section7-img2 {
  width: 255px;
height: 492px;
    border-radius: 25px;
 
    background: url(img/ig3.jpg) right / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
    .section7-img3 {
  width: 255px;
height: 492px;
    border-radius: 25px;
 
    background: url(img/ig4.webp) center / cover no-repeat;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    flex-direction: column;
    position: relative;
    overflow: hidden;
  }
  .section7-img,
.section7-img1,
.section7-img2,
.section7-img3 {
  position: relative;
  overflow: hidden;
  padding-bottom: 25px;
  padding-right: 20px;
}

.section7-img::before,
.section7-img1::before,
.section7-img2::before,
.section7-img3::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--filterr1);
  opacity: 0;
  transition: opacity 0.4s ease;
  border-radius: 25px;
}


.section7-img:hover::before,
.section7-img1:hover::before,
.section7-img2:hover::before,
.section7-img3:hover::before {
  opacity: 1;
}

.section7-img:hover .img-hover-title,
.section7-img1:hover .img-hover-title,
.section7-img2:hover .img-hover-title,

.section7-img3:hover .img-hover-title
 {
  opacity: 1;
  transform: translateY(0);
}

.section7-btn{
  color: var(--black);

font-family: Jost;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: 140%; /* 33.6px */
text-decoration-line: underline;

text-decoration-thickness: 17%; /* 3.6px */
text-underline-offset: 35%; /* 6px */
padding-bottom: 5px;
align-self: flex-end;  
transition: all 0.3s ease;
}


.section7-btn::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height:4px;
  background: var(--cta);
  
  transition: width 0.4s ease;
}

.section7-btn:hover::after {
  width: 100%;
}

.section7-btn:hover {
  text-decoration-line: none;
  color: var(--black)000;
  transform: translateY(-2px);
  transition: transform 0.3s ease, color 0.3s ease;
}
.vid {
  position: relative;
  width: 1280px;
  height: 565px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 20px;
  padding: 155px 100px 0;
  overflow: hidden;
}

.video-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
.vid-title{ color: var(--white); width: 390px; font-family: "Koh Santepheap"; font-size: 46px; font-style: normal; font-weight: 700; line-height: normal; } .vid-text{ margin-bottom: 30px; color: var(--white); width: 350px; font-family: Jost; font-size: 18px; font-style: normal; font-weight: 600; line-height: normal;
}
.vid-title,
.vid-text,
.cta {
  position: relative;
  z-index: 1;
  color: var(--white);
}


.footer{    height: fit-content;;width: 1280px;
background-color: var(--Blue);
display: flex;flex-direction: column;
gap: 115.55px;
}

.container-footer{display: flex;
flex-direction: row;margin: 0;padding: 0;
gap: 85px;
padding: 110px 100px 0 100px;
box-sizing: border-box;}

.container-footer2{display: flex;
flex-direction: column;width: 186px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}


.container-footer3{display: flex;
flex-direction: column;width: 123px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}


.container-footer4{display: flex;
flex-direction: column;    width: 188px;

gap: 48px;list-style-type: none;
margin: 0;padding: 0;}

.container-footer5{display: flex;
flex-direction: column;width: 329px;
gap: 48px;list-style-type: none;
margin: 0;padding: 0;}









.title-footer{color: var(--white);
margin: 0;
font-family: Jost;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;}

.small-list-footer{display: flex;
flex-direction: column;
list-style-type: none;margin: 0;
padding: 0;
gap: 28px;}

.link-footer{text-decoration: none;}

.small-navs-footer {
  color: var(--white);
  margin: 0;
  font-family: Jost;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}


.small-navs-footer::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px; 
  width: 0;
  height: 1px;
  background-color: var(--whitefaded);
  transition: width 0.3s ease;
}


.small-navs-footer:hover::after {
  width: 100%;
}

.row-contact-us-footer{display: flex;
flex-direction: row;gap: 22px;
list-style-type: none;
margin: 0;padding: 0;}



.small-navs-footer2 {
  color: var(--white);
  margin: 0;
  font-family: Jost;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}

.list-icons-footer{display: flex;
flex-direction: row;padding: 0;
gap: 24px;margin: 0;}

.lastpart-footer{height: 64.938px;
width: 1280;background-color: var(--blue2);
padding: 0 100px;box-sizing: border-box;
display: flex;align-items: center;}

.container-last-part-footer{
    display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}

.last-text-footer{
    color: var(--white);
font-family: Jost;
font-size: 10px;
font-style: normal;
font-weight: 500;
line-height: 150%; /* 15px */
}

.list-final-part-footer{    display: flex
;
    flex-direction: row;
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 489px;
    gap: 11px;
    align-items: center;}



.small-navs-footer2-small {
  color: var(--whitefaded);
  margin: 0;
  font-family: Jost;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: relative;
  display: inline-block;
  text-decoration: none;
}


.small-navs-footer2-small::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px; 
  width: 0;
  height: 1px;
  background-color: var(--whitefaded);
  transition: width 0.3s ease;
}


.small-navs-footer2-small:hover::after {
  width: 100%;
}

.rect-footer{width: 1px;
height: 13.503px;
background: var(--whitefaded);}