.sticky-top .navbar-nav a,
.theme-slide,
body {
	color: var(--text-color);
	overflow-x:hidden;
}

#muteIcon img,
.footer ul li,
.mode-theme {
	cursor: pointer
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box
}

:root {
	--theme-color: #ff0000;
	--theme-dark-color: #fff;
	--text-color: #000;
	--darkgray: #f1f1f1;
	--pricing-card: rgb(216 216 216 / 50%);
	--text-color-white: #fff
}

body.dark {
	--theme-dark-color: #000;
	--darkgray: #1b1b1b;
	--text-color: #fff;
	--pricing-card: rgba(0, 0, 0, 0.5)
}

body {
	background-color: var(--theme-dark-color);
	font-family: Rubik, sans-serif
}

section {
	scroll-margin-top: 56px !important;
	padding-top: 3rem;
	padding-bottom:1.5rem;
}

.sticky-top {
	background: var(--theme-dark-color)
}

#slide-container,
.section-1 .navbar,
.section-5 {
	background-color: var(--navbar-theme)
}

.sticky-top .navbar-nav a {
	font-size: 16px;
	padding: 0 16px !important
}

.sticky-top .navbar-nav a:after {
	display: block;
	content: '';
	border-bottom: solid 3px var(--theme-color);
	transform: scaleX(0);
	transition: transform .3s ease-in-out
}

.sticky-top .navbar-nav a:hover:after {
	transform: scaleX(1)
}

.client-content-area,
.section-5 {
	background-color: var(--darkgray);
	color: var(--text-color)
}

.headerbtn,
.silo-suite-btn {
	background: var(--theme-color);
	font-size: 16px
}

.headerbtn,
.section-8 .nav-pills button,
.silo-suite-btn {
	color: var(--text-color-white);
	font-weight: 600
}

a {
	text-decoration: none
}

.silo-suite-btn {
	padding: 10px 20px;
	border: 1px solid transparent;
	border-radius: 5px
}

.headerbtn:hover,
.silo-suite-btn:hover {
	background-color: transparent;
	color: var(--theme-color);
	border: 1px solid var(--theme-color)
}

.headerbtn {
	padding: 6px 16px;
	border: 1px solid transparent;
	border-radius: 5px
}

.saas-image .img-project {
	position: absolute;
	left: 0;
	top: 40px;
	animation: 5s linear infinite movebounce
}

.saas-image .img-dashboard {
	animation: 6s linear infinite movebounce;
	position: absolute;
	left: 25%;
	top: 50px;
	width: 60%
}

h3.prg-count::after {
	content: " %";
	display: inline-block
}

h3.prg-count.prg-count1::after {
	content: " +"
}

h3.prg-count.prg-count2::after {
	content: " h"
}

h3.prg-count.prg-count3::after {
	content: " k"
}

.footer a {
	color: var(--text-color-white) !important
}

.section-8 .nav-pills button {
	background-color: #161616;
	width: 160px;
	border-radius: 0;
	padding: 10px 16px;
	border: 1px solid transparent
}

.nav-pills .show>.nav-link,
.section-8 .nav-pills .nav-link.active {
	color: var(--theme-color);
	background-color: #161616;
	border: 1px solid var(--text-color)
}

.pricing-card {
	margin: 40px 10px 16px
}

.bg-theme {
	background: #f90000;
	padding: 4px 6px
}

.plan-features span {
	background: #f90000ad;
	padding: 4px 6px
}

.bx-check {
	font-size:16px
}

.pricing-card .plan {
	box-shadow: 0 0 5px rgba(0, 0, 0, .3);
	background-color: var(--darkgray)
}

.pricing-card .plan.hover i,
.pricing-card .plan:hover i {
	-webkit-transform: scale(1.2);
	transform: scale(1.2)
}

.pricing-card .plan:first-of-type {
	border-radius: 8px 0 0 8px
}

.pricing-card .plan:last-of-type {
	border-radius: 0 8px 8px 0
}

.pricing-card * {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: .25s ease-out;
	transition: .25s ease-out
}

.pricing-card .plan-title {
	background-color: var(--pricing-card);
	position: relative;
	margin: 0;
	padding: 20px 20px 0;
	text-transform: uppercase;
	letter-spacing: 4px
}

.pricing-card .plan-title:after {
	position: absolute;
	content: '';
	top: 100%;
	left: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 40px 260px 0 0;
	border-color: var(--pricing-card) transparent transparent
}

.pricing-card .plan-cost {
	padding: 40px 20px 10px;
	text-align: center
}

.pricing-card .plan-price {
	font-weight: 600;
	font-size: 3em
}

.pricing-card .plan-type {
	opacity: .8;
	font-size: .7em;
	text-transform: uppercase
}

.pricing-card .plan-features {
	padding: 0 0 20px;
	margin: 0;
	list-style: none
}

.pricing-card .plan-features li {
	padding: 4px 5%
}

