:root {
  --blackbg:#000000;
  --brownbg:#181e2b;
  --whitebg:#ffffff;
  --midgraybg:#b9b9b9;
  --graybg:#454545;
  --glodenbg:#b9975a;
  --lightgraybg:#f8f8f8;
  --graylegbg:#ebebeb;
  --darkbrownbg:#5d0434;

  --comfont:#414042;
  --ftblack:#000000;
  --ftbrown:#181e2b;
  --ftwhite:#ffffff;
  --ftgray:#b9b9b9;
  --ftgloden:#b9975a;
  --ftlightgray:#f8f8f8;

}
/* comman style
----------------------*/
.homebannercont {max-width: 850px; padding-top: 10px; padding-left: 70px;}
.homebannercont h1 {font-size: 80px; font-family: var(--ft-extrabold); color: var(--ftwhite); margin-bottom: 25px; line-height: 1; position: relative; opacity: 0; top: 0px; visibility: hidden; transition: all 1.2s ease-in-out 0s; right: -180px;}
.swiper-slide-active .homebannercont h1 {opacity:1;right:0;visibility:visible}
.homebannercont h1 span {font-family: var(--ft-regular);}
.bancont {font-size: 25px; font-family: var(--ft-semibold); margin-bottom: 15px; line-height: 1.2; position: relative; opacity: 0; top: 0px; visibility: hidden; transition: all 1.2s ease-in-out 0s; right: -300px; min-height: 70px;}
.swiper-slide-active .bancont {opacity:1;right:0;visibility:visible}
.homebannercont .commonbtn {position: relative; opacity: 0;  visibility: hidden; transition: all 1.2s ease-in-out 0s; right: -400px; margin-bottom: 10px;}

.swiper-slide-active .homebannercont .commonbtn {opacity:1;right:0;visibility:visible}
a.commonbtn {
  display: inline-flex; justify-content: center; align-items: center; padding: 6px 16px; border-radius: 20px;/*
   background-color:var(--glodenbg);*/
   background-color: #111724; color: white; font-family: var(--ft-bold); position: relative; font-size: 16px;
   text-decoration: none;
 }
a:hover.commonbtn {background-color:var(--graybg); color: var(--ftwhite);}
.homebannerbg {height: 680px; background-color: var(--brownbg); color: var(--ftwhite); position: relative;}
.homebannerimg {position: absolute; right: 0; top: 0; width: 843px; height: 100%; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center; /*clip-path: circle(93.9% at 96% 51%);*/ border-radius: 340px 0px 0px 340px;}
.paginationbullet {position: relative; top: -200px;}
.paginationbullet .swiper-pagination {text-align: left; padding-left: 80px; bottom: 0;}
.paginationbullet .swiper-pagination-bullet {width: 11px; height: 11px; margin-left: 8px !important; margin-right: -8px; background-color: transparent; border: 1px solid var(--whitebg); opacity: 1;}
.paginationbullet .swiper-pagination-bullet-active {
  background-color: #d94d3a; /*background-color: var(--glodenbg); */border: 1px solid var(--glodenbg);}