/* -------------------------------------------------------------------
 * Template         : Blueket - Digital Agency & Portfolio HTML Template
 * Author           : SeparateWeb
 * File             : style.css
------------------------------------------------------------------- */
/*
1. Global Typography Settings       2. Theme Help Classes     3. Button     4. home hero section      5.  Common header     6. Service slider block     7. About Block    8.  Tabs Design     9.Review Block
10. Clients Block     11. Pricing Block     12. Blog Card     13. Form Design     14. Footer Design   15. Hover Effect Class      16. Accordion Design      17.Responsive Css*/

/*scrollbar Theme*/
::-webkit-scrollbar {width:4px;}
::-webkit-scrollbar-track {background: var(--bg-b2);}
::-webkit-scrollbar-thumb:hover {background: var(--orange-color);}
::-webkit-scrollbar-thumb {background: var(--orange-color3);}

/* Global Typography Settings */
*,html {
    -webkit-font-smoothing: antialiased;
    -moz-os-font-smoothing: grayscale;
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    outline: none;
    vertical-align: baseline;
}
body {
    font-family: var(--font-secondry);
    background: var(--white-color);
    color: var(--black-color-1);
    font-weight: 300;
    font-style: normal;
    line-height: 1.6;
    font-size: 18px;
    outline: none;
    overflow-x: hidden;
}
.animation, .sw-hover-1:hover a, .sw-hover-2:hover a, .sw-hover-2 a, .carrerlinkandimg, .nav-link, .sw-btn, .menu-icon, .swbdr, .linkiconsw{
-webkit-transition: 1.1s cubic-bezier(.16, .84, .442, .98);
-o-transition: 1.1s cubic-bezier(.16, .84, .442, .98);
transition: 1.1s cubic-bezier(.16, .84, .442, .98);
}
h1, h2,h3,h4,h5,h6{font-family: var(--font-primary); color: var(--black-color-0);}
h1, h2,h3,h4,h5,h6,p,ul,address{padding: 0; margin: 0;}
ul{list-style: none;}
h1{font-size: 50px; font-weight: 700; line-height: 62px;}
h2{font-size: 45px; font-weight: 700; line-height: 58px;}
h3{font-size: 38px; font-weight: 700; line-height: 50px;}
h4{font-size: 30px; font-weight: 600; line-height: 42px;}
h5{font-size: 22px; font-weight: 500; line-height: 30px;}
h6{font-size: 18px; font-weight: 500; line-height: 28px;}
a{text-decoration: none;}
.f15{font-size: 15px;}
.f14{font-size: 14px;}

/*theme Help Classes*/
.index-up{position: relative; z-index: 5;}
.index-down{position: relative; z-index: 0;}
.v-center{align-items: center;}
.italic{font-style: italic;}

/*template colors*/
:root {
  --font-primary:'Inter', sans-serif;
  --font-secondry:'Open Sans', sans-serif;  
  --black-color-0: #101f38;   
  --black-color-1: #3e4d68;   
  --black-color: #111111;   
  --white-color:#fff;
  --blue-color:#3c56eb;
  --blue-colo2:#5688f9;
  --blue-colo3:#233eff;
  --color-yellow-lite: #ffac5f;
  --orange-color: #ff5723;        
  --orange-color2: #ff5722;        
  --orange-color3: #ff2938;        
  --black-bg: #111111;
  --black-bg-1: #0e0e0e;    
  --black-bg-2: #181818;
  --black-bg-3: #2e2e2e;
  --black-bg-4: #1c1c1c;
  --sw-bg-1: #dde3da;    
  --sw-bg-2: #ff9900;    
  --sw-bg-3: #c90079;    
  --white-lite-1:rgb(255 255 255 / 20%);   
  --white-lite-2:rgb(255 255 255 / 10%);   

  --bg-b0:#ffe7da;
  --bg-b1:#fbf3e9;
  --bg-b2:#f5f5f5;
  --bg-b3:#f6f7ff;
  --bg-b4:#fff6e0;

  /*gradient colors*/
  --gradient-0: linear-gradient(225deg, #ffcaba 0%, #f0fbff 100%);   
  --gradient-1: linear-gradient(225deg, #5688f9 0%, #233eff 100%);   
  --gradient-2: linear-gradient(225deg, #fe7649 0%, #ff2938 100%);
  --gradient-3: linear-gradient(225deg, #d821ff 0%, #6d2ccd 100%);
  --gradient-4: linear-gradient(225deg, #ffb868 0%, #ff6022 100%);
  --gradient-5: linear-gradient(225deg, #a4f251 0%, #129c1f 100%);
  --gradient-6: linear-gradient(225deg, #d70a84 0%, #51127f 100%);
  --gradient-6: linear-gradient(225deg, #d70a84 0%, #51127f 100%);    
  --gradient-7: linear-gradient(225deg, #fff8f1 0%, #ffd5c1 100%);
}



.section-space{padding-top: 100px; padding-bottom: 100px;}
/*margin top*/
.mr10{margin-right: 10px;}
.mt5{margin-top: 5px;}
.mt10{margin-top: 10px;}
.mt15{margin-top: 15px;}
.mt20{margin-top: 20px;}
.mt25{margin-top: 25px;}
.mt30{margin-top: 30px;}
.mt35{margin-top: 35px;}
.mt40{margin-top: 40px;}
.mt45{margin-top: 45px;}
.mt50{margin-top: 50px;}
.mt55{margin-top: 55px;}
.mt60{margin-top: 60px;}
.mt65{margin-top: 65px;}
.mt70{margin-top: 70px;}
.mt75{margin-top: 75px;}
.mt80{margin-top: 80px;}
.mt85{margin-top: 85px;}
.mt90{margin-top: 90px;}
.mt95{margin-top: 95px;}
.mt100{margin-top: 100px;}
.mt105{margin-top: 105px;}
.mt110{margin-top: 110px;}
.mt115{margin-top: 115px;}
.mt120{margin-top: 120px;}
.mt125{margin-top: 125px;}
.mt130{margin-top: 130px;}
.mt135{margin-top: 135px;}
.mt140{margin-top: 140px;}
.mt145{margin-top: 145px;}
.mt150{margin-top: 150px;}

/*margin bottom*/
.mb5{margin-bottom: 5px;}
.mb10{margin-bottom: 10px;}
.mb15{margin-bottom: 15px;}
.mb20{margin-bottom: 20px;}
.mb25{margin-bottom: 25px;}
.mb30{margin-bottom: 30px;}
.mb35{margin-bottom: 35px;}
.mb40{margin-bottom: 40px;}
.mb45{margin-bottom: 45px;}
.mb50{margin-bottom: 50px;}
.mb55{margin-bottom: 55px;}
.mb60{margin-bottom: 60px;}
.mb65{margin-bottom: 65px;}
.mb70{margin-bottom: 70px;}
.mb75{margin-bottom: 75px;}
.mb80{margin-bottom: 80px;}
.mb85{margin-bottom: 85px;}
.mb90{margin-bottom: 90px;}
.mb95{margin-bottom: 95px;}
.mb100{margin-bottom: 100px;}
.mb105{margin-bottom: 105px;}
.mb110{margin-bottom: 110px;}
.mb115{margin-bottom: 115px;}
.mb120{margin-bottom: 120px;}
.mb125{margin-bottom: 125px;}
.mb130{margin-bottom: 130px;}
.mb135{margin-bottom: 135px;}
.mb140{margin-bottom: 140px;}
.mb145{margin-bottom: 145px;}
.mb150{margin-bottom: 150px;}

/*padding top*/
html .pt0{padding-top: 0;}
.pt5{padding-top: 5px;}
.pt10{padding-top: 10px;}
.pt15{padding-top: 15px;}
.pt20{padding-top: 20px;}
.pt25{padding-top: 25px;}
.pt30{padding-top: 30px;}
.pt35{padding-top: 35px;}
.pt40{padding-top: 40px;}
.pt45{padding-top: 45px;}
.pt50{padding-top: 50px;}
.pt55{padding-top: 55px;}
.pt60{padding-top: 60px;}
.pt65{padding-top: 65px;}
.pt70{padding-top: 70px;}
.pt75{padding-top: 75px;}
.pt80{padding-top: 80px;}
.pt85{padding-top: 85px;}
.pt90{padding-top: 90px;}
.pt95{padding-top: 95px;}
.pt100{padding-top: 100px;}
.pt105{padding-top: 105px;}
.pt110{padding-top: 110px;}
.pt115{padding-top: 115px;}
.pt120{padding-top: 120px;}
.pt125{padding-top: 125px;}
.pt130{padding-top: 130px;}
.pt135{padding-top: 135px;}
.pt140{padding-top: 140px;}
.pt145{padding-top: 145px;}
.pt150{padding-top: 150px;}

/*padding bottom*/
.pb5{padding-bottom: 5px;}
.pb10{padding-bottom: 10px;}
.pb15{padding-bottom: 15px;}
.pb20{padding-bottom: 20px;}
.pb25{padding-bottom: 25px;}
.pb30{padding-bottom: 30px;}
.pb35{padding-bottom: 35px;}
.pb40{padding-bottom: 40px;}
.pb45{padding-bottom: 45px;}
.pb50{padding-bottom: 50px;}
.pb55{padding-bottom: 55px;}
.pb60{padding-bottom: 60px;}
.pb65{padding-bottom: 65px;}
.pb70{padding-bottom: 70px;}
.pb75{padding-bottom: 75px;}
.pb80{padding-bottom: 80px;}
.pb85{padding-bottom: 85px;}
.pb90{padding-bottom: 90px;}
.pb95{padding-bottom: 95px;}
.pb100{padding-bottom: 100px;}
.pb105{padding-bottom: 105px;}
.pb110{padding-bottom: 110px;}
.pb115{padding-bottom: 115px;}
.pb120{padding-bottom: 120px;}
.pb125{padding-bottom: 125px;}
.pb130{padding-bottom: 130px;}
.pb135{padding-bottom: 135px;}
.pb140{padding-bottom: 140px;}
.pb145{padding-bottom: 145px;}
.pb150{padding-bottom: 150px;}
/**/
.orange-color{ color: var(--orange-color);}
.yellow-color{ color: var(--color-yellow-lite);}
.black-color{ color: var(--black-color);}
.darkbg2{background: var(--black-bg-2);}
.white-color{ color: var(--white-color);}
.black-bg{ background: var(--black-color);}
.black-bg-1{ background: var(--black-bg-1);}
.black-bg-2{ background: var(--black-color-2);}
.white-bg{ background: var(--white-color);}
.blue-bg{ background: var(--blue-color);}
.orange-bg{ background: var(--orange-color);}
.gradient-1{ background: var(--gradient-1);}
.gradient-2{ background: var(--gradient-2);}
.gradient-3{ background: var(--gradient-3);}
.gradient-4{ background: var(--gradient-4);}
.gradient-5{ background: var(--gradient-5);}
.gradient-6{ background: var(--gradient-6);}

.bkbg0{  background: url(../images/background/ad-noise.png) var(--bg-b0);}
.bkbg2{  background: url(../images/background/ad-noise.png) var(--bg-b2);}
.bkbg3{  background: url(../images/background/ad-noise.png) var(--bg-b3);}

.text-gradient-1{
  background: var(--black-color-0);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.yellow-color:hover{color: var(--color-yellow-lite);}
img {max-width: 100%; height: auto;}
.zup{position: relative;z-index: 50;}
.noshadow{box-shadow: none !important;}
.shadow {box-shadow: 0px 10px 25px -5px rgb(0 0 0 / 10%) !important;}
/*button*/

.sw-btn{
  border-radius: 100px;
  overflow: hidden;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.4px;
  padding: 0px 42px;
  height: auto;
  text-align: center;
  position: relative;
  z-index: 1;
  display: inline-flex;
  line-height: 64px;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  grid-gap: 8px;
  border: 0;
  transform: translateY(0);
}
.sw-btn:after{
  position: absolute;
  content: "";
  width: 100%;
  height: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  transition: all 0.3s ease;
}

/* blue button */
.sw-blue-btn{ 
  color: var(--white-color);
  background: var(--blue-color);
  box-shadow: 0px 20px 20px rgb(36 0 255 / 10%);}
.sw-blue-btn:hover { color: var(--white-color);}
.sw-blue-btn:after {background: var(--blue-color);  background-image: linear-gradient(315deg, var(--blue-colo2) 0%, var(--blue-colo3) 80%);}
.sw-blue-btn:hover:after { top: 0;  height: 100%;}

/* orange button */
.sw-orange-btn{ 
  color: var(--white-color);
  background: var(--orange-color);
  box-shadow: 0px 19px 40px -10px rgb(255 79 0 / 25%);}
.sw-orange-btn:hover{color: var(--white-color);}
.sw-orange-btn:after { background: var(--orange-color);  background-image: linear-gradient(315deg, var(--orange-color) 0%, var(--orange-color3) 80%);}
.sw-orange-btn:hover:after { top: 0;  height: 100%;}

/* white button */
.sw-white-btn{ color: var(--black-bg); background: var(--white-color);}
.sw-white-btn:hover{color: var(--black-bg);}
.sw-white-btn:after { background: var(--sw-bg-1);  background-image: linear-gradient(315deg, var(--sw-bg-1) 0%, var(--sw-bg-1) 80%);}
.sw-white-btn:hover:after { top: 0;  height: 100%;}

.inline-btn{
    font-weight: 500;   
    display: inline-flex;   
    text-decoration: none;
    align-items: center;
    grid-gap: 8px;
    color: var(--black-color-0);
}
.txt-white{color: var(--white-color);}
.header-item-right .menu-icon:hover{background: var(--orange-color);}
.bdrtop{border-top: 1px solid var(--bs-gray-300);}
/*home hero section*/
.heroimg{background: url(../images/common/office-back.jpg) no-repeat; }
.dot-bg{background: url(../images/background/swt-bg-design.png) no-repeat; }
.color-bgs { background: url(../images/background/top-right-body.png) no-repeat;  background-size: cover;  background-position: right top;}
.blur-bg-blocks {
  overflow-x: hidden;
  overflow-y: hidden;
  height: 100%;
  width: 100%;
  position: absolute;
}
.blur-bg-set {
  overflow: hidden;
}

.blur-bg {
  z-index: 0;
  border-radius: 50%;
  position: absolute; 
  -webkit-filter: blur(100px);
  filter: blur(100px);  
  z-index: -1;
}
.blur-bg-a {
  right: -10%;
  top: -10%;
  background: var(--sw-bg-2);
  opacity: 30%;
  width: 500px;
  height: 500px;
}

.blur-bg-b {
  right: -10%;
  top: 0%;
  background: var(--sw-bg-3);
  width: 900px;
  height: 700px;
  opacity: 10%;
}
.bggrdient {
  position: relative;
  overflow: hidden;
}
.h1{font-size: 70px; font-weight: 800;}
.demo-1-hero{
    min-height: 950px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.demo-1-hero .hero-content{   padding: 0 10%;}
.demo-1-hero .hero-content p{ padding: 0px 14%}
.hero-content p{font-size: 20px; line-height: 30px;}
.demo-2-hero {
  position: relative;
  z-index: 1;
  padding-top: 180px;
  padding-bottom: 100px;
  min-height: 100vh;
  display: grid;
  align-items: center;
}
.hero-content .bottombtn {
  font-size: 13px;
  margin-top: 5px;
}
.demo-2-hero .hero-content h1{
  font-size: 50px;    
  line-height: 62px;
  font-weight: 800;
}
.uniqpont .mediainfoblock p{
  font-size: 18px;
  line-height: 28px;
  opacity: 1;
}
.uniqpont {
  display: flex;
  margin-top: 40px;
  grid-gap: 30px;
  justify-content: flex-start;
}
/**header**/
@-webkit-keyframes slideLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
  }
}

@keyframes slideLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
  }
}

@-webkit-keyframes slideRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
}

@keyframes slideRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0%);
    transform: translateX(0%)
  }
  100% {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
  }
}
.headeraction ul{
  display: flex;
    align-items: center;
    grid-gap: 15px;
}
.header-btn{
  line-height: 48px;
  padding: 0 32px;
}
.sticky {
  background: rgb(255 255 255 / 80%);
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);
  height: 75px !important;
  backdrop-filter: blur(10px);
}
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 85px;
  padding: 0;
  z-index: 100;
  display: flex;
  align-items: center;
}
.brandlogo img{max-height: 35px;} 
.brandlogo .light{display: none;} 
.brandlogo .dark{display: block; min-height: 28px; height: 28px;} 

.sidedarklogo{display: block;} 
.sidewhitelogo{display: none;} 

.header .wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  gap: 5px;
}