.pricing-card .plan-features li i {
	font-size: 1rem;
	font-weight: 700
}

.pricing-card .plan-select {
	border-top: 1px solid rgba(0, 0, 0, .2);
	padding: 20px;
	text-align: center
}

.pricing-card .plan-select a {
	background-color: #442232;
	color: var(--text-color);
	text-decoration: none;
	padding: 12px 20px;
	font-size: .75em;
	font-weight: 600;
	border-radius: 20px;
	text-transform: uppercase;
	letter-spacing: 4px;
	display: inline-block
}

.pricing-card .plan-select a:hover {
	background-color: #552a3f
}

.pricing-card .plan:hover {
	margin-top: -10px;
	border-color: var(--darkgray);
	box-shadow: 0 0 25px rgba(0, 0, 0, .4);
	z-index: 1;
	border-radius: 8px;
	cursor: pointer
}

.pricing-card .plan .plan-select {
	padding: 30px 20px
}

@media only screen and (max-width:767px) {
	.pricing-card .plan {
		width: 50%
	}

	.pricing-card .plan-select a,
	.pricing-card .plan-title {
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}

	.pricing-card .featured .plan-select,
	.pricing-card .plan-select {
		padding: 20px
	}

	.pricing-card .featured {
		margin-top: 0
	}

	section {
		padding-top:24px !important;
		padding-bottom: 1rem !important
	}

	.logo-mobile {
		height: 25px
	}
}

@media only screen and (max-width:440px) {
	.pricing-card .plan {
		width: 100%
	}
	.saas-image .img-dashboard, .saas-image .img-project{
		top: 0px;
	}
}

.footer h5 {
	position: relative;
	border-bottom: 2px solid #dfdada;
	padding-bottom: 8px
}

.footer h5:before {
	content: "";
	position: absolute;
	width: 20%;
	height: 3px;
	background-color: var(--theme-color);
	bottom: -2px;
	left: 0;
	transition: .5s cubic-bezier(.645, .045, .355, 1)
}

.footer .col-sm-6:hover h5:before {
	width: 100%
}

.footer ul li {
	margin-bottom: 10px;
	transition: .5s ease-in-out
}

.list-unstyled li:hover {
	color: var(--text-theme-color);
	transform: scale(1.05)
}

.footer .footer-icon {
	display: inline-block;
	color: #7f839c;
	font-size: 22px;
	transition: .3s;
	height: 40px;
	width: 40px;
	text-align: center;
	line-height: 32px;
	border: 1px solid #7f839c;
	border-radius: 50%;
	margin: 10px
}

.footer-icon:hover {
	color: var(--text-color);
	background: var(--theme-color);
	box-shadow: 0 17px 66px 1px hwb(208deg 0 0);
	border: 1px solid var(--theme-color)
}

#muteIcon img {
	position: fixed;
	right: 2%;
	bottom: 15px;
	width: 48px;
	border-radius: 50%;
	background: rgb(252 0 0 / 50%);
	transition: .6s
}

#muteIcon img:hover {
	background: rgb(252 0 0 / 90%)
}

#faq-section #faqAccordion>div,
#faq-section .accordion-header>button {
	background-color: var(--darkgray) !important;
	color: var(--text-color)
}

@media only screen and (max-width:900px) {
	.w-sm-75 {
		width: 75% !important
	}
}



    .section-10 .owl-nav {
      display: none;
    }

    .section-10 .owl-dots button {
      border: none;
      background: transparent;
    }

    .footer .follow a {
      position: relative;
    }

    .footer .follow a i {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }

   
    .form-group {
      margin: 16px 0px;
    }

    .sm-form-control {
      display: block !important;
      width: 100% !important;

      padding: 8px 14px !important;
      font-size: 15px !important;
      line-height: 1.42857143 !important;
      color: #555555 !important;
      background-color: transparent !important;
      background-image: none !important;
      border: 2px solid #DDD !important;
      border-radius: 0 !important !important;
      transition: border-color ease-in-out .15s !important;
    }

    .form-group label {
      display: inline-block;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 1px;
      color: #555;
      margin-bottom: 10px;
      cursor: pointer;
    }

    .form-group .error {
      color: red;
    }

    .section-1 .section1-title {
      position: absolute;
      top: 50%;
      font-size: 70px;
      font-weight: 600;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100%;
    }

    .muteIcon img {
      padding: 10px;
    }

    @media only screen and (max-width: 600px) {
      .section-1 .section1-title {
        position: absolute;
        top: 146px;
        font-size: 20px;
        font-weight: 600;
      }
    }

    .logo-mobile {
      height: 30px;
    }

    #my-video,
    #task-video {
      box-shadow: 0 30px 50px 0 rgb(246 246 247 / 10%);
    }

    #captcha_err {
      color: red;
    }

    #soundIcon {
      padding: 10px;
    }

    #myModal_new {
      display: none;
    }