/* --------------------------------------------------------------------------
comopany name : RedCheap Theme
Server name : rctheme.com
contact Now : info@rctheme.com

---------------------------------------------------------------------------*/
/*


1. impot Files
2. body css
3. custom button
4. preloader
5. back to top button
6. top bar
7. header


/*

/* --------------------------------------------------------------------------
                           1. import Files
---------------------------------------------------------------------------*/
@import url('bootstrap.min.css');
@import url('framework.css');
@import url('swiper-bundle.css');
@import url('aos.css');

/* --------------------------------------------------------------------------
                           2. body css
---------------------------------------------------------------------------*/
main section {
  padding: 40px 0 40px 0;
  overflow: hidden;
}
.section-header {
  padding-bottom: 40px;
}

.text-primary-two{
  color: var(--color-primary-two) !important;
}

.position-s {
  position: sticky !important;
  top: 0rem !important;
}

.underline{
  text-decoration: underline;
}

.justify-content-between-two{
  display: flex !important;
  justify-content: space-between;
}


a.text-primary:focus, a.text-primary:hover {
  color: var(--color-primary) !important;
}

.section-header h2{
font-size: 48px;
color: var(--color-secondary);
font-weight: 700;
margin-bottom: 20px;
}
.section-header h2 span{
color: var(--color-primary-two);
font-weight: 700;
}
.section-header.center h2{
text-align: center;
}

.section-header p {
  margin: 0 auto;
  color: var(--color-info-dark);
  font-size: 18px;
}

.section-header.white h2{
  color: var(--color-white);
}

.section-header.white h2 span{
  color: var(--color-white);
}

.section-header.white p{
  color: var(--color-white);
}

.section-header.center p{
text-align: center;
}


@media (min-width: 1280px) {
  .section-header.center p {
    max-width: 80%;
  }

  .section-header p.w-100 {
    max-width: 100%;
  }
}

@media (max-width:767px) {
.section-header h2{
          font-size: 38px;
}
}

@media (max-width:480px) {
.section-header h2{
          font-size: 33px;
          margin-bottom: 10px;
}
.section-header p{
          font-size: 17px;
}
}

.text-primary-two{
  color: var(--color-primary-two);
}



ul{
  margin: 0px !important;
  padding: 0px !important;
  list-style: none !important;
}


.max-height-60{
  max-height: 60px !important;
}



/* --------------------------------------------------------------------------
                           3. custom button
---------------------------------------------------------------------------*/
.btn-primary-two:not(#main-body *) {
  font-size: 16px;
  color: var(--color-white) !important;
  background: var(--color-primary) !important;
  padding: 8px 23px;
  border-radius: 5px;
  transition: 0.3s;
  font-family: var(--font-primary);
  border-color: var(--color-primary) !important;
}

 .btn-primary-two:not(#main-body *):hover,
 .btn-primary-two:focus:not(#main-body *):hover, .btn-primary-two:not(#main-body *):focus {
  color: var(--color-white) !important;
  background: rgba(var(--color-primary-rgb), 0.85) !important;
  border-color: var(--color-primary) !important;
}

.btn-primary:not(#main-body *){
position: relative;
font-weight: 500;
line-height: 33px;
overflow: hidden;
text-align: center;
border-radius: 50px;
border:0px;
display: inline-block;
color: var(--color-white) !important;
font-size: 16px;
text-transform: capitalize;
padding: 10px 35px 10px;
font-family:var(--font-primary);
background-color: var(--color-primary-two);
z-index: 1;
}
.btn-primary:not(#main-body *):before{
-webkit-transition-duration: 800ms;
transition-duration: 800ms;
position: absolute;
width: 200%;
height: 200%;
content: "";
top: -200%;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
border-radius: 50%;
z-index: -1;
background: var(--color-primary);
color: var(--color-white) !important;
}

.btn-primary:not(#main-body *):hover:before{
  top: -40%;
}

.btn-outline-primary:not(#main-body *), .btn-outline-primary:not(#main-body *):active{
 font-size: 16px;
 color: var(--color-primary) !important;
 background: none;
 padding: 8px 23px;
 border-radius: 5px;
 transition: 0.3s;
 font-family: var(--font-primary) !important;
 border-color: var(--color-primary) !important;
}

.btn-outline-primary:not(#main-body *):hover,
.btn-outline-primary:not(#main-body *):focus:hover,
.btn-outline-primary:not(#main-body *):focus {
 color: var(--color-white) !important;
 background: rgba(var(--color-primary-rgb)) !important;
 border-color: var(--color-primary) !important;
}


.btn-white:not(#main-body *) {
  font-size: 16px;
  color: var(--color-secondary) !important;
  background: var(--color-white) !important;
  padding: 8px 23px;
  border-radius: 5px;
  transition: 0.3s;
  font-family: var(--font-primary);
  border-color: var(--color-white) !important;
}

 .btn-white:not(#main-body *):hover,
 .btn-white:not(#main-body *):focus:hover, .btn-white:not(#main-body *):focus {
  color: var(--color-secondary) !important;
  background: rgba(var(--color-white-rgb), 0.85) !important;
  border-color: var(--color-white) !important;
}



/*--------------------------------------------------------------
4. Preloader
--------------------------------------------------------------*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  overflow: hidden;
  background: #fff;
  display: flex;
}



div.spinner {
  position: relative;
  width: 54px;
  height: 54px;
  display: block;
  margin-left: 50%;
  margin-right: 50%;
  background: var(--color-primary-two);
  padding: 10px;
  border-radius: 10px;
  margin: auto;
}

div.spinner div {
  width: 6%;
  height: 16%;
  background: var(--color-white);
  position: absolute;
  left: 49%;
  top: 43%;
  opacity: 0;
  -webkit-border-radius: 50px;
  -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.2);
  -webkit-animation: fade 1s linear infinite;
}

@-webkit-keyframes fade {
  from {opacity: 1;}
  to {opacity: 0.25;}
}

div.spinner div.bar1 {
  -webkit-transform:rotate(0deg) translate(0, -130%);
  -webkit-animation-delay: 0s;
}    

div.spinner div.bar2 {
  -webkit-transform:rotate(30deg) translate(0, -130%); 
  -webkit-animation-delay: -0.9167s;
}

div.spinner div.bar3 {
  -webkit-transform:rotate(60deg) translate(0, -130%); 
  -webkit-animation-delay: -0.833s;
}
div.spinner div.bar4 {
  -webkit-transform:rotate(90deg) translate(0, -130%); 
  -webkit-animation-delay: -0.7497s;
}
div.spinner div.bar5 {
  -webkit-transform:rotate(120deg) translate(0, -130%); 
  -webkit-animation-delay: -0.667s;
}
div.spinner div.bar6 {
  -webkit-transform:rotate(150deg) translate(0, -130%); 
  -webkit-animation-delay: -0.5837s;
}
div.spinner div.bar7 {
  -webkit-transform:rotate(180deg) translate(0, -130%); 
  -webkit-animation-delay: -0.5s;
}
div.spinner div.bar8 {
  -webkit-transform:rotate(210deg) translate(0, -130%); 
  -webkit-animation-delay: -0.4167s;
}
div.spinner div.bar9 {
  -webkit-transform:rotate(240deg) translate(0, -130%); 
  -webkit-animation-delay: -0.333s;
}
div.spinner div.bar10 {
  -webkit-transform:rotate(270deg) translate(0, -130%); 
  -webkit-animation-delay: -0.2497s;
}
div.spinner div.bar11 {
  -webkit-transform:rotate(300deg) translate(0, -130%); 
  -webkit-animation-delay: -0.167s;
}
div.spinner div.bar12 {
  -webkit-transform:rotate(330deg) translate(0, -130%); 
  -webkit-animation-delay: -0.0833s;
}



/*--------------------------------------------------------------
# animations
--------------------------------------------------------------*/

@keyframes anim-rotate {
  0% {
    transform: rotate(-30deg);
  }
  50% {
    transform: rotate(-45deg);
  }
  100% {
    transform: rotate(-30deg);
  }
}
.elem-rotate {
  animation: anim-rotate 5s infinite;
}
@keyframes anim-updown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(30px);
  }
  100% {
    transform: translateY(0);
  }
}
.elem-updown {
  animation: anim-updown 5s infinite;
}
@keyframes anim-move {
  0% {
    transform: translateX(0);
  }
  50% {
    transform: translateX(30px);
  }
  100% {
    transform: translateX(0);
  }
}
.elem-move {
  animation: anim-move 5s infinite;
}
@keyframes anim-rotate-full {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(360deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.elem-rotate-full {
  animation: anim-rotate-full 12s infinite;
}
@keyframes anim-zoom {
  0% {
    transform: scale(0.8);
  }
  50% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.8);
  }
}
.elem-zoom {
  animation: anim-zoom 5s infinite;
}






/*--------------------------------------------------------------
5. Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 100%;
  z-index: 996;
  background: var(--color-primary);
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: 1s ease;
}

.back-to-top i {
  font-size: 28px;
  color: #fff;
  line-height: 0;
}

.back-to-top:hover {
  background: var(--color-primary);
  color: #fff;
}

.back-to-top.active {
  visibility: visible;
  opacity: 1;
  bottom: 15px;
  transition: 1s ease;
}

/*--------------------------------------------------------------
6. Top bar
--------------------------------------------------------------*/
.topbar {
  background: var(--color-primary);
  padding-top: 5px;
  padding-bottom: 5px;
}

.topbar .support{
display: flex;
justify-content: start;
}
.topbar .support.right-sider{
display: flex;
justify-content: end;
}

.topbar .support .support-items{
  margin-left: 15px;
  padding: 5px 10px;
  transition: all .5s;
}

.topbar .support .support-items:first-child{
  margin-left: 0px;
}

.topbar .support .support-items:hover{
  background-color: var(--color-primary-two);
  border-radius: 5px;
}

.topbar .support .support-items i{
  color: var(--color-white);
  font-size: 16px;
}

.topbar .support .support-items a{
  color: var(--color-white);
  font-size: 16px;
}

.topbar .support .support-items a.dropdown-item{
  color: var(--color-primary-two);
  transition: all .5s;
}

.topbar .support .support-items a.dropdown-item:hover{
  color: var(--color-white);
}

.topbar .support .support-items a.dropdown-item i{
  color: var(--color-primary-two);
  transition: all .5s;
}


.header-main{
  padding-top: 4px;
  padding-bottom: 4px;
}
.header-main .logo{
  display: inline-block;
}
.header-main .logo img{
max-height: 60px;
}

.header-main .social{
display: flex;
justify-content: end;
}

.header-main .social .social-item{
  margin-right: 15px;
  display: flex;
  align-items: center;
  transition: all .5s;
}
.header-main .social .social-item:last-child{
  margin-right: 0px;
}

.header-main .social .social-item:hover .icon{
  background-color: var(--color-primary-two);
  color: var(--color-white);
}

.header-main .social .social-item .icon{
  height: 40px;
  width: 40px;
  line-height: 40px;
  border: 1px solid;
  border-color: var(--color-primary-two);
  border-radius: 100%;
  text-align: center;
  margin-right: 10px;
  color:var(--color-primary-two);
  transition: all .5s;
}

.header-main .social .social-item .content{
  display: grid;
}

.header-main .social .social-item .content .contents{
  font-size: 13px;
  color: var(--color-secondary);
}



#header {
  background: rgba(var(--color-white-rgb), 0.1);
  transition: all 0.5s;
  z-index: 997;
  height: 70px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  position: absolute;
  z-index: 5;
  width: 100%;
}


#header.fixed-top {
  height: 70px;
  background: var(--color-white);
  position: fixed;
}
@media(max-width:992px){
  #header.fixed-top{
    background: var(--color-primary-two);
  }
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation
*/
.navbar {
  padding: 0;
}

.navbar ul {
  margin: 0;
  padding: 0;
  display: flex;
  list-style: none;
  align-items: center;
}

.navbar li {
  position: relative;
}

.navbar>ul>li {
  white-space: nowrap;
/*   padding: 20px 20px 20px 20px; */
}

.navbar>ul>li>a{
  padding: 15px 15px 15px 15px;
}

.navbar a, .navbar a:focus {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 15px;
	font-weight: 600;
	color: var(--color-white);
	white-space: nowrap;
	transition: 0.3s;
	position: relative;
	text-transform: uppercase;
	font-family: var(--font-primary);
}

.fixed-top .navbar a, .fixed-top .navbar a:focus{
color: var(--color-secondary);
}


.navbar .dropdown ul li a {
  display: flex;
  justify-content: unset;
  color: var(--color-secondary);
}

.navbar .dropdown .dropdown>a{
justify-content: space-between;
}


.navbar a span{
  font-size: 15px;
	font-weight: 600;
}

 .navbar a i,
.navbar a:focus i {
  font-size: 15px;
  line-height: 0;
  margin-left: 0px;
} 





.navbar a:hover,
.navbar .active,
.navbar .active:focus,
.navbar li:hover>a {
  color: var(--color-primary);
}

.navbar .dropdown ul {
  display: block;
  position: absolute;
  left: 0px;
  top: calc(100% + 30px);
  margin: 0;
  padding: 0px 0;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  background: var(--color-white);
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  transition: 0.3s;
  border-radius: 3px;
  border: 1px solid;
  border-color: rgba(var(--color-secondary-rgb), 0.5);
}



.navbar .dropdown ul.megamenu-style{
          padding-top: 10px;
          padding-bottom: 10px;

}

