/* --------------------------------------------------------------------------
                           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;
}



ul{
  margin: 0px !important;
  padding: 0px !important;
  list-style: none !important;
}


.section-header {
  padding-bottom: 40px;
}


.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;
}
}

.bg-pattern {
	z-index: 1;
	position: relative;
}
.bg-pattern::before{
content: "";
position: absolute;
inset-block-start: 0;
inset-inline-start: 0;
height: 100%;
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
opacity: 0.05;
z-index: -1;
background-attachment: fixed;
}
.bg-pattern-1:before{
background-image: url("../images/bgpattern1.jpg");
opacity: 0.05;
}

.bg-pattern-2:before{
background-image: url("../images/bgpattern2.jpg");
opacity: 0.05;
}


.bg-pattern-3:before{
background-image: url("../images/bgpattern3.jpg");
opacity: 0.1;
}


.bg-pattern-4:before{
background-image: url("../images/bgpattern4.jpg");
opacity: 0.05;
}

.bg-pattern.darkness{
	background-color: rgba(var(--color-primary-rgb-two), 1);
}

.bg-pattern-5:before{
background-image: url("../images/bgpattern5.png");
opacity: 1;
}

.darkness.bg-pattern-5:before{
opacity: 1;
}

.bg-pattern-6:before{
background-image: url("../images/bgpattern6.jpg");
opacity: 0.08;
}

.bg-darked{
background-color:var(--color-primary-two);
}

.bg-pattern-7:before{
background-image: url("../images/bgpattern7.jpg");
opacity: 0.05;
}




ul.list-style-one li{
padding-left: 25px;
position: relative;
padding-bottom: 10px;
font-size: 17px;
color: var(--color-secondary);
}
[dir="rtl"] ul.list-style-one li{
	padding-left: unset;
	padding-right: 25px;
}
ul.list-style-one li:before{
content: "\F26B";
font-family: "bootstrap-icons";
font-size: 15px;
color: var(--color-primary-two);
position: absolute;
left: 2px;
top: 2px;
}

[dir="rtl"] ul.list-style-one li:before{
	left: unset;
	right: 2px;
}


ul.list-style-one li:last-child{
padding-bottom: 0px;
}


/* --------------------------------------------------------------------------
                           3. custom button
---------------------------------------------------------------------------*/
.btn-primary {
  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:hover,
 .btn-primary:focus:hover, .btn-primary:focus {
  color: var(--color-white) !important;
  background: rgba(var(--color-primary-rgb), 0.85) !important;
  border-color: var(--color-primary) !important;
}

.btn-primary-two {
  font-size: 16px;
  color: var(--color-white) !important;
  background: var(--color-primary-two) !important;
  padding: 8px 23px;
  border-radius: 5px;
  transition: 0.3s;
  font-family: var(--font-primary);
  border-color: var(--color-primary-two) !important;
}

 .btn-primary-two:hover,
 .btn-primary-two:focus:hover, .btn-primary-two:focus {
  color: var(--color-white) !important;
  background: rgba(var(--color-primary-rgb-two), 0.85) !important;
  border-color: var(--color-primary-two) !important;
}

.btn-outline-primary, .btn-outline-primary: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:hover,
.btn-outline-primary:focus:hover,
.btn-outline-primary:focus {
 color: var(--color-white) !important;
 background: rgba(var(--color-primary-rgb)) !important;
 border-color: var(--color-primary) !important;
}


.btn-white {
  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:hover,
 .btn-white:focus:hover, .btn-white: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;
}

.preloader {
  display: block;
  position: relative;
  width: 80px;
  height: 80px;
	margin: auto;
}
.preloader div {
  animation: preloader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 40px 40px;
}
.preloader div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-primary-two);
  margin: -4px 0 0 -4px;
}
.preloader div:nth-child(1) {
  animation-delay: -0.036s;
}
.preloader div:nth-child(1):after {
  top: 63px;
  left: 63px;
}
.preloader div:nth-child(2) {
  animation-delay: -0.072s;
}
.preloader div:nth-child(2):after {
  top: 68px;
  left: 56px;
}
.preloader div:nth-child(3) {
  animation-delay: -0.108s;
}
.preloader div:nth-child(3):after {
  top: 71px;
  left: 48px;
}
.preloader div:nth-child(4) {
  animation-delay: -0.144s;
}
.preloader div:nth-child(4):after {
  top: 72px;
  left: 40px;
}
.preloader div:nth-child(5){
  animation-delay: -0.18s;
}
.preloader div:nth-child(5):after{
  top: 71px;
  left: 32px;
}
.preloader div:nth-child(6) {
  animation-delay: -0.216s;
}
.preloader div:nth-child(6):after {
  top: 68px;
  left: 24px;
}
.preloader div:nth-child(7) {
  animation-delay: -0.252s;
}
.preloader div:nth-child(7):after {
  top: 63px;
  left: 17px;
}
.preloader div:nth-child(8) {
  animation-delay: -0.288s;
}
.preloader div:nth-child(8):after {
  top: 56px;
  left: 12px;
}
.preloader div:nth-child(9) {
  animation-delay: -0.324s;
}
.preloader div:nth-child(9):after {
  top: 49px;
  left: 8px;
}
@keyframes preloader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


/*
#preloader:before {
  content: "";
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 30px);
  border: 6px solid var(--color-primary);
  border-top-color: #e2eefd;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  -webkit-animation: animate-preloader 1s linear infinite;
  animation: animate-preloader 1s linear infinite;
}

@-webkit-keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

@keyframes animate-preloader {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}
*/

/*--------------------------------------------------------------
5. Back to top button
--------------------------------------------------------------*/
.back-to-top {
  position: fixed;
  visibility: visible;
  opacity: 0;
  right: 15px;
  bottom: 100%;
  z-index: 996;
  background: var(--color-primary);
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: 1s ease;
}

[dir="rtl"] .back-to-top {
  right: auto;
	left: 15px;
}

.back-to-top i {
  font-size: 21px;
  color: #fff;
  line-height: 0;
}

.back-to-top:hover {
  background: var(--color-primary);
  color: #fff;
}

.back-to-top.active {
  transition: 1s ease;
  right: 15px;
  bottom: 15px;
  opacity: 1;
}

[dir="rtl"] .back-to-top.active {
  right: auto;
	left: 15px;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
  [data-aos^="fade"][data-aos^="fade"] {
  opacity: 1;
  transform: unset !important;
}
}

/*--------------------------------------------------------------
6. Top bar
--------------------------------------------------------------*/
.topbar {
  background: rgba(var(--color-secondary-light-rgb), .2);
  padding-top: 7px;
  padding-bottom: 7px;
}

.topbar .support{
display: flex;
justify-content: start;
}
.topbar .support.right-sider{
display: flex;
justify-content: end;
}

@media(max-width:767px){
          .topbar .support.right-sider{
          display: flex;
          justify-content: center;
          }

}

.topbar .support .support-items {
	margin-left: 20px;
}

[dir="rtl"] .topbar .support .support-items {
	margin-left: unset;
	margin-right: 20px;
}

.topbar .support .support-items:first-child{
          margin-left: 0px;
}

[dir="rtl"] .topbar .support .support-items:first-child{
          margin-left: unset;
	margin-right: 0px;
}

.topbar .support .support-items i {
	color: var(--color-primary-two);
	font-size: 16px;
}
.topbar .support .support-items a{
          color: var(--color-secondary);
          font-size: 16px;
          transition: 0.5s;
	position: relative;
}
.topbar .support .support-items a:hover{
	color: var(--color-primary-two);
}


.topbar .support .support-items>a::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 2px;
	bottom: -6px;
	left: 0;
	background-color: var(--color-primary-two);
	visibility: hidden;
	width: 0px;
	transition: all 0.3s ease-in-out 0s;
}
.topbar .support .support-items>a:hover::before{
visibility: visible;
width: 100%;
}

.topbar .support .dropdown.support-items>a:after{
content: "\F229";
display: inline-block;
font-family: bootstrap-icons !important;
margin-left: 5px;
position: relative;
top: 1px;
font-size: 11px;
}

[dir="rtl"] .topbar .support .dropdown.support-items>a:after{
margin-left: unset;
margin-right: 5px;
}

[dir="rtl"] .topbar .support .dropdown.support-items .dropdown-menu a{
text-align: right;
}




.topbar .support .dropdown.support-items .dropdown-menu a:hover{
color: var(--color-white) !important;
}
.topbar .support .dropdown.support-items .dropdown-menu a i{
          color: var(--color-secondary);
          transition: 0.5s;
}
.topbar .support .dropdown.support-items .dropdown-menu a:hover i{
color: var(--color-white) !important;
}
.header-main {
  padding-top: 20px;
  padding-bottom: 20px;
}
.header-main .logo{
          display: 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;
}


[dir="rtl"] .header-main .social .social-item{
  margin-right: unset;
  margin-left: 15px;
}


.header-main .social .social-item:last-child{
  margin-right: 0px;
}

[dir="rtl"] .header-main .social .social-item:last-child{
  margin-right: unset;
  margin-left: 0px;
}

.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 0.5s;
}

[dir="rtl"] .header-main .social .social-item .icon{
	margin-right: unset;
	margin-left: 10px;
}

.header-main .social .social-item:hover .icon{
	background: var(--color-primary-two);
	color: var(--color-white);
}

.header-main .social .social-item .content{
  display: grid;
	transition: all 0.5s;
}
.header-main .social .social-item:hover .content{
	color:var(--color-primary-two);
}
.header-main .social .social-item .content .contents{
  font-size: 13px;
  color: var(--color-secondary);
	transition: all 0.5s;
}

.top-bar-serch{
          display: flex;
}

.top-bar-serch input[type="text"]{
          padding: 13px 10px;
          border: 1px solid;
          border-color: rgba(var(--color-secondary-rgb), .5);
          border-radius: 4px 0 0 4px;
          width: 85%;
          font-size: 15px;
}

[dir="rtl"] .top-bar-serch input[type="text"]{
         
          border-radius: 0px 4px 4px 0px;
          
}