.header-item-left {
  display: flex;
  align-items: center;
}

.header-item-center {
  display: flex;
  align-items: center;
}

.headeraction{display: flex;}

.header-item-right .menu-icon { 
  font-size: 18px;  
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100px;
  color: var(--white-color);
  background: var(--blue-color);
  box-shadow: 0px 20px 20px rgb(36 0 255 / 10%);
}

.header .menu>ul>li {
  display: inline-flex;
  margin-left: 15px;
}

.header .menu>ul>li>a {
  color: var(--black-color-0);
  position: relative;
  font-family: inherit;
  font-size: 18px;
  line-height: 85px;
  border: none;
  outline: none;
  text-transform: capitalize;
  -webkit-transition: color .3s ease;
  transition: color .3s ease;
}
.menu-item-has-children i{font-size: 15px;}
.header .menu>ul>li .menu-subs {
  background: var(--white-color);
  border-top: 2px solid var(--color-yellow-lite);
  position: absolute;
  width: 100%;
  height: auto;   
  z-index: 109;
  opacity: 0;
  visibility: hidden;
  border-radius: 14px;
  -webkit-transition: all .5s ease;
  transition: all .5s ease;
  padding: 25px;
  top: 95px; 
  box-shadow: 0px 20px 20px -5px rgb(0 0 0 / 15%);
}

.header .menu>ul>li .menu-subs>ul>li {
  line-height: 1
}

.header .menu>ul>li .menu-subs>ul>li>a {
  color: var(--black-color-0);
  display: inline-block;  
  padding: 10px 0;
  font-size: 16px;
  border: none;
  outline: none;   
  text-transform: capitalize;
  -webkit-transition: all .3s ease;
  transition: all .3s ease
}

.header .menu>ul>li .menu-column-1 {
  min-width: auto;
  max-width: max-content;
}

.header .menu>ul>li .menu-subs.menu-mega {
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.header .menu>ul>li .menu-subs.menu-mega>.list-item>ul>li {
  display: block;
  line-height: 1
}

.header .menu>ul>li .menu-subs.menu-mega>.list-item>ul>li>a {
  color: var(--black-color-0);
  display: inline-block;
  font-size: 16px;
  border: none;
  outline: none;
  text-transform: capitalize;
  -webkit-transition: color .3s ease;
  transition: color .3s ease;
  padding: 10px 0;
}

.header .menu>ul>li .menu-subs.menu-column-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 1320px;
  width: 1320px;
  padding: 25px;   
}

.header .menu>ul>li .menu-subs.menu-column-4>.list-item {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  padding: 0 1rem
}
.header .menu>ul>li .menu-subs.menu-column-4>.list-item .title {
  color: var(--orange-color);
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  font-weight: 300;
  font-size: 14px;
  padding: 10px 0 0px 0;
}
.header .menu>ul>li .menu-subs.menu-column-4>.list-item.text-center .title {  text-align: center}
.header .menu>ul>li .menu-subs.menu-column-4>.list-item img {
  display: block;
  width: 100%;
  height: auto;
  margin-top: .75rem;
  -o-object-fit: cover;
  object-fit: cover
}
.header .menu-mobile-header,.header .menu-mobile-toggle {  display: none}