.navbar .dropdown ul.megamenu-style li>h6{
  padding: 10px 20px;
  color: var(--color-primary-two);
  font-size: 16px;
  position: relative;
}
.navbar .dropdown ul.megamenu-style li>h6 i{
          margin-right: 7px;
}

.navbar .dropdown ul.megamenu-style li > h6::after {
  content: "";
  position: absolute;
  width: 90%;
  height: 1px;
  background-color: var(--color-primary-two);
  left: 0px;
  bottom: 0px;
}

.navbar .dropdown ul.megamenu-style li a span.content{
  display: flex;
  flex-direction: row;
  justify-content: unset;
}

.navbar .dropdown ul.megamenu-style li a span.description{
   display: flex;
  flex-direction: column;
  transition: 0.3s;
}

.navbar .dropdown ul.megamenu-style li a span.content span.name{
  color: var(--color-secondary-dark);
  font-size: 17px;
  transition: 0.3s;
}


.navbar .dropdown ul.megamenu-style li a span.content span.contents{
  color: var(--color-secondary);
  font-size: 13px;
  transition: 0.3s;
  max-width: 100%;
overflow: hidden;
white-space: normal;
}



.navbar .dropdown ul.megamenu-style li a:hover span.content span.contents{
  color: var(--color-secondary);
}


.navbar .dropdown ul.megamenu-style li a i {
  height: 40px;
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 100%;
  font-size: 20px;
  display: block;
  border: 1px solid;
  background: white;
  transition: 0.3s;
}

.navbar .dropdown ul.megamenu-style li a.color-one i{
border-color: rgb(247, 131, 38);
color: rgb(247, 131, 38);
}