.top-bar-serch input[type="submit"]{
          padding: 13px 10px;
          background: var(--color-primary-two);
          border: 1px solid;
          border-color: var(--color-primary-two);
          color: var(--color-white);
          border-radius: 0px 4px 4px 0px;
          width: 15%;
}

[dir="rtl"] .top-bar-serch input[type="submit"]{
         
          border-radius: 4px 0px 0px 4px;
          
}

.top-bar-serch input[type="submit"]:hover{
          background: transparent;
          color: var(--color-primary-two);
}


#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;
  top: calc(100% + 30px);
  margin: 0;
  padding: 10px !important;
  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);
}

[dir="rtl"] .navbar .dropdown ul{
	left: auto;
	right: 0px;
}



.navbar .dropdown ul.megamenu-style{
          padding-top: 10px;
          padding-bottom: 10px;

}
.navbar .dropdown ul.megamenu-style.whithad li.img-ad{
min-width: 100%;
position: absolute;
padding-top: 0px;

}
.navbar .dropdown ul.megamenu-style.whithad li.img-ad img{
          position: absolute;
}
.navbar .dropdown ul.megamenu-style.whithad li.img-ad .heading {
	font-size: 20px;
	color: var(--color-white);
	position: relative;
	top: 20px;
	padding-left: 20px;
	display: block;
	margin-bottom: 15px;
          z-index: 5;
}

[dir="rtl"] .navbar .dropdown ul.megamenu-style.whithad li.img-ad .heading {
	padding-left: unset;
	padding-right: 20px;
	
}


.navbar .dropdown ul.megamenu-style.whithad li.img-ad .content {
	font-size: 16px;
	color: var(--color-white);
	position: relative;
	top: 10px;
	padding-left: 20px;
	line-height: 1.5;
	z-index: 5;
	max-width: 290px;
	display: block;
	word-break: break-all;
	overflow-wrap: break-word;
}

[dir="rtl"]  .navbar .dropdown ul.megamenu-style.whithad li.img-ad .content {
	padding-left: unset;
	padding-right: 20px;
	
}



.navbar .dropdown ul.megamenu-style.whithad li.img-ad .content span{
          display: block;
white-space: break-spaces;
}

.navbar .dropdown ul.megamenu-style.whithad li{
          padding-top: 150px;
}

@media (max-width:992px){
          .navbar .dropdown ul.megamenu-style.whithad li.img-ad{
                    display: none;
          }
          .navbar .dropdown ul.megamenu-style.whithad li{
                    padding-top: 0px;
          }

}
.navbar .dropdown ul.megamenu-style li:hover>a{
          background: none;
          color: var(--color-secondary);
}
.navbar .dropdown ul.megamenu-style li>a:hover{
background-color: rgba(var(--color-secondary-light-rgb), 0.2);
color: var(--color-primary-two);
}

.navbar .dropdown ul.megamenu-style li > h6 {
	padding: 0px 0 9px 12px;
	color: var(--color-secondary);
	font-size: 18px;
	margin-bottom: 10px;
	border-bottom: 1px solid;
	margin-right: 20px;
	border-color: rgba(var(--color-secondary-rgb), 0.5);
	font-weight: 800;
}

[dir="rtl"] .navbar .dropdown ul.megamenu-style li > h6{
	padding: 0px 12px 9px 0px;
}

.navbar .dropdown ul.megamenu-style li > a {
	font-size: 15px;
	letter-spacing: 0.5px;
}

.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.width-big ul li{
          min-width: 275px;
}

.navbar .dropdown>a::after{
content: "\F229";
display: inline-block;
font-family: bootstrap-icons !important;
margin-left: 5px;
position: relative;
top: 1px;
font-size: 11px;
}

[dir="rtl"] .navbar .dropdown>a::after{
	margin-left: unset;
	margin-right: 5px;
}

.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: auto;
  overflow: auto;
   display: flex;
  flex-direction: row;
  align-items: baseline;
}
.navbar .dropdown ul.megamenu-two{
  width: 570px;
  display: flex;
  flex-direction: row;
  align-items: baseline;
}
}

.navbar .dropdown.megamenu{
  position: static;
}



.navbar .megamenu>ul>li {
	flex: 1;
}





.navbar .dropdown ul a {
  padding: 10px 20px;
  font-weight: 600;
  font-size: 15px;
  
  font-family: var(--font-primary);
  text-transform: capitalize;
  border-radius: 5px;
}

.navbar .dropdown ul a span.badge{
margin-left: 10px;
	font-size: 14px;
}

[dir="rtl"] .navbar .dropdown ul a span.badge {
	margin-left: unset;
	margin-right: 10px;
}

.navbar .dropdown ul a i{
font-size: 15px;
color: var(--color-secondary);
margin-right: 10px;
}

.navbar .dropdown ul a span{
  font-size: 16px;
}


.navbar .dropdown ul a:hover,
.navbar .dropdown ul a.active:hover,
.navbar .dropdown ul li:hover>a {
  color: var(--color-primary-two);
  background-color: rgba(var(--color-secondary-light-rgb), 0.2);

}

.navbar .dropdown ul a:hover i{
          color: var(--color-primary-two);
}

.navbar .dropdown:hover>ul {
  opacity: 1;
  top: 100%;
  visibility: visible;
}

.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;
}
.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: var(--color-white);
}

.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;
}



.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;
}
}

.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;
}

.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{
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);
}
.fixed-top .navbar>ul>li.login:hover{
border: 1px solid;
border-color: var(--color-primary);
background: transparent;
}

.fixed-top .navbar>ul>li.login a{
color: var(--color-white) !important;
padding-left: 0;
padding-right: 0;
}

.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%;
  }
	
	[dir="rtl"] .navbar .dropdown .dropdown ul {
    left: auto;
	right: 90%;
  }
	
	

  .navbar .dropdown .dropdown:hover>ul {
    left: 100%;
  }
	
	[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: 100%; */
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{
           

          }

          .navbar .megamenu ul{
          overflow: visible !important;
          }

          .navbar .logo-mob-nav{
                  display: none;
          }
          .navbar .nav-mobiles{
                 display: none;

          }
}

@media (max-width: 991px) {
  .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: 10px 15px;
   }

   .navbar .nav-mobiles .contacts .my-custom-dropdown ul li a:hover{
    color: var(--color-primary-two);
   }

   .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;
}

	[dir="rtl"] .navbar .nav-mobiles .contacts .items{
  margin-right: unset;
margin-left: 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;
}


}

.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;
}

/*--------------------------------------------------------------
# banner
--------------------------------------------------------------*/
.banner{
          padding: 60px 0px;
          /* background: var(--color-primary-two); */
          height: 100%;
width: 100%;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
color: #fff;
position: relative;
}



.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%;
	
}

.banner.img1{
	background-image: url("../images/bannerbg.jpg");
}



.banner.img2{
	background-image: url("../images/bannerbg2.png");
}

.banner.img2{
  background-image: url("../images/bannerbg2.png");
}

.banner.img15{
  background-image: url("../images/bannerbg15.jpg");
}

.banner.img3{
  background-image: url("../images/bannerbg3.jpg");
}

.banner.img4{
  background-image: url("../images/bannerbg4.jpg");
}

.banner.img5{
  background-image: url("../images/bannerbg5.jpg");
}

.banner.img6{
  background-image: url("../images/bannerbg6.jpg");
}

.banner.img7{
  background-image: url("../images/bannerbg7.jpg");
}

.banner.img8{
  background-image: url("../images/bannerbg8.jpg");
}

.banner.img9{
  background-image: url("../images/bannerbg9.jpg");
}

.banner.img10{
  background-image: url("../images/bannerbg10.jpg");
}

.banner.img11{
  background-image: url("../images/bannerbg11.jpg");
}

.banner.img12{
  background-image: url("../images/bannerbg12.jpg");
}

.banner.img13{
  background-image: url("../images/bannerbg13.jpg");
}

.banner.img14{
  background-image: url("../images/bannerbg14.jpg");
}


.imageslight.banner::before {
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.8) 100%);
}

.banner.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;
}

.banner.video-banner:before{
  opacity: 1 !important;
  background: linear-gradient(to bottom, rgba(var(--color-primary-rgb-two), 1) 0%, rgba(var(--color-primary-rgb-two), 0.7) 100%);
}



.img1.banner::before{
	opacity: 0.9;
}



.banner.withheader{
          padding-top: 110px;
}

.banner .banner-inner{
        /*  z-index: 2; */
          position: relative;
}

.banner .banner-heading{
          font-size: 65px;
          font-weight: 700;
}

  .banner .page-big-heading .banner-heading{
          font-size: 150px;
          font-weight: 700;
}

  .banner .page-big-heading h5{
    font-size: 45px;
    text-align: center;
  }


@media(min-width:1200px){
  .banner .page-big-heading .banner-heading{
          font-size: 250px;
          font-weight: 700;
}
}



.banner .banner-heading span{
          color: var(--color-primary);
          display: inline-block;
position: relative;
z-index: 1;
font-weight: 700;
}

.banner .banner-heading span::before {
	content: '';
	position: absolute;
	left: 3px;
	bottom: 10px;
	width: 97%;
	height: 12px;
	background: var(--color-white);
	opacity: .1;
	z-index: -1;
}

.banner .banner-content{
          font-size: 24px;
}


@media(max-width:767px){
          .banner .banner-heading{
                    font-size: 50px;
                    font-weight: 700;
          }

          .banner .banner-content{
                    font-size: 20px;
          }
}

@media(max-width:480px){
          .banner .banner-heading{
                    font-size: 45px;
                    font-weight: 700;
          }
          .banner .banner-content{
                    font-size: 17px;
          }

          .banner .btn{
                    margin-top: 10px;
          }
}

.card-style-one {
  position: relative;
  padding: 26px 20px;
  border-radius: 5px;
  background-color: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.08);
  display: flex;
  align-items: center;
  top: 0px;
  transition: all 0.5s;
  flex-direction: row;
  height: 100%;
}
.card-style-one:hover{
top: -10px;
}