@media screen and (min-width:1199px) {
  .header .menu>ul>li.menu-item-has-children:hover .menu-subs {   
    opacity: 1;
    visibility: visible;
    top:85px;
  }
}
@media screen and (max-width: 1199px) {
  .header-item-left, .header-item-right {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto
  }
  .wrapper {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 0 auto;
    padding: .5rem 0
  }
  .header .menu-mobile-toggle {
    position: relative;
    display: block;
    cursor: pointer;
    width: 25px;
    height: 16px;
    border: none;
    outline: none;
    background: none;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
  }
  .header .menu-mobile-toggle span {
    background: var(--black-color-0);
    display: block;
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    border: none;
    outline: none;
    opacity: 1;
    border-radius: .25rem;      
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out
  }
  .header .menu-mobile-toggle span:nth-child(1) {    top: 0  }
  .header .menu-mobile-toggle span:nth-child(2),  .header .menu-mobile-toggle span:nth-child(3) {    top: .5rem  }
  .header .menu-mobile-toggle span:nth-child(4) {    top: 1rem  }
  .header-item-right {    -webkit-box-align: center;    -ms-flex-align: center;    align-items: center  }
  .header .menu {
    background: var(--white-color);
    position: fixed;
    top: 0;
    left: 0;
    width: 85%;
    max-width: 380px;
    height: 100%;
    z-index: 111;
    overflow: hidden;      
    -webkit-transform: translate(-100%);
    transform: translate(-100%);  
    opacity: 0; 
  }
  .header .menu.active {    -webkit-transform: translate(0%);    transform: translate(0%);    opacity: 1;  }
  .header .menu>ul>li {    display: block;   line-height: 1;    margin: 0  }
  .header .menu>ul>li>a {
    display: block;
    line-height: 3.125rem;
    height: 3.125rem;
    padding: 0 3.125rem 0 1rem;
    border-bottom: 1px solid var(--bs-gray-300)
  }
  .header .menu>ul>li>a i {
      position: absolute;
      font-size: 16px;
      top: 0;
      right: 0;
      width: 50px;
      height: 50px;
      text-align: center;
      -webkit-transform: rotate(-90deg);
      transform: rotate(-90deg);
      display: flex;
      align-items: center;
      justify-content: center;
  }
  .header .menu .menu-mobile-header {
    position: relative;
    position: sticky;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    top: 0;
    height: 3.125rem;
    z-index: 110;
    border-bottom: 1px solid var(--bs-gray-300);   
    background: repeating-linear-gradient( 45deg, var(--bs-gray-100), var(--bs-gray-200) 5px, var(--bs-gray-100) 5px, var(--bs-gray-200) 10px );
  }
  .darkmode .header .menu .menu-mobile-header {
    background: repeating-linear-gradient( 45deg,var(--black-bg-2),var(--black-bg-3) 5px,var(--black-bg-2) 5px,var(--black-bg-3) 10px ); border-bottom: 1px solid var(--black-bg-3);}
  .darkmode .header .menu-mobile-toggle span {background: var(--black-color-0);}
  .darkmode .header .menu {background: var(--black-bg-2);}
  .darkmode .header .menu>ul>li>a {border-bottom: 1px solid var(--black-bg-3);}
  .darkmode .header .menu-mobile-toggle span {background: var(--white-color);}

.header .menu .menu-mobile-header .menu-mobile-arrow {
      display: none;
      font-size: 20px;
      width: 50px;
      height: 50px;
      cursor: pointer;
      text-align: center;
      background: var(--blue-color);
      border: 0;
      color: var(--white-color);   
  }
  .header .menu .menu-mobile-header.active .menu-mobile-arrow {    display: block  }
  .header .menu .menu-mobile-header .menu-mobile-title {
    font-family: inherit;
    font-size: 1rem;
    font-weight: 500;
    line-height: inherit;     
    text-transform: capitalize
  }
  .header .menu .menu-mobile-header .menu-mobile-close {
      font-size: 20px;
      cursor: pointer;
      width: 50px;
      height: 50px;
      text-align: center;
      display: flex;
      align-items: center;
      justify-content: center;
      border: 0;
      background: var(--blue-color);
      color: var(--white-color);
  }
  .header .menu .menu-section {    height: 100%;    overflow-y: auto;    overflow-x: hidden;  }
  .header .menu>ul>li .menu-subs {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    max-width: none;
    min-width: auto;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem;
    padding-top: 4rem;
    opacity: 1;
    overflow-y: auto;
    visibility: visible;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-box-shadow: none;
    box-shadow: none; 
    border: 0px;
  }
  .header .menu>ul>li .menu-subs.menu-mega {
    position: absolute;
    display: none;
    top: 0;
    left: 0;
    max-width: none;
    min-width: auto;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 1rem;
    padding-top: 4rem;
    opacity: 1;
    overflow-y: auto;
    visibility: visible;
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  .header .menu>ul>li .menu-subs.active {    display: block  }
  .header .menu>ul>li .menu-subs.menu-column-4>.list-item {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    padding: 0rem;
  }
  .header .menu>ul>li .menu-subs.menu-column-4>.list-item img {    margin-top: 0;  }
  .header .menu>ul>li .menu-subs.menu-column-4>.list-item.text-center .title {    margin-bottom: 1.25rem;  }
  .header .menu>ul>li .menu-subs.menu-column-4>.list-item.text-center:last-child .title {    margin-bottom: 0rem;  }
  .header .menu>ul>li .menu-subs>ul>li>a {    display: block;  }
  .header .menu>ul>li .menu-subs.menu-mega>.list-item>ul {    margin-bottom: 1rem;  }
  .header .menu>ul>li .menu-subs.menu-mega>.list-item>ul>li>a {    display: block;  }
  .overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    background: rgba(0, 0, 0, .65);
    -webkit-transition: all .45s ease-in-out;
    transition: all .45s ease-in-out;
  }
  .overlay.active {    opacity: 1;    visibility: visible;  }
}
.headerbg .menu>ul>li>a { color: var(--white-color);}
.headerbg.sticky .menu>ul>li>a { color: var(--black-color-0);}


