@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

/* 
* { padding:0; margin:0; box-sizing: border-box; outline-width: 0; font-family: "Open Sans", sans-serif; }
a:hover { opacity: 0.9; }
a { text-decoration: none; cursor: pointer; color:#111; }
img { display:block; max-width: 100%; max-height:100%;}
ul, li { list-style-type:none; }  */

.ib-mainBoxData { position:relative; width:100%; height:510px;  display: flex; justify-content: flex-end; align-items: center; overflow: hidden; }
.mySwiper { width:100%; height:100% }
.mySwiper .swiper-wrapper { width:100%; height:100% }
.mySwiper .swiper-wrapper .swiper-slide { width:100%; height:100%; display:flex; flex-direction: column; justify-content: center; }
.mySwiper .swiper-wrapper .swiper-slide img { width:100%; height:100%; object-fit: cover; filter: brightness(60%); }
.mySwiper .swiper-wrapper .swiper-slide .floatText { transition: all 1s; transform:translateY(100px); opacity:0; position:absolute; display: flex; flex-direction: column; z-index:3; padding:4%; width:50%; max-width: 550px; color:#fff; }
.mySwiper .swiper-wrapper .swiper-slide.swiper-slide-active .floatText { transform:translateY(0); opacity:1;}
.mySwiper .swiper-wrapper .swiper-slide .floatText h2 { font-size: 26pt; background: linear-gradient(290deg,rgba(179, 155, 117, 1) 11%, rgba(224, 191, 144, 1) 30%, rgba(242, 216, 172, 1) 45%, rgba(236, 202, 164, 1) 57%, rgba(217, 167, 118, 1) 71%, rgba(172, 142, 90, 1) 81%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;  }
.mySwiper .swiper-wrapper .swiper-slide .floatText p { margin-top:10px; font-size: 12pt; text-shadow: 1px 1px #000; }
.mySwiper .swiper-wrapper .swiper-slide .floatText hr { margin:0 !important; padding: 0 !important; border:0; border-bottom:1px solid #d4a779; width:90%; align-self: flex-start; }
.mySwiper .swiper-wrapper .swiper-slide .floatText a { width:fit-content; max-width: 80%; text-shadow: 0 0 ; } 

.floatBox { 
    background-image: linear-gradient(196.4deg, #01010D 0%, rgba(1, 1, 13, 0.66) 34%, rgba(1, 1, 13, 0.7) 53%, rgba(1, 1, 13, 0.26) 100%);
    position:absolute; top:0; left:0; height:100%; width:40%; max-width: 600px; z-index: 2; display: flex; justify-content: center; flex-direction: column; }
.floatBox div { display: flex; flex-direction: column; color:#fff; width:70%; position: relative; margin-right:10%; }
.floatBox a { cursor: pointer; transition: all 1s; display: flex; gap:10%; color:#999; padding:24px 10%; padding-left:0; align-items: center; }
.floatBox a:hover { color:#fff; }
.floatBox a br { display:none; }
.floatBox a b { font-weight: 800; display: block; width:30%; font-size: 36pt; }
.floatBox a span { flex:1; display:block;  }
.floatBox p { display:none;  }
.floatBox hr { padding:0; margin:0; transition: all 1s; position: absolute; bottom:0; left:0; width:100%; display: block; border:0; border-bottom:1px solid #edd4b952 }

.floatBox div.ck a { color:rgba(242, 216, 172, 1) }
.floatBox div.ck hr { border-color:#edd4b9; width:114%; }

.floatBox div.ck a b, .floatBox div.ck a span {
  background: linear-gradient(290deg,rgba(179, 155, 117, 1) 11%, rgba(224, 191, 144, 1) 30%, rgba(242, 216, 172, 1) 45%, rgba(236, 202, 164, 1) 57%, rgba(217, 167, 118, 1) 71%, rgba(172, 142, 90, 1) 81%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text; /* for future support */
}
.floatBox div a:hover b, .floatBox div a:hover span {
  background: linear-gradient(290deg,rgba(179, 155, 117, 1) 11%, rgba(224, 191, 144, 1) 30%, rgba(242, 216, 172, 1) 45%, rgba(236, 202, 164, 1) 57%, rgba(217, 167, 118, 1) 71%, rgba(172, 142, 90, 1) 81%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text; /* for future support */
}

.swiper-pagination span { background-color: #999; }
.swiper-pagination .swiper-pagination-bullet-active { background-color:#d4a779; }