.card-style-one .icons{
width: 20%;
}



.card-style-one .icons img{
          margin: auto;
          transition: all 0.5s;
}
.card-style-one:hover .icons img{
          transform: rotateY(180deg);
}
.card-style-one .content{
          width: 80%;
          /* margin-left: 20px; */
}

.card-style-one .content h4{
font-size: 27px;
color: var(--color-secondary);
font-weight: 700;
transition: all 0.5s;
}
.card-style-one:hover .content h4{
color: var(--color-primary);
}

.card-style-one .content p{
color: var(--color-secondary);
font-size: 18px;
line-height: 1.5;
}

@media (min-width:767px) and (max-width:991px){
	.card-style-one{
                    flex-direction: column;
          }
          .card-style-one .icons{
          width: 100%;
          }
          .card-style-one .icons img{
                    margin: unset;
          }
          .card-style-one .content{
                    width: 100%;
                    margin-top: 15px;
          }
}

@media(max-width:480px){
          .card-style-one{
                    flex-direction: column;
          }
          .card-style-one .icons{
          width: 100%;
          }
          .card-style-one .icons img{
                    margin: unset;
          }
          .card-style-one .content{
                    width: 100%;
                    margin-top: 15px;
          }

          .card-style-one .content h4{
                    font-size: 25px;
          }
          .card-style-one .content p{
                    font-size: 17px;
          }
}


.card-style-two {
	box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
	border-radius: 5px;
	padding: 35px;
	width: 100%;
	background: var(--color-white);
	position: relative;
	top: 0;
	transition: 0.5s ease;
	border: 1px solid;
	border-top: 5px solid;
	border-color: rgba(var(--color-secondary-light-rgb), 0.3);
}

.card-style-two:hover{
	top:-10px;
	border-color: var(--color-primary-two);
}

.card-style-two .icon {
	width: fit-content;
	height: auto;
	background: rgba(var(--color-secondary-light-rgb), 0.2);
	padding: 20px;
	border-radius: 7px;
	transition: 0.5s ease;
}
.card-style-two:hover .icon{
	background: rgba(var(--color-primary-rgb-two), 1);
}

.card-style-two .icon svg {
	width: 40px;
	height: auto;
	fill: var(--color-primary-two);
	transition: 0.5s ease;
}

.card-style-two:hover .icon svg{
	fill: var(--color-white);
}

.card-style-two .content h3{
	font-size: 25px;
	margin: 30px 0 8px;
	color: var(--color-secondary-dark);
}

.card-style-two .content p{
	font-size: 19px;
line-height: 32px;
color: var(--color-secondary);
	margin-bottom: 0px;
}


.card-style-three {
	box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
	border-radius: 5px;
	padding: 15px;
	width: 100%;
	background: var(--color-white);
	position: relative;
	transition: 0.5s ease;
	overflow: hidden;
	z-index: 1;
	border: 1px solid;
	border-color: var(--color-primary-two);
}



.card-style-three::before {
	content: '';
	position: absolute;
	width: 50px;
	height: 50px;
	right: -50px;
	top: -10px;
	border-radius: 50%;
	z-index: -1;
	background: var(--color-primary-two);
	transition: 0.5s ease;
}
.card-style-three:hover::before{
	width: 100%;
	height: 100%;
	z-index: -1;
	right: 0;
	top: 0;
	border-radius: 4px;
	transition: 0.5s ease;
}

.hover-dark.card-style-three:hover::before{
  content: unset;
}

.card-style-three .icon {
	width: fit-content;
	height: auto;
	background: rgba(var(--color-secondary-light-rgb), 0.2);
	padding: 20px;
	border-radius: 7px;
	transition: 0.5s ease;
	margin: auto;
}
.card-style-three:hover .icon{
	background: rgba(var(--color-white-rgb), 1);
}

.hover-dark.card-style-three:hover .icon{
  background: var(--color-primary-two);
}

.card-style-three .icon svg {
	width: 40px;
	height: auto;
	fill: var(--color-primary-two);
	transition: 0.5s ease;
}

.card-style-three:hover .icon svg{
	fill: var(--color-primary-two);
}

.hover-dark.card-style-three:hover .icon svg{
  fill: var(--color-white);
}

.card-style-three .content h3{
	font-size: 22px;
	margin: 30px 0 8px;
	color: var(--color-secondary-dark);
	text-align: center;
	transition: 0.5s ease;
}

.card-style-three:hover .content h3{
	color: var(--color-white);
}

.hover-dark.card-style-three:hover .content h3{
  color: var(--color-primary-two);
}

.card-style-three .content p {
	font-size: 17px;
	line-height: 32px;
	color: var(--color-secondary);
	margin-bottom: 0px;
	text-align: center;
	transition: 0.5s ease;
}
.card-style-three:hover .content p{
	color: var(--color-white);
}
.hover-dark.card-style-three:hover .content p{
  color: var(--color-secondary);
}

.card-style-four{
  border: 1px solid;
  padding: 25px;
  box-shadow: 0 3px 10px 0px rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

@media (min-width:991px){
  .card-style-four img{
    max-height: 85px;
  }
}

.card-style-four.error{
border-color: var(--bs-red);
}

.card-style-four.success{
border-color: var(--bs-green);
}

.card-style-four h4{
  font-size: 20px;
  color: var(--color-secondary);
  margin-bottom: 10px;
}

.card-style-four.error h4{
  color: var(--bs-red);
}

.card-style-four.error ul.list-tick li:before{
color: var(--bs-red);
}

.card-style-four.success h4{
  color: var(--bs-green);
}

.card-style-four.success ul.list-tick li:before{
color: var(--bs-green);
}

.pricing-box {
	position: relative;
	padding: 25px 35px 40px 35px;
	z-index: 1;
}
.pricing-box.plan-featured{
          padding-top: 70px;
}
.pricing-box.plan-featured .featured{
display: block;
}

.pricing-box .featured{
display: none;
}
.pricing-box .featured {
	position: absolute;
	top: 0px;
	left: 0px;
	background: var(--color-primary-two);
	color: var(--color-white);
	width: 100%;
	border-radius: 5px 5px 0 0;
	text-align: center;
	padding: 10px 10px;
	font-size: 17px;
	letter-spacing: .5px;
          margin-bottom: 20px;
}
.pricing-box:before{
          position: absolute;
          content: '';
          left: 0px;
          top: 0px;
          right: 0px;
          bottom: 0px;
          border-radius: 5px;
          background-color: var(--color-white);
          box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
          z-index: -1;
}

.pricing-box .pricing-top{
          border-bottom: 1px solid;
          border-color:rgba(var(--color-secondary-rgb), 0.5);
          padding-bottom: 20px;
}

.pricing-box .pricing-top h3 {
	text-align: center;
	color: var(--color-secondary-dark);
	font-size: 37px;
	margin-bottom: 13px;
          font-weight: 700;
}

.pricing-box .pricing-top p {
	text-align: center;
	color: var(--color-secondary);
	font-size: 17px;
	line-height: 1;
	margin-bottom: 10px;
}

.pricing-box .pricing-top h4 {
	text-align: center;
	color: var(--color-primary-dark-two);
	font-size: 33px;
	margin-bottom: 14px;
	font-weight: 700;
}
.pricing-box .pricing-top h4 span.currency {
	color: var(--color-secondary);
	font-size: 17px;
	line-height: 1;
	top: -14px;
	position: relative;
	margin-right: 5px;
}
.pricing-box .pricing-top h4 span.durection{
color: var(--color-secondary);
font-size: 17px;
line-height: 1;
margin-left: 5px;
}

.pricing-box .pricing-bottom{
          padding-top: 20px;
}

.pricing-box .pricing-bottom ul li{
padding-left: 25px;
position: relative;
padding-bottom: 10px;
font-size: 17px;
color: var(--color-secondary);
}

[dir="rtl"] .pricing-box .pricing-bottom ul li{
	padding-left: unset;
	padding-right: 25px;
}

.pricing-box .pricing-bottom ul li:before{
content: "\F26A";
font-family: "bootstrap-icons";
font-size: 15px;
color: var(--color-primary-two);
position: absolute;
left: 2px;
top: 2px;
font-size: 15px;
}

[dir="rtl"] .pricing-box .pricing-bottom ul li:before{
	left: auto;
	right: 2px;
}


.pricing-box .pricing-bottom ul li:last-child{
padding-bottom: 0px;
}

.pricing-box .pricing-bottom ul li a.unmetered{
  display: unset !important;
  color: var(--color-primary-two);
}

.pricing-box .pricing-bottom a{
          margin-top: 17px;
          display: block;
          text-align: center;
}


.pricing-box-four{
          padding: 22px;
          transition: all ease 0.3s;
box-shadow: none;
border: 1px solid;
border-top: 5px solid;
border-color: rgba(var(--color-secondary-rgb), 0.3);
border-radius: 5px;
background: var(--color-white);
}


.pricing-box-four.plan-featured{
          border-color: var(--color-primary-two);
}

.pricing-box-four h3{
font-size: 33px;
color: var(--color-primary-dark-two);
font-weight: 700;
}

.pricing-box-four p {
	font-size: 16px;
	color: var(--color-secondary);
	margin-bottom: 18px;
}

.pricing-box-four h4 {
	font-weight: 700;
	font-size: 30px;
	color: var(--color-primary-dark-two);
	margin-bottom: 20px;
}

.pricing-box-four h4 span{
font-size: 17px;
color: var(--color-secondary);
}

.pricing-box-four ul{
padding-top: 20px;
}

.pricing-box-four ul li{
          padding-left: 25px;
          position: relative;
          padding-bottom: 10px;
          font-size: 17px;
          color: var(--color-secondary);
}

[dir="rtl"] .pricing-box-four ul li{
          padding-left: unset;
		  padding-right: 25px;
}


.pricing-box-four ul li:before{
          content: "\F26B";
          font-family: "bootstrap-icons";
          font-size: 15px;
          color: var(--color-primary-two);
          position: absolute;
          left: 2px;
          top: 2px;
          font-size: 15px;
}

[dir="rtl"] .pricing-box-four ul li:before{
          left: auto;
	right: 2px;
          
}


.pricing-box-four a{
display: block;
margin-top: 10px;
opacity: 0.7;
transition: all 0.5s;
}
.pricing-box-four:hover{
border-color: var(--color-primary-two);
}
.pricing-box-four:hover a{
opacity: 1;
}
.pricing-box-four.plan-featured a{
          opacity: 1;
}

.pricing-box-four ul li a{
display: unset;
color: var(--color-primary-two);
}

.tootips-plans{
          position: relative;
}
.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;
}