/*service slide*/
.circleffect div{
  width: 100%;
  height: 200px;
  background: var(--white-color);
  opacity: .080;
  display: block;
  border-radius: 100%;
  position: absolute;
  right: 0;
  left: 0;
  bottom: -14%;
  margin: 0 auto;
}
.service-card-div:hover  .circleffect div{bottom: -10%;}
.service-row-block {    padding: 0 20px;    margin: -160px 0 100px 0;}
.service-card-div a{ padding: 50px 0;}
.service-card-div{
  border-radius: 150px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
.owl-carousel .owl-item .service-images img{    width: 200px;    margin: 0px auto 0px;}
.service-name {
  font-family: var(--font-primary);
  text-align: center;
  color: var(--white-color);
  padding-top: 40px;
  font-size: 22px;
  line-height: 32px;
  font-weight: 700;
}

/*home about*/

.scriptheading{   color: var(--orange-color);     letter-spacing: 2px;    display: block;}
.paragraph p + p {margin-top: 15px;}

.item-pair{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 15px;
}
.videobutton {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    grid-gap: 15px;
}
.videobutton a{
    min-width: 60px;
    min-height: 60px;
    display: inline-flex;
    background: var(--bg-b2);
    box-shadow: 0px 20px 20px -5px rgb(0 0 0 / 15%);
    border-radius: 1000px;
    transition: all 0.3s ease-in-out 0s;
    cursor: pointer;
    outline: none;
    position: relative;
    padding: 10px;
    align-items: center;
}
.videobutton span{font-weight: 500;}
.button-play {
    width: 0;
    height: 0;
    border-top: 13px solid transparent;
    border-left: 21px solid var(--blue-color);
    border-bottom: 13px solid transparent;
    text-align: center;
    margin: 0 auto 0;
    margin-left: 10px;
}
.button-play::before {
    content: '';
    width: 60px;
    height: 60px;
    border-radius: 100%;
    border: 6px solid var(--bg-b2);;
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); 
}
.homepagecounter {  display: grid;  grid-gap: 30px;}
.immt100{margin-top: 100px;}
.overtheimg {
  display: flex;
  justify-content: space-between;
  grid-gap: 30px;
  background: var(--bg-b2);
  padding: 40px 40px;
  border-radius: 14px;
  margin: -80px auto 100px;
  width: 95%;
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);
}
.countertag{ margin-top: 5px;  display: block;}
.text-ends{text-align: right;}
.counter-setdiv p{
  font-size: 60px;
  line-height: 70px;
  font-weight: 700;
  color: var(--orange-color);
  display: flex;
  align-items: center;
  grid-gap: 8px;
}
.card-img-round{    border-radius: 14px;    overflow: hidden;}
.work-imags {  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);  overflow: hidden;  border-radius: 14px;}
.icon-label {    display: grid;    grid-template-columns: repeat(4, 1fr);    grid-gap: 30px;} 
.icon-data img{    width: 50px; margin-bottom: 15px;}
.card-img-round img{width: 100%;}
.review-links {
  display: flex;
  justify-content: space-evenly;
  margin: 30px 0 30px 0px;
  align-items: center;
  grid-gap: 30px;
}
.review-links img{max-height: 60px;}
/*owl icon slider*/
.icon-slider-block  {text-align: center;}
.icon-slider-block .slider-icon img{max-width: 60px; margin: 0 auto;}
.icon-slider-block .slider-icon-text p{margin-top: 15px; font-size: 15px; line-height: 20px;}
/*owl icon slider*/
.shcb{   
    border-radius: 100%;
    position: absolute; 
    right: 0;
    left: 0;  
    margin: 0 auto;
}
.sw-half-circle-block1{
    background: var(--gradient-1);
    width: 500px;
    height: 500px;   
    top: -250px; 
}
.sw-half-circle-block2{
    background: var(--gradient-2);
    width: 170px;
    height: 170px;
    bottom: -85px;
}
.sw-work-preview{
    display: grid;
    grid-template-columns: 65% auto;
    grid-gap: 20px;
}
.sw-work-preview a{display: block;}
.sw-right-slot{
    display: grid;
    grid-template-columns: auto;
    grid-gap: 20px;
}
.sw-work-preview img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.roundimg{overflow: hidden; border-radius: 14px;}
/*tabs design*/
.sw-tabs-links .nav-tabs li + li{margin-top: 10px;}
.sw-tabs-links .nav-tabs .nav-item.show .nav-link, .sw-tabs-links .nav-tabs .nav-link.active { 
    background-color: var(--orange-color);
    border-color: transparent;
    color: var(--white-color);
}
.sw-tabs-links .nav-tabs .nav-link:hover {
  background-color: var(--orange-color);
  color: var(--white-color);
}
.sw-tabs-links .nav-tabs {border-bottom: 0px}
.sw-tabs-links .nav-tabs .nav-link i{margin-right: 8px;}
.sw-tabs-links .nav-tabs .nav-link {
    margin-bottom: 0;
    background: 0 0;
    border: 0px solid transparent;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;   
    font-size: 18px;
    padding: 15px 20px;    
    width: 100%;
    text-align: left;
    border-radius: 14px;
    background: var(--white-color);
    color: var(--black-color-1);
    box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);
}
.sw-tabs-links .nav-tabs button{
    position: relative;
    display: flex;
    align-items: center;
}
.sw-tabs-links .nav-tabs button:after {
    position: absolute;
    content: "\f178";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    right: 15px;
    font-size: 14px;
    background: var(--white-lite-1);
    width: 20px;
    height: 20px;
    border-radius: 100px;
}
.sw-tabs-links .nav{flex-direction: column;}
.waveline{
    background: url(../images/shape/wave-line.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.office-interior{background: var(--gradient-1);}
.imageoutofbox{margin-top: 300px;}
.imageoutbox{margin-top: -200px;}

/*review*/
.blueket-card-noise{
    /* background: url(../images/shape/noise.png) var(--white-lite-2); */
    background: var(--bg-b2);
    border: 1px solid var(--bs-gray-300);
}
.pair-block{
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 25px;
    align-items: center;
}
.review-img-block {
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 25px;
    align-items: center;
    padding: 0 20px;
    justify-content: start;
}
.user-image {
    width: 100px;
    height: 100px;
    border-radius: 100%;
    overflow: hidden;
    border: 2px solid var(--white-lite-2);
}
.user-content h5{ margin: 0 0 5px 0;}
.user-content p{ opacity: 0.8; font-size: 16px;}
.starrating{text-align: right;}
.starrating ul li{display: inline-flex;}
.starrating li a.checked { color: var(--color-yellow-lite);}
.review-content {padding: 0 30px;}
.review-content p{position: relative;}
.review-content p:before{
    position: absolute;
    content: "\f10d";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 90px;
    line-height: 1;
    top: -20px;
    left: 0;
    color: var(--white-lite-2);
}

.review-footer{padding:30px; border-top: 2px solid var(--white-lite-2);}
.image-icon{width: 40px;}

/*owl button*/
.owl-carousel.full-button .owl-nav  .owl-prev, .owl-carousel.full-button .owl-nav  .owl-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: var(--white-color);
    width: 40px;
    height: 40px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 7px 15px 0px rgb(0 0 0 / 15%);
}
.owl-carousel.full-button .owl-nav .owl-prev{
    color: var(--black-bg);
    left: -20px;
}
.owl-carousel.full-button .owl-nav .owl-next{
    color: var(--black-bg);
    right: -20px;
}
/*clients*/
.clients-logo-table{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}
.img-client-logo-cell {
  padding: 30px;
  border: 1px solid var(--bs-gray-200);
  border-radius: 14px;
}

.owl-carousel.full-button.centerbtns .owl-nav .owl-prev{
  top: auto;
  transform: translateY(0%);
  color: var(--black-bg);
  left: -50px;
  right: 0;
  text-align: center;
  margin: 0 auto;
}
.owl-carousel.full-button.centerbtns .owl-nav .owl-next{
  top: auto;
  transform: translateY(-0%);
  color: var(--black-bg);
  right: -50px;
  left: 0;
  margin: 0 auto;
}

.owl-carousel.full-button.centerbtns .owl-nav {
  position: relative;
  top: 30px;
}


/*pricing block*/
.p-head-sw h3, .p-head-sw p, .p-head-sw h2, .what-in-plan-sw h5, .what-in-plan-sw ul li {
  color: var(--white-color);
}

.pricing-column:hover .sw-btn{ grid-gap: 18px; box-shadow: 0px 12px 25px 0px rgb(0 0 0 / 25%);}

.pricing-table-with-cta{
    display: grid;
    grid-template-columns: 75% auto;
    grid-gap: 30px;
    align-items: center;
}
.pricing-table{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 2px;
}
.pricing-table2{  
    grid-template-columns: repeat(2, 1fr);   
}
.pricing-column{ padding: 40px 0px; position: relative;}

.what-in-plan-sw{
    padding: 30px 30px 0px 30px;
    border-top: 2px solid var(--bs-body-bg);
}
.what-in-plan-sw h5 {font-size: 20px; }
.p-head-sw{ padding: 0px 30px;}
 
.p-head-sw h3{
    font-size: 24px;
    margin: 0px 0 10px 0;
}
.p-btn-cta-sw .sw-btn{ width: 100%;  line-height: 62px;}
.p-btn-cta-sw{
    text-align: center;
    margin: 40px 0 30px 0;
    padding: 0 30px;
}
.what-in-plan-sw ul li{
    padding: 0 0 0 20px;
    font-size: 17px;
    position: relative;
}
.what-in-plan-sw ul li:before {
    content: "\f192";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 8px;
    font-size: 9px;
}
.pricemain{    margin: 30px 0 0 0;    font-size: 40px;}
.what-in-plan-sw ul li + li{margin-top: 6px;}
.tblfirst{border-radius:14px 0 0 14px ;}
.tblend{border-radius: 0 14px  14px 0 ;}
.recomnd-block-sw{
    color: var(--black-bg);
    background-color: var(--bs-warning);
    position: absolute;
    right: 0;
    left: 30px;
    width: fit-content;
    top: -14px;
    bottom: auto;
    display: flex;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 10px;
    letter-spacing: 1px;
    font-weight: 700;
    align-items: center;
    justify-content: center;
}
.p-btn-cta-sw a.inline-btn{color: var(--white-color);}
.p-btn-cta-sw a.inline-btn:hover{color: var(--white-color);}
.mediablock{
    display: flex;
    grid-gap: 25px;
}
.mediablock div:first-child {
    flex-shrink: 0;
}
.icondiv{
    height: 60px;
    width: 60px;
    display: flex;
    align-items: center;
    justify-content: center;   
}
.icondiv i{font-size: 35px;}
.mediainfoblock p{font-size: 16px;}
.mediainfoblock a.contactlink{
    text-decoration: none;
    color: var(--bs-orange);
    font-size: 22px;
    font-weight: 500;
}
.dashbefore{position: relative; padding-left: 25px;}
.dashbefore:before {
  content: "";
  position: absolute;
  display: inline-block;
  top: 50%;
  left: 0;
  transform: translateY(-50%); 
  width: 12px;
  height: 2px;
  background: var(--orange-color);  
}
.indexdemo{background: var(--white-color) !important;}
/*blogs*/
.dateandvieicon{
  display: flex;
  align-items: center;
  justify-content: space-between;}
.bdrwor{border: 1px solid var(--bs-gray-300);}
.bdrwor-rt{border-right: 1px solid var(--bs-gray-300);}
.cardlinkfooter{
  border-top: 1px solid var(--bs-gray-300);;
  display: grid;
  grid-template-columns: auto 60px;
  height: 60px;
  align-items: center;
  padding-left: 25px;
}
.div-card-img-info{padding: 25px 25px 0px 25px;}
.linkiconsw {
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 1px solid var(--bs-gray-300);
  min-height: 60px;
}
.swbluketcard:hover .linkiconsw {
  background: var(--orange-color2);
  color: var(--white-color);
}
.buttontext{text-transform: uppercase;  font-size: 16px;}
.cardaclr a{color: var(--black-color-1);}
.img-div-sw-bkt{
    border-radius: 8px;
    overflow: hidden;
    height: 250px;
}
.img-div-sw-bkt img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.swbluketcard {
  flex-direction: column;
  -webkit-box-pack: justify;
  justify-content: space-between;
  display: flex;
  height: calc(100% - 0px);
}
.swbluketcard:hover{background: var(--bg-b2);}
.info-div-sw-btk{ padding: 30px 0 0 0;}
.blogtitle{
    color: var(--black-color-0);   
    font-size: 22px;
    line-height: 32px;
    font-weight: 500;
}
.blogsubdata{
    padding: 20px 0;
    font-size: 16px;}
/**/
.cta-info-div-bkt h3, .cta-info-div-bkt p {color: var(--white-color);}
.whitebg h3 {color: var(--black-color-0);}
.whitebg p {color: var(--black-color-1);}
.cta-design-block-sw{
    display: grid;
    grid-template-columns: 50% 30%;
    grid-gap: 30px;
    justify-content: space-between;
    padding: 40px;
    border-radius: 24px;
}

.continfoblck h2{
    font-size: 80px;
    line-height: 92px;
    font-weight: 800;
}
.contactinkediv a{
  color: var(--black-color-0);  
    font-size: 25px;
    font-weight: 500;
}

/*form*/
.form-controls::placeholder {color: var(--black-color-0);}
.form-controls:-ms-input-placeholder { color: var(--black-color-0);}
.form-controls::-ms-input-placeholder { color: var(--black-color-0);}

.form-controls {
    display: block;
    width: 100%;
    font-size: 18px;
    font-weight: 300;
    color: var(--black-color-0);
    background-color: var(--white-color);  
    border:  1px solid var(--bs-gray-300);  
    background-clip: padding-box;    
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 14px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    line-height: 54px;
    padding: 0 20px;
}
.form-control:focus {
    color: var(--black-bg-3);
    background-color: var(--black-bg-2);
    box-shadow: none;
}
.form-inputs label {
  font-size: 15px;
  font-weight: 500;
  padding: 0 0 10px 0;
  opacity: .8;
}
.plus-terms{
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 30px;
    justify-content: start;
    align-items: center;
}
.sw-form-term{font-size: 14px;}
.sw-textarea{width: 100%; height: 90px;}
.blueketcotactform-sw{
  background: var(--bg-b2);   
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);  
    padding: 40px;
    border-radius: 14px;
}
.footercreditnote {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.bg-efffect-1{position: relative;}
.bg-efffect-1:after{
  /* background: url(../images/shape/blur-3.png); */  /*hidden for darkmode*/
  background-position: right top;
  background-size: 100%;
  background-repeat: no-repeat;
  content: "";
  width: 60%;
  position: absolute;
  bottom: 0;
  right: 0;
  top: 0;
  z-index: 0;
  opacity: .5;
}
.bg-efffect-2{position: relative;}
.bg-efffect-2:after{ 
  background: url(../images/shape/shape-12.svg);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  content: "";
  width: 100%;
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 0;
  opacity: .5;
}
/*footer*/
.footer-logo-sw .light{display: none;} 
.footer-logo-sw .dark{display: block;} 

.footerbg1{position: relative;}
.footerbg1:after{
  /* background: url(../images/shape/blur-6.png); */ /*hidden for darkmode*/
    background-position: center bottom;
    background-size: 80%;
    background-repeat: no-repeat;
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 0;
    opacity: .5;
}
footer{font-size: 16px; position: relative;}
.footer-logo-sw a img{max-width: 200px;}
.career-link-btn-sw span{display: block;}
.career-link-btn-sw a { color: var(--black-color-1);}
.career-link-btn-sw:hover a{color: var(--orange-color);}
.carrerlinkandimg {
    display: inline-flex;
    grid-gap: 15px;
    align-items: center;
    border: dashed 1px var(--bs-gray-500);
    padding: 10px 25px;
    border-radius: 14px;
}
.carrerlinkandimg:hover{border-color: var(--color-yellow-lite);}
.footer-social-sw{
    display: flex;
    align-items: center;
    grid-gap: 20px;
}
.footer-social-sw a{color: var(--black-color-1);  font-size: 22px;}
.two-address-blocks{
    display: grid;
    grid-template-columns: auto auto;
    grid-gap: 30px;
}
.w32{width: 32px;}
.address-div-sw  address{font-size: 16px;}
.addresstile{
    display: flex;
    grid-gap: 15px;
    align-items: center;    
}
.connectwithus a {
    color: var(--black-color-1);
    line-height: 1.8;
    display: flex;
    align-items: baseline;
}
.footertitle{  
    font-weight: 500;
    font-size: 20px;}

.award-badge-block {
      display: grid;
      grid-gap: 30px;
      grid-template-columns: auto auto auto auto auto auto;
      text-align: center;
}
.award-badge-block img{max-width: 75px;}
.footer-links ul li + li{margin-top: 5px;}
.footer-links ul li a{ 
  color: var(--black-color-0);  
    display: block;    
}
.footerbreak {margin-top: 80px; }  
.swhr{ border-top:  1px solid var(--bs-gray-300);}
.companyreviwprofile{
    display: flex;
    justify-content: flex-start;
    grid-gap: 30px;
}
.companyreviwprofile a img{max-width: 120px;}
.footercreditnote a{color: var(--black-color-1);}
.linktitle{
  font-weight: 300;
  font-size: 16px;
  line-height: 25px;
  opacity: .8;
  display: block;
}
.subsform{position: relative;}
.subsform button{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    position: absolute;
    right: 5px;
    top: 5px;
    border: 0;
}

/*effect class*/
.sw-hover-2 a:hover{color: var(--orange-color) !important;}
.sw-hover-1 a:hover{color: var(--orange-color) !important;}
.sw-hover-1 a {
    display: inline-flex !important;
    padding: 3px 0;
    position: relative;
    overflow: hidden;
    -webkit-transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    -o-transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    z-index: 1;
}
.sw-hover-1 a::after {
    position: absolute;
    content: "";
    width: 0;
    height: 1px;
    bottom: 0;   
    left: auto;
    right: 0;
    z-index: -1;
    -webkit-transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    -o-transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    background: currentColor;
}
.sw-hover-1 a:hover::after {
    width: 100%;
    left: 0;
    right: auto;
}

/*contact us page*/
.breadcrum-area {
  padding-top: 170px;
  padding-bottom: 80px;
  background: var(--gradient-7);
}
.white-bg{ background: var(--white-color);}
.list-h-styled li::after {
  content: "";
  height: 4px;
  width: 4px;
  background-color: var(--black-color-1);
  border-radius: 100%;
  position: absolute;
  top: 50%;
  right: -15px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.list-h-styled li:last-child::after {
  display: none;
}
.list-h-styled li a{ color: var(--black-color-1);}
.list-h-styled li{
  position: relative;
  display: inline-flex; 
  color: var(--orange-color);  
  position: relative;
  margin-right: 20px;
}
.contactinfodiv .con-block-sw-div .linktitle, .contactinfodiv .con-block-sw-div h4, .contactinfodiv .con-block-sw-div p, .contactinfodiv .con-block-sw-div a{color:var(--white-color);}
.contactpagefullform {
  background: var(--bg-b2);
  border-radius: 14px;
  display: grid;
  grid-template-columns: auto 65%;
}
.radio-select-list{
  justify-content: flex-start;
  grid-gap: 10px;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  flex-direction: row;
  padding: 15px 0 0px 0;
}
.radio-select-list label{padding: 0; margin: 0;}
.form-checks:first-child{margin-right: 10px;}
.form-checks + .form-checks{margin-right: 10px;}
.form-check-input:focus { box-shadow: none;}
.form-checks label{margin-left: 5px;}
.form-check-input:checked {
  background-color: var(--orange-color);
  border-color: var(--orange-color);
}
.form-inputs p{font-weight: 500;}
.contactformfiller{padding: 40px;}
.con-block-sw-div{
  position: relative;
  z-index: 5;}
.contactinfodiv{
  background: var(--gradient-1);
  padding: 40px;
  position: relative; 
}
.contactinfodiv:after{
  position: absolute;
  content: "";
  background-image: url(../images/shape/wave-line.svg);
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
}
.contactnumberdiv a{display: table;  color: var(--black-color-0);   margin-top: 5px;}

.locaton-block-sw{
  display: grid;
  grid-template-columns: auto 60%;
  grid-gap: 30px;
}
.locationimg img{
  height: 100%;
  object-fit: cover;
}
.maplocation iframe{height: 320px; width: 100%;}

/***/
.justify-left{justify-content:flex-end}
.flex-end{align-self: flex-end !important;}
p + p{margin-top: 15px;}
.imgcover img{height: 100%; width: 100%; object-fit: fill;}
.centershape{position: relative; z-index: 5;}
.centershape:before{
  content: "";
  position: absolute;
  background: url(../images/shape/dot-pattern.png);
  background-size: auto;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.row-blocks{
  display: flex;
  justify-content: space-between;
  grid-gap: 30px;
}
.quote-text:hover{border: dashed 1px var(--color-yellow-lite);}
.quote-text {
  display: inline-flex;
  grid-gap: 15px;
  align-items: center;
  padding: 10px 25px;
  border-radius: 14px;
  font-size: 25px;
  line-height: 38px;
  font-weight: 700;
  color: var(--orange-color);
}
.font22{font-size: 22px;}
.teamsocialprofile span {
  margin: 15px 0 10px 0;
}
.teamsocialprofile div a {
  font-size: 25px;
  color: var(--black-color-1);
}
.teamsocialprofile div a + a{margin-left: 15px;}
.fivecardrow-sw{
  display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 30px;
}
.img-ovrflo-sw{
  position: relative;
  min-height: 235px;
}
.user-info-div-sw{
  position: absolute;
    bottom: 0;
    z-index: 2;
    padding: 10px;
}

.user-info-div-sw h4 {
  font-size: 20px;
  font-weight: 600;
  line-height: 30px;
}
.ioswmg {
  position: relative;
  clip-path: circle(35% at 50% 38%);
}
.ioswmg:before{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(360deg, rgb(0 0 0 / 78%) 0%, rgb(0 0 0 / 0%) 50%);
}
.user-info-div-sw p{    font-size: 15px; line-height: 24px;}
.card-user-photo-sw:hover .user-info-div-sw p, .card-user-photo-sw:hover .user-info-div-sw h4 { color: var(--white-color);}
.card-user-photo-sw:hover .ioswmg {
  clip-path: circle(100% at 50% 38%);
}

.port-ref-link img {
  width: 40px;
}
.port-ref-link a {
  display: block;
  text-align: center;
}
.port-ref-link a span {
  display: block;
  font-size: 15px;
  line-height: 28px;
  color: var(--black-color-1);
  margin-top: 10px;
}
.portfolio-source {
  display: grid;
    grid-template-columns: auto auto auto auto;
    grid-gap: 0;
    margin-top: 20px;   
    border-radius: 14px;
}
.port-ref-link{ padding: 20px;}
.dashedbdr{ border: dashed 1px  var(--orange-color);}
.dashedbdr:hover{ border: dashed 1px var(--color-yellow-lite)}
.nameofitem h3 {  font-size: 24px;  line-height: 34px;}
.filters ul {  list-style: none;  padding: 20px 0;}
.filters li.active {
  color: var(--orange-color);
  background: var(--bg-b0);
  border-bottom: 1px solid var(--orange-color);
}
.filters li {
  display: inline;
  padding: 10px 25px;
  font-size: 16px;
  color: var(--black-color-0);
  font-weight: 500;
  cursor: pointer;
  letter-spacing: 1px;
  border-bottom: 1px solid hsl(0deg 0% 100% / 0%);
}
.blueketworktile img{width: 100%;}
.portfolioimg{position: relative;}
.viewportfolititem {
  opacity: 0;
  position: absolute;
  right: 0;
  bottom: 0;
  background: var(--bs-body-bg);
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--black-bg);
  border-radius: 10px 0 0 0;
}
.portfolidiv:hover .viewportfolititem { opacity: 1;}
.infoblocis{margin-top: 20px;}
/**/
.itmquickinfo {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15px;
}
.itmquickinfo a{
  color: var(--black-color-1);
  display: inline-block;
  padding: 20px 0; 
}
.cardtitlemain:hover{ color: var(--black-color-0);}
.cardtitlemain{
  color: var(--black-color-0);
    display: inline-block;
    font-size: 22px;
    line-height: 32px;
    font-weight: 500;
}
.big-blog .cardtitlemain{ 
    font-size: 26px;
    line-height: 36px;
    font-weight: 500;
}
.listofpost .icondiv {
  height: 120px;
  width: 180px;
}
.sidetqi{
  justify-content: flex-start;
  grid-gap: 15px;
}
.multipost .mediablock + .mediablock{margin-top: 30px;}
.latestpost {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--bs-gray-400);
  padding-bottom: 10px;
}
.blogstabs:hover{color: var(--white-color);}
.blogstags {
  display: inline-block;
  background: var(--color-yellow-lite);
  color: var(--bs-white);
  padding: 4px 10px;
  margin: 0 0 15px 0;
  font-size: 14px;
  border-radius: 4px;
}

.blog-post-details-sw h1{
  font-size: 34px;
  line-height: 44px;
  font-weight: 600;
}

.post-status {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.postby, .post-countncomnt{
  display: flex;
  grid-gap: 10px;
  justify-content: flex-start;
  align-items: center;
}
.w35{
  width: 35px;
  height: 35px;
  border-radius: 6px;
}
.postby .mediablock { 
  grid-gap: 12px;
  align-items: center;
} 

.blog-content-part, .img-block, .blog-content-part h2, .blog-content-part h3, .blog-content-part h4, .blog-content-part h5, .blog-content-part h6, .blog-content-part p, .blog-content-part ul  {margin-bottom:30px;}

/**/
.blueketlist{padding-left: 20px;}
.blueketlist li{padding: 0 0 0px 5px;}
.blueketlist.number li {list-style-type: decimal;  }
.blueketlist.licircle li {list-style-type: circle;}
.blueketlist li + li{margin-top: 5px;}
/**/

.blog-postinfos span {
  font-size: 18px;
  font-weight: 700;
  display: block;
  margin-bottom: 17px;  
  color: var(--black-color-0);
}
a.btgs {
  color: var(--black-color-0);
  background: var(--bs-body-bg);   
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);
  display: inline-block;
  font-size: 14px;
  font-weight: 400;
  margin-right: 10px;
  margin-bottom: 10px;
  padding: 6px 14px;
  border-radius: 6px;
}

.bpsocial a {
  
  color: var(--black-color-1);
  font-size: 18px;
  margin-right: 22px;
}
.bpsocial a:last-child {
  margin-right: 0;
}
.sidebartitle {
  border-bottom: 2px solid var(--bs-gray-200);
  margin-bottom: 30px;
}
.sidebartitle h6 {
  background: var(--bs-gray-200);
  color: var(--black-color-0);
  padding: 5px 10px;
  display: inline-block;
}
.sidebarpost .icondiv {
  height: 100px;
  width: 100px;}

.pdr100{padding-right: 100px;}  
.fcdsw{grid-template-columns: 50% 40%;}
.cardforimg, .multipost .icondiv, .img-block {
  box-shadow: 0px 7px 15px 0px rgb(0 0 0 / 15%);
}

.paragraph-block h2 {margin-bottom: 20px;}
.paragraph-block h3 {margin-bottom: 20px;}
.paragraph-block h4, .paragraph-block h5, .paragraph-block h6{margin: 30px 0 20px 0;}

.stickyposition-sw{
  position: sticky;
  top: 100px;
}
.listitleinfo h5{margin: 0 0 10px 0;}
.listitleinfo li + li{margin-top: 30px;}

.dotinswbdr{position: relative;}
.dotinswbdr:before {
  content: "";
  width: 10px;
  height: 10px;
  display: block;
  border: 1px solid var(--black-color-0);   
  border-radius: 100px;
  left: -4px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.pagination-block .page-link {
  position: relative;
  display: block;
  color: var(--black-color-0);
  text-decoration: none;
  background-color: var(--white-color);
  border: 1px solid var(--bs-gray-300);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  font-size: 18px;
  padding: 10px 20px;
}
.pagination {
  display: inline-flex;
  padding-left: 0;
  list-style: none;
  box-shadow: 0px 7px 15px 0px rgb(0 0 0 / 15%);
  justify-content: center;
}
.pagination-block .page-link:hover{ background-color: var(--bs-gray-300);}

.offcanvas.show .cbtn {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

.btnclose {
  background: var(--white-color);
  width: 50px;
  height: 50px;
  border-radius: 50px;  
  align-items: center;
  display: flex;
  justify-content: center;
}
.btnclose .btn-close {
  padding: 0;  margin: 0;
}


.offcanvas {
-webkit-transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
transition: all 0.8s cubic-bezier(0.77, 0.2, 0.05, 1);
}
.sidebar-offcanvas {
  width: 30vw;
  min-width: 300px; 
  opacity: 0;
}
.offcanvas.show {
  transform: none;
  opacity: 1;
}
.sidebarlogooff img {
  max-width: 150px;
  height: auto;
}
.offcanvas-body, .offcanvas-header { 
  padding:1rem 1.4rem; 
}
.sidebarcontactblock .icondiv{width: 45px;}
.form-label {
  margin-bottom: 0;
}
.bradecrumborderdesign-sw .vtextonborder, .bradecrumborderdesign-sw p{ color: var(--white-color);}
.crdbkt .list-h-styled li a{ color: var(--white-color);}
.crdbkt .list-h-styled li::after{ background: var(--white-color);}

.bradecrumborderdesign-sw {
  position: relative;
  width: 100%;
  border: 2px solid var(--white-color);
  border-radius: 0px 100px 14px 0px;
  border-left: 0 none;
  padding: 50px 40px 50px;
}
.bradecrumborderdesign-sw:before {
  width: 2px;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 68px;
  background: var(--white-color);
}
.bradecrumborderdesign-sw:after {
  width: 2px;
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  height: 68px;
  background: var(--white-color);
}
.bradecrumborderdesign-sw h1 {
  font-size: 50px;
  line-height: 62px;
  font-weight: 800;
  color: var(--white-color);
  margin-bottom: 40px;
  position: relative;
  text-transform: uppercase;
}
.bradecrumborderdesign-sw h2:after, .bradecrumborderdesign-sw h1:after {
  background: var(--white-color);
  width: 174px;
  height: 1px;
  transition: all .5s 4s ease-out;
  -webkit-transition: all .5s 4s ease-out;
  content: "";
  position: absolute;
  left: 0;
  bottom: -15px;
}

.vtextonborder{ 
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  position: absolute;
  left: -122px;
  top: 46%;
  display: block;
}
.bgimg{
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: relative;
} 
.bgimg:before {
  content: "";
  background: linear-gradient(90deg, #1d2671 30%, rgb(14 14 14 / 50%) 90%);
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.swbdr {
  border: 1px solid var(--bs-gray-300);
}
.swbdr:hover {
  border: 1px solid var(--color-yellow-lite);
  background: var(--bs-white);
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);
}
.sw-card{
  padding: 30px;
  border-radius: 14px;
}
.sw-card h4 {
  margin-bottom: 20px;
  font-size: 25px;
  line-height: 35px;
}
.cardicon img{width: 52px; margin-bottom: 20px;}

.techusedin-sw{
  margin-top: 20px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.techusedin-sw span{font-size: 15px;   color: var(--orange-color); position: relative; margin-right: 20px; text-transform: uppercase;}
.techusedin-sw span:after{
  content: "";
  height: 4px;
  width: 4px;
  background-color: var(--orange-color);
  border-radius: 100%;
  position: absolute;
  top: 50%;
  right: -13px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.techusedin-sw span:last-child::after { display: none;}
.img-collage-set{position: relative;}
.blueketshape1 {background-image: radial-gradient(var(--black-color-1) 2px,transparent 2px);  background-size: 16px 16px;}
.blueketshape2 {background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) 0.8px, var(--orange-color) 1.6px,var(--orange-color) 3px,rgba(255,255,255,0) 3.8px,rgb(255 0 0 / 0%) 10px); border-radius: 100px;}
.shapesw{position: absolute;  z-index: 0;  width: 150px;  height: 150px;  opacity: .7;}
.shapecontrol-1{ right: 50px;  top: 30px;}
.shapecontrol-2{ left: 10px;  bottom: -30px;}
.shapecontrol-3{ left: -20px;  bottom: -30px;}
.shapecontrol-4 {right: -30px; top: -40px;}

.imgcover{box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%)}

/*accordion*/
.accordion-button:not(.collapsed) {
  color: var(--black-color-0);
  background-color: transparent;
  box-shadow: none;
}
.accordion-item {
  background-color: transparent;
  border: 0;
  padding: 0 0 0 30px;
  position: relative;
}
.accordion-button {
  padding: 0;
  color: var(--black-color-0);
  background-color: transparent;
  border: 0;
  margin-bottom: 0;
  font-size: 20px;
  line-height: 30px;
  font-weight: 5;
  outline: none;
}
.accordion-body {
  padding: 0px 0 15px 0;
  font-size: 17px;
  line-height: 26px;
}
.accordion-header {
  margin-bottom: 0;
  line-height: 1;
  outline: none;
  padding: 10px 0;
}
.accordion-button:focus { 
  box-shadow: none;
}

.accordion-button::after {
  flex-shrink: 0;
  width: auto;
  height: auto;
  margin-left: auto;
  content: "\f107";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  background-image: none;
  background-repeat: no-repeat;
  background-size: 1.25rem;
  transition: transform .2s ease-in-out;
  left: -30px;
  position: absolute;
}
.accordion-button:not(.collapsed)::after {
  background-image: none;
  transform: rotate(-180deg);
  content: "\f107";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
}.servicelist li a{
    font-size: 16px;
    line-height: 26px;
    font-weight: 500;}
.servicelist li + li{margin-top: 8px;}
.sw-cardinfo{margin-top: 30px;}
.cardicon-bg{
  margin: 10px 10px 0 10px;
  overflow: hidden;
  border-radius: 7px;
}
.swbttitle {
  margin-bottom: 25px;
  font-size: 15px;
  line-height: 20px;
  opacity: 0.8;
  font-weight: normal;
  position: relative;
}
.swbttitle:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  height: 2px;
  background: var(--white-color);
  width: 60px;
}
.fullworkcard {
  display: grid;
  grid-template-columns: auto 60%;
  grid-gap: 30px;
  align-items: center;
}
.sw-card2{
  padding: 38px;
  border-radius: 14px;}
.fwc{background: var(--sw-bg-1);}
.fwc h2, .fwc h3, .fwc h4, .fwc h5, .fwc p, .fwc a{color: var(--black-color);}
.divinfo span{color: var(--orange-color); display: block; letter-spacing: 2px;}
.divinfo .icon-data img{max-width: 36px;}
.icon-labels{display: flex; grid-gap: 15px;}
.divinfo h2 {
  font-size: 30px;
  line-height: 40px;
  font-weight: 700;
}
.workslidercontrol {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  align-content: center;
  flex-direction: row;
  grid-gap: 20px;
  max-width: 800px;
  margin: 20px auto 0;
}
.btnforportfolio a{color: var(--black-color-1);}
.btnforportfolio a:hover{color: var(--black-color-1);}
.work-slider  .sw-card2 {  opacity: .5; }
.work-slider .owl-item.center .sw-card2 {  opacity: 1;}
.work-slider.owl-carousel.full-button .owl-nav .owl-next { right: 30px;}
.work-slider.owl-carousel.full-button .owl-nav .owl-prev { left: 30px;}
.service-row-block2 { padding: 0 20px;}

.linklist{
  display: flow-root;
  grid-gap: 30px;
  column-count: 3;
}
.linklist li + li{margin-top: 10px;}
.linklist li a { font-size: 20px;}
.demobg {
  background-position: center center;
  background-size: cover;
  background-color: #111111;
}
 
/*scroll to top*/
#scrollUp {
  bottom: 80px;
  right: 10px;
  width: 30px;
  height: 30px;
  -webkit-border-radius: 100px;
  border-radius: 100px;
  color: #fff;
  opacity: .4;  
  background-repeat: no-repeat;
  background-size: 15px;
  background-position: center center;
  background-repeat: no-repeat; 
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M416 352c-8.188 0-16.38-3.125-22.62-9.375L224 173.3l-169.4 169.4c-12.5 12.5-32.75 12.5-45.25 0s-12.5-32.75 0-45.25l192-192c12.5-12.5 32.75-12.5 45.25 0l192 192c12.5 12.5 12.5 32.75 0 45.25C432.4 348.9 424.2 352 416 352z'/%3E%3C/svg%3E");
  background-color: var(--white-color);
  box-shadow: 0px 10px 10px rgb(17 17 17 / 30%);
}
#scrollUp:hover {opacity: 1;}

/*preloader*/
.preloader div{
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
  transition-duration: 500ms;
  -webkit-transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  transition-delay: 0.1s;
}
.preloader{
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  z-index: 999999;
  top: 0;
  left: 0;
  margin: auto;
  width: 100vw;
  height: 100vh;
  background: #1d1d1d;
  opacity: 1;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
  transition-duration: 500ms;
  -webkit-transition-duration: 500ms;
  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);

}
.preloader_inner {
  width: 100%;
  font-size: 30vh;
  line-height: 1;
  font-weight: 900;
  color: #fff;
  opacity: 0.04;
  font-family: var(--font-primary);
  position: absolute;
  right: 0;
  left: 0;
  text-align: center;  
}
.loaderlogo{
  height: 50px;
  animation: zoomIn ease 0.6s;
}
.loaderlogo img {
  min-height: 40px;
  height: 35px;
}
.page-loaded{
  top: 0;
 
  visibility: hidden;
}
/*****darkmode switch*****/
.darkmodeswitch{
  position: absolute;
  bottom: 24px;
  right: -30px;
}
.switch-wrapper {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 55555;
  transform: none;
  justify-content: center;
}
.switch-wrapper .switch {
  display: inline-block;
  height: 34px;
  position: relative;
  width: 34px;
}
.switch-wrapper .switch input {
  display: none;
}
.switch-wrapper input:checked + .slider {
  background-color: rgb(36, 36, 36);
  border: 1px solid #ffffff57;
}
.switch-wrapper .slider.round {
  border-radius: 50px;
}
.switch-wrapper .slider {
  background-color: white;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: 0.4s;
  border: 1px solid #e2e2e2;
  box-shadow: 0px 7px 15px 0px rgb(0 0 0 / 15%);
}
.switch-wrapper input:checked + .slider:before {
  content: "";
  background: url(../images/icons/moon.svg) #2196f3 no-repeat center center;
}
.switch-wrapper .slider.round:before {
  border-radius: 50%;
}
.switch-wrapper .slider:before {
  bottom: 4px;
  content: "";
  background: url(../images/icons/sun.svg) rgb(255, 196, 0) no-repeat center center;
  height: 24px;
  left: 4px;
  position: absolute;
  transition: 0.4s;
  width: 24px;
}