.navbar .dropdown ul.megamenu-style li a.color-one:hover i{
background: rgb(247, 131, 38);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-one:hover span.content span.name{
color: rgb(247, 131, 38);
}

.navbar .dropdown ul.megamenu-style li a.color-two i{
border-color: rgb(23, 202, 104);
color: rgb(23, 202, 104);
}

.navbar .dropdown ul.megamenu-style li a.color-two:hover i{
background: rgb(23, 202, 104);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-two:hover span.content span.name{
color: rgb(23, 202, 104);
}

.navbar .dropdown ul.megamenu-style li a.color-three i{
border-color: rgb(120, 145, 239);
color: rgb(120, 145, 139);
}

.navbar .dropdown ul.megamenu-style li a.color-three:hover i{
background: rgb(120, 145, 239);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-three:hover span.content span.name{
  color: rgb(120, 145, 239);
}

.navbar .dropdown ul.megamenu-style li a.color-four i{
border-color: rgb(227, 74, 230);
color: rgb(227, 74, 230);
}

.navbar .dropdown ul.megamenu-style li a.color-four:hover i{
background: rgb(227, 74, 230);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-four:hover span.content span.name{
  color: rgb(227, 74, 230);
}

.navbar .dropdown ul.megamenu-style li a.color-five i{
border-color: rgb(20, 87, 230);
color: rgb(20, 87, 230);
}

.navbar .dropdown ul.megamenu-style li a.color-five:hover i{
background: rgb(20, 87, 230);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-five:hover span.content span.name{
  color: rgb(20, 87, 230);
}

.navbar .dropdown ul.megamenu-style li a.color-six i{
border-color: rgb(236, 95, 103);
color: rgb(236, 95, 130);
}

.navbar .dropdown ul.megamenu-style li a.color-six:hover i{
background: rgb(236, 95, 103);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-six:hover span.content span.name{
  color: rgb(236, 95, 103);
}

.navbar .dropdown ul.megamenu-style li a.color-seven i{
border-color: rgb(245, 177, 75);
color: rgb(245, 177, 75);
}

.navbar .dropdown ul.megamenu-style li a.color-seven:hover i{
background: rgb(245, 177, 75);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-seven:hover span.content span.name{
  color: rgb(245, 177, 75);
}

.navbar .dropdown ul.megamenu-style li a.color-eight i{
border-color: rgb(74, 201, 189);
color: rgb(74, 201, 189);
}

.navbar .dropdown ul.megamenu-style li a.color-eight:hover i{
background: rgb(74, 201, 189);
color: #fff;
}

.navbar .dropdown ul.megamenu-style li a.color-eight:hover span.content span.name{
  color: rgb(74, 201, 189);
}


.navbar .dropdown .dropdown ul::before{
          content: unset;
}

.navbar .dropdown.right-sider ul{
  right: 0px;
  left: auto;
}

.navbar .dropdown ul li {
  min-width: 200px;
}

.navbar .dropdown ul li.min-width{
    min-width: 290px;
}

/*.navbar .dropdown ul li.border-right-1{
  border-right: 1px solid;
  border-color: var(--color-primary);
}*/

.navbar .dropdown.websitemenu ul li{
min-width: 280px;
}

.navbar .dropdown>a::after{
content: "\F229";
display: inline-block;
font-family: bootstrap-icons !important;
margin-left: 5px;
position: relative;
top: 1px;
font-size: 11px;
}

.navbar .dropdown.icon-none>a::after{
  display: none;
}

@media(min-width:992px){
.navbar .dropdown .dropdown>a::after{
  content: "\F231";
  display: inline-block;
  font-family: bootstrap-icons !important;
  margin-left: 5px;
  position: relative;
  top: 1px;
  font-size: 11px;
}
.navbar .dropdown.megamenu>ul{
  width: 100%;
  overflow: auto;
   display: flex;
  flex-direction: row;
  align-items: stretch;
}
.navbar .dropdown ul.megamenu-two{
  display: flex;
  flex-direction: row;
  align-items: baseline;
}
}

.navbar .dropdown.megamenu{
  position: static;
}



.navbar .megamenu>ul>li {
	flex: 1;
  /*border-right: 1px solid;
  border-color: var(--color-primary);*/
  padding-bottom: 30px;
}

.navbar .megamenu>ul>li:last-child{
  border-right: 0px;
}






.navbar .dropdown ul a {
  padding: 10px 20px;
  font-weight: 600;
  font-size: 15px;
  font-weight: 600;
  font-family: var(--font-primary);
  text-transform: capitalize;
}

.navbar .dropdown ul a i{
font-size: 15px;
color: var(--color-secondary);
margin-right: 10px;
}

.navbar .dropdown ul a span{
  font-size: 14px;
}


.navbar .dropdown ul a:hover,
.navbar .dropdown ul a.active:hover,
.navbar .dropdown ul li:hover>a {
  color: var(--color-primary-two);
}

.navbar .dropdown .dropdown ul li:hover>a{
  color: var(--color-secondary);
}

.navbar .dropdown .dropdown ul li>a:hover{
  color: var(--color-primary-two);
}

.navbar .dropdown ul a:hover i{
          color: var(--color-primary-two);
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
  border-top: 2px solid !important;
  border-color: var(--color-primary) !important;
  border: 0px;
  border-radius: 0px !important;
}

.navbar .dropdown .dropdown ul {
  top: 0;
  left: calc(100% - 30px);
  visibility: hidden;
}

.navbar .dropdown .dropdown:hover>ul {
  opacity: 1;
  top: 0;
  left: 100%;
  visibility: visible;
}

[dir="rtl"] .navbar .dropdown .dropdown:hover>ul {
  left: auto;
   right: 100%;
}

/*.navbar .dropdown .dropdown.two-level ul li{
  border-right: 1px solid;
  border-color: var(--color-primary);
}

.navbar .dropdown .dropdown.two-level ul li:last-child{
  border-right: 0px;
}


.navbar .dropdown .dropdown.two-level:hover>ul{
  display: flex;
  align-items: stretch;
}

  .navbar .dropdown .dropdown.two-level>ul li:hover a{
    color: var(--color-secondary);
  }

  .navbar .dropdown .dropdown.two-level>ul li a:hover{
    color: var(--color-primary-two);
  }*/


@media (max-width: 992px){
  .navbar .dropdown .dropdown.two-level>ul.dropdown-active{
  display: grid;
}
}


.navbar>ul>li.register{
margin: 0;
padding: 0px 25px;
background: transparent;
border-radius: 4px;
color: var(--color-white) !important;
transition: all 0.3s ease-in-out 0s;
cursor: pointer;
border: 1px solid;
border-color: var(--color-white);
}

.navbar>ul>li.register:hover{
border: 1px solid;
border-color: var(--color-white);
background: transparent;
}

.navbar>ul>li.register a{
color: var(--color-white) !important;
padding-left: 0;
padding-right: 0;
}

.navbar>ul>li.register:hover a{
color: var(--color-primary) !important;
}



.fixed-top .navbar>ul>li.register{
          margin: 0;
          padding: 0px 25px;
          background: var(--color-primary-two);
          border-radius: 4px;
          color: var(--color-white) !important;
          transition: all 0.3s ease-in-out 0s;
          cursor: pointer;
          border: 1px solid;
          border-color: var(--color-primary-two);
          }

          .fixed-top .navbar>ul>li.register:hover{
          border: 1px solid;
          border-color: var(--color-primary-two);
          background: transparent;
          }

          .fixed-top .navbar>ul>li.register a{
          color: var(--color-white) !important;
          padding-left: 0;
          padding-right: 0;
          }
          .fixed-top .navbar>ul>li.register:hover a{
          color: var(--color-primary-two) !important;
          }

@media (max-width:992px) {
          .navbar>ul>li.register{
          margin: 0;
          padding: 0px 25px;
          background: var(--color-primary-two);
          border-radius: 4px;
          color: var(--color-white) !important;
          transition: all 0.3s ease-in-out 0s;
          cursor: pointer;
          border: 1px solid;
          border-color: var(--color-primary-two);
          }

          .navbar>ul>li.register:hover{
          border: 1px solid;
          border-color: var(--color-primary-two);
          background: transparent;
          }

          .navbar>ul>li.register a{
          color: var(--color-white) !important;
          padding-left: 0;
          padding-right: 0;
          }
          .navbar>ul>li.register:hover a{
          color: var(--color-primary-two) !important;
          }
.navbar>ul>li.login{
          margin-top: 10px;
          transition: all .5s;
}
}

.navbar>ul>li.login{
margin: 0;
padding: 0px 25px;
background: var(--color-primary);
border-radius: 4px;
color: var(--color-white) !important;
transition: all 0.3s ease-in-out 0s;
cursor: pointer;
border: 1px solid;
border-color: var(--color-primary);
}
.navbar>ul>li.login:hover{
border: 1px solid;
border-color: var(--color-white);
background: transparent;
}

.fixed-top .navbar>ul>li.login:hover{
border-color: var(--color-primary);
}

.navbar>ul>li.login a{
color: var(--color-white) !important;
padding-left: 0;
padding-right: 0;
}

.navbar>ul>li.login:hover a{
color: var(--color-white) !important;
}

.fixed-top .navbar>ul>li.login:hover a{
color: var(--color-primary) !important;
}





.navbar>ul>li.get-started ul:before{
          content: unset;
}


@media (min-width: 1200px) {
  .navbar>ul>li.get-started{
    margin: 0;
    /* margin-left: 28px; */
    padding: 0px 25px;
    background: var(--color-primary);
    border-radius: 4px;
    color: var(--color-white) !important;
    transition: all 0.3s ease-in-out 0s;
    cursor: pointer;
  }

  .navbar>ul>li.get-started:hover{
    background: rgba(var(--color-primary-rgb), 0.9)
  }

  .navbar>ul>li.get-started>a{
  color: var(--color-white) !important;
  padding-left: 0;
  padding-right: 0;

  }
}

@media (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: 90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: 100%;
  }

 [dir="rtl"] .navbar .dropdown .dropdown ul {
    left: auto;
    right: 90%;
  }

  [dir="rtl"] .navbar .dropdown .dropdown:hover>ul {
    left: auto;
    right: 100%;
  }

}

/**
* Mobile Navigation
*/
.mobile-nav-toggle {
  color: var(--color-white);
  font-size: 28px;
  cursor: pointer;
  display: none;
  line-height: 0;
  transition: 0.5s;
  position: relative;
text-align: end;
right: 0;
width: fit-content;
}
#header.fixed-top .mobile-nav-toggle{
  width: unset;
}

.mobile-nav-toggle.bi-x {
  color: var(--color-white);
}

@media (min-width: 992px){
  .navbar>ul.mainmenu{
  width: 100%;
  justify-content: space-between;
  }

 /* .navbar .dropdown ul::before {
  	content: "";
  	position: absolute;
  	inset-block-start: -7px;
  	inset-inline-start: 10%;
  	width: 13px;
  	height: 13px;
  	border: 1px solid transparent;
  	transform: rotate(45deg);
  	background-color: var(--color-white);
  	z-index: 901;
  	display: block;
  	transition-duration: 0.25s;
  	border-color: rgba(var(--color-secondary-rgb), 0.5);
  	border-bottom: 0;
  	border-right: 0;
  }
          .navbar .megamenu ul::before{
            inset-inline-start: 22%;

          }*/

          .navbar .megamenu ul{
          overflow: visible !important;
          }

          .navbar .logo-mob-nav{
                  display: none;
          }
          .navbar .nav-mobiles{
                 display: none;

          }
}

@media (max-width: 991px) {


  .navbar .megamenu>ul>li {
  padding-bottom: 0px;
}

  .navbar .dropdown:hover>ul {
  border-top: 0px solid !important;

}

  .navbar>ul>li.get-started{
    display: none;
  }
  .navbar>ul>li.login{
    display: none;
  }
  .navbar>ul>li.register{
    display: none;
  }
  .navbar{
    padding-top: 5px;
    padding-bottom: 5px;
  }

  .mobile-nav-toggle {
    display: block;
  }
  .navbar ul {
    display: none;
  }
  .navbar ul.mainmenu{
            position: fixed;
           right: 100%;
           left: -100%;
           transition: 0.5s ease;
           top: 0px;
           display: block;
 }


 .navbar-mobile ul.mainmenu{
           right: 10%;
           left: 0%;
           top: 0px;
          transition: 0.5s ease;

 }


  .navbar .dropdown ul.megamenu-style li a span.content span.contents{
    max-width: 100%;
  overflow: hidden;
  white-space: normal;
  }

  .navbar .logo-mob-nav{
          display: block;
  }

  .navbar .logo-mob-nav a{
            display: block;
            width: fit-content;
            margin: auto;
 }

   .navbar .logo-mob-nav a img{
             max-height: 70px;
   }
   .navbar.navbar-mobile .nav-mobiles{
             display: none;
   }

   .navbar .nav-mobiles {
	display: flex;
	justify-content: space-between;
	width: 89%;
	right: 0;
	position: absolute;
	left: auto;
	top: 0;
}

[dir="rtl"]  .navbar .nav-mobiles {
  right: auto;
  left: 0;
 
}

   .navbar .nav-mobiles .logos a img{
          max-height: 40px;
   }

   .navbar .nav-mobiles .contacts{
             display: flex;
   }

   .navbar .nav-mobiles .contacts .my-custom-dropdown ul{
    right: 0;
    left: auto;
   }

  [dir="rtl"] .navbar .nav-mobiles .contacts .my-custom-dropdown ul {
  right: auto;
  left: 0;
}

   .navbar .nav-mobiles .contacts .my-custom-dropdown ul li{
    min-width: 150px;
   }

   .navbar .nav-mobiles .contacts .my-custom-dropdown ul li a{
    padding: 7px 10px;
   }

   .navbar .nav-mobiles .contacts .my-custom-dropdown ul li a:hover{
    color: var(--color-white);
   }

   .navbar .nav-mobiles .contacts .icon {
	height: 40px;
	width: 40px;
	line-height: 40px;
	border: 1px solid;
	border-color: #fff;
	border-radius: 100%;
	text-align: center;
	
	color: #fff;
          display: block;
}

.navbar .nav-mobiles .contacts .items{
  margin-right: 10px;
}

.navbar .nav-mobiles .contacts .items:last-child{
 
 margin-right: 0px;
}

[dir="rtl"] .navbar .nav-mobiles .contacts .items:last-child{
 margin-left: 0px;
 margin-right: unset;
}

[dir="rtl"] .navbar .nav-mobiles .contacts .items {
  margin-left: 10px;
  margin-right: unset;
}



}

.navbar-mobile {
	position: fixed;
	overflow: hidden;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	background: rgba(9, 9, 9, 0.51);
	transition: 0.3s;
	z-index: 999;
}

.navbar-mobile .mobile-nav-toggle {
	position: absolute;
	top: 15px;
	right: 10px;
	display: block;
	width: fit-content;
}

.navbar-mobile ul {
  display: block;
  position: absolute;
  top: 55px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  padding: 10px 0;
  background-color: var(--color-white);
  overflow-y: auto;
  transition: 0.3s;
  /* max-height: 400px; */
  height: 100%;
}

.navbar-mobile a,
.navbar-mobile a:focus {
  /* padding: 10px 20px; */
  font-size: 15px;
  color: var(--color-secondary);
}

.navbar-mobile>ul>li {
  padding: 0;
}

.navbar-mobile a:hover:before,
.navbar-mobile li:hover>a:before,
.navbar-mobile .active:before {
  visibility: hidden;
}

.navbar-mobile a:hover,
.navbar-mobile .active,
.navbar-mobile li:hover>a {
  color: var(--color-primary);
}

.navbar-mobile .getstarted,
.navbar-mobile .getstarted:focus {
  margin: 15px;
}

.navbar-mobile .dropdown ul {
  position: static;
  display: none;
  margin: 10px 0px;
  /* padding: 10px 0; */
  z-index: 99;
  opacity: 1;
  visibility: visible;
  background: var(--color-white);
  box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
  border-left: 0;
  border-right: 0px;
}

.navbar-mobile .dropdown ul li {
  min-width: 200px;
}

.navbar-mobile .dropdown ul a {
  padding: 10px 20px;
}

.navbar-mobile .dropdown ul a i {
  font-size: 12px;
}

.navbar-mobile .dropdown ul a:hover,
.navbar-mobile .dropdown ul .active:hover,
.navbar-mobile .dropdown ul li:hover>a {
  color: var(--color-primary);
}

.navbar-mobile .dropdown > .dropdown-active {
  display: block;
  border-top: 0px;
  border-bottom: 0px;
}

/*--------------------------------------------------------------
# banner
--------------------------------------------------------------*/
.banner{
          padding: 60px 0px;
          /* background: var(--color-primary-two); */
          height: 100%;
width: 100%;
background-image: url("../images/bannerbg.jpg");
background-repeat: no-repeat;
background-position: center;
background-size: cover;
color: #fff;
position: relative;
height: fit-content;
}

.banner::before {
	content: "";
	background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.5) 100%);
	position: absolute;
	inset-block-start: 0;
	inset-inline-start: 0;
	z-index: 0;
	height: 100%;
	width: 100%;
	opacity: 0.9;
}



.banner.withheader{
          padding-top: 110px;
}

.banner .banner-inner{
          z-index: 2;
          position: relative;
}

.banner .banner-heading{
          font-size: 50px;
          font-weight: 600;
}

.banner-deatile{
  font-size: 250px;
  font-weight: bold;
  margin-bottom: 0px;
}

.banner .banner-heading span{
          color: var(--color-primary);
          display: inline-block;
position: relative;
z-index: 1;
font-weight: 600;
}

.banner .banner-heading span::before {
	content: '';
	position: absolute;
	left: 3px;
	bottom: 5px;
	width: 97%;
	height: 12px;
	background: var(--color-white);
	opacity: .1;
	z-index: -1;
}

.banner .banner-content{
          font-size: 18px;
}


.list-tick{
margin: 0;
padding: 0;
}

.list-tick.mb-bottom{
  margin-bottom: 10px !important;
}

.list-tick li {
  font-size: 20px;
  padding-left: 20px;
  color: var(--color-secondary);
  position: relative;
  padding-bottom: 6px;
}

[dir="rtl"] .list-tick li {
  padding-left: unset;
  padding-right: 20px;
}



.list-tick.whites li{
  color: var(--color-white);
}


.list-tick li:before{
  content: "\F234";
  margin-right: 6px;
  font-family: "bootstrap-icons";
  font-size: 16px;
  border-radius: 50%;
  line-height: 1;
color: var(--color-secondary);
position: absolute;
left: 0;
top: 8px;
}

[dir="rtl"] .list-tick li:before{

left: auto;
right: 0;

}


.list-tick.whites li:before{
color: var(--color-white);
}




.price-box-one{
  position: relative;
text-align: center;
padding: 0px 35px 40px;
z-index: 1;
}


.price-box-one::before {
  position: absolute;
  content: '';
  left: 0px;
  top: 50px;
  right: 0px;
  bottom: 0px;
  border-radius: 15px;
  background-color: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  z-index: -1;
}
.price-box-one .icon-box{
position: relative;
width: 160px;
height: 160px;
margin: 0 auto;
border-radius: 50%;
background-color: var(--color-white);
transition: all 500ms ease;
}

.price-box-one h3{
  font-size: 35px;
  color: var(--color-secondary);
  line-height: 1;
  font-weight: 800;
  text-align: center;
  margin-bottom: 15px;
}


.price-box-one p {
  font-size: 18px;
  color: var(--color-secondary-light);
  line-height: 1;
  font-weight: 800;
  text-align: center;
  margin-bottom: 15px;
}
.price-box-one h4 {
  font-size: 34px;
  color: var(--color-primary-two);
  line-height: 1;
  font-weight: bold;
  text-align: center;
}

.price-box-one h4 span.currency-icons {
  font-size: 18px;
  line-height: 1;
  position: relative;
  bottom: 9px;
  font-weight: 600;
}
.price-box-one h4 span.duretions{
  font-size: 18px;
  line-height: 1;
  position: relative;
  top: 5px;
  font-weight: 600;
  color: var(--color-secondary);
}

.price-box-one h5 {
  font-size: 16px;
  color: var(--color-primary-two);
  line-height: 1;
  font-weight: bold;
  text-align: center;
  margin-top: 16px;
}

.price-box-one h5 span{
  font-size: 16px;
  color: var(--color-secondary);
  line-height: 1;
  font-weight: bold;
  text-align: center;
  text-decoration: line-through;
}

.price-box-one a {
  display: block;
  margin-top: 20px;
  border-radius: 50px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 17px;
  text-align: center;
}

/*======================================== plan ============================*/

.plan .plan-card{
  background-color: var(--color-white);
box-shadow: 20px 20px 40px rgba(0,0,1,5%);
border-radius: 0px 50px 0px 50px;
border: 3px solid;
border-color: var(--color-primary-two);
padding: 50px 40px;
background-color: #f8f9fa;
transition: all .5s;
}

.plan .plan-card.active{
  border-radius: 30px;
  border-color: #d0d3d5;
}

.plan .plan-card.active:hover{
  border-color: #d0d3d5;
}


.plan .plan-card:hover{
  border-radius: 30px;
  border-color: var(--color-primary);
}


.plan .plan-card .plan-name{
  font-size: 25px;
font-weight: 600;
color: var(--color-primary-two);
margin-bottom: 22px;
}

.plan .plan-card .plan-price{
  font-size: 48px;
  font-weight: 800;
  margin-bottom: 25px;
}

.plan .plan-card .plan-price sup{
  font-size: 25px;
  font-weight: 500;
  color: var(--color-secondary);
}

.plan .plan-card .plan-price sub{
  font-size: 18px;
  font-weight: 500;
  color: var(--color-secondary);
}

.plan .plan-card .plan-contant{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-primary-two);
}

.plan .plan-card .plan-unlist li {
  padding-bottom: 20px;
  font-size: 20px;
  font-weight: 600;
  display: flex;
  color: var(--color-secondary);
  position: relative;
  transition: all .5s;
}

.plan .plan-card .plan-unlist li:before li:hover{
  color: var(--color-primary-two);
}


.plan .plan-card .plan-unlist li:before{
  content: "\F26B";
  margin-right: 6px;
  font-family: "bootstrap-icons";
  font-size: 18px;
  color: var(--color-secondary);
  padding: 4px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.1);
  line-height: 1;
  display: inline-block;
  vertical-align: bottom;
}

.plan .plan-card .plan-unlist li:last-child{
  padding-bottom: 0px;
}


.plan .plan-card.active-two {
  background-color: var(--color-white);
  box-shadow:unset !important;
  border-radius: 10px;
  border: 3px solid;
  border-color: #d0d3d5;
  padding: 30px 20px;
  background-color: #f8f9fa;
  transition: all .5s;
  position: relative;
}

.plan .plan-card.active-two:hover{
  border-color: var(--color-primary);
}

.plan .plan-card.active-two.border-black{
  border-color: var(--color-primary);
}

.plan .plan-card.active-two .plan-price {
  font-size: 36px;
  font-weight: 500;
  margin-bottom: 15px;
}


.plan .plan-card.active-two .plan-unlist li {
  padding-bottom:15px;
  font-size: 16px;
  font-weight: 500;
}

.plan .plan-card.active-two .tootips-plans span{
  transform: translate(-84%, -102%);
}



.horizontal-plan.active {
  /*margin-top: 50px;*/
  margin-bottom: 50px;
  overflow: unset !important;
}

.horizontal-plan .pricing-column {
  padding: 50px 30px;
  padding-bottom: 50px;
}

.horizontal-plan .pricing-column .plan-name {
  margin-top: 0;
  margin-bottom: .5rem;
  font-weight: 800;
  line-height: 1.2;
  font-size: 20px;
  color: var(--color-primary-two);
}

.horizontal-plan .pricing-column .pricing-label {
  color: var(--color-primary);
  font-size: 16px;
  font-weight: 800;
}

.horizontal-plan .pricing-column .monthly-price {
  font-size: 40px;
  font-weight: 800;
}

.horizontal-plan .pricing-column .monthly-price span.durections {
  font-size: 16px;
  font-weight: 600;
  margin-left: 6px;
}

.horizontal-plan .pricing-column p.contens {
  font-size: 15px;
  letter-spacing: 1px;
  color: var(--color-secondary-dark);
  text-align: start;
}

.horizontal-plan .pricing-column.pricing-column-horizontal ul.custum-lists {
  display: flex;
  flex-wrap: wrap;
}

.horizontal-plan .pricing-column.pricing-column-horizontal ul.custum-lists li {
  width: 50%;
  font-size: 20px;
  display: flex;
  align-items: baseline;
}

.horizontal-plan .pricing-column .custum-lists li::before {
  content: '\F26E';
  font-family: bootstrap-icons;
  margin-right: 5px;
  color: var(--color-primary);
  font-size: 24px;
  position: relative;
  top: 5px;
}

.horizontal-plan .pricing-column .form-select{
  border: 1px solid;
  border-color: var(--color-primary-two);
  height: unset !important;
  padding: 12px 12px;
}




.horizontal-plan-two .plan-border{
  border: 1px solid;
  border-color: var(--color-secondary);
}

.horizontal-plan-two .form-amount{
  display: grid;
}

.horizontal-plan-two .form-amount label{
  text-align: center;
}

.horizontal-plan-two .form-amount input{
  text-align: center;
   padding-top: 10px;
  padding-bottom: 10px;
  border-radius: 5px;
  font-size: 20px;
  border: 1px solid;
  border-color: var(--color-primary-two);
}

.horizontal-plan-two .form-price{
  display: grid;
}

.horizontal-plan-two .form-price p{
  font-size: 17px;
  font-weight: 400;
  margin-bottom: 0px;
}

.horizontal-plan-two .form-price select {
  padding-top: 16px;
  padding-bottom: 16px;
  padding-left: 15px;
  border-radius: 5px;
  border: 1px solid;
  border-color: var(--color-primary-two);
}

.mr-top-32{
  margin-top: 32px;
}

.horizontal-plan-two .form-price-total{
  display: grid;
}

.horizontal-plan-two .form-price-total p{
  font-size: 17px;
  font-weight: 400;
  margin-bottom: 0px;
}

.horizontal-plan-two .form-price-total .price-count{
  border: 1px solid;
  border-color: var(--color-primary-two);
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 10px;
  border-radius: 5px;
}

.horizontal-plan-two .form-price-total .price-count h5{
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 0px;
}
















.tootips-plans{
  position: relative;
  left: 5px;
}
.tootips-plans span {
  position: absolute;
  background: var(--color-black);
  color: var(--color-white);
  display: block;
  font-size: 15px;
  line-height: 1.5;
  padding: 9px 14px;
  border-radius: 5px;
  text-align: center;
  min-width: 200px;
  top: 0%;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transform: translate(-46%, -102%);
          transition: 0.5s;
          text-transform: lowercase;
}

.tootips-plans:hover span{
          opacity: 1;
          visibility: visible;
          display: block;
          transition: 0.5s;
}

.tootips-plans span:after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
}