@media (max-width:480px){
	
	.tootips-plans span{
		transform: translate(-80%, -102%);
	}
	
	.tootips-plans span:after{
		left: 85%;
	}
	
}
.modal.unmetered-model{
background: rgba(var(--color-black-rgb),0.8);
}
.unmetered-model .modal-dialog-centered {
  display: flex;
  align-items: center;
  min-height: calc(100% - 30px * 2);
}

.unmetered-model .modal-dialog-scrollable {
  height: calc(100% - 30px * 2);
}

.unmetered-model .modal-dialog-scrollable .modal-body {
  overflow-y: auto;
  max-height: 400px;
}

.modal.unmetered-model .modal-title{
  font-size: 23px;
  color:var(--color-secondary-dark);
}

.modal.unmetered-model .modal-body p{
  line-height: 1.5;
  font-size: 17px;
  color:var(--color-secondary);
}

.modal.unmetered-model .modal-body p span{
  font-size: 20px;
  font-weight: 700;
  color:var(--color-secondary-dark);
}

.modal.unmetered-model .modal-body p a{
  color: var(--color-primary-two);
}

.table-plans table {
  background: rgba(var(--color-white-rgb), 1);
  border-radius: 4px;

}

.table-plans>.table-responsive>table thead th{
  background: var(--color-primary-two);
}

.table-plans>.table-responsive>table thead th{
border: none;
text-align: center;
border-right: 1px solid;
border-color: var(--color-white);
vertical-align: middle;
}

.table-plans > .table-responsive > table thead th:nth-child(2) {
border-radius: 0px 0 0 0;
}

.table-plans>.table-responsive>table thead th:first-child{
  border-radius: 4px 0 0 0;
}

[dir="rtl"] .table-plans>.table-responsive>table thead th:first-child{
  border-radius: 0px 4px 0 0;
}


.table-plans > .table-responsive > table thead th:nth-child(4) {
  
}

[dir="rtl"] .table-plans>.table-responsive>table thead th{
  border-right: unset;
  border-left: 1px solid;
}


.table-plans>.table-responsive>table thead th:last-child{
  border-right: 0;
  border-radius: 0 4px 0 0;
}

[dir="rtl"] .table-plans>.table-responsive>table thead th:last-child{
  border-right: unset;
  border-left: 0;
  border-radius: 4px 0px 0 0;
}



.table-plans>.table-responsive>table thead th:first-child{
  text-align: left;
  font-size: 16px;
  color: var(--color-white);
  width: 17.2%;
  min-width: 200px;
  vertical-align: bottom;
}

[dir="rtl"] .table-plans>.table-responsive>table thead th:first-child{
  text-align: right;
}

.table-plans>.table-responsive>table thead th .name{
  font-size: 18px;
  color: var(--color-white);
  margin-bottom: 0;
}

.table-plans > .table-responsive > table thead th .price {
  font-size: 24px;
  color: var(--color-white);
  margin-bottom: 0;
  font-weight: 700;
  line-height: 1.5;
}

.table-plans>.table-responsive>table thead th .cuttedprice{
  font-size: 16px;
  color: var(--color-white);
  margin-bottom: 0;
  font-weight: normal;
  text-decoration: line-through;
}

.table-plans>.table-responsive>table thead th .cuttedprice.unset{
  text-decoration: unset;
}

.table-plans>.table-responsive>table thead th a{
margin-top: 5px;
}


.table-plans tbody.tbody-collapsed tr:not(:first-child) {
  display: none;
}

.table-plans tbody th{
  border: 0;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: rgba(var(--color-secondary-rgb), 0.3);
}

.table-plans tbody th.tbale-titles {
  background: rgba(var(--color-primary-rgb-two), 0.8);
  padding: 0;
}

.table-plans tbody tr th span.table-toogler {
  display: block;
  position: relative;
  padding: 7px 48px 7px 24px;
  color: var(--color-white);
  font-size: 20px;
  cursor: pointer;
  user-select: none;
  font-weight: 800;
}

.table-plans tbody tr th span.table-toogler::before {
  position: absolute;
  top: 50%;
  right: 24px;
  width: 0;
  height: 0;
  margin-top: -4px;
  border-top: none;
  border-right: 7px solid rgba(0, 0, 0, 0);
  border-bottom: 8px solid #fff;
  border-left: 7px solid rgba(0,0,0,0);
  content: "";
  transition: all 0.5s;
}

.table-plans tbody.tbody-collapsed tr th span.table-toogler::before{
  transform: rotate(180deg);
}

.table-plans tbody tr th.first-coloumn{
  background: rgba(var(--color-secondary-light-rgb), 0.3);
}

.table-plans tbody tr th.first-coloumn .main-headings {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.table-plans tbody tr th.first-coloumn .main-headings span.name{
  font-size: 18px;
  font-weight: 900;
  color: var(--color-secondary);
}
.table-plans tbody tr th.first-coloumn .main-headings span.icons-views{
  position: relative;
}
.table-plans tbody tr th.first-coloumn .main-headings span.icons-views .icon {
  width: 21px;
  height: 21px;
  line-height: 21px;
  font-weight: 500;
  font-size: 15px;
  background: var(--color-secondary);
  border-radius: 50%;
  display: block;
  text-align: center;
  color: var(--color-white);
}

.table-plans tbody tr th.first-coloumn .main-headings span.icons-views .content {
  position: absolute;
  top: 50%;
  left: 50%;
  padding: 6px;
  text-align: left;
  cursor: auto;
  z-index: 999;
  display: block;
  visibility: hidden;
  opacity: 0;
  transition: all 0.5s;
  transform: translate(4%, -50%);
}

[dir="rtl"] .table-plans tbody tr th.first-coloumn .main-headings span.icons-views .content {
  left: auto;
  right: 50%;
  text-align: right;
  transform: translate(-4%, -50%);
}

.table-plans tbody tr th.first-coloumn .main-headings span.icons-views:hover .content{
display: block;
visibility: visible;
opacity: 1;
}

.table-plans tbody tr th.first-coloumn .main-headings span.icons-views .content .icon-toogler{
position: absolute;
width: 30px;
height: 30px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
background: #6d6e70;
top: 42%;
}


.table-plans tbody tr th.first-coloumn .main-headings span.icons-views .content .tootips-contens {
  display: inline-block;
  width: 260px;
  padding: 15px 20px;
  border-radius: 5px;
  background: #6d6e70;
  color: #fff;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  text-transform: none;
  -webkit-box-shadow: 0 0 15px rgba(0,0,0,.3);
  box-shadow: 0 0 15px rgba(0,0,0,.3);
  z-index: 1;
  position: relative;
}


.table-plans tbody tr td {
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-color: rgba(var(--color-secondary-rgb), 0.3);
  font-size: 17px;
  color: var(--color-secondary);
  text-align: center;
  vertical-align: middle;
}

.table-plans tbody tr td .bi-check-circle{
  color: var(--bs-green);
}


.horizontal-plans {
  background: var(--color-white);
  border: 0;
  border-radius: 4px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.08);
  padding: 42px 42px;
}






.just-one-click{
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          justify-content: center;
}

.just-one-click li{
          padding: 20px;
          border-radius: 7px;
          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;
}

.under-hood{
	background-color: var(--color-white);
    box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
	border-radius: 15px;
}
.under-hood img{
	width: 100%;
	border-radius: 5px 5px 0 0;
}

.under-hood .img{
width: 100%;
border-radius: 5px 5px 0 0;
background: #f9fafb;
padding: 25px;
}

.under-hood .img img{
  border-radius: 0px;
}

.under-hood .underhood-content{
	padding: 20px;
}

.under-hood .underhood-content h4 {
	font-size: 22px;
	color: var(--color-secondary-dark);
	line-height: 1;
	margin-bottom: 15px;
	font-weight: 700;
}
.under-hood .underhood-content p {
  font-size: 17px;
  color: var(--color-secondary);
  font-weight: 700;
  margin-bottom: 0;
}
.under-hood .underhood-content ul{
	margin-bottom: 15px;
}
.testimonilas-wrap{
	position: relative;
}

[dir="rtl"] .testimonilas-wrap{
	text-align: right;
}

.testimonilas-wrap::before {
	content: "";
	position: absolute;
	top: 60px;
	left: 18px;
	width: 99%;
	height: 69%;
	background: var(--color-primary-light-two);
	transform: rotate(-6deg);
	border-radius: 4px;
}

.testimonilas-slide{
	background:var(--color-primary-dark-two);
	padding: 0 40px 40px;
/* z-index: 4; */
margin-top: 30px;
border-radius: 4px;
position: relative;
}


.testimonilas-slide .quote {
	position: absolute;
	right: 25px;
	top: 25px;
}

/*
[dir="rtl"] .testimonilas-slide .quote {
	right: unset;
	left: 25px;
	
}
*/

.testimonilas-slide .quote svg {
	width: 50px;
	height: auto;
	fill: var(--color-white);
}

.testimonilas-slide .info-wrap {
	display: flex;
	align-items: flex-end;
	transform: translateY(-30px);
}

.testimonilas-slide .info-wrap .avatar {
	width: 100px;
	height: 100px;
	border: 4px solid #fff;
	margin-right: 20px;
	border-radius: 6px;
}

/*
[dir="rtl"] .testimonilas-slide .info-wrap .avatar{
	margin-right: unset;
	margin-left: 20px;
}
*/