.pb300{padding-bottom: 215px}
.imageoutbox {
  position: relative;
  margin: -200px 0 0 0;
}
.imageoutofbox {
  margin-top: 0;
}

.imageoutofbox h2, .imageoutofbox p{color: var(--white-color);}
.service-row-block{ margin: -160px 0 0px 0;   padding-bottom: 100px;}
.error404page {
  width: 100%;
  height: 100vh;
  display: grid;
  align-items: center;
}
.pagecontentss h2 {
  font-size: 60px;
  line-height: 1;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--orange-color2);
  margin: 20px 0 10px 0;
}

/*blueket Update 1.2*/

/*loader animation*/
.page-loaded .loaderlogo {transform: translateX(-350px); opacity: 0;}
.page-loaded .preloader_inner {transform: translateX(400px); opacity: 0;}

.hidden {display: none;}

/*demo 4 hero slider*/
.hero-slider {
	width: 100%;
	height: 100vh;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	position: relative;
	z-index: 0;
  }
  .hero-slider .slide-inner{ position: relative;}
  .hero-slider .slide-inner:before{
	content: "";
    position: absolute;
    background: #000;
    width: 100%;
    height: 100%;
    opacity: 0.4;
    top: 0;
    left: 0px;
    right: 0;
  }
   .hero-slider .swiper-slide {
	overflow: hidden;
	color: #fff;
  }  
  .hero-slider .swiper-container {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
  }  
  .hero-slider .slide-inner {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background-size: cover;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: left;
  }  
  .hero-slider .swiper-button-prev, .hero-slider .swiper-button-next {
    background: transparent;
    width: 35px;
    height: 55px;
    line-height: 53px;
    margin-top: -30px;
    text-align: center;
    border: 1px solid #d4d3d382;
    border-radius: 55px;
    opacity: 0;
    visibility: hidden;
    transition: all .3s ease;
}
  .hero-slider:hover .swiper-button-prev, .hero-slider:hover .swiper-button-next {
	transform:translateX(0);
	opacity:1;
	visibility:visible;
  }
  
  .hero-slider .swiper-button-prev {
	left: 25px;
	transform:translateX(50px);
  }  
  .hero-slider .swiper-button-prev:before {
	font-family: "Font Awesome 5 Free";
	content: "\f060";
	font-size: 15px;
	color: #d4d3d3;
	font-style: normal;
	display: inline-block;
	vertical-align: middle;
	font-weight: 900;
  }  
  .hero-slider .swiper-button-next {
	right: 25px;
	transform:translateX(-50px);
  }  
  .hero-slider .swiper-button-next:before {
	font-family: "Font Awesome 5 Free";
	content: "\f061";
	font-size: 15px;
	color: #d4d3d3;
	font-style: normal;
	display: inline-block;
	font-weight: 900;
  }  
  .hero-slider .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	text-align: left;
	line-height: 12px;
	font-size: 12px;
	color: #000;
	opacity: 0.3;
	background:#fff;
	transition:all .2s ease;
  }  
  .hero-slider .swiper-pagination-bullet-active {opacity:1;  }  
  .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets,  .hero-slider .swiper-pagination-custom,  .hero-slider .swiper-pagination-fraction {	bottom: 30px;  }  
  .swiper-pagination {	text-align:left;  }  
  .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{
	bottom:50px;
	  max-width: 1200px;
	  padding: 0 15px;
	  margin: 0 auto;
	  left: 50%;
	  transform: translateX(-50%);
  }   
  .hero-style .slide-title,  .hero-style .slide-text,  .hero-style .slide-btns {max-width: 750px; }  
  .hero-style .slide-title h2 {
	font-size: 55px;
	line-height: 65px;
	color: #ffffff;
	margin: 0 0 20px;	
	transition:all .4s ease;	
  }  