.plan-select{
  margin-top: 28px;
  width: 100%;
  text-align: left;
  padding: 11px 10px;
  background-color: var(--color-white);
  outline: none;
  border: 1px solid;
  border-color: var(--color-primary-two);
  border-radius: 5px
}



/*============================= features ================================*/

.features1 {
  background-image: linear-gradient(238deg, rgba(17, 17, 17, 0.63) 0%, rgba(30, 29, 29, 0.74) 100%), url(../images/banner.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
  position: relative;
}




.features1 .card-style{
  color: var(--color-white);
  padding: 30px 30px;
}

.features1 .card-style h3{
  font-size: 30px;
  font-weight: 600;
  color: var(--color-white);
}

.features1 .card-style p{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
}

.features1 .card-style i {
  color: var(--color-primary-two);
  font-size: 50px;
  width: 70px;
  height: 70px;
  line-height: 70px;
  border-radius: 50%;
  background-color: var(--color-primary);
  border: 3px solid;
  border-color: var(--color-white);
  display: inline-block;
  text-align: center;
  margin-bottom: 30px;
  font-size: 35px;
}


.features2 .features-card h3{
  font-size: 35px;
  font-weight: 800;
  margin-bottom: 25px;
}

.features2 .features-card p{
  font-size: 18px;
  color: var(--color-secondary);
}

.features3 .card-style{
  padding: 20px 20px;
  background-color: #f8f9fa;
  border-radius: 5px;
  border-top: 4px solid;
  border-bottom: 4px solid;
  border-color: var(--color-primary-two);
  transition: all .5s;
}

.features3 .card-style:hover{
  border-color: var(--color-primary);
}

.features3 .card-style .images {
  border: 4px solid;
  border-color: var(--color-white);
  border-radius: 50%;
  max-width: 65px;
  height: 65px;
  margin-bottom: 12px;
  background: rgb(238 242 255);
  text-align: center;
  line-height: 54px;
}

.features3 .card-style .images img {
  max-width: 40px;
  text-align: center;
  margin: 7px 0px 0px 7px;
}

.features3 .card-style .images svg {
  width: 35px;
  height: 35px;
  fill: var(--color-primary-two);
}

.features3 .card-style h4{
  font-size: 22px;
  font-weight: 600;
}

.features3 .card-style p{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-secondary);
  line-height: 30px;
  margin-bottom: 0px;
}


.features5 .card{
  border-radius: 5px;
  background-color: var(--color-primary);
  padding: 30px 20px;
}

.features5 .card h3{
  font-size: 35px;
  font-weight: 800;
  color: var(--color-white);
}

.features5 .card p{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
}

.features5 .card.orange{
  background-color: var(--color-primary-two);
}

.features6 .card-style {
  padding: 20px 20px;
  background-color: #f8f9fa;
  border-radius: 5px;
  box-shadow: 0px 4px 5px 4px rgba(0,0,0,.1);
  transition: all .5s;
}

.features6 .section-headeing h2{
  font-size: 55px;
  font-weight: 600;
  color: var(--color-secondary);

}

.features6 .card-style:hover{
  box-shadow: 0 10px 25px 10px rgba(0,0,0,.1);
  -webkit-transform: translateY(-5px);
  transform: translateY(-5px);
  background-color: var(--color-primary-two);
  color: var(--color-white);
}

.features6 .card-style:hover .icon svg{
  color: var(--color-white);
}

.features6 .card-style:hover .content .title{
  color: var(--color-white);
}

.features6 .card-style .icon svg{
  font-size: 55px;
  margin-bottom: 20px;
  stroke-width: 1 !important;
  color: var(--color-primary-two);
}

.features6 .card-style .content .title{
  font-size: 33px;
  font-weight: 800;
  margin-bottom: 20px;
  color: var(--color-secondary);
  transition: all .5s;
}

.features6 .card-style .content p{
  font-size: 18px;
  font-weight: 400;
}

.features7 .card-style {
  flex-direction: row;
  display: flex;
  margin-bottom: 20px;
}

.features7 .card-style .width-20{
  width: 10%;
}

.features7 .card-style .width-20 i {
  width: 50px;
  height: 50px;
  line-height: 50px;
  background-color: var(--color-primary-two);
  display: block;
  text-align: center;
  color: var(--color-white);
  font-size: 30px;
  font-weight: 900;
  border-radius: 50%;
}

.features7 .card-style .width-80{
  width: 90%;
}

.features7 .card-style .width-80 h4{
  font-size: 25px;
  font-weight: 800;
}

.features7 .card-style .width-80 p{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-secondary);
}

.features8 .heading-vps h3{
  font-size: 30px;
  font-weight: 500;
  color: var(--color-primary);
  margin-bottom: 20px;
}

.features8 .heading-vps h3 span{
  color: var(--color-primary-two);
}

.features8 .heading-vps h4{
  font-size: 25px;
  font-weight: 700;
  color: var(--color-secondary);
  margin-bottom: 20px;
}

.features8 .section-list li{
  font-size: 20px;
  font-weight: 500;
  color: var(--color-secondary);
  padding-bottom: 10px;
  position: relative;
  display: flex;
}

.features8 .section-list li:last-child{
  padding-bottom: 0px;
}

.features8 .section-list li::before {
  content: "\F26D";
  margin-right: 6px;
  font-family: "bootstrap-icons";
  font-size: 15px;
  color: var(--color-primary-two);
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.1);
  line-height: 1;
  display: inline-block;
  top: 3px;
  position: relative;
}


.features8 .section-list.section-list-two li:before{
  content: "\F26F";
  margin-right: 6px;
  font-family: "bootstrap-icons";
  font-size: 18px;
  color: var(--color-primary-two);
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.1);
  line-height: 1;
  display: inline-block;
  top: 3px;
  position: relative;
}

.features9 .card{
  padding: 20px 10px;
  border: 0px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  transition: all .5s;
}

.features9 .card:hover{
  transform: translateY(-7px);
}

.features9 .card:hover .images img{
  transform: scale(0.8);
}

.features9 .card .images{
  padding: 40px 30px;
  background-color: #f0f4ff;
  margin-bottom: 25px;
}

.features9 .card .images img{
  max-width: 130px;
  margin: auto;
  transition: all .5s;
}

.max-whith-112{
  max-width: 109px !important;
}


.features9 .card h5{
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 20px;
  padding-left: 15px;
}


.features9 .card .features-list li{
  display: flex;
  color: var(--color-secondary);
  padding-left: 15px;
}

.features9 .card .features-list li:before{
  content: "\F26D";
  margin-right: 6px;
  font-family: "bootstrap-icons";
  font-size: 13px;
  color: var(--color-primary-two);
  padding: 4px;
  background-color: rgba(255, 255, 255, 0.1);
  line-height: 1;
  display: inline-block;
  position: relative;
}

.features10 .card-style {
  background-color: var(--color-white);
  box-shadow: 0 .165rem .25rem rgba(0,0,0,.090) !important;
}

.features10 .card-style .images-blog{
  background-color: var(--color-primary);
}

.features10 .card-style .images-blog img{
  position: relative;
  transition: all .5s;
}

.features10 .card-style .images-blog img:hover{
  transform: scale(0.9);
}

.features10 .card-style:hover .images-blog img{
  transform: scale(0.9); 
  border-radius: 10px;
  filter: grayscale(100%);
}


.features10 .card-style .content{
  padding: 20px 20px 20px 20px;
}

.features10 .card-style .content span{
  font-size: 14px;
  font-weight: 300;
  color: var(--color-primary-two);
}

.features10 .card-style .content h4{
  font-size: 30px;
  font-weight: 800;
  color: var(--color-secondary);
  margin-top: 15px;
}

.features10 .card-style .content p{
  font-size: 18px;
  line-height: 30px;
}


.features11 .blog-detail .contents{
  padding: 5px 20px;
}

.features11 .blog-detail .images{
  border-bottom: 1px solid;
  border-color: #d6d9dd;
}

.features11 .blog-detail .images img{
  margin-bottom: 25px;
  border-radius: 10px;
  cursor: pointer;
  filter: grayscale(100%);
  transition: .5s ease;
}

.features11 .blog-detail .images img:hover{
  filter: none;
}

.features11 .blog-detail .contents .heading{
  font-size: 35px;
  font-weight: 800;
  color: var(--color-secondary);
  margin-bottom: 20px;
}

.features11 .blog-detail .contents .section-list{
  display: flex;
}

.features11 .blog-detail .contents .section-list li{
  margin-top: 15px;
  margin-bottom: 15px;
  margin-right: 20px;
  cursor: pointer;
  color: var(--color-primary-two);
}

.features11 .blog-detail .contents .section-list li:last-child{
  margin-right: 0px;
}

.features11 .blog-detail .contents .sub-heading{
  font-size: 18px;
  font-weight: 400;
}

.features11 .blog-detail-two{
  padding: 20px 20px 10px 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  background-color: var(--color-white);
  border-radius: 5px;
}

.features11 .blog-detail-two .blog-heading{
  font-size: 35px;
  font-weight: 800;
  color: var(--color-secondary);
}

.features11 .blog-detail-two .blog-list li{
  border-bottom: 1px solid;
  border-color: #d6d9dd;
  padding-bottom: 20px;
  padding-top: 15px;
  font-size: 20px;
  font-weight: 400;
}

.features11 .blog-detail-two .blog-list li:last-child{
  border-bottom: 0px;
}

.features11 .blog-detail-two .blog-list li span{
  color: var(--color-secondary);
}

.features11 .blog-detail-two .post{
  margin-top: 20px;
  display: flex;
  align-items: center;
}

.features11 .blog-detail-two .post .images{
  margin-right: 15px;
}

.features11 .blog-detail-two .post .images img{
  border-radius: 100%;
  border: 3px solid;
  border-color: var(--color-primary-two);
  width: 70px;
  height: 70px;
  cursor: pointer;
  transition: .5s ease;
}

.features11 .blog-detail-two .post .images img:hover{
  filter: grayscale(100%);
}

.features11 .blog-detail-two .post .post-content h5{
  font-size: 20px;
  font-weight: 500;
  color: var(--color-secondary);
  margin-bottom: 0px;
}

.features11 .blog-detail-two .post .post-content p{
  font-size: 17px;
  font-weight: 400;
  margin-bottom: 0px;
}

.features11 .blog-detail-two .tages{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.features11 .blog-detail-two .tages li{
  display: inline-block;
  padding: 10px;
}

.features11 .blog-detail-two .tages li a {
  color: var(--color-gray);
  font-size: 14px;
  padding: 6px 14px;
  margin: 0 6px 8px 0;
  border: 1px solid rgba(131, 136, 147, 0.4);
  display: inline-block;
  transition: 0.5s;
}

.features11 .blog-company {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  padding: 25px 10px;
}

.features11 .blog-company img{
  border-radius: 5px;
  transition: all .5s;
  cursor: pointer;
}

.features11 .blog-company img:hover{
  transform: scale(0.9);
}

.features11 .blog-company .contacts-blog h3{
  font-size: 35px;
  font-weight: 800;
  color: var(--color-secondary);
}

.features11 .blog-company .contacts-blog P{
  font-size: 18px;
  font-weight: 400;
}


.features12 .section-card h3 {
  font-size: 35px;
  font-weight: 800;
  color: var(--color-primary-two);
  margin-bottom: 26px;
  margin-top: 22px;
}

.features12 .section-card h3:first-child{
  margin-top: 0px;
}

.features12 .section-card p{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-secondary);
}