.testimonilas-slide .info-wrap .avatar img {
	border-radius: 6px;
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.testimonilas-slide .info-wrap .name {
	font-size: 20px;
	color: #fff;
	margin: 0;
	font-weight: 700;
}

.testimonilas-slide .info-wrap .designation {
	color: #fff;
}
.testimonilas-slide .testimonial-content-inner h4 {
	color: #fff;
	margin: 0;
	font-size: 23px;
	line-height: 1.5;
	margin-bottom: 5px;
}
.testimonilas-slide .testimonial-content-inner p {
	color: #fff;
	margin: 0;
	font-size: 16px;
	line-height: 1.5;
	word-spacing: 0.5px;
}

.faq{
	background: var(--color-white);
	box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
	padding: 30px 20px;
	border-radius: 15px;
}

.faq .accordion .accordion-item:first-child{
	margin-top: 0px;
}

.faq .accordion .accordion-item{
  border:none;
  border-radius: 4px;
  margin-top: 15px;
  border: 1px solid;
  border-color: rgba(var(--color-primary-rgb-two), 0.2);
  color: var(--color-secondary);
  font-size: 17px;
  line-height: 1.7;
}


.faq .accordion .accordion-item .accordion-header .accordion-button{
  font-size: 17px;
line-height: 24px;
background: rgba(var(--color-primary-rgb-two), 0.0);
border-radius: 4px 4px 0px 0px;
border: none !important;
color: var(--color-secondary-dark);
border-bottom: 1px solid !important;
border-color: rgba(var(--color-primary-rgb-two), 0.2) !important;
}


.faq .accordion .accordion-item .accordion-header .accordion-button.collapsed{
background: rgba(var(--color-primary-rgb-two), 0.0);
  border-radius: 4px 4px 4px 4px;
	border: none !important;
}

.faq .accordion .accordion-item .accordion-body a{
color: var(--color-primary-two);
}


.custom-tabings{
  width: 100%;
  display: flex;
  justify-content: center;
}
.custom-tabings .customtab{
width: fit-content;
display: flex;
}
.custom-tabings.style-one .customtab{
	border: 1px solid;
	border-color: rgba(var(--color-secondary-light-rgb), 0.5);
	border-radius: 4px;
}
.custom-tabings.style-one .customtab .tablinks{
padding:13px 30px;
color: var(--color-primary);
border: 1px solid;
border-color: var(--color-primary);
	margin: 5px;
	font-size: 16px;
}
.custom-tabings.style-one .customtab .tablinks:first-child{
  border-radius: 4px;
}
.custom-tabings.style-one .customtab .tablinks:last-child{
  border-radius: 4px;
}
.custom-tabings.style-one .customtab .tablinks.active{
  background-color: var(--color-primary);
  color: var(--color-white);
}

.customtabcontent {
  display: none;
}

.customtabcontent.active{
  display: block;
}


.custom-tabings.style-two{
	justify-content: flex-start;
}
.custom-tabings.style-two .customtab .tablinks {
	padding: 10px 20px;
	background: none;
	color: var(--color-white);
	border: 1px solid;
	border-color: rgba(var(--color-white-rgb), 1);
	font-size: 18px;
	padding-bottom: 6px;
	border-radius: 0;
}

.custom-tabings.style-two .customtab .tablinks:first-child{
border-radius: 5px 0 0 5px;
}

.custom-tabings.style-two .customtab .tablinks:last-child{
	border-radius: 0px 5px 5px 0px;
}

[dir="rtl"] .custom-tabings.style-two .customtab .tablinks:last-child{
	border-radius: 5px 0px 0px 5px;
}

[dir="rtl"] .custom-tabings.style-two .customtab .tablinks:first-child{
	border-radius: 0px 5px 5px 0px;
}


.custom-tabings.style-two .customtab .tablinks.active{
background: var(--color-white);
	color: var(--color-primary-two);
}


.single-blog-article{
  display: block;
  border-radius: 4px;
  border: 1px solid;
  border-color: rgba(var(--color-secondary-light-rgb), 0.3);
  background: var(--color-white);
  transition: all 0.5s;
  height: 100%;
}

.single-blog-article:hover{
    border-color: rgba(var(--color-primary-rgb-two), 0.3);
}


.single-blog-article .blog-img img{
border-radius: 4px 4px 0px 0px;
}

.single-blog-article .blog-content{
  padding: 22px;
}

.single-blog-article .blog-content .article-heading h5{
font-size: 20px;
font-weight: 700;
color: var(--color-secondary);
margin-bottom: 0;
line-height: 1.5;
transition: all 0.5s;
}

.single-blog-article:hover .blog-content .article-heading h5{
color: var(--color-primary-two);
}

.single-blog-article .blog-content .article-heading span{
  font-size: 15px;
  color: var(--color-secondary);
}

.single-blog-article .blog-content .border-shape{
width: 100px;
height: 2px;
position: relative;
z-index: 1;
display: block;
margin-top: 15px;
margin-bottom: 15px;
}

.single-blog-article .blog-content .border-shape:before{
  content: "";
position: absolute;
left: 0;
bottom: 0;
height: 2px;
width: 50%;
border-bottom: 2px solid var(--color-primary-two);
}


.single-blog-article .blog-content .detail{
font-size: 17px;
  color: var(--color-secondary);
  margin-bottom: 15px;
  line-height: 1.5;
  margin-bottom: 15px;
}

.single-blog-article .blog-content .article-footer .article-comments span{
    font-size: 14px;
  color: var(--color-secondary);
}

.single-blog-article .blog-content .article-footer .article-comments span i{
  margin: 0 5px;
}

.single-blog-article .blog-content .article-footer .article-user{
  font-size: 16px;
  color: var(--color-primary-two);
}

.two-buttons{
  margin-top: 20px;
}

.two-buttons a:last-child{
margin-left: 10px;
}

[dir="rtl"] .two-buttons a:last-child{
margin-left: unset;
margin-right: 10px;

}

@media (max-width:396px){
  .two-buttons a:last-child{
margin-left: unset;
margin-top: 10px;
}
[dir="rtl"] .two-buttons a:last-child{
margin-left: unset;
margin-right: unset;
margin-top: 10px;
}
}

.banner-seacrch{
 position: relative;
}

.banner-seacrch .searching {
  width: 100%;
  background: var(--color-white);
  padding: 17px 15px;
  border-radius: 4px;
  font-size: 16px;
  border: 0;
}

.banner-seacrch.transfer .searching{
padding: 10px 15px;
}

.youthcode{
   width: 100%;
  background: var(--color-white);
  padding: 10px 15px;
  border-radius: 4px;
  font-size: 16px;
  border: 0;
  margin-top: 10px;
}

.banner-seacrch.transfer select.form-select{
   width: 100%;
  background: var(--color-white);
  padding: 10px 15px;
  border-radius: 4px;
  font-size: 16px;
 margin-top: 10px;
 border: 0;
}


.submitnow {
  position: absolute;
  right: 0px;
  top: 0;
  padding: 17px 15px;
  background: var(--color-primary-two);
  color: var(--color-white);
  font-size: 16px;
  border: 0;
  border-radius: 0 4px 4px 0;
} 

.banner-seacrch.transfer .submitnow {
  padding: 10px 20px;
  position: relative;
  right: unset;
  left: unset;
  background: var(--color-primary);
  border-radius: 4px;
  margin-top: 10px;
}

.pt-domain-text{
  display: flex;
  margin-top: 20px !important;
}

  @media only screen and (max-width: 767px){

.pt-domain-text {
  display: block;
}

.pt-domain-text li {
  width: 50%;
  float: left;
}

[dir="rtl"] .pt-domain-text li {
  float: right;
}

.pt-domain-text li:nth-child(2n)::before {
  display: none;
}

  }

.pt-domain-text li{
  text-align: center;
flex: 1;
position: relative;
margin: 0;
color: var(--color-white);
list-style: none;
line-height: 2;
}
.pt-domain-text li:before{
content: "";
background: var(--color-white);
height: 16px;
display: inline-block;
width: 1px;
position: absolute;
right: 0;
top: 50%;
margin-top: -8px;
}

[dir="rtl"] .pt-domain-text li:before{
right: auto;
left: 0;
}

.pt-domain-text li:last-child::before {
  display: none;
}

.pt-domain-text li span.domain-price{
font-size: 16px;
}

.pt-domain-text li span.domain-name{
font-weight: 700;
font-size: 19px;
}

.promos-view{
  background: var(--color-white);
  padding: 20px;
  border-radius: 4px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  position: relative;
  top: 0;
  transition: all 0.5s;
  border: 1px solid;
  border-color: rgba(var(--color-secondary-light-rgb), 0.5);
}

.promos-view:hover{
  top: -10px;
   border-color: rgba(var(--color-primary-rgb-two), 0.5);
}

.promos-view .img {
  padding: 10px 0 20px 0px;
}


.promos-view .img h2 {
  font-size: 45px;
  font-weight: 900;
  color: var(--color-primary-two);
  text-align: center;
  margin-bottom: 0;
  line-height: 1;
  text-transform: uppercase;
}

.promos-view .content{
  font-size: 18px;
  color: var(--color-secondary-dark);
  text-align: center;
  line-height: 1.5;
}

.promos-view .starting{
  font-size: 16px;
  color: var(--color-secondary);
  text-align: center;
  width: 100%;
  display: block;
}

.promos-view .price {
  font-size: 33px;
  color: var(--color-secondary-dark);
  text-align: center;
  line-height: 1.5;
  margin-top: 8px;
  margin-bottom: 20px;
  font-weight: 700;
  transition: all 0.5s;
}

.promos-view:hover .price {
  color: var(--color-primary-two);
}

.promos-view .price span.durection{
  font-size: 15px;
  color: var(--color-secondary);
  text-align: center;
  line-height: 1;
}

.promos-view a{
  display: block;
  width: 100%;
}


.contact-now {
  background: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
  padding: 50px 45px;
  border-radius: 4px;
}

@media (max-width:480px){
  .contact-now {
  padding: 30px 20px;
}
}

.contact-now .heding {
  font-size: 30px;
  font-weight: 700;
  color: var(--color-secondary);
  margin-bottom: 20px;
}

.contact-now .custom {
  border: 1px solid;
  border-color: rgba(var(--color-secondary-rgb), 0.3);
  padding: 10px 10px;
  font-size: 16px;
  display: block;
  width: 100%;
  border-radius: 4px;
  margin: 20px 0;
}

.contact-now .checking{
  display: flex;
  align-items: baseline;
}

.contact-now .checking input[type="checkbox"]{
  margin: 0 5px;
}

.contact-now .checking label{
  font-size: 16px;
  cursor: pointer;
  user-select: none;
  color: var(--color-secondary);
}

.contact-now .checking label a{
  color: var(--color-primary-two);
}

.contact-now .contect-detail{
  border: 1px solid;
  border-color: rgba(var(--color-secondary-rgb), 0.3);
  padding: 15px;
  border-radius: 4px;
  margin-bottom: 20px;
}

.contact-now .contect-detail:last-child{
margin-bottom: 0px;
}

.contact-now .contect-detail h4 {
  font-size: 18px;
  color: var(--color-secondary-dark);
  margin-bottom: 0;
  font-weight: 800;
}

.contact-now .contect-detail h5{
 font-size: 16px;
  color: var(--color-secondary);
  margin-bottom: 0;
  font-weight: 700;
}

.contact-now .contect-detail h5 span{
  font-weight: normal;
}



.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;
  }
}