.hero-style .slide-text p {
	letter-spacing: normal;
	color: #ffffff;
	margin: 0 0 30px;
	transition:all .4s ease;
  }  
  .hero-style .slide-btns > a:first-child {
	margin-right: 10px;
  }

/*slider end*/

.sw-cl-1 {background: var(--bg-b0);}
.cardicon-out {
    border-radius: 40px;
    padding: 28px;
    width: 120px;
    height: 120px;
    background: var(--white-color);
    margin: -80px auto 0px;
}
.dm4 .sw-card { 
  position: relative;
  text-align: center;
}
.sw-cl-2{background: var(--bg-b2);}
.sw-cl-3{background: var(--bg-b4);}
.sw-cl-4 {background: var(--orange-color);}

.swbttitlex {
  font-weight: 700;
  font-size: 24px;
  line-height: 30px;
  color: var(--black-color-0);
  margin-bottom: 15px;
}
.sw-cl-4 p, .sw-cl-4 h3{
  color: var(--bs-white);
}

/*demo 3*/
.demo-3-hero {
    background: url(../images/shape/wave-bg.svg);
    position: relative;
    z-index: 1;
    padding-top: 180px;
    padding-bottom: 100px;
    min-height: 100vh;
    display: grid;
    align-items: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
}
.demo-three .swbdr{position: relative;}
.demo-three .swbdr:hover{
  background: var(--bg-b0);
  border: 1px solid var(--bg-b0);
}
.sw-cardx {
  background: var(--bg-b0);
  border: 1px solid var(--bg-b0);
}
.lnkarrow {
  right: 20px;
  bottom: 10px;
  text-align: right;
}
.demo-three .swbdr:hover .lnkarrow{color: var(--orange-color);}
.servicelink {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  display: flex;

}