.features13 .features-card{
  border: 1px solid;
  border-color: var(--color-primary-two);
  padding: 20px 30px 33px 30px;
  border-radius: 5px;
  background-color: var(--color-white);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.features13 .features-list{
  margin-top: 20px;
}

.features13 .features-list li{
  font-size: 18px;
  font-weight: 400;
  padding-bottom: 20px;
}

.features13 .features-list li:last-child{
  padding-bottom: 0px;
}

.features13 .features-list li:nth-child(2){
  color: var(--color-secondary);
}

.features13 .features-list li:nth-child(4){
  color: var(--color-secondary);
}

.features13 .features-list li:nth-child(6){
  color: var(--color-secondary);
}



.features14 .sunricedomains {
  padding: 24px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  background: var(--color-primary);
}

.features14 .sunricedomains label {
  font-size: 17px;
  font-weight: 600;
  color: var(--color-white);
  line-height: 1.5;
  display: block;
  margin-bottom: 15px;
}

.features14 .sunricedomains .sunriceinput {
  padding: 10px 15px;
  width: 100%;
  display: block;
  font-size: 17px;
  font-weight: 500;
  color: var(--color-secondary);
  line-height: 1.5;
  border: 1px solid var(--color-primary-two);
  border-radius: 5px;
}

.features15 .credite-card{
  padding: 25px 25px;
  background-color: var(--color-white);
  border-radius: 10px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  text-align: center;
  cursor: pointer;
  transition: .5s ease;
}

.features15 .credite-card:hover{
  transform: translateY(-10px);
}

.features15 .credite-card .images-payment svg{
  background-color: var(--color-primary-two);
  border-radius: 5px;
}

.features15 .credite-card h3{
  font-size: 25px;
  font-weight: 800;
  color: var(--color-secondary);
  margin-bottom: 0px;
  margin-top: 30px;
}








.contact .contact-detail{
  box-shadow: 0 0 24px 0 rgb(0 0 0 / 10%);
  padding: 30px;
  border-top: 3px solid var(--color-primary-two);
  border-bottom: 3px solid var(--color-primary-two);
  border-radius: 10px;
  width: 100%;
  background-color: rgba(var(--color-primary-rgb), 1);
}

.contact .contact-detail .icon{
  box-shadow: 0 0 24px 0 rgb(0 0 0 / 10%);
  background-color: var(--color-primary-two);
  padding: 15px 15px;
  border-radius: 5px;
  color: var(--color-white);
}

.contact .contact-detail .icon i {
  background-color: var(--color-primary);
  width: 44px;
  height: 44px;
  line-height: 44px;
  display: block;
  color: var(--color-white);
  border-radius: 50%;
  text-align: center;
  font-size: 22px;
}

.contact .contact-detail .icon h4{
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 4px;
}

.contact .contact-detail .icon p{
  margin-bottom: 0px;
}

.contact .contact-input{
  box-shadow: 0 0 24px 0 rgb(0 0 0 / 10%);
  padding: 30px;
  border-top: 3px solid var(--color-primary);
  border-bottom: 3px solid var(--color-primary);
  border-radius: 10px;
  width: 100%;
  background-color: rgba(var(--color-primary-rgb-two), 1);
}

.contact .contact-input .form-label{
  font-size: 18px;
  color: var(--color-white);
}

.contact .contact-input .form-control.form-control-lg {
  border: 1px solid;
  border-color: var(--color-primary);
  border-radius: 5px;
  padding: 12px 10px;
  height: unset;
  font-size: 16px;
}

.contact .contact-input .form-select{
  border: 1px solid;
  border-color: var(--color-primary);
  border-radius: 5px; 
  height: unset !important;
  padding: 13px 13px;
}

.contact .contact-input .message{
  border: 1px solid;
  border-color: var(--color-primary);
  border-radius: 5px; 
}







/*=================================== login ========================*/

.login-page .login-cart-two {
  border-radius: 0px;
  text-align: center;
}

.login-page .login-cart-two p{
  padding: 0 30px;
  font-size: 18px;
  margin-bottom: 0px;
}

.login-page .login-detail .login-cart{
  background-color: var(--color-primary);
  border-radius: 0px;
  box-shadow: 0 0 24px 0 rgb(0 0 0 / 10%);
}

.login-page .login-detail .login-cart .form-heading{
  color: var(--color-white);
  text-align: left;
}

.login-page .login-detail .login-cart .singup-forgot{
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.login-page .login-detail .login-cart .singup-forgot .link-page{
  text-decoration: underline;
}

.login-page .login-detail .login-cart .singup-forgot .link-page i{
  margin-right: 6px;
}





/*============================== resister ============================*/

.register .register-cart-two{
  border-radius: 0px;
  text-align: center;
}

.register .register-cart{
  background-color: var(--color-primary);
  border-radius: 0px;
  box-shadow: 0 0 24px 0 rgb(0 0 0 / 10%);
}

.register .register-cart .form-label{
  color: var(--color-white);
  font-size: 18px;
}

.register .register-cart .form-select{
  height: unset !important;
  padding: 13px 13px;
}

.register .register-cart .singup-forgot{
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.register .register-cart .singup-forgot .register-text{
  text-decoration: underline;
}

.register .register-cart .singup-forgot .register-text i{
  margin-right: 6px;
}


.forgot .forgot-cart-two{
  border-radius: 0px;
  text-align: center;
}

.forgot .forgot-cart{
  background-color: var(--color-primary);
  border-radius: 0px;
}

.forgot .forgot-cart .form-heading{
  color: var(--color-white);
  font-size: 18px;
}

.forgot .forgot-cart .forgot-forgot{
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}

.forgot .forgot-cart .forgot-forgot a{
  text-decoration: underline;
}

.forgot .forgot-cart .forgot-forgot i{
  margin-right: 6px;
}


/*========================== about-us =================================*/

.padding-bo-60{
  padding-bottom: 80px;
}

.about-us .card{
  border: 0px;
  background-color:var(--color-white);
  position: relative;
}

.about-us .card .images{
  position: relative;
  overflow: hidden;
}

.about-us .card .images img{
  border-radius: 5px;
}

.about-us .card .images .overlay-team{
  background: rgba(var(--color-primary-rgb-two), 0.5);
  position: absolute;
  width: 100%;
  height: 100%;
  bottom: 0;
  right: 100%;
  display: flex;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: 1s ease;
  border-radius: 5px;
}

.about-us .card:hover .images .overlay-team{
  display: flex;
  right: 0;
  visibility: visible;
  opacity: 1;
  cursor: move;
}

.about-us .card .overlay-team .about-link {
  display: flex;
  justify-content: space-between;
  margin: auto !important;
}


.about-us .card .overlay-team .about-link li{
  margin-right: 15px;
}

.about-us .card .overlay-team .about-link li:last-child{
  margin-right: 0px;
}

.about-us .card .overlay-team .about-link li a {
  border: 1px solid;
  border-color: var(--color-white);
  border-radius: 50%;
  width: 50px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  transition: 0.5s ease;
}

.about-us .card .overlay-team .about-link li a:hover{
  border-color: var(--color-primary);
  background: var(--color-primary);
}

.about-us .card .overlay-team .about-link li a i {
  font-size: 25px;
  color: var(--color-white);
}



.about-us .card .team-detail {
  background-color: var(--color-white);
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  padding: 30px 20px;
  text-align: center;
  border-radius: 5px;
  width: 80%;
  margin: auto;
  position: absolute;
  bottom: -30px;
  left: 0px;
  right: 0px;
}

.about-us .card .team-detail h4{
  font-size: 25px;
  font-weight: 600;
  color: var(--color-primary);
  margin-bottom: 0px;
}

.about-us .card .team-detail p{
  font-size: 17px;
  font-weight: 400;
  color: var(--color-secondary);
  margin-bottom: 0px;
}









.scronis-paln .plan-card{
  text-align: center;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  padding: 30px 0px;
  transition: .5s ease;
}

.scronis-paln .plan-card:hover .plan-images img{
  transform: scale(1.1);
}

.scronis-paln .plan-card .plan-images img {
  margin: auto;
  border-radius:0px;
  transition: .5s ease;
}

.scronis-paln .plan-card h3{
  font-size: 30px;
  color: var(--color-primary);
  font-weight: 600;
  text-align: center;
  margin: 25px 0px;
  padding: 0px 20px;
}





/*=================================== domian-search ===================================*/

.domian-search{
  background-color: var(--color-primary-two);
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.domian-search:before{
content: "";
position: absolute;
height: 100%;
width: 100%;
inset-block-start: 0;
background-image: url(../images/banner.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
opacity: 0.08;
transition: transform ease 0.3s;
z-index: -1;
}

.domian-search .domain-style{
  display: flex;
}

.domian-search .domain-style .input-fist{
  width: 75%;
}

.domian-search .domain-style .input-fist .form-control {
  background: var(--color-white);
  border: none;
  line-height: 30px;
  font-size: 18px;
  padding: 20px 10px;
  border-radius: 5px 0 0 5px;
}

.premium-domain-range-bar{
  display: flex;
  margin: 20px 0; 
}

.premium-domain-range-bar .rangebar{
width: 80%;
}



.premium-domain-range-bar input[type="range"]{
width: 100%;
height: 25px;
  background: var(--color-white);
  border: 0;
  border-radius: 4px;
}

.premium-domain-range-bar input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 30px;
  background: var(--color-primary);
  cursor: pointer;
  border-radius: 2px;
  border: 1px solid;
  border-color: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
}

.premium-domain-range-bar input[type="range"]::-moz-range-thumb {
  width: 25px;
  height: 30px;
  background: var(--color-primary-two);
  cursor: pointer;
  border-radius: 2px;
  border: 1px solid;
  border-color: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
}

.premium-domain-range-bar input[type="range"]::-moz-range-progress {
  background-color: var(--color-primary);
  height: 25px;
  border: 0;
  border-radius: 4px;
}

.premium-domain-range-bar .numberbar{
width: 20%;
position: relative;
}

@media (max-width:500px){
  .premium-domain-range-bar {
  display: grid;
}
  .premium-domain-range-bar .rangebar{
width: 100%;
}
.premium-domain-range-bar .numberbar{
width: 100%;
}
}

.premium-domain-range-bar .numberbar .currency-icon{
  display: flex;
}

.premium-domain-range-bar .numberbar .currency-icon span.icon {
  font-size: 16px;
  color: var(--color-white);
  margin: 0 5px 0px 30px;
  /*! border-left: 1px solid; */
  border-color: var(--color-white);
  padding-left: 20px;
}

[dir="rtl"] .premium-domain-range-bar .numberbar .currency-icon span.icon {
  margin: 0 30px 0px 5px;
  padding-left: unset;
  padding-right: 20px;

}

.premium-domain-range-bar input[type="number"]{
border: none;
color: var(--color-white);
background: transparent;
/*text-align: center;*/
  font-size: 16px;
  width: fit-content !important;
  padding: 0;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}


.form-domain-two .input-fist {
  width: 70%;
}

.form-domain-two .input-fist input.form-control {
  background: var(--color-white);
  border: none;
  line-height: 30px;
  font-size: 18px;
  padding: 20px 10px;
  border-radius: 4px 0 0 4px;
  height: auto;
}
.form-domain-two .submit-button .submit-now {
  border-radius: 0 4px 4px 0px;
}

.form-domain-two .select-box {
  border-radius: 0px !important;
  font-size: 20px;
  font-weight: 600;
  width: 15%;
}

.form-domain-two .select-box  select{
  border-radius: 0px;
  border: none;
  padding: 0px 10px;
}

.form-domain-two .submit-button .border-raduis {
  border-radius: 0px 5px 5px 0px;
  font-size: 20px;
  font-weight: 600;
}



.btn-domain {
  font-size: 16px;
  color: var(--color-white) !important;
  background: var(--color-primary) !important;
  padding: 8px 23px;
  border-radius: 0px 5px 5px 0px !important;
  transition: 0.3s;
  font-family: var(--font-primary);
  border-color: var(--color-primary) !important;
}



/*.support-two{
  background-image: linear-gradient(238deg, rgba(17, 17, 17, 0.57) 0%, rgba(30, 29, 29, 0.33) 100%), url(../images/banner.jpg);
  background-repeat: no-repeat;
  background-size: auto;
  background-position: center;
}*/

.support-two{
  background-color: var(--color-primary-two);
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.support-two:before{
content: "";
position: absolute;
height: 100%;
width: 100%;
inset-block-start: 0;
background-image: url(../images/banner.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
opacity: 0.09;
transition: transform ease 0.3s;
z-index: -1;
} 


.support-two .support-contant h3{
  font-size: 30px;
  font-weight: 800;
  color: var(--color-white);
}

.support-two .support-contant p{
  font-size: 18px;
  color: var(--color-white);
}

.support-two .support-contant a{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
  margin-right: 20px;
}

.support-two .support-contant a i{
  margin-right: 5px;
}

/*=============================== faq ==================================*/

.faq .accordion .accordion-item{
  border:none;
  border-radius: 7px;
  margin-top: 15px;
  border: 1px solid;
  color: var(--color-secondary);
  font-size: 15px;
  line-height: 1.7;
}


.faq .accordion .accordion-item .accordion-header .accordion-button{
  font-size: 16px;
line-height: 24px;
background: var(--color-primary);
border-radius: 4px 4px 0px 0px;
border: none !important;
color: var(--color-white);
border-color: rgba(var(--color-primary-rgb-two), 0.2) !important;
}

.faq .accordion .accordion-item .accordion-header .accordion-button:after{
  fill: var(--color-primary-two);
}

.faq .accordion .accordion-item .accordion-header .accordion-button.collapsed {
  background: var(--color-primary-two);
  border-radius: 5px;
  border: 1px solid !important;
  border-color: var(--color-primary-two) !important;
  color: var(--color-white);
}








.under-the-hood .style-card li {
  padding: 10px 10px;
  border-radius: 5px;
  box-shadow: 0 0 3px rgb(60 72 88 / 0.15) !important;
  align-items: center;
  display: flex;
  background-color: var(--color-white);
  margin-bottom: 13px;
  color: var(--color-secondary);
  transition: all .5s;
}

.under-the-hood .style-card li:hover{
  box-shadow: 0 5px 13px rgb(60 72 88 / 0.20) !important;
}

.under-the-hood .style-card li:last-child{
  margin-bottom: 0px;
}

.under-the-hood .style-card li i {
  margin-right: 10px;
  background-color: rgb(238 242 255);
  width: 45px;
  height: 45px;
  display: inline-block;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
  color: var(--color-primary-two);
  font-size: 22px;
}


.just-one-click{
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          justify-content: center;
}

.just-one-click li{
          padding: 20px;
          border-radius: 15px;
          background-color: var(--color-white);
          box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
          margin: 10px;
}

@media(max-width:480px){
          .just-one-click li {
            padding: 20px;
            border-radius: 15px;
            background-color: var(--color-white);
            box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
            margin: 5px;
            width: 46%;
          }
}

.just-one-click li img{
          display: block;
}

.just-one-click2 .sectioncontent h2{
  font-size: 50px;
  font-weight: 800;
  color: var(--color-secondary);
  margin-bottom: 20px;
}

.just-one-click2 .sectioncontent p{
  font-size: 18px;
  font-weight: 400;
}

.just-one-click2 .hover{
  transition: all .5s;
}

.just-one-click2 .hover:hover{
  transform: scale(0.9); 
}



/*====================================== testimonials ===============================*/


.testimonials .card-style{
  padding: 45px 35px;
  border-radius: 10px;
  background-color: var(--white-color);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  cursor: e-resize;
  background-color: var(--color-primary);
  color: var(--color-white);
}

.testimonials .card-style .images{
  display: flex;
  justify-content: end;
}

.testimonials .card-style .images img{
  margin-bottom: 30px;
  max-width: 100%;
}

.testimonials .card-style p{
  font-size: 18px;
  color:var(--color-white);
  margin-bottom: 30px;
}

.testimonials .card-style h3{
  font-size: 30px;
  font-weight: 800;
  color: var(--color-secondary);
  margin-bottom: 0px;
}

.testimonials .card-style h3 span{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
}

.testimonials .card-style .figma img{
  box-shadow: 0px 10px 15px rgba(0,0,0,0.15);
  border:4px solid;
  border-color: var(--color-white);
  border-radius: 50%;
  margin-bottom: 0px;
  max-width: 63px;
}



/*================================================= banner ========================*/

.withheader {
  padding-top: 110px !important;
}

.banner-heading {
  font-size: 50px;
  font-weight: 600;
}

.banner-content {
  font-size: 18px;
}

.banner2{
  padding: 60px 0px;
  background-image: url(../images/banner2.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner2::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner3{
  padding: 60px 0px;
  background-image: url(../images/banner3.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner3::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner4{
  padding: 60px 0px;
  background-image: url(../images/banner4.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner4::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.5) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.8;
}

.banner5{
  padding: 60px 0px;
  background-image: url(../images/banner5.svg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner5::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.5) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.6;
}

.banner6{
  padding: 60px 0px;
  background-image: url(../images/banner7.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner6::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.7) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner7{
  padding: 60px 0px;
  background-image: url(../images/banner8.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner7::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner8{
  padding: 60px 0px;
  background-image: url(../images/banner9.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner8::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}



.banner9::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner9{
  padding: 60px 0px;
  background-image: url(../images/banner.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}




.banner10::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.7) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner10{
  padding: 60px 0px;
  background-image: url(../images/banner10.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}


.banner11{
  padding: 60px 0px;
  background-image: url(../images/banner11.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner11::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.8) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner12{
  padding: 60px 0px;
  background-image: url(../images/banner12.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner12::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.8) 0%, rgba(var(--color-primary-rgb-two), 1) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner13{
  padding: 60px 0px;
  background-image: url(../images/banner13.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner13::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner14{
  padding: 60px 0px;
  background-image: url(../images/banner14.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner14::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner15{
  padding: 60px 0px;
  background-image: url(../images/banner15.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner15::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.8) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner16{
  padding: 60px 0px;
  background-image: url(../images/banner16.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner16::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.8) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner17{
  padding: 60px 0px;
  background-image: url(../images/banner17.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner17::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner18{
  padding: 60px 0px;
  background-image: url(../images/banner18.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner18::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner19{
  padding:30px 0px;
  background-image: url(../images/banner19.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner19::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.4;
}

.banner20{
  padding:30px 0px;
  background-image: url(../images/banner20.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner20::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.9;
}

.banner21{
  padding:30px 0px;
  background-image: url(../images/banner21.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner21::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.9) 0%, rgba(var(--color-primary-rgb-two), 0.9) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}

.banner22{
  padding:30px 0px;
  background-image: url(../images/banner22.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner22::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 0.8) 0%, rgba(var(--color-primary-rgb-two), 1) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}


.banner23{
  padding:30px 0px;
  background-image: url(../images/banner23.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner23::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 05) 0%, rgba(var(--color-primary-rgb-two), 1) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.8;
}


.banner24{
  padding:30px 0px;
  background-image: url(../images/christmas.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner24::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two),1) 0%, rgba(var(--color-primary-rgb-two), 1) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 0.9;
}

.banner25{
  padding:30px 0px;
  background-image: url(../images/blackfriday.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  color: var(--color-white);
}

.banner25::before {
  content: "";
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two),1) 0%, rgba(var(--color-primary-rgb-two), 1) 100%);
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  z-index: 0;
  height: 100%;
  width: 100%;
  opacity: 1;
}










.banner-bg {
  position: relative;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  transition: transform ease 0.8s;
}

.banner-bg.banner-img1 {
  min-height: 330px;
}

.banner-bg.banner-img1::before {
  background-image: url("../images/windo.svg");
}

.banner-bg::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.1;
  z-index: -1;
  max-width: 100%;
}



.banner-bg.banner-img2 {
  min-height: 330px;
}

.banner-bg.banner-img2::before {
  background-image: url("../images/banner6.png");
}

.banner-bg.banner-img2::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.5;
  z-index: -1;
  max-width: 100%;
}




.banner-bg.banner-img3 {
  min-height: 330px;
}

.banner-bg.banner-img3::before {
  background-image: url("../images/banner7.png");
}

.banner-bg.banner-img3::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.5;
  z-index: -1;
  max-width: 100%;
}





.banner-bg.banner-img4 {
  min-height: 330px;
}

.banner-bg.banner-img4::before {
  background-image: url("../images/codegurd.png");
}

.banner-bg.banner-img4::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.9;
  z-index: -1;
  max-width: 100%;
}




.banner-bg.banner-img5 {
  min-height: 330px;
}

.banner-bg.banner-img5::before {
  background-image: url("../images/acronis.png");
}

.banner-bg.banner-img5::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.1;
  z-index: -1;
  max-width: 100%;
}



.banner-bg.banner-img6 {
  min-height: 330px;
}

.banner-bg.banner-img6::before {
  background-image: url("../images/google.png");
}

.banner-bg.banner-img6::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.7;
  z-index: -1;
  max-width: 100%;
}


.banner-bg.banner-img7 {
  min-height: 330px;
}

.banner-bg.banner-img7::before {
  background-image: url("../images/enterprice.png");
}

.banner-bg.banner-img7::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.8;
  z-index: -1;
  max-width: 100%;
}


.banner-bg.banner-img8 {
  min-height: 400px;
}

.banner-bg.banner-img8::before {
  background-image: url("../images/wordpressimages.svg");
}

.banner-bg.banner-img8::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.6;
  z-index: -1;
  max-width: 100%;
}



.banner-bg.banner-img9 {
  min-height: 400px;
}

.banner-bg.banner-img9::before {
  background-image: url("../images/combooffer.png");
}

.banner-bg.banner-img9::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.7;
  z-index: -1;
  max-width: 100%;
}


.banner-bg.banner-img10 {
  min-height: 400px;
}

.banner-bg.banner-img10::before {
  background-image: url("../images/bulkdomain.png");
}

.banner-bg.banner-img10::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.8;
  z-index: -1;
  max-width: 100%;
}


.banner-bg.banner-img11 {
  min-height: 400px;
}

.banner-bg.banner-img11::before {
  background-image: url("../images/sunrise.png");
}

.banner-bg.banner-img11::before {
  content: "";
  height: 100%;
  width: 400px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  fill: #fff;
  opacity: 0.8;
  z-index: -1;
  max-width: 100%;
}


.banner-price .price-strat{
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 0px;
}

.banner-price .price-bg{
  width: 310px;
height: 310px;
background-color:var(--color-white);
border-radius: 100%;
text-align: center;
position: relative;
}

.banner-price .price-bg .offer-content-wrap{
background-color:var(--color-primary-two);
border: 2px solid;
border-color: var(--color-primary);
padding: 20%;
border-radius: 100%;
width: 95%;
height: 95%;
}

.banner-price .price{
  font-size: 75px;
  font-weight: 800;
  color: var(--color-primary);
  margin-bottom: 0px;
}

.banner-price .price.active{
  font-size: 90px;
  font-weight: 800;
}

.banner-price .price span{
  font-size: 18px;
  font-weight: 400;
  color: var(--color-white);
}



/*============================== cerdit-card =================================*/

.cerdit-card .cards {
  padding: 25px 25px;
  box-shadow: 0 10px 20px 0 rgba(0,0,0,.1);
  border-radius:10px;
  transition: .5s ease;
  background-color: var(--color-white);
}

.cerdit-card .cards .images{
  border-radius: 10px;
}

.cerdit-card .cards .images img{
  margin: auto;
  padding: 20px 20px;
  transition: .5s ease;
  cursor: pointer;
}

.cerdit-card .cards:hover .images img {
  transform: scale(0.9);
  filter: grayscale(100%);
  background-color: var(--color-primary-two);
  border-radius: 10px;
}



.cerdit-card .cards .card-contant h3{
  font-size: 30px;
  font-weight: 800;
  text-align: center;
  margin-top: 20px;
  color: var(--color-primary);
  transition: .5s ease;
}

.cerdit-card .cards .card-contant p{
  font-size: 19px;
  font-weight: 600;
  margin-bottom: 0px;
  text-align: center;
  color: var(--color-secondary);
}


/*============================= tabs =======================================*/
.custom-tabings{
  width: 100%;
  display: flex;
  justify-content: center;
}
.custom-tabings .customtab{
width: fit-content;
display: flex;
}
.custom-tabings .customtab .tablinks{
padding:13px 25px;
color: var(--color-primary);
border: 1px solid;
border-color: var(--color-primary);
}
.custom-tabings .customtab .tablinks:first-child{
  border-radius: 50px 0px 0 50px;
}
.custom-tabings .customtab .tablinks:last-child{
  border-radius: 0 50px 50px 0;
}
.custom-tabings .customtab .tablinks.active{
  background-color: var(--color-primary);
  color: var(--color-white);
}
.customtabcontent {
  display: none;
}

.customtabcontent.active{
  display: block;
}


/**************** network *******************/



#subheader{
  background-image:url("../images/subheader.jpg");
  background-repeat: no-repeat;
  width: 100%;
  height:auto;
  margin-bottom: 50px;
}
/*#subheader h1 {
    font-size:60px;
    color: var(--color-primary);
    font-weight: 600;
    letter-spacing: -2px;
}*/
.de-spot span {
  position: absolute;
  display: inline-block;
  background: var(--color-primary);
  padding: 0 10px;
  font-size: 12px;
  font-weight: bold;
  left: 30px;
  line-height: 1.8em;
  color: var(--color-white);
  border-radius: 30px;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
}
.de-spot {
    padding: 0;
    margin: 0;
    position: absolute;
    vertical-align: center;
    text-align: center;
}
.de-circle-1 {
    width: 15px;
    height: 15px;
    background-color: var(--color-primary);
    border-radius: 50%;
    position: absolute;
    margin:5px 0 0 5px;
    left:31%;
}

.de-circle-2 {
    border: 4px solid var(--color-white);
    -webkit-border-radius: 30px;
    height: 25px;
    width: 25px;
    position: absolute;
    -webkit-animation: pulsate 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    opacity: 0.0;
    left:31%;
    background-color: var(--color-secondary);
}
@-webkit-keyframes pulsate {
    0% {-webkit-transform: scale(0.1, 0.1); opacity: 0.0;}
    50% {opacity: 1.0;}
    100% {-webkit-transform: scale(1.2, 1.2); opacity: 0.0;}
}




/*=================================== specialty ====================*/

.countdown .data-count{
  margin-right: 30px;
  text-align: center;
  border: 3px solid var(--color-primary);
  width: 250px;
  height: auto;
  padding: 20px 0px;
  border-radius: 10px;
}

.countdown .data-count:last-child{
  margin-right: 0px;
}

.countdown .data-count h4{
  margin-bottom: 0px;
}




/*--------------------------------------------------------------
# domain-search
--------------------------------------------------------------*/

.domain-search .section-header p{
  color: var(--color-primary);
  font-size: 20px;
  font-weight: 600;
  text-align: center;
}


.domain-search form {
    background: var(--color-white);
    padding: 8px 10px;
    position: relative;
    border-radius: 5px;
}

.domain-search form input[type="text"] {
  border: 0;
  padding: 10px;
  width: calc(100% - 110px);
  background: var(--color-white);
}

.domain-search form input[type=submit] {
    position: absolute;
    top: 0;
    right: -2px;
    bottom: 0;
    border: 0;
    font-size: 16px;
    padding: 0 30px;
    background: var(--color-primary-two) !important;
    color: var(--color-white);
    transition: 0.3s;
  border-radius: 5px;
}

.domain-lists{
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: space-between;
}


.domain-lists li {
  background: var(--color-white);
  color: var(--color-primary);
  border-radius: 5px;
  padding: 18px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  transition: all .5s;
}

.domain-lists li:hover h5{
  transform: scale(1.4);
}

.domain-lists li h5{
  font-size: 20px;
  font-weight: 700;
  text-align: center;
  margin-bottom: 0px;
  color: var(--color-primary-two);
  transition: all .5s;
}

.domain-lists li p{
  color: var(--color-primary);
  font-size: 18px;
  font-weight: 400;
  text-align: center;
  margin-bottom: 0px;
}


/*============================== domain-promos =========================*/

.domain-promos .promo-cart{
  padding: 20px 20px;
  border-top: 5px solid;
  border-bottom: 5px solid;
  border-color: var(--color-primary-two);
  border-radius: 5px;
  text-align: center;
  background-color: var(--color-white);
  transition: all .5s;
}

.domain-promos .promo-cart:hover {
  border-color: var(--color-primary);
}

.domain-promos .promo-cart .plan-price-name{
  font-size: 80px;
  font-weight: 800;
  color: var(--color-primary-two);
  overflow: hidden;
  text-overflow: ellipsis;
  transition: all .5s;
}

.domain-promos .promo-cart:hover .plan-price-name{
  color:var(--color-primary);
}

.domain-promos .promo-cart .plan-name{
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 0px;
  color: var(--color-primary);
}

.domain-promos .promo-cart .plan-price{
  font-size: 40px;
  font-weight: 800;
  margin-bottom: 0px;
  color: var(--color-secondary);
}

.domain-promos .promo-cart:hover .plan-price{
  color: var(--color-primary-two);
}

.domain-promos .promo-cart .plan-price span{
  font-size: 18px;
  font-weight: 400;
}


/*============================== view-domain============================*/


.tabings {
  width: 100%;
  display: flex;
  justify-content: center;
}

.tabings .tabs{
  width: fit-content;
display: flex;
flex-direction: row;
}

@media (max-width:767px){
 .tabings .tabs{
   flex-direction: row;
   flex-wrap: wrap;
 } 
}

.tabings .tabs .tabbutton{
  padding: 13px 20px;
  color: var(--color-primary-two);
  border: 1px solid;
  border-color: var(--color-primary-two);
  margin-bottom: 10px;
  border-radius: 0px;
  text-align: left;
  font-size: 17px;
  display: flex;
  align-items: center;
  background-color: var(--color-white);
}

.tabings .tabs .tabbutton.active{
  background-color: var(--color-primary-two);
  color: var(--color-white);
}

@media(min-width:767px){

.tabings .tabs.roundness .tabbutton:first-child{
border-radius: 4px 0px 0px 4px;
}

[dir="rtl"] .tabings .tabs.roundness .tabbutton:first-child{
border-radius: 0px 4px 4px 0px;
}

.tabings .tabs.roundness .tabbutton:last-child{
border-radius: 0px 4px 4px 0px;
}

[dir="rtl"] .tabings .tabs.roundness .tabbutton:last-child{
border-radius: 4px 0px 0px 4px;
}

}

@media (max-width:767px){
 .tabings .tabs.roundness .tabbutton{
  width: 50%;
 }
}

@media (max-width:430px){
 .tabings .tabs.roundness .tabbutton{
  width: 100%;
 }
}

.tabings .tabs .tabbutton i{
margin-right: 10px;
}

[dir="rtl"] .tabings .tabs .tabbutton i{
margin-right: unset;
margin-left: 10px;
}
.tabscontents{
  display: none;
}

.tabscontents.active{
  display: block;
}

.domain-pricng-searching {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px 15px;
  font-size: 16px;
  color: var(--color-secondary);
}


.table-style-three{
  overflow: visible;
  box-shadow: none;
  border: none;
  border-collapse: unset;
  border-spacing: 0 10px;
}



.table-style-three thead{
  background: var(--color-primary);
  color: var(--color-white);
  border-color: inherit;
border-style: solid;
border-width: 0;
}


.table-style-three thead th{
    border-color: inherit;
border-style: solid;
border-width: 0;
font-size: 16px;
}

.table-style-three tbody tr{
text-align: left;
transition: all .1s linear;
background: #fafafa;
border-collapse: unset;
  border-spacing: 0 10px;
}

.table-style-three > tbody > tr > td {
  padding: 20px 15px;
  border-right: none;
  font-weight: 600;
  font-size: 16px;
  line-height: 1;
  vertical-align: middle;
  border: none;
  transition: all .3s ease;
  color: var(--color-secondary);
  box-shadow: 0 3px 0px rgb(0 0 0 / 0.1);
}


/*.table-style-three tbody tr td:first-child {
  border-left: 3px solid #e2e8f0;
  border-radius: 2px 0 0 2px;
}*/

[dir="rtl"] .table-style-three tbody tr td:first-child{
  border-left: 0;
  border-right: 3px solid #e2e8f0;
  border-radius: 0px 2px 2px 0px;
}

[dir="rtl"] .table-style-three tbody tr td{
  text-align: right;
}


.table-style-three tbody tr:hover td {
  border-color: var(--color-primary-two); !important;
}






/*========================= table-plan =========================*/

.table-plan .table-header{
  background-color: var(--color-primary-two);
  border-top: 3px solid;
  border-color: var(--color-primary);
  color:  var(--color-white);
}

.table-plan .table-header.active{
  background-color: var(--color-white);
}

.table-plan .table-header.active .plan-name{
  color: var(--color-primary-two);
}

.table-plan .table-header.active .plan-subname{
  color: var(--color-primary);
}

.table-plan .table-header.active .paln-price{
  color: var(--color-primary);
}

.table-plan .table-header.active .paln-price sub{
  color: var(--color-primary-two);
}

.table-plan .plan-header{
  width: 20%;
  text-align: left;
}

.table-plan .plan-name{
  font-size: 20px;
  font-weight: 500;
  color: var(--color-white);
  margin-bottom: 0px;
}



.table-plan .plan-subname{
  font-size: 15px;
  margin-bottom: 0px;
}

.table-plan .paln-price{
  font-size: 28px;
  font-weight: 800;
}

.table-plan .paln-price sub{
  color: var(--color-white);
  font-size: 18px
}

.coolabsed tr:not(:first-child) {
  display: none;
}

.coolabsed.active tr:not(:first-child) {
  display: table-row;
}

.table-plan thead>tr>th{
  border-right: 1px solid;
  border-color: var(--color-secondary);
  border-bottom: 0px;
  border-top: 3px solid;
}

.table-plan thead>tr>th:last-child{
  border-right: 0px;
}


.table-toogler .up-down-icon{
  position: relative;
  padding-right: 20px;
  cursor: pointer;
}

.table-toogler .up-down-icon:before{
  position: absolute;
  width: 0;
  right: 0px;
  top: 10px;
height: 0;
margin-top: -4px;
border-top: none;
border-right: 7px solid rgba(0, 0, 0, 0);
border-bottom: 8px solid #6a6767;
border-left: 7px solid rgba(0,0,0,0);
content: "";
transition: all 0.5s;
transform: rotate(90deg);
}

.table-toogler.active .up-down-icon:before{
  transform: rotate(180deg);
}

.table-plan tbody>tr>td .bi-check-circle{
  color: var(--bs-green);
}

.table-plan tbody>tr>td .bi-dash-circle{
  color: var(--bs-red);
}

.table-plan tbody>tr>td .bi-x-circle{
  color: var(--bs-red);
}

.table-plan tbody>tr>th {
  text-align: left;
  border-right: 1px solid;
  border-right: 1px solid #6b6b7e !important;
  border-top: 0px;
  border-top: 1px solid;
  border-color: var(--color-white);

}

.table-plan tbody>tr>td{
  border-right: 1px solid #6b6b7e !important;
  border-top: 1px solid;
  border-color: var(--color-white);
}

.table-plan tbody>tr>td:last-child{
  border-right: 0px !important;
}

.table tbody + tbody{
  border-top: 0px !important;
}



/*============================== webbly =====================================*/

.weebly #weebly-flters {
  padding: 0;
  margin: 0 auto 25px auto !important;
  list-style: none;
  text-align: center;
  border-radius: 50px;
  padding: 2px 15px;
  width: fit-content;
}

.weebly #weebly-flters li {
  cursor: pointer;
  display: inline-block;
  padding: 8px 25px 8px 25px !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  color: var(--color-secondary);
  margin: 0 4px 0px 4px;
  transition: 0.3s;
  border-radius: 50px;
  border: 1px solid #fff;
  background: var(--color-white);
}

.weebly #weebly-flters li:hover,
.weebly #weebly-flters li.filter-active {
  color: var(--color-primary-two);
  border-color: var(--color-primary-two);
}


@media (max-width:991px){
  .weebly-container{
    height: unset !important; 
  }

  .weebly-item{
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important; 
  }

  .weebly-item img{
    margin: auto;
  }
}



/*===================================== sale ===========================*/




.banner-offer{
  font-size: 110px;
  font-weight: bold;
  color: var(--color-primary);
}


.video-banner{
  background-image: none;
}

.video-banner .video {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  height: 100%;
  z-index: -2;
}


.snow,
.snow:before,
.snow:after {
  position: absolute;
  top: -600px;
  left: 0;
  bottom: 0;
  right: 0;
  background-image: radial-gradient(6px 6px at 28px 45px, white 50%, rgba(0, 0, 0, 0)), radial-gradient(6px 6px at 118px 423px, rgba(255, 255, 255, 0.8) 50%, rgba(0, 0, 0, 0)), radial-gradient(5px 5px at 512px 231px, rgba(255, 255, 255, 0.6) 50%, rgba(0, 0, 0, 0));
  background-size: 600px 600px;
  animation: snow 3s linear infinite;
  content: "";
}

.snow:after {
  margin-left: -200px;
  opacity: 0.2;
  animation-duration: 5s;
  animation-direction: reverse;
  filter: blur(0px);
}

.snow:before {
  animation-duration: 5s;
  animation-direction: reverse;
  margin-left: -300px;
  opacity: 0.5;
  filter: blur(0px);
}

@keyframes snow {
  to {
    transform: translateY(900px);
  }
}


/*======================================== footer ================================*/

.footer {
  background-color: var(--color-primary-two);
  padding-top: 40px;
  padding-bottom: 20px;
}

.footer .footer-contant{
  color: var(--color-white);
}

.footer .footer-contant .footer-pera{
  font-size: 16px;
  line-height: 1.5rem;
  padding-bottom: 10px;
}

.footer .footer-contant .footer-list li{
  display: flex;
  font-size: 17px;
  padding-bottom: 10px;
}

.footer .footer-contant .footer-list li:last-child{
  padding-bottom: 0px; 
}


.footer .footer-contant .footer-list li a i{
  margin-right: 13px;
}

.footer .footer-contant .footer-link{
  display: flex;
}


.footer .footer-contant .footer-link a {
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 100%;
  border: 1px solid;
  border-color: var(--color-primary); !important;
  color: var(--color-white);
  text-align: center;
  font-size: 15px;
  margin-right: 15px;
  transition: all .5s;
  position: relative;
  background-color: var(--color-primary);
}

.footer .footer-contant .footer-link a:hover{
   transform: scale(1.2);
}

.footer .footer-contant .footer-link a:last-child{
  margin-right: 0px;
}

.footer .footer-link-style{
  color: var(--color-white);
}

.footer .footer-link-style .footer-list li{ 
  padding-bottom: 15px;
}


.footer .footer-link-style .footer-list li a{
  font-size: 15px;
}

.footer .footer-link-style .footer-list li a:before{
  content: "\F234";
  margin-right: 6px;
  font-family:"bootstrap-icons";
  font-size: 15px;
  color: var(--color-white);
  padding: 4px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.1);
  line-height: 1;
  display: inline-block;
  vertical-align: bottom;
}

.footer .border-top-bottom{
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

.footer .payment-heading{
  margin-bottom: 0px !important;
  color: var(--color-white);
  font-size: 16px;
  margin-right: 15px;
}

.footer .images-payment{
  margin-right: 10px;
}

.footer .payment-cards {
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 5px;
}

.footer .copy-right{
  padding-top: 22px;
  color: var(--color-white);
  display: block;
  text-align: center;
}



/*======================================== rtl =======================================*/

[dir="rtl"] .topbar .support .support-items {
  margin-left: unset;
  margin-right: 15px;
}

[dir="rtl"] .header-main .social .social-item {
  margin-right: unset;
  margin-left: 15px;
}

[dir="rtl"] .header-main .social .social-item .icon {
  margin-left: 10px;
  margin-right: unset;
}

[dir="rtl"] .navbar .dropdown > a::after {
  margin-right: 5px;
  margin-left: unset;
}

[dir="rtl"] .navbar .dropdown ul.megamenu-style li > h6 i {
  margin-right: unset;
  margin-left: 7px;
}

[dir="rtl"] .navbar .dropdown ul a i {
  margin-left: 10px;
  margin-right: unset; 
}

[dir="rtl"] .navbar .dropdown ul {
  right: 0px;
  left: unset;
}

[dir="rtl"] .navbar .dropdown .dropdown:hover > ul {
  right: 100%;
  left: unset;
}

[dir="rtl"] .plan .plan-card .plan-unlist li::before {
  margin-right: unset;
  margin-left: 6px;
}

[dir="rtl"] .tootips-plans {
  left: unset;
  right: 5px;
}

[dir="rtl"] .under-the-hood .style-card li i {
  margin-right:unset;
  margin-left: 10px;
}

[dir="rtl"] .domian-search .domain-style .input-fist .form-control {
  border-radius: 0px 5px 5px 0px;
}

[dir="rtl"] .btn-domain {
  border-radius: 5px 0px 0px 5px !important;
}

[dir="rtl"] .support-two .support-contant a {
  margin-left: 20px;
  margin-right: unset;
}

[dir="rtl"] .support-two .support-contant a i {
  margin-left: 5px;
  margin-right: unset;
}


[dir="rtl"] .footer .footer-contant .footer-list li a i {
  margin-right: unset;
  margin-left: 13px;
}

[dir="rtl"] .footer .footer-contant .footer-link a {
  margin-right: unset;
  margin-left: 15px;
}

[dir="rtl"] .footer .footer-contant .footer-link a:last-child{
  margin-left: 0px;
}

[dir="rtl"] .footer .footer-link-style .footer-list li a::before {
  margin-right: unset;
  margin-left: 6px;
}

[dir="rtl"] .footer .images-payment {
  margin-left: 10px;
  margin-right: unset;
}

[dir="rtl"] .footer .payment-heading {
  margin-left: 15px;
  margin-right: unset;
}




/* --------------------------------------------------------------------------
                           Style Switcher
---------------------------------------------------------------------------*/


.switcher-icon {
  position: fixed;
  height: 45px;
  width: 45px;
  background: #000;
  color: #fff !important;
  border-start-start-radius: 0.3rem;
  border-start-end-radius: 0px;
  border-end-end-radius: 0px;
  border-end-start-radius: 0.3rem;
  inset-inline-end: 0;
  inset-block-start: 20rem;
  text-align: center;
  line-height: 3;
  z-index: 99;
  font-size: 20px;
  display: flex;
  justify-content: center;
  line-height: 45px;
}
.switcher-icon .spin:before{
  animation-name: spin;
  animation-duration: 5000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; 
}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}






#switcher-canvas.offcanvas{
  width: 350px;
  height: 100%;
  background: var(--color-white);
  position: fixed;
  z-index: 999;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  left:-100%;
  top: 0;
  transition:  0.5s ease;
  display: block;
  visibility: hidden;
  opacity: 0;
}

[dir="rtl"] #switcher-canvas.offcanvas {
  left: auto;
  right: -100%;
  top: 0;
  opacity: 0;
}


@media (max-width:767px){
  #switcher-canvas.offcanvas{
    height: auto;
  }
}

.offcanvas::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #0006;
  z-index: -1;
}

#switcher-canvas.offcanvas.show{
  visibility: visible;
  opacity: 1;
  left: 0;
  transition:  0.5s ease;
}

[dir="rtl"] #switcher-canvas.offcanvas.show{
  left: auto;
  right: 0;

}

.offcanvas-inner {
  height: 100%;
  background: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  min-height: 100vh;
  overflow: auto;
  position: relative;
}

.offcanvas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px;
}
.offcanvas-header h5{
margin-bottom: 0;
line-height: 1.5;
font-size: 20px;
}
.offcanvas-header .style-swicher-close {
  width: 37px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: rgba(var(--color-secondary-light-rgb), 0.2);
  color: var(--color-primary-two) !important;
  border-radius: 4px;
}

.offcanvas-body {
  flex-grow: 1;
  padding: 16px 16px;
/*  overflow-y: auto;*/
display: block;
}

#switcher-canvas .offcanvas-body {
  padding: 0 0 0px 0;
/*  max-height: 450px;*/
  position: relative;
}

@media (max-width:480px){
  #switcher-canvas .offcanvas-body{
      max-height: 500px;
      overflow: auto;
  }
}

.switcher-style-head {
  font-size: 17px;
  font-weight: 500;
  -webkit-margin-after: 0;
  margin-block-end: 0;
  padding: 5px 8px;
  color: var(--color-secondary-dark);
}

.switcher-style {
  padding: 10px 17px;
  margin: 0;
}

.switch-select.form-check {
  -webkit-margin-after: 0;
  margin-block-end: 0;
  min-height: auto;
  padding-left: 1.25rem;
}

[dir="rtl"] .switch-select.form-check {
  padding-left: unset;
  padding-right: 1.25rem;
}

.switch-select .form-check-label {
  font-size: 16px;
}

.form-check-input[type="radio"] {
  border-radius: 50%;
}

.form-check .form-check-input {
  float: left;
  margin-left: -1.5em;
  position: relative;
}

[dir="rtl"] .form-check .form-check-input {
  float: right;
  margin-left: unset;
  margin-right: -1.5em;
  
}

.form-check-input {
  background-color: var(--color-white);
}
.form-check-input {
  border: 1px solid #e9e9e9;
}

.form-check-input {
  width: 16px;
  height: 16px;
  margin-top: .25em;
  vertical-align: top;
}

#switcher-canvas .canvas-footer {
  padding: 10px 15px;
  position: relative;
  width: 100%;
  background-color: var(--color-white);
  box-shadow: 0 3px 10px 0px rgba(0, 0, 0, 0.1);
}

.accept-cookies {
  position: fixed;
  z-index: 9999;
  inset-inline-start: 15px;
  inset-block-end: 30px;
  max-width: 23rem;
  background-color: var(--color-white);
  padding: 20px;
  border-radius: 3px;
  border: 1px solid var(--color-secondary);
  box-shadow: 0 8px 20px 0 rgba(40, 37, 89, 0.6);
  -webkit-margin-start: 30px;
          margin-inline-start: 30px;
  text-align: start;
  display: none;
}


@media (max-width:480px){
.accept-cookies {
  inset-inline-start: -15px !important;
  max-width: 18rem !important;
}
.accept-cookies .btn-wrap button{
  margin-top: 10px;
}
.accept-cookies .btn-wrap button:first-child{
  margin-top: 0px;
}
}



.accept-cookies .title-wrap h4 {
  font-size: 22px;
  color: var(--color-secondary-dark);
  margin-bottom: 5px;
}

.accept-cookies .msg-wrap p{
  font-size: 16px;
  color: var(--color-secondary);
}

.accept-cookies .msg-wrap a{
  color: var(--color-primary-two);
}

#customizeCookie h6{
  color: var(--color-secondary);
  font-size: 18px;
}