.offer-box {
  max-width: 300px;
  width: auto;
  border-radius: 1rem;
  margin: 0 auto;
  padding: 15px;
  background: rgba(var(--color-primary-dark-rgb-two), 0.6);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  text-align: center;
  padding-top: 45px;
  padding-bottom: 45px;
  padding-left: 22px;
  padding-right: 22px;
}

.offer-box:hover {
  background: rgba(var(--color-primary-dark-rgb-two), 1);
}

.offer-box h5 {
  font-size: 18px;
  color: var(--color-white);
  text-align: center;
  margin-bottom: 16px;
}


.offer-box .offer-price{
font-size: 75px;
line-height: 1;
font-weight: 600;
position: relative;
color: var(--color-white);
text-align: center;
margin-bottom: 20px;
}

.offer-box .offer-price .symbols {
  font-size: 30px;
  line-height: 1;
  color: var(--color-white);
  vertical-align: super;
}

.offer-box .offer-price .durection{
  font-size: 18px;
  line-height: 1;
  color: var(--color-white);
}

.offer-box p{
  font-size: 16px;
  line-height: 1;
  color: var(--color-white);
  text-align: center;
  margin-bottom: 20px;
}


.table-style-two{
  overflow: visible;
  box-shadow: none;
  border: none;
  border-collapse: unset;
  border-spacing: 0 10px;
}

.table-style-two thead{
  background: var(--color-primary-two);
  color: var(--color-white);
  border-color: inherit;
border-style: solid;
border-width: 0;
}


.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-two);
  color: var(--color-white);
  border-color: inherit;
border-style: solid;
border-width: 0;
}


@media (max-width:991px){
  .table-style-two thead{
    display: none;
  }
}

.table-style-two thead th{
    border-color: inherit;
border-style: solid;
border-width: 0;
font-size: 16px;
}

.table-style-two tbody tr{
text-align: left;
transition: all .1s linear;
background: #fafafa;
border-collapse: unset;
  border-spacing: 0 10px;
}

.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-two > tbody > tr > td::before {
  content: attr(data-value);
  display: none;
  transition: all .3s ease;
}

.table-style-two > tbody > tr > td select{
  background: transparent;
}

@media (max-width:991px){
  .table-style-two > tbody > tr{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  border-radius: 4px;
  width: 45%;
  float: left;
  margin: 0 15px 28px 15px;
  }



  .table-style-two > tbody > tr > td::before {
  display: block;
  width: 45%;
}
.table-style-two > tbody > tr > td{
  font-size: 14px;
  font-weight: normal;
}
}

.table-style-two > 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);
}

.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);
}

#SSD .table-style-two > tbody > tr > td{
  padding: 20px 9px;
}

.table-style-two tbody tr td:first-child {
  border-left: 3px solid #e2e8f0;
  border-radius: 2px 0 0 2px;
}

[dir="rtl"] .table-style-two tbody tr td:first-child{
  border-left: 0;
  border-right: 3px solid #e2e8f0;
  border-radius: 0px 2px 2px 0px;
}

[dir="rtl"] .table-style-two tbody tr td{
  text-align: right;
}


.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-two tbody tr td.unset::before{
  content: unset;
}



.table-style-two tbody tr:hover td {
  border-color: var(--color-primary-two); !important;
}


.table-style-three tbody tr:hover td {
  border-color: var(--color-primary-two); !important;
}

.table-style-two tbody tr td h4 {
  font-size: 25px;
  color: var(--color-primary-two);
  font-weight: 800;
  margin-bottom: 0;
}

.table-style-two tbody tr td h4 .icon{
font-size: 16px;
color: var(--color-secondary);
}


.table-style-two tbody tr td h4 .durection{
font-size: 16px;
color: var(--color-secondary);
}


@media (max-width:991px){
  .table-style-two tbody tr td:first-child{
    border: 0px;
  }

  [dir="rtl"] .table-style-two tbody tr td:first-child{
  border: 0;
}

  .table-style-two tbody tr td{
    display: flex;
    align-items: center;
    padding: 12px 15px;
  }
  .table-style-two tbody tr td.center{
    text-align: center;
  }

  .table-style-two tbody tr td.center h4{
    width: 100%;
    display: block;
    text-align: center;
    margin-bottom: 0;
  }

  .table-style-two tbody tr td.buyning a{
        margin: auto;
    margin-bottom: 20px;
    text-align: center;
  }
}



@media (max-width:767px){
  .table-style-two tbody tr{
    width: 100%;
    margin: 0;
    margin-bottom: 15px;
  }
}


.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;
}

.tabings .tabs.roundness .tabbutton:last-child{
border-radius: 0px 4px 4px 0px;
}
}

@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;

}


.tabings .tabs.column-type{
flex-direction: column;  
}
.tabings .tabs.column-type .tabbutton {
  padding: 13px 20px;
  color: var(--color-primary-two);
  border: 1px solid;
  border-color: var(--color-primary-two);
  margin-bottom: 10px;
  border-radius: 4px;
  text-align: left;
  font-size: 17px;
  display: flex;
  align-items: center;
  background-color: var(--color-white);
}

.tabings .tabs.column-type .tabbutton i{
margin-right: 10px;
}

[dir="rtl"] .tabings .tabs.column-type .tabbutton i{
margin-right: unset;
margin-left: 10px;

}


.tabings .tabs.column-type .tabbutton.active{
background-color: var(--color-primary-two);
  color: var(--color-white);
}

.tabscontents{
  display: none;
}

.tabscontents.active{
  display: block;
}

.main-plans .col-12{
  border-right: 1px solid;
  border-color: var(--bs-border-color);
}

.main-plans .col-12:last-child{
  border-right:unset;
}

[dir="rtl"] .main-plans .col-12:last-child{
  border-right:unset;
  border-left:unset;
}

[dir="rtl"] .main-plans .col-12{
  border-right: unset;
  border-left: 1px solid;
  border-color: var(--bs-border-color);

}

.main-plans .bg-primary-two{
  background: var(--color-primary-two);
}
.main-plans .col-12:first-child .plan-heading{
  border-radius: 4px 0px 0 0;
}

@media (min-width:767px){
  .main-plans .col-12 .h-100{
  padding-bottom: 70px;
}
}

[dir="rtl"] .main-plans .col-12:first-child .plan-heading{
  border-radius: 0px 4px 0 0;
}

.main-plans .col-12:last-child .plan-heading{
  border-radius: 0px 4px 0 0;
}

[dir="rtl"] .main-plans .col-12:last-child .plan-heading{
  border-radius: 4px 0px 0 0;
}

@media (max-width:767px) {
  .main-plans .col-12{
    border: 0;
  }
}

.main-plans .button-bootom {
   bottom: 0;
  border-radius: 0 0 4px 4px;
  width: 100%;
  left: 0;
  position: absolute;
}

@media (max-width:767px) {
  .main-plans .button-bootom{
    position: relative;
  }
}

.main-plans .paddings{
padding: 1.2rem 1.5rem;
}

.main-plans .plan-heading .icons {
  position: relative;
  height: 2.625rem;
  width: 2.625rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  line-height: 0;
  background: rgba(var(--color-white-rgb), 0.2);
  color: var(--color-white);
  font-size: 20px;
  border-radius: 50%;
  opacity: 1;
  visibility: visible;
}


.main-plans .plan-heading h4 {
  font-size: 22px;
  color: var(--color-white);
  line-height: 1;
  margin-top: 15px;
  margin-bottom: 10px;
}

.main-plans .plan-heading p {
  font-size: 16px;
  color: rgba(var(--color-white-rgb), 0.7);
  line-height: 1.5;
  margin-bottom: 0;
}

.main-plans h2 {
  font-size: 30px;
  color: var(--color-black);
  line-height: 1;
  margin-bottom: 15px;
  font-weight: 900;
}

.main-plans h2 .durection{
  font-size: 18px;
  color: var(--color-secondary);
  line-height: 1;
  margin-bottom: 0px;
  font-weight: 700;
}

.main-plans h5 {
  font-size: 17px;
  color: var(--color-primary-dark-two);
  line-height: 1;
  margin-bottom: 5px;
  font-weight: 700;
}

.main-plans p{
  font-size: 16px;
  color: var(--color-secondary);
  line-height: 1.5;
  margin-bottom: 0px;
}

.main-plans .items p{
  margin-top: 15px;
}

 .main-plans .accordion-buttons {
  color: var(--color-primary-dark-two);
  font-size: 16px;
  background: none;
  width: 100%;
  text-align: left;
  display: flex;
  font-weight: 700;
}