/* dark background header color change */
.headerbg  .brandlogo .dark {display: none;}
.headerbg  .brandlogo .light {display: block !important;}
.headerbg.sticky  .brandlogo .dark {display: block;}
.headerbg.sticky  .brandlogo .light {display: none !important;}
.darkmode .headerbg.sticky  .brandlogo .light {display: block !important;}
.darkmode .headerbg.sticky  .brandlogo .dark {display: none !important;}
/**/

.header .menu>ul>li .menu-subs>ul>li>a:hover{color: var(--orange-color) !important;}
.badge {  
  font-size: 12px; 
  color: var(--white-color);  
  background: var(--bs-orange);
  position: relative;
  top: -3px;
}

/***************************/
/**blueket Responsive CSS**/
/***************************/

/**width between 1920 to 1500**/ 
@media screen and (max-width:1920px) and (min-width:1500px) {
}
/**width under 1199**/ 
@media only screen and (max-width:1450px) {
h1 {  font-size: 40px;  line-height: 50px; font-weight: 700;}
h2 {  font-size: 35px;  line-height: 45px; font-weight: 700;}
h3 {  font-size: 32px;  line-height: 42px; font-weight: 700;}
h4 {  font-size: 28px;  line-height: 38px; font-weight: 600;}
h5 {  font-size: 22px;  line-height: 32px; font-weight: 600;}
h6 {  font-size: 18px;  line-height: 28px; font-weight: 600;}
p {   font-size: 17px;  line-height: 27px;}
.h1 {font-size: 50px;  }
.demo-1-hero {  min-height: 750px;}
.counter-setdiv p {font-size: 50px; line-height: 60px;}
.pricemain {font-size: 35px;}
.conactinfoblock .icondiv { height: 35px; width: 35px;}
.conactinfoblock .mediablock {grid-gap: 15px;}
.img-div-sw-bkt {  height: 220px;}
.sidebar-offcanvas { width: 40vw;  min-width: 300px;}
.fivecardrow-sw {grid-template-columns: repeat(4, 1fr); }
.plus-terms {grid-gap: 15px;}
.form-inputs label { font-size: 15px;  padding: 0 0 5px 0; }
.form-controls { line-height: 48px;  padding: 0 18px;}
form .mb20{margin-bottom: 10px;}
.blueketcotactform-sw { padding: 30px 20px;}
.multipost a h5 { font-size: 20px; line-height: 30px; font-weight: 500;}
.cardtitlemain { font-size: 20px; line-height: 30px;}
.mediablock {grid-gap: 20px;}


/*update 1.2*/
.demo-3-hero {padding-top: 130px; padding-bottom: 80px;}
.hero-style .slide-title h2 { font-size: 40px; line-height: 50px; }
/*update 1.2*/


}
/**width over 1200px**/ 
@media only screen and (max-width: 1200px) {
  .mt40lg{margin-top:40px}
}