#customizeCookie label{
  color: var(--color-secondary);
  font-size: 16px;
}

[dir="rtl"] #customizeCookie .form-check{
  padding-left: unset;
  padding-right: 1.25rem;
}


.switcher-box {
  height:auto;
  overflow:hidden;
  margin-bottom:0px;
}

.switcher{
  position: relative;
  display: flex;
}

.switcher .styleswitch{
  width: 35px;
height: 35px;
display: block;
cursor: pointer;
margin: 10px;
float: left;
border-radius: 3px;
}

[dir="rtl"] .switcher .styleswitch{
  float: right;
}

.styleswitch#default {
  background: #1457E6;
}

.styleswitch#blue {
  background: #0ea2bd;
}


.styleswitch#red {
  background: #cc0066;
}

.styleswitch#green {
  background: #04aa6d;
}


/* Layout Box */
.layout-switcher {
  margin:0 0 0px 0;
  overflow:hidden;
}

.layout-switcher a.layout {
  padding: 10px 15px;
  border: 1px solid var(--color-primary-two);
  color: var(--color-primary-two);
  font-size: 15px;
  border-radius: 4px;
  cursor: pointer;
  margin-left: 7px;
  transition: all 0.5s;
  background: var(--color-white);
}

.layout-switcher a.layout:hover{
  background: var(--color-primary-two);
  color: var(--color-white);
}