.main-plans .collapsed .accordion-buttons::after {
  content: "\F282";
  font-family: bootstrap-icons;
  color: var(--color-primary-dark-two);
  font-size: 16px;
}

.main-plans .accordion-buttons:after{
flex-shrink: 0;
margin-left: auto;
content: "\F286";
font-family: bootstrap-icons;
color: var(--color-primary-dark-two);
font-size: 16px;
}

.main-plans .items {
  display: flex;
  align-items: start;
  padding: 13px 0;
  flex-direction: column;
}

.main-plans .items img {
  max-height: 25px;
}
.main-plans .icons{
  display: none;
  transition: all 0.5s;
  visibility: hidden;
  opacity: 0;
  position: relative;
  width: 100%;
  justify-content: start;
}

.main-plans .collapsed .icons {
  visibility: visible;
  opacity: 1;
  display: flex;
  flex-wrap: wrap;
}

.main-plans .icons img {
  margin-right: 15px;
  max-height: 22px;
  margin-top: 5px;
}

[dir="rtl"] .main-plans .icons img{
  margin-right: unset;
  margin-left: 15px;
}


.domain-pricng-searching {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px 15px;
  font-size: 16px;
  color: var(--color-secondary);
}



.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-dark);
  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-dark);
  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;
}

.sunricedomains {
  padding: 24px;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  border-radius: 5px;
  background: var(--color-primary-two);
}
.sunricedomains label {
  font-size: 17px;
  font-weight: 600;
  color: var(--color-white);
  line-height: 1.5;
  display: block;
  margin-bottom: 15px;
}

.sunricedomains label a{
color: var(--color-primary);
}

.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-secondary-light);
  border-radius: 5px;
}

.ribbone {
  width: 160px;
  height: 160px;
  overflow: hidden;
  position: absolute;
  z-index: 6;
  inset-block-start: 0;
  inset-inline-start: 0;
}

.ribbone span {
  inset-inline-end: 0px;
  inset-block-start: 17px;
  transform: rotate(-45deg);
  position: absolute;
  display: block;
  width: 260px;
  padding: 2px 0;
  color: #fff;
  text-transform: capitalize;
  text-align: center;
  font-size: 13px;
}


.team-style{
  position: relative;
  border-radius: 5px;
  transition:  all 0.5s ease-in-out;
  top: 0;
}

.team-style:hover{
  top: -10px;
  box-shadow: 0px 0px 15px rgba(0,0,0,0.08);
}

.team-style .team-img{
  position: relative;
overflow: hidden;
border-radius: 5px 5px 0 0;
}

.team-style .team-social{
  position: absolute;
bottom: 0;
left: 0;
right: 0;
transition: all 0.5s ease-in-out;
opacity: 0;
text-align: center;
}

.team-style:hover .team-social{
  opacity: 1;
  bottom: 20px;
}

.team-style .team-social ul li{

list-style: none;
margin: 0 2px;
padding: 0;
display: inline-block;
  
}
.team-style .team-social ul li a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background: var(--color-primary-dark-two);
  color: var(--color-white);
  border-radius: 700px;
  transition: all 0.5s ease-in-out;
  font-size: 18px;
}

.team-style .team-social ul li a:hover{
  background: var(--color-primary-two);
}


.team-info{
  padding: 30px 15px;
  background: var(--color-white);
  box-shadow: 0px 0px 15px rgba(0,0,0,0.08);
  border-radius: 0 0 5px 5px;

}

.team-info h5{
  font-size: 25px;
  color: var(--color-primary-two);
  text-align: center;
  margin-bottom: 0;
  font-weight: 800;


}

.team-info p{
  font-size: 18px;
  color: var(--color-secondary);
  text-align: center;
  margin-bottom: 0;
}

.blog-card{
  box-shadow: 0px 10px 10px rgba(151,151,151,.15);
border-radius: 5px;
background: var(--color-white);
}

.blog-card .feature-img{
border-radius: 5px 5px 0 0;
}

.blog-card .feature-img a{
  display: block;
  overflow: hidden;
  border-radius: 5px 5px 0 0;

}

.blog-card .feature-img a img{
border-radius: 5px 5px 0 0;
transition: all .3s ease-in;
}
.blog-card:hover .feature-img a img{
transform: scale(1.05);
}

.blog-card .blog-content{
  position: relative;
  padding: 40px 25px 40px 25px;
}


.blog-card .blog-content .tag-btn{
  position: absolute;
  background: var(--color-primary-two);
padding: 8px 20px;
color: #fff;
font-weight: 900;
font-size: 16px;
display: inline-block;
top: -20px;
overflow: hidden;
z-index: 1;
color: var(--color-white);
border-radius: 4px;
}

.blog-card .blog-content h3{
  font-size: 20px;
  color: var(--color-primary-dark-two);
  margin-bottom: 15px;
  font-weight: 700;
  line-height: 1.5;
}


.blog-card .blog-content h4{
 font-size: 17px;
  color: var(--color-secondary);
  margin-bottom: 20px;
  font-weight: 500;
  line-height: 1.5;
}


.blog-card  .blog-autor{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.blog-card  .blog-autor img{
  max-height: 50px;
  border-radius: 50%;
}

.blog-card  .blog-autor h6{
  margin-left: 10px;
  font-size: 18px;
  margin-bottom: 0px;
  color: var(--color-primary-dark-two);
  font-weight: 800;
}


[dir="rtl"] .blog-card  .blog-autor h6{
  margin-left: unset;
  margin-right: 10px;

}

.blog-side-bar .secrch-wighet form{
  position: relative;
}

.blog-side-bar .secrch-wighet form input{
width: 100%;
  padding: 18px 60px 18px 25px;
  border: 0;
  border-radius: 5px;
  font-weight: 600;
  background: #ececec;
  border-radius: 4px;
   font-size: 16px;
  line-height: 1;
}

.blog-side-bar .secrch-wighet form button{
  position: absolute;
  top: 0;
  right: 0; 
  background: var(--color-primary-two);
  color: var(--color-white);
  padding: 18px 25px;
  border: 0;
  border-radius: 4px;
  font-size: 18px;
  line-height: 1;
}


[dir="rtl"] .blog-side-bar .secrch-wighet form button{
  left: 0;
  right: auto;
}


.blog-side-bar .widget-title {
position: relative;
padding-bottom: 15px;
border-bottom: 2px solid #c4c4c4;
font-size: 25px;
color: var(--color-secondary-dark);
font-weight: 700;
}


 .blog-side-bar .widget-title::before {
  content: "";
  position: absolute;
  width: 100px;
  height: 2px;
  background: linear-gradient(95.45deg, var(--color-primary-two) 0.64%, var(--color-primary-two) 98.23%);
  left: 0;
  bottom: -2px;
}


 .blog-side-bar .news-content{
  display: flex;
  align-items: center;
  margin-top: 30px;
}

 .blog-side-bar .news-content .img img{
  width: 80px;
height: 60px;
border-radius: 50%;
}


 .blog-side-bar .news-content .contents{
  margin-left: 20px;
}

[dir="rtl"]  .blog-side-bar .news-content .contents{
  margin-left: unset;
  margin-right: 20px;

}

 .blog-side-bar .news-content .contents h5{
font-size: 20px;
  color: var(--color-primary-dark-two);
  margin-bottom: 0px;
  font-weight: 700;
  line-height: 1.5;
}


 .blog-side-bar .news-content .contents p{
  font-size: 17px;
  color: var(--color-secondary);
  margin-bottom: 0px;
  font-weight: 500;
  line-height: 1.5;
}


 .blog-side-bar .banners-content{
  padding: 50px 20px;
  background: var(--color-primary-two);
  position: relative;
  overflow: hidden;
  border-radius: 4px;
}


 .blog-side-bar .banners-content img {
  position: absolute;
  left: 0;
  mix-blend-mode: soft-light;
  opacity: 0.3;
  top: 0;
  right: 0;
  width: -moz-available;
}
 .blog-side-bar .banners-content .contents{
  position: relative;
}
 .blog-side-bar .banners-content .contents h6{
color: #fff;
text-align: center;
font-size: 22px;
margin-bottom: 20px;

}

.blog-side-bar .banners-content .contents h3 {
  color: #fff;
  text-align: center;
  font-size: 35px;
  margin-bottom: 20px;
  font-weight: 800;
}

 .blog-side-bar .banners-content .contents a{
display: block;
margin: auto;
width: fit-content;
margin-bottom: 20px;
}
 

  .blog-side-bar .banners-content .contents p{
  color: #fff;
  text-align: center;
font-size: 22px;.
margin-bottom: 0px;

}


.blog-deatils{
  background: var(--color-white);
  margin-block-end: 30px;
  box-shadow: 0 3px 10px 0px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
}

.blog-deatils .blog-preview{
border-radius: 5px 5px 0 0;
}

.blog-deatils .blog-preview-details{
  padding: 25px;
}

.blog-deatils .blog-preview-details .items{
  margin-right: 30px;
  margin-bottom: 20px;
}
@media (min-width:767px){
  .blog-deatils .blog-preview-details .items{
  margin-bottom: 0px;
}
}

.blog-deatils .blog-preview-details .items .author-img {
position: relative;
height: 50px;
width: 50px;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
line-height: 0;
font-size: 20px;
color: var(--color-secondary-dark);
}

.blog-deatils .blog-preview-details .items .author-img {
  margin-right: 15px;
}

[dir="rtl"] .blog-deatils .blog-preview-details .items .author-img {
  margin-right: unset;
  margin-left: 15px;

}
[dir="rtl"] .blog-deatils .blog-preview-details .items{
  margin-right: unset;
  margin-left: 30px;
}

.blog-deatils .blog-preview-details .items .contents h6{
color: var(--color-secondary-dark);
font-size: 20px;
line-height: 1.5;
margin-bottom: 0px;
font-weight: 800;
}

.blog-deatils .blog-preview-details .items .contents p{
color: var(--color-secondary-dark);
font-size: 16px;
line-height: 1.5;
margin-bottom: 0px;
}

.blog-deatils .viewcontent{
  padding: 30px;
  padding-top: 15px;
}

.blog-deatils .viewcontent h4{
color: var(--color-primary-dark-two);
font-size: 30px;
line-height: 1.5;
margin-bottom: 0px;
font-weight: 800;
}

.blog-deatils .viewcontent p{
  color: var(--color-secondary);
font-size: 17px;
line-height: 1.5;
margin-bottom: 20px;
font-weight: 500;
}

.blog-deatils .viewcontent h5 {
  color: var(--color-secondary-dark);
  font-size: 19px;
  line-height: 1.5;
  margin-bottom: 15px;
  font-weight: 800;
}


.blog-deatils .top-rated{
  background: rgba(var(--color-primary-rgb-two), 0.1);
  padding: 20px;
  border-radius: 4px;
}

.blog-deatils .top-rated h3{
  color: var(--color-primary-dark-two);
font-size: 25px;
line-height: 1.5;
margin-bottom: 15px;
font-weight: 800;
}

.blog-deatils .top-rated h5{
   color: var(--color-secondary);
font-size: 17px;
line-height: 1.5;
margin-bottom: 0px;
font-weight: 500;
}


.blog-deatils .social-icons {
  padding: 8px;
  border-radius: 50%;
  line-height: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: var(--color-white);
  margin: 0 5px;
  transition: all 0.5s;
}

.blog-deatils .related-tages{
  display: flex;
  flex-wrap: wrap;
}

.blog-deatils .related-tages a{
background: rgba(var(--color-secondary-light-rgb), 0.2);
border: 1px solid rgba(var(--color-secondary-light-rgb), 0.2);
font-size: 16px;
border-radius: 4px;
padding: 5px 10px;
transition: all 0.5s;
color: var(--color-secondary-dark);
margin: 5px;
}

.blog-deatils .related-tages a:hover, .blog-deatils .related-tages a.active{
  background: var(--color-primary-two);
border: 1px solid var(--color-primary-two);
color: var(--color-white);
transition: all 0.5s;
}

.blog-deatils .comants .img{
margin-right: 15px;
}

.blog-deatils .comants .img img{
  max-height: 150px;
}

[dir="rtl"] .blog-deatils .comants .img{
margin-right: unset;
margin-left: 15px;
}

.blog-deatils .comants .contents h5 {
  color: var(--color-primary-dark-two);
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 5px;
  font-weight: 800;
}

.blog-deatils .comants .contents p{
 color: var(--color-secondary);
font-size: 17px;
line-height: 1.5;
margin-bottom: 0px;
font-weight: 500;
}

.blog-deatils .comants  .blog-reply::before {
  content: "";
  background: var(--color-white);
  width: 15px;
  height: 15px;
  position: absolute;
  transform: rotate(45deg);
  inset-block-start: -9px;
  -webkit-border-start: 1px solid var(--bs-border-color);
  border-inline-start: 1px solid var(--bs-border-color);
  -webkit-border-before: 1px solid var(--bs-border-color);
  border-block-start: 1px solid var(--bs-border-color);
}



.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-dark-two);
  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: 16px;
  letter-spacing: 1px;
  color: var(--color-secondary-dark);
  text-align: start;
  margin-bottom: 10px;
}