/**width under 1199**/ 
@media only screen and (max-width:1199px) {
.techusedin-sw span{font-size: 13px;}
.work-slider  .sw-card2 {opacity:1;}
.fivecardrow-sw { grid-template-columns: repeat(3, 1fr);}
.pricing-table-with-cta, .plus-terms { grid-template-columns: auto; }
.award-badge-block { grid-template-columns: auto auto auto auto;}
.demo-1-hero .hero-content { padding: 0 0%;}
.portfolio-source {grid-template-columns: auto auto;}
.nameofitem h3 {font-size: 20px; line-height: 30px;}
.blog-post-details-sw h1 {  font-size: 30px;  line-height: 40px;}
.darkmodeswitch { position: absolute; bottom: 20px;  right: 15px;}
.headerbg .menu>ul>li>a { color: var(--black-color-0);}
.sticky { backdrop-filter: none;     background: var(--white-color);}

/*1.2*/
.headerbg .menu-mobile-toggle span {background: var(--white-color);}
.headerbg.sticky .menu-mobile-toggle span {background: var(--black-color-0);}
}
/**width under 992**/ 
@media only screen and (max-width: 992px) {  
.order1{order: 1;}  
.order2{order: 2;} 
.no-pb{padding-bottom: 0;} 
.mmt40{margin-top: 40px;}
.mmt30{margin-top: 30px;}
h1 {  font-size: 35px;  line-height: 45px; font-weight: 700;}
h2 {  font-size: 30px;  line-height: 40px; font-weight: 700;}
h3 {  font-size: 25px;  line-height: 35px; font-weight: 700;}
h4 {  font-size: 20px;  line-height: 30px; font-weight: 600;}
h5 {  font-size: 18px;  line-height: 28px; font-weight: 600;}
h6 {  font-size: 18px;  line-height: 28px; font-weight: 600;}
p {   font-size: 17px;  line-height: 27px;}
.imginheader{margin-top: 40px;}
.footercreditnote {  flex-direction: column;  grid-gap: 10px;}
.continfoblck h2 {  font-size: 50px;  line-height: 62px;}
.cta-design-block-sw {  grid-template-columns: 100%;  grid-gap: 60px;} 
.cardlinkfooter { border-bottom: 1px solid var(--bs-gray-300);}
.pricing-table {     grid-template-columns: repeat(1, 1fr);  grid-gap: 30px;}
.tblfirst, .pricing-column { border-radius: 14px;}
.pb300 {padding-bottom: 300px;}
.sw-tabs-links .nav, .filter-button-group ul {
  flex-direction: row;
  display: flex;
  overflow: auto;
  white-space: nowrap;
  padding-bottom: 15px;
  width: 100%;
  flex-wrap: inherit;
}
.sw-tabs-links .nav-tabs .nav-link {  padding: 15px 50px 15px 20px;  width: fit-content;}
.sw-tabs-links .nav-tabs li + li {margin-top: 0; margin-left: 10px;}
.sidebar-offcanvas {width: 100%;}
.demo-1-hero {  min-height: auto;  padding: 160px 0 130px 0;}
.service-row-block { padding: 0 20px; margin: -50px 0 0px 0;  padding-bottom: 60px;}
.award-badge-block {  grid-template-columns: auto auto auto;  text-align: center;}
.demo-1-hero .hero-content p {  padding: 0px 0%;}
.fourcounter {
  margin: 60px auto;
  width: 100%;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.fourcounter .countertag { margin-top: 10px; }
.fivecardrow-sw {  grid-template-columns: repeat(2, 1fr);}
.quote-text { 
  padding: 10px 20px;  
  font-size: 18px;
  font-weight: 500;  
}
.immt100 {  margin-top: 60px;}
.homepagecounter {  display: grid;  grid-gap: 30px;  grid-template-columns: repeat(3, 1fr);}
.counter-setdiv p { font-size: 35px;  line-height: 45px;}
.countertag {  margin-top: 5px;  display: block;  font-size: 15px;  line-height: 24px;}
.contactpagefullform { grid-template-columns: auto;}
.plus-terms {justify-content: center; align-items: center;}
.locaton-block-sw {align-items: center;}
.subsform button {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  position: absolute;
  right: 3px;
  top: 3px;
  padding: 0 0;
}
.pdr100{padding-right: 15px;}
.sidebar-post-block-sw{margin-top: 40px;}
.demo-2-hero .hero-content h1 { font-size: 40px; line-height: 52px;}
.bdrwor-rt {border-right: 0;}
.div-card-img-info { padding: 25px 20px 0px 20px;}

}
/**width under 767**/
@media only screen and (max-width: 767px){
.blur-bg-b {  width: 600px;   height: 550px;   opacity: 40%;}
.preloader_inner {font-size: 15vh;}
.linklist {grid-gap: 20px;  column-count: 2;}
.linklist li a {font-size: 18px;}
.demo-2-hero .hero-content h1 {font-size: 35px; line-height: 45px;}
.fullworkcard {grid-template-columns: auto;    grid-gap: 30px;  }
.work-slider.owl-carousel.full-button .owl-nav .owl-next { right: -50px;}
.work-slider.owl-carousel.full-button .owl-nav .owl-prev {left: -50px;}
.mediablock {grid-gap: 15px;}
.icondiv { height: 50px;  width: 50px;}
.img-collage-set{justify-content: center; overflow: hidden;}
.sw-btn {font-size: 16px; padding: 0px 32px;  line-height: 60px; }
.continfoblck h2 {    font-size: 35px;    line-height: 45px;}
.contactinkediv a {  font-size: 18px;}
.owl-carousel.full-button .owl-nav .owl-prev { color: var(--black-bg);   left: -50px;  right: 0; text-align: center; margin: 0 auto;}
.owl-carousel.full-button .owl-nav .owl-next { color: var(--black-bg); right: -50px; left: 0; margin: 0 auto;}
.owl-carousel.full-button .owl-nav .owl-prev, .owl-carousel.full-button .owl-nav .owl-next { top: auto;    transform: translateY(-50%);  background: var(--white-color);
  box-shadow: 0px 10px 20px -5px rgb(0 0 0 / 10%);}
.header-btn i{display: none;}
.sw-btn.header-btn{ font-size: 13px;   padding: 0 12px;   border-radius: 8px;   line-height: 40px;}
.headeraction ul { display: flex; align-items: center; grid-gap: 8px;}
.brandlogo .dark { width: 160px; }
.header-item-right .menu-icon {  color: var(--white-color);  font-size: 14px; width: 30px;  line-height: 40px;  height: 40px;}
.service-card-div {   border-radius: 34px;}
.cardforimg img{width: 100%;}
.blog-post-details-sw h1 {  font-size: 24px;  line-height: 34px;}
.bradecrumborderdesign-sw {padding: 50px 25px 50px;}
.bradecrumborderdesign-sw h1 { font-size: 35px;  line-height: 45px;  margin-bottom: 30px;}
.vtextonborder {left: -116px;}
.two-address-blocks {grid-template-columns: auto;}
.cta-design-block-sw {padding: 30px 20px; border-radius: 14px;}
}
/**width under 575**/
@media only screen and (max-width: 575px) {
.blur-bg-a { right: -2%;  top: -2%;  opacity: 70%;  width: 300px;  height: 300px;}
.blur-bg-b { width: 380px; height: 480px; opacity: 50%;}
.sw-half-circle-block1 {width: 400px;    height: 400px;    top: -200px;}
.imageoutbox {  margin-top: -110px;}
.imageoutofbox {margin-top:0px; padding-bottom: 60px;}
.h1 {  font-size: 35px;}
.sw-btn {padding: 0px 30px;  line-height: 60px; font-size: 16px;}
.homepagecounter {  grid-gap: 20px;  grid-template-columns: repeat(2, 1fr);}
.section-space {  padding-top: 60px;  padding-bottom: 60px;}
.pb300 { padding-bottom: 190px !important;}
.footercreditnote { grid-gap: 5px;}
.contactformfiller { padding: 30px 20px;}
.big-blog .cardtitlemain {font-size: 22px; line-height: 32px;}
.listofpost .icondiv {height: 100%; width: 100px;}
.footer-links ul li a {font-size: 14px;}
.breadcrum-area {  padding-top: 120px;  padding-bottom: 60px;}
.demo-2-hero {padding-top: 150px;  padding-bottom: 80px;}
.word-block-div{padding-bottom: 100px;}
/* .uniqpont { flex-direction: column;} disable in 1.2 */
.sw-right-slot, .sw-work-preview, .fivecardrow-sw {grid-gap: 10px;}
.user-info-div-sw h4 { font-size: 18px;  line-height: 28px;}
.fivecardrow-sw { grid-template-columns: repeat(1, 1fr);}
.user-info-div-sw { padding: 0 0 20px 0; text-align: center;  right: 0;  left: 0;}
.multipost a h5 {font-size: 18px; line-height: 26px;}
.form-inputs p{font-size: 15px; line-height: 24px;}


/*update 1.2*/ 
.roundimg {border-radius: 8px;}
.hero-style .slide-title h2 {font-size: 35px; line-height: 45px;}
.demo-1-hero {padding: 150px 0 100px 0;}
.preloader{width: 100%; height: 100%;}
.uniqpont .mediainfoblock p { font-size: 16px; line-height: 26px;}
.uniqpont {grid-gap: 15px;}
.icondiv {height: 40px; width: 40px;}
.swbttitlex br{display: none;}
h1 {font-size: 30px; line-height: 40px;}
h2 {font-size: 26px;  line-height: 36px;}
.sw-card h4 {font-size: 22px; line-height: 32px;}
/*update 1.2*/ 

}  
/**width under 360**/  
@media only screen and (max-width: 460px) {  
  .sw-half-circle-block1 {  width: 280px;   height: 280px;   top: -140px;}
  .locaton-block-sw { grid-template-columns: auto;}
  .locationimg img{width: 100%;}
}
/**width under 370**/  
@media only screen and (max-width: 370px) {
}
/**width under 300**/  
@media only screen and (max-width: 300px) {
}