.layout-switcher a.layout:first-child{
margin-left: 0px;
}

.layout-switcher a.layout:first-child{
  background: var(--color-primary-two);
  color: var(--color-white);
}

[dir="rtl"] .layout-switcher a.layout{
  margin-left: unset;
  margin-right: 7px;
}

[dir="rtl"] .layout-switcher a.layout:first-child{
margin-left: unset;
margin-right: 0px;
}


/* Mode Box */
.mode-switcher {
  margin:0 0 0px 0;
  overflow:hidden;
}

.mode-switcher a.layout {
  padding: 10px 15px;
  border: 1px solid var(--color-primary-two);
  color: var(--color-primary-two);
  font-size: 15px;
  border-radius: 4px;
  cursor: pointer;
  margin-left: 7px;
  transition: all 0.5s;
  background: var(--color-white);
}

.mode-switcher a.layout:hover{
  background: var(--color-primary-two);
  color: var(--color-white);
}

.mode-switcher a.layout:first-child{
margin-left: 0px;
}

.mode-switcher a.layout:first-child{
  background: var(--color-primary-two);
  color: var(--color-white);
}


.container-fluid::after, .container-fluid::before, .container::after, .container::before, .nav::after, .nav::before, .navbar-collapse::after, .navbar-collapse::before, .navbar-header::after, .navbar-header::before, .navbar::after, .navbar::before, .pager::after, .pager::before, .panel-body::after, .panel-body::before, .row::after, .row::before{
    display: unset;
    content: unset;
}