.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: 17px;
  display: flex;
  align-items: baseline;
  color: var(--color-secondary);
}

.horizontal-plan .pricing-column .custum-lists li::before {
  content: '\F26E';
  font-family: bootstrap-icons;
  margin-right: 5px;
  color: var(--color-primary-two);
  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;
}



.main-body-img::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  opacity: 0.08;
  z-index: -1;
  filter: invert(1);
}
.img4.main-body-img::before{
background-image: url("../images/bgpattern4.jpg");
}

.img5.main-body-img::before{
background-image: url("../images/bgpattern5.png");
filter: unset;
opacity: 1;
}

.main-body-img{
  min-height: 100vh;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.main-body-img {
  position: relative;
  z-index: 1;
  background: radial-gradient(var(--color-primary-two), #268fe6);
}

.page {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.page .section{
  padding: 70px 0;
}

.page .section .main {
  justify-content: space-evenly;
}

.construction-bg .counter-item::before {
  background-image: none;
}

.counter-item::before {
  content: "";
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  height: 100%;
  width: 100%;
  background-position: center;
  background-color: rgba(255, 255, 255, 0.4);
  background-size: cover;
  opacity: 0.4;
  z-index: -1;
  border-radius: 10px;
}
.counter-item {
  width: 30%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  background-color: var(--color-primary-two);
  border-radius: 10px;
  padding: 10px;
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
  position: relative;
  z-index: 1;
}

.counter-item .count_down {
  font-size: 40px;
  -webkit-margin-after: 0;
  margin-block-end: 0;
}

.counter-item h5{
  font-size: 16px;
}

.counter-item h4, .counter-item h5 {
  color: #fff;
}

.before-unset:before{
content: unset;
}

.iner-content h4 {
  font-size: 27px;
  margin-bottom: 20px;
  color: var(--color-secondary-dark);
  line-height: 1.5;
  margin-top: 15px;
}

.iner-content p{
  font-size: 19px;
margin-bottom: 20px;
color: var(--color-secondary);
line-height: 1.5;
}

.bg-whites{
  background: var(--color-white);
box-shadow: 0px 0px 15px rgba(0,0,0,0.07);
padding: 30px 20px;
border-radius: 15px;
}
.terms-content{
max-height: 60vh;
overflow-y: auto;
width: 100%;
}

.terms-content > .row{
  margin: 0;
}


.terms-content h4{
  font-size: 27px;
  margin-bottom: 20px;
  color: var(--color-secondary-dark);
  line-height: 1.5;
  margin-top: 15px;
}

.terms-content p{
    font-size: 19px;
margin-bottom: 20px;
color: var(--color-secondary);
line-height: 1.5;
}

.login-contens.bg-whites{
  background: #fafafa;
}

.login-contens .registers{
  max-height: 45vh;
  overflow-y: auto;
}

.login-contens a.logs img{
max-height: 60px;
}

.login-contens h4 {
  font-size: 30px;
  color: var(--color-primary-dark-two);
  margin-bottom: 10px;
  text-align: center;
  font-weight: 800;
  margin-top: 20px;
}

.login-contens label{
display: block;
color: var(--color-primary-dark-two);
font-weight: 500;
font-size: 17px;
margin-bottom: 0px;
}

.login-contens .field{
width: 100%;
padding: 12px 15px 12px 15px;
border: 1px solid rgba(221,221,221,.485);
margin-top: 6px;
border-radius: 4px;
position: relative;
margin-bottom: 20px;
}

.login-contens .forgot{
  font-size: 18px;
  color: var(--color-secondary);
  text-align: right;
  display: block;
  transition: all 0.5s;
}

.login-contens .forgot:hover{
  color: var(--color-primary-two);

}

.login-contens hr{
  border-color: var(--color-primary-two);
}

.login-contens h4{
  font-size: 22px;
  color: var(--color-primary-two);
  text-align: center;
  display: block;
  transition: all 0.5s;
}

.login-contens h5{
  font-size: 18px;
  color: var(--color-secondary);
  text-align: center;
  display: block;
  transition: all 0.5s;
}

.login-contens h5 a{
  color: var(--color-primary-two);

}

.single-offer-box {
  background: var(--color-primary-dark-two);
  border-radius: 10px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 10px 0;
}

.single-offer-box  .content {
  margin: 12px;
  border: 1px solid #fff;
  border-radius: 10px;
  width: 100%;
}

.single-offer-box  .pass {
  padding: 10px 15px;
  border-radius: 10px 10px 0 0;
  background: #ffffff;
}

.single-offer-box  .pass::before {
  content: "";
  position: absolute;
  bottom: -8px;
  left: calc(50% - 20px);
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  border-top: 10px solid #ffffff;
}

.single-offer-box  .pass h6 {
  font-size: 14px;
  font-weight: 600;
  font-family: var(--font-primary);
  color: var(--color-primary-two);
}

.single-offer-box  .discount-price {
  font-size: 30px;
  line-height: 55px;
  font-weight: 600;
  font-family: var(--font-primary);
}


 
/*======================================== footer ================================*/

.footer{
  padding: 40px 0px;
  background-color: var(--color-primary-two);
	padding-bottom: 20px;
}

.footer .footer-contant{
  color: var(--color-white);
}

.footer .footer-contant .logo img{
max-height: 60px;
}

.footer .footer-contant .footer-pera{
  font-size: 18px;
  line-height: 25px;
  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;
}

[dir="rtl"] .footer .footer-contant .footer-list li a i{
  margin-right: unset;
	margin-left: 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: rgba(255, 255, 255, 0.2) !important;
  color: var(--color-white);
  text-align: center;
  font-size: 15px;
  margin-right: 15px;
	transition: all 0.5s;
}

.footer .footer-contant .footer-link a:hover{
	background: rgba(255, 255, 255, 1) !important;
border-color: rgba(255, 255, 255, 1) !important;
	color: var(--color-primary-two);
}

[dir="rtl"] .footer .footer-contant .footer-link a{
	margin-right: unset;
	margin-left: 15px;
}

.footer .footer-contant .footer-link a:last-child{
  margin-right: 0px;
}

[dir="rtl"] .footer .footer-contant .footer-link a:last-child{
  margin-right: unset;
	margin-left: 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: #fff;
  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 .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;
}



/* --------------------------------------------------------------------------
                           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;
}
#clientAreaMenus-2 li ul.show {
    display: contents !important;
}
[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;
}

.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;
}

#switcher-canvas .offcanvas-body {
	padding: 0 0 55px 0;
/*	max-height: 450px;*/
	position: relative;
}

@media (max-width:480px){
  #switcher-canvas .offcanvas-body{
      max-height: 450px;
  }
}

.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: absolute;
	bottom: 0; 
	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);
}

[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;
}