[dir="rtl"] .mode-switcher a.layout{
  margin-left: unset;
  margin-right: 7px;
}

[dir="rtl"] .mode-switcher a.layout:first-child{
margin-left: unset;
margin-right: 0px;
}

[dir="rtl"] .domain-search form input[type="submit"] {
  right: unset;
  left: -2px;
}

[dir="rtl"] .list-tick li::before {
  margin-left: 6px;
  margin-right: unset;
}


[dir="rtl"] .custom-tabings .customtab .tablinks:last-child {
  border-radius: 50px 0px 0px 50px;
}

[dir="rtl"] .custom-tabings .customtab .tablinks:first-child {
  border-radius: 0px 50px 50px 0px;
}

[dir="rtl"] .plan-select {
  text-align: right;
}

[dir="rtl"] .plan .plan-card.active-two .tootips-plans span {
  transform: translate(0%, -102%);
}

[dir="rtl"] .features8 .section-list li::before {
  margin-left: 6px;
  margin-right: unset;
}

[dir="rtl"] .features9 .card .features-list li {
  padding-left: unset;
  padding-right: 15px;
}

[dir="rtl"] .features9 .card .features-list li::before {
  margin-left: 6px;
  margin-right: unset;
}

[dir="rtl"] .table-plan tbody > tr > th {
  text-align: right;
}

[dir="rtl"] .table-plan .plan-header {
  text-align: right;
}

[dir="rtl"] .faq .accordion .accordion-item .accordion-header .accordion-button.collapsed {
  text-align: right;
}

[dir="rtl"] .faq .accordion .accordion-item .accordion-header .accordion-button {
  text-align: right;
}

[dir="rtl"] .form-domain-two .input-fist input.form-control {
  border-radius: 0px 4px 4px 0px;
}

[dir="rtl"] .me-2 {
  margin-right: unset !important;
  margin-left: 0.5rem !important;
}

[dir="rtl"] .horizontal-plan-two .form-price select {
  padding-right: 15px;
  padding-left: unset;
}

[dir="rtl"] .horizontal-plan-two .form-price-total .price-count {
  padding-right: 10px;
  padding-left: unset;
}

[dir="rtl"] .about-us .card .overlay-team .about-link li {
  margin-right: unset;
  margin-left: 15px;
}

[dir="rtl"] .about-us .card .overlay-team .about-link li:last-child{
  margin-left: 0px;
}

[dir="rtl"] .ms-2 {
  margin-right: 0.5rem !important;
  margin-left: unset !important;
}

[dir="rtl"] .features11 .blog-detail .contents .section-list li {
  margin-left: 20px;
  margin-right: unset;
}

[dir="rtl"] .features11 .blog-detail-two .post .images {
  margin-right: unset;
  margin-left: 15px;
}

[dir="rtl"] .horizontal-plan .pricing-column .monthly-price span.durections {
 margin-right: 6px;
  margin-left: unset;
}

[dir="rtl"] .horizontal-plan .pricing-column .custum-lists li::before {
  margin-left: 5px;
  margin-right: unset;
}

[dir="rtl"] .countdown .data-count{
  margin-right: unset;
  margin-left: 30px;
}

[dir="rtl"] .countdown .data-count:last-child{
  margin-left: 0px;
}

[dir="rtl"] .login-page .login-detail .login-cart .singup-forgot .link-page i {
  margin-left: 6px;
  margin-right: unset;
}

[dir="rtl"] .register .register-cart .singup-forgot .register-text i {
  margin-left: 6px;
  margin-right: unset;
}

[dir="rtl"] .forgot .forgot-cart .forgot-forgot i {
  margin-left: 6px;
  margin-right: unset;
}

[dir="rtl"] .form-domain-two .submit-button .border-raduis{
  border-radius: 5px 0px 0px 5px;
}


/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media (max-width: 768px) {
    .aos-init {
    transition: unset !important;
    transform: translate(0)!important;
    opacity: 1 !important;
  }
}
