/*
Theme Name: Online Documentation Pro
Theme URI:
Author: VW Themes
Author URI: https://www.vwthemes.com/
Description:
Version: 0.0.1
Requires at least: 5.8.0
Tested up to: 6.0.3
Requires PHP: 7.2
License: GNU General Public License
License URI:license.txt
Text Domain: online-documentation-pro
Tags: one-column, right-sidebar, custom-menu, editor-style, featured-images, full-width-template, sticky-post, theme-options, threaded-comments
Online Documentation Pro WordPress Theme has been created by VW Themes(vwthemes.com), 2023.
Online Documentation Pro WordPress Theme is released under the terms of GNU GPL
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
  --darkblue: #070395;
  --lightblue:#00D7FE;
  --black: #000000;
  --white: #ffffff;
  --pink:#640092;
  --theme-font:"Poppins", sans-serif;
}
/* Basic Style */
 html body {
  margin: 0;
  padding: 0;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  background-color: white;
  position: relative;
  font-size: 14px;
  color:var(--black);
  font-family: var(--theme-font);
  background: var(--white);
}
 label {
     margin-bottom: 0 !important;
}
 img {
     margin: 0;
     padding: 0;
     border: none;
     max-width: 100%;
     height: auto;
     width: auto;
}
 section img {
     max-width: 100%;
}
 h1, h2, h3, h4, h5, h6 {
     margin: 0;
    font-family: var(--theme-font);
    font-weight: bold;
}
 p {
     margin: 0 0 15px;
     padding: 0;
     font-size: 14px;
     font-weight: normal;
}
 p, ul li a {
     letter-spacing: 0px;
       font-family: var(--theme-font);
}
 body a {
     text-decoration: none;
     color: #277BF8;
}
 a:hover {
     text-decoration: none;
     color: var(--black1);
}
 a:focus, a:hover {
     text-decoration: none !important;
}
 ul, ol {
     margin: 0 0 0 0;
     padding: 0;
}

 input[type="text"], input[type="tel"], input[type="email"], input[type="phno"], input[type="password"], textarea , .form-group input, select{
     border: 1px solid transparent;
     font-size: 14px;
     padding: 10px 10px;
     margin: 0 0 0px 0;
     height: auto;
     width: 100%;
     background: #FFFFFF;
     border-radius: 5px;
     margin-bottom: 10px;
     color: #000;
}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
  color: grey;
}
.wpcf7-spinner{
  position: absolute;
  margin: 0 5px;
  right: -36px;
  z-index: 1;
  opacity: 1;
}
.advisor-form-box .theme-btn p{
  margin-bottom: 0;
}
.advisor-form-box .theme-btn p input {
  background: transparent;
  border: none;
  font: 400 16px / 20px var(--theme-font);
  color: #fff;
}
 section{
     background-size: cover !important;
     background-repeat: no-repeat !important;
     padding: 60px 0;
     background-attachment: scroll;
     overflow-x: hidden;
}
 .screen-reader-text {
     position: absolute;
     top: -9999em;
     left: -9999em;
}

/*------------------------- Headings --------------------------*/
 section h2,h2 {
  font:700 45px / 45px var(--theme-font);
  letter-spacing: 0px;
}
 section h3 ,h3 a,h3{
  font-weight: 700;
    font-size: 30px;
  line-height: 25px;
}
section h4,h4 a,h4{
  font: 600 20px / 26px var(--theme-font);
  letter-spacing: 0px;
}
section h5,h5,h5 a{
  font: 600 18px / 23px var(--theme-font);
  letter-spacing: 0px;
}
section h6,h6 a,h6{
  font: 600 16px / 22px var(--theme-font);
  letter-spacing: 0px;
}
p{
  font: 400 14px/25px var(--theme-font);
  letter-spacing: 0px;
}
/* ----------- Post Content ---------------*/

 .vw-fixed{
     background-attachment: fixed !important;
     background-size: cover ;
     background-repeat: no-repeat ;

}
 .vw-scroll{
     background-attachment: scroll !important;
     background-size: cover ;
     background-repeat: no-repeat;
}
 .slider-bg-image.vw-fixed{
   position: fixed !important;
 }
/* ---------- Return to Top ------------ */
 #return-to-top {
  position: fixed;
  bottom: 10px;
  right: 19px;
  background: #000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  display: block;
  text-align: center;
  text-decoration: none;
  border-radius: 50%;
  border: 8px solid #111111;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 9;
  align-items: center;
  display: flex;
  justify-content: center;
}
 #return-to-top i {
  position: relative;
  font-size: 20px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  color: #fff !important;
  font-weight: 800;
}
 #return-to-top:hover {
  background: #070395;
}

.dark #return-to-top{
  background: var(--white);
}
.dark #return-to-top i{
  color:  #000 !important;
}
.sticky.stickynavbar {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99999;
  background:var(--white);
  padding: 20px 0;
   box-shadow: 0px 0px 20px #0000002B; 
}
.dark .sticky.stickynavbar{
  background:var(--black);
}
/* .sticky.stickynavbar .header-inner{
  background: unset;
  box-shadow: unset;
} */
 .owl-nav{
    position: absolute;
    right: 0;
    top: -70px;
    display: flex;
    gap: 10px;
 }
.owl-nav button{
  background: var(--black);
  border: none;
  height: 45px;
  width: 45px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.custom-owl-nav button{
  background: #000000;
  border: none;
  height: 45px;
  width: 45px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.owl-nav button i,.custom-owl-nav button i{
  font-size: 16px;
  color: #fff;
}
.owl-nav button:hover{
background: linear-gradient(180deg, #070395 0%, #00D7FE 100%);
}
.custom-owl-nav button:hover{
  background-color: var(--white);
}

.owl-nav button:hover i{
  color: var(--white);
}
.custom-owl-nav button:hover i{
 color: var(--black);
}
.dark .owl-nav button{
  background-color: var(--white);
}
.dark .owl-nav button i{
  color: var(--black);
}
.dark .owl-nav button:hover i{
   color: var(--white);
}
/* ----------- Spinner ------------- */
 .eco-box{
   position: fixed;
   height: 100%;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   cursor: pointer;
   z-index: 99999999;
   background-color:var( --black);
   width: 100%;
}
.loader-main{
  display: flex;
  justify-content: center;
  width: max-content;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: max-content;
}

.loader {
  width: 50px;
  height: 50px;
  display: flex;
  transform: rotate(45deg);
  animation: l3-0 1.5s infinite linear;
}
.loader:before,
.loader:after {
  content: "";
  width: 50%;
  background: var(--white);
  clip-path: polygon(0 50%,100% 0,100% 100%);
  animation: inherit;
  animation-name: l3-1;
}
.loader:after {
  clip-path: polygon(0 0,100% 50%,0% 100%);
  animation-name: l3-2;
}
@keyframes l3-0 {
  25% {width:50px;height:50px;transform:rotate(0)}
  50% {width:50px;height:50px}
  75% {width:70.70px;height:35.35px}
  100%{width:70.70px;height:35.35px;transform:rotate(0)}
}
@keyframes l3-1 {
  0%,25% {clip-path: polygon(0 50% ,100% 0,100% 100%);transform:translate(0.3px)}
  50%    {clip-path: polygon(0 50% ,100% 0,100% 100%);transform:translate(-5px)}
  75%    {clip-path: polygon(0 100%,0    0,100% 100%);transform:translate(-5px)}
  100%   {clip-path: polygon(0 100%,0    0,100% 100%);transform:translate(17.7px)}
}
@keyframes l3-2 {
  0%,25% {clip-path: polygon(0 0,100% 50%,0    100%);transform:translate(-0.3px) }
  50%    {clip-path: polygon(0 0,100% 50%,0    100%);transform:translate(5px) }
  75%    {clip-path: polygon(0 0,100% 0  ,100% 100%);transform:translate(5px)}
  100%   {clip-path: polygon(0 0,100% 0  ,100% 100%);transform:translate(-17.7px) }
}

 /* common css */
.main-head{
  line-height: 49px;
}
.sub-head {
  font: 600 17px / 22px var(--theme-font);
  letter-spacing: 0px;
}
.main-para{
  font: 400 15px / 26px var(--theme-font);
}
.theme-btn-wrap{
  position: relative;
  width: max-content;
}

 .theme-btn{
  border-radius: 50px;
    position: relative;
    transition: all 0.5s;
    overflow: hidden;
    display: inline-block;
    padding: 12px 30px;
    z-index: 1;
    width: max-content;
    /* transition: all 0.4s ease 0.5s; */
    background: var(--black);
    color: var(--white);
    font: 400 16px / 20px var(--theme-font);
    display: block;
 }
  .btn-inner{
    padding: 24px 30px;
    width: 100%;
    border-radius: 50px;
    background: #000;
    opacity: 20%;
    position: absolute;
    top: -2px;
    transform: rotate(5deg);
    left: 0px;
}
/* .theme-btn::after{
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg, #070395 0%, #00D7FE 100%);
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: 50% 100%;
  transform-origin: 50% 100%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
  border-radius: 50px;
} */
.theme-btn-wrap:hover .theme-btn {
    background: linear-gradient(90deg, #070395 0%, #00D7FE 100%);
  /* -webkit-transform: scaleY(1);
  transform: scaleY(1); */
}
 .theme-btn:hover{
  color: #fff;
 }
 .theme-btn-wrap:hover  .btn-inner{
  background: linear-gradient(272.41deg, #070395 1.64%, #00D7FE 94.72%);
    opacity: 20%;
 }
@keyframes tilt-btn-inner {
  0%   { transform: rotate(0deg); }
  50%  { transform: rotate(5deg); }
  100% { transform: rotate(-5deg); }
}

.theme-btn-wrap:hover .btn-inner {
  animation: tilt-btn-inner 1s ease-in-out infinite alternate;
}
.dark .theme-btn{
    background: linear-gradient(272.41deg, #070395 1.64%, #00D7FE 94.72%);
}
 .dark .theme-btn:hover{
      background: var(--white);
      color: #000;
 }
 .dark  .btn-inner{
  background: linear-gradient(272.41deg, #070395 1.64%, #00D7FE 94.72%);
 }
.dark  .theme-btn-wrap:hover  .btn-inner{
background: #fff9f9;
}
 /* slider */
 .filters-tag{
    display: flex;
    justify-content: center;
    gap: 10px;
    align-items: center;
    margin-top: 40px;
 }
 .filters-tag span{
    font-family: Poppins;
    font-weight: 700;
    font-size: 18px;
    color: var(--white);
 }
.tagss {
  border: 1px solid #FFFFFF;
    padding: 7px 25px;
    border-radius: 20px;
    color: #fff;
    font-size: 14px;
 }
 .tagss:hover{
    background: linear-gradient(100.4deg, #070395 11.74%, #00D7FE 92.96%);
    border: transparent;
      color: #fff;
 }
#doc-category-btn {
     background: transparent;
    border: none;
    padding: 5px;
    font-size: 16px;
    font-weight: 500;
    padding-left: 15px;
    display: flex;
}

#doc-category-btn .chevron {
  transition: transform 0.3s ease;
  margin-left: 8px;
}

#doc-category-btn.active .chevron {
  transform: rotate(180deg);
}
 .searchform {
  display: flex;
  align-items: center;
}
.searchform input[type="text"] {
  flex: 1;
  padding: 8px 8px 8px 25px;
  margin-bottom: 0;
  width: 419px;
}
.category-dropdown{
  border-right: 2px solid #000000;
  padding-right: 10px;
  position: relative;
}
#doc-category-list{
  background: #fff;
  position: absolute;
  list-style: none;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  border-radius: 10px;
  border: 2px solid #070395;
  width: 240px
}
.mic-btn {
  background: none;
  border: none;
  font-size: 20px;
  cursor: pointer;
  margin-left: 5px;
}
.search-btn-wrap{
  background: #000000;
  padding: 10px 20px;
  border-radius: 50px;
}
.search-btn-wrap:hover{
  background: linear-gradient(116.79deg, #070395 11.54%, #00D7FE 79.81%);
}
.search-btn-wrap i{
  font-size: 14px;
  color: var(--white);
  padding-right: 10px;
}
#searchsubmit{
  background: transparent;
  border: none;
  font-family: Poppins;
  font-weight: 400;
  font-size: 15px;
  color: #fff;
  padding: 0;
  padding-left: 3px;
}
.search-main-box{
  background: #FFFFFF;
  display: flex;
  width: 84%;
  margin: 20px auto 0;
  border-radius: 40px;
  align-items: center;
  box-shadow: 0px 3px 6px 0px #00000029;
  padding: 5px 5px;
  justify-content: space-between;
}
#doc-category-list li a{
    font: 400 15px / 22px var(--theme-font);
    color: #000;
}
#doc-category-list li a:hover{
  color: #070395;
}
.slider-inner{
  clip-path: polygon(0% 0%, 0% 0%, 0.735% 0.169%, 2.799% 0.636%, 5.985% 1.338%, 10.082% 2.215%, 14.884% 3.206%, 20.18% 4.249%, 25.762% 5.283%, 31.422% 6.246%, 36.95% 7.078%, 42.137% 7.716%, 42.137% 7.716%, 48.243% 8.23%, 54.734% 8.558%, 61.423% 8.727%, 68.12% 8.766%, 74.638% 8.702%, 80.79% 8.564%, 86.387% 8.378%, 91.241% 8.174%, 95.164% 7.98%, 97.969% 7.822%, 97.969% 7.822%, 98.244% 7.856%, 98.505% 7.986%, 98.749% 8.204%, 98.972% 8.503%, 99.17% 8.873%, 99.34% 9.308%, 99.478% 9.8%, 99.581% 10.34%, 99.646% 10.92%, 99.668% 11.533%, 99.668% 95.123%, 99.668% 95.123%, 99.646% 95.724%, 99.583% 96.294%, 99.482% 96.826%, 99.347% 97.311%, 99.181% 97.742%, 98.988% 98.113%, 98.77% 98.414%, 98.532% 98.638%, 98.276% 98.779%, 98.007% 98.827%, 0% 98.827%, 0% 0%);
  background: linear-gradient(100.34deg, #070395 1.2%, #00D7FE 100%);
  height: 100%;
  width: 95%;
  padding: 20% 0;
    background-size: 400% 400%;
  animation: gradientMove 6s ease infinite;
}

@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
#slider .sub-head{
  color: var(--white);
}
.slider-head{
  font-size: 36px;
  color: var(--white);
  font-weight: 700;
}
.slider-top-svg{
  position: absolute;
  top: 0;
  width: 70%;
  height: 70%;
  clip-path: polygon(0% 0.076%, 0% 0.076%, 0.743% 0.239%, 2.837% 0.693%, 6.084% 1.385%, 10.282% 2.262%, 15.231% 3.272%, 20.731% 4.361%, 26.581% 5.477%, 32.582% 6.568%, 38.534% 7.58%, 44.235% 8.46%, 44.235% 8.46%, 50.904% 9.265%, 58.081% 9.869%, 65.481% 10.299%, 72.818% 10.582%, 79.809% 10.747%, 86.167% 10.82%, 91.608% 10.829%, 95.847% 10.802%, 98.6% 10.765%, 99.581% 10.747%, 99.581% 10.747%, 99.147% 11.305%, 97.923% 12.847%, 96.024% 15.179%, 93.568% 18.103%, 90.67% 21.424%, 87.446% 24.946%, 84.013% 28.472%, 80.487% 31.807%, 76.984% 34.755%, 73.62% 37.119%, 73.62% 37.119%, 69.487% 39.063%, 65.578% 39.843%, 61.838% 39.761%, 58.212% 39.121%, 54.648% 38.227%, 51.09% 37.381%, 47.486% 36.887%, 43.78% 37.048%, 39.919% 38.168%, 35.849% 40.549%, 35.849% 40.549%, 32.977% 42.8%, 30.349% 45.114%, 27.917% 47.528%, 25.635% 50.083%, 23.456% 52.818%, 21.334% 55.773%, 19.221% 58.987%, 17.071% 62.5%, 14.838% 66.351%, 12.474% 70.579%, 12.474% 70.579%, 10.819% 73.729%, 9.113% 77.228%, 7.41% 80.916%, 5.762% 84.633%, 4.222% 88.218%, 2.843% 91.51%, 1.679% 94.35%, 0.781% 96.578%, 0.204% 98.032%, 0% 98.552%, 0% 0.076%);
  background: linear-gradient(100.54deg, #640092 1.51%, #00D7FE 100%);
  opacity: 30%;
  
}
.slider-btm-svg{
  clip-path: polygon(0% 97.545%, 99.303% 97.545%, 99.303% 97.545%, 98.87% 96.903%, 97.65% 95.127%, 95.757% 92.448%, 93.307% 89.094%, 90.417% 85.293%, 87.203% 81.274%, 83.779% 77.266%, 80.263% 73.497%, 76.769% 70.197%, 73.415% 67.593%, 73.415% 67.593%, 69.294% 65.483%, 65.395% 64.636%, 61.665% 64.725%, 58.05% 65.419%, 54.496% 66.39%, 50.948% 67.309%, 47.353% 67.845%, 43.658% 67.67%, 39.808% 66.455%, 35.749% 63.87%, 35.749% 63.87%, 32.886% 61.426%, 30.265% 58.915%, 27.839% 56.294%, 25.564% 53.52%, 23.391% 50.551%, 21.274% 47.343%, 19.167% 43.854%, 17.023% 40.041%, 14.796% 35.86%, 12.439% 31.27%, 12.439% 31.27%, 10.789% 27.851%, 9.088% 24.052%, 7.389% 20.049%, 5.746% 16.014%, 4.21% 12.123%, 2.835% 8.548%, 1.674% 5.465%, 0.779% 3.047%, 0.204% 1.469%, 0% 0.904%, 0% 97.545%);
  position: absolute;
  bottom: 0;
  width: 50%;
  height: 50%;
  background: linear-gradient(99.54deg, #070395 0%, #00D7FE 100%);
  opacity: 30%
}
.slider-right-svg{
  clip-path: polygon(100% 90.95%, 100% 90.95%, 99.955% 92.394%, 99.824% 93.763%, 99.616% 95.041%, 99.335% 96.207%, 98.991% 97.244%, 98.59% 98.134%, 98.139% 98.858%, 97.644% 99.398%, 97.114% 99.735%, 96.556% 99.852%, 3.374% 99.852%, 3.374% 99.852%, 2.409% 99.536%, 1.591% 98.66%, 0.933% 97.334%, 0.446% 95.664%, 0.141% 93.76%, 0.032% 91.729%, 0.128% 89.681%, 0.443% 87.722%, 0.988% 85.962%, 1.776% 84.509%, 1.776% 84.509%, 3.462% 82.202%, 5.212% 79.876%, 7.011% 77.562%, 8.846% 75.29%, 10.701% 73.09%, 12.563% 70.995%, 14.417% 69.033%, 16.249% 67.236%, 18.044% 65.635%, 19.789% 64.26%, 19.789% 64.26%, 24.292% 61.752%, 28.551% 60.747%, 32.626% 60.852%, 36.576% 61.677%, 40.46% 62.831%, 44.336% 63.922%, 48.263% 64.559%, 52.3% 64.351%, 56.507% 62.907%, 60.941% 59.836%, 60.941% 59.836%, 64.07% 56.931%, 66.934% 53.947%, 69.583% 50.833%, 72.07% 47.537%, 74.444% 44.009%, 76.756% 40.197%, 79.058% 36.051%, 81.401% 31.52%, 83.834% 26.553%, 86.409% 21.098%, 86.409% 21.098%, 87.12% 19.541%, 87.845% 17.892%, 88.581% 16.164%, 89.323% 14.371%, 90.069% 12.525%, 90.815% 10.641%, 91.556% 8.731%, 92.29% 6.808%, 93.012% 4.886%, 93.719% 2.978%, 93.719% 2.978%, 94.432% 1.471%, 95.221% 0.529%, 96.05% 0.117%, 96.884% 0.202%, 97.688% 0.748%, 98.425% 1.724%, 99.061% 3.094%, 99.559% 4.824%, 99.884% 6.881%, 100% 9.231%, 100% 90.95%);
  background: linear-gradient(284deg, #00D7FE -5.46%, #070395 98.79%);
  opacity: 30%;
  width: 45%;
  height: 45%;
  position: absolute;
  bottom: 0;
  right: 0;
  
}
.slider-outer-svg{
  position: absolute;
    right: 50px;
  bottom: 40px;
  clip-path: polygon(0% 0.069%, 98.354% 1.422%, 98.354% 1.422%, 98.62% 1.48%, 98.871% 1.643%, 99.105% 1.9%, 99.318% 2.244%, 99.507% 2.666%, 99.669% 3.156%, 99.799% 3.706%, 99.895% 4.306%, 99.952% 4.949%, 99.969% 5.626%, 99.3% 95.931%, 99.3% 95.931%, 99.273% 96.615%, 99.204% 97.26%, 99.096% 97.858%, 98.955% 98.4%, 98.782% 98.876%, 98.582% 99.278%, 98.36% 99.598%, 98.117% 99.826%, 97.859% 99.954%, 97.588% 99.973%, 0% 86.451%, 0% 0.069%);
  background: linear-gradient(125.78deg, #070395 42.73%, #00D7FE 98.22%);
  opacity: 20%;
  width: 85%;
  height: 80%;
  z-index: -1;

}


/* .slider-outer-svg{
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 20%;
  background: linear-gradient(125.78deg, #070395 42.73%, #00D7FE 98.22%);
  clip-path: polygon( 0% 0.069%,98.354% 1.422%,98.354% 1.422%,98.62% 1.48%,98.871% 1.643%,99.105% 1.9%,99.318% 2.244%,99.507% 2.666%,99.669% 3.156%,99.799% 3.706%,99.895% 4.306%,99.952% 4.949%,99.969% 5.626%,99.3% 95.931%,99.3% 95.931%,99.273% 96.615%,99.204% 97.26%,99.096% 97.858%,98.955% 98.4%,98.782% 98.876%,98.582% 99.278%,98.36% 99.598%,98.117% 99.826%,97.859% 99.954%,97.588% 99.973%,0% 86.451%,0% 0.069% );
} */
 /* Blog */
 .circle-blog{
    position: absolute;
    right: 25%;
    top: 15%;
 }
 #blog-news{
   padding-bottom: 7%;
  overflow: hidden;
 }
 .blog-btm-svg{
  position: absolute;
  right: 0;
  bottom: -8px;
 }
 #blog-news .blog-svg{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
      z-index: -1;
 }
 .theme-btn-wrap{
  margin: 0 auto;
 }
#blog-news .owl-stage{
      padding: 2% 0px;
 }
.blog-img-main{
  position: relative; 
  height: 250px;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
}
.blog-img-main::before{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(8, 3, 149, 0.25);
    border-radius: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
}
.blog-detail-inner-wrap:hover .blog-img-main::before  {
    -webkit-animation: circle .75s;
    animation: circle .75s;
}
@keyframes circle {
  0% {
    opacity: 1;
  }
  40% {
      opacity: 1;
  }
  100% {
    width: 200%;
    height: 200%;
    opacity: 0;
  }
}
.blog-img-main img {
  height: 100%;
  width: 100% ;
  object-fit: cover;
} 
.news-author {
  display: flex;
  gap: 10px;
  text-transform: capitalize;
}
.author-image{
  height: 30px ;
  width: 30px !important;
  border-radius: 50%;
}
.blog-inner-content-box{
    background: var(--white);
    box-shadow: 0px 3px 6px 0px #00000029;
    padding: 15px;
    border-radius: 0 0 10px 10px;
    position: relative;
    z-index: 1;
        color: #000;
}
.blog-inner-content-box::after{
  content: '';
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;
  transition: width 0.3s ease-in-out;
  background: linear-gradient(93.82deg, #070395 1.04%, #00D7FE 100%);
  border-radius: 0 0 10px 10px;
  z-index: -1;
}
.blog-detail-inner-wrap:hover .blog-inner-content-box::after{
  width: 100%;
}
.blog-title a{
  color: #000;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
 .blog-detail-inner-wrap {
  transition: 0.6s ease all;
      margin: 2px;
}
.blog-meta a{
  font-size: 14px;
  color: #000;
  font-weight: 600;
  text-transform:capitalize;
}
.blog-detail-inner-wrap:hover a{
color: var(--white);
}

 .blog-detail-inner-wrap:hover .blog-title a, .blog-detail-inner-wrap:hover  .news-author a, .blog-detail-inner-wrap:hover .post-date,.blog-detail-inner-wrap:hover .post-comments {
color: var(--white);
transition: 0.3s ease-in-out;
}
.blog-inner-meta a{
  color: #000;
}
.blog-detail .post-date{
  position: relative;
  color: #000;
}
.post-comments{
    color: #000;
}
.blog-detail .post-date::after{
  content: '';
  position: absolute;
  background: var(--black);
  right: 0;
  height: 20px;
  width: 2px;
}
.blog-detail:hover .post-date::after{
  background: var(--white);
}
/* about sec */
.page-template-about #about-us .theme-btn-wrap{
  display: none;
}
.page-template-about #about-us{
  margin-top: 3%;
}
.abt-btm-clip{
  clip-path: polygon(100% 96.07%, 1.198% 96.07%, 1.198% 96.07%, 1.628% 95.44%, 2.843% 93.699%, 4.726% 91.072%, 7.163% 87.783%, 10.039% 84.056%, 13.237% 80.115%, 16.643% 76.185%, 20.142% 72.49%, 23.618% 69.254%, 26.955% 66.701%, 26.955% 66.701%, 31.056% 64.631%, 34.935% 63.802%, 38.646% 63.889%, 42.243% 64.569%, 45.779% 65.521%, 49.309% 66.422%, 52.885% 66.947%, 56.562% 66.776%, 60.393% 65.584%, 64.431% 63.05%, 64.431% 63.05%, 67.28% 60.653%, 69.888% 58.191%, 72.301% 55.621%, 74.565% 52.902%, 76.727% 49.99%, 78.833% 46.845%, 80.929% 43.424%, 83.062% 39.685%, 85.278% 35.586%, 87.624% 31.085%, 87.624% 31.085%, 89.266% 27.732%, 90.958% 24.007%, 92.648% 20.082%, 94.283% 16.126%, 95.811% 12.31%, 97.179% 8.805%, 98.334% 5.782%, 99.225% 3.411%, 99.797% 1.864%, 100% 1.31%, 100% 96.07%);
    background: linear-gradient(99.54deg, var(--lightblue) 0%, var(--darkblue) 100%);
    width: 23%;
    position: absolute;
    right: 0;
    bottom: -15px;
    height: 35%;
    opacity: 10%;
}
#about-us{
  overflow: hidden;
padding-bottom: 8%;
}
.about-img-main{
  display: grid;
  position: relative;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: repeat(10, 20px);
  grid-gap: 25px;
  z-index: 1;
  width: 90%;
  color: #000;
}
.about-img-main .abt-main-iner:nth-child(1){
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 1;
  grid-row-end: 8;
  background: #FFFFFF;
  box-shadow: 0px 0px 12px 0px #00000026;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 20px;
  text-align: center;
  gap: 15px;
  border-radius: 10px;
}
.about-img-main .abt-main-iner:nth-child(2){
  grid-column-start: 7;
  grid-column-end: 13;
  grid-row-start: 3;
  grid-row-end: 10;
  background: #FFFFFF;
  box-shadow: 0px 0px 12px 0px #00000026;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 20px;
  text-align: center;
  gap: 15px;
  border-radius: 10px;
  position: relative;
  left: 15px;
}
.about-img-main .abt-main-iner:nth-child(3){
  grid-column-start: 1;
  grid-column-end: 7;
  grid-row-start: 8;
  grid-row-end: 11;
  background: #000000;
  border-radius: 10px;
  position: relative;
  left: 20px;
}
.dark .about-img-main .abt-main-iner:nth-child(3){
  background: var(--white);
}
.dark .about-img-main .abt-main-iner:nth-child(3) h2,.dark .about-img-main .abt-main-iner:nth-child(3) h6{
  color: var(--black);
}
.about-img-main .abt-main-iner:nth-child(4){
  grid-column-start: 7;
  grid-column-end: 12;
  grid-row-start: 6;
  grid-row-end: 13;
}
.abt-main-iner1{
  position: relative;
  overflow: hidden;
  z-index: 0;
}
.abt-main-iner1:after,
.abt-main-iner1:before{
  content:"";
  width:2px;
  height:2px;
  border-radius:50%;
  background: linear-gradient(143.32deg, var(--darkblue) 0%,  var(--lightblue) 94.61%);
  position:absolute;
  top:50%;
  left:50%;
  -webkit-transform:scale(0);
  -moz-transform:scale(0);
  -ms-transform:scale(0);
  -o-transform:scale(0);transform:scale(0);
    z-index: -1;
}

.abt-main-iner1:before{
  opacity: 0.35;
}
.abt-main-iner1:hover::after,
.abt-main-iner1:hover::before{
    -webkit-transform:scale(400);
    -moz-transform:scale(400);
    -ms-transform:scale(400);
    -o-transform:scale(400);
    transform:scale(400);
}
.abt-main-iner1:before{
    -o-transition:all .5s linear .3s;
    -moz-transition:all .5s linear .3s;
    -ms-transition:all .5s linear .3s;
    -webkit-transition:all .5s linear .3s;
    transition:all .5s linear .3s;
}
.abt-main-iner1:hover::before{
    -moz-transition-delay:0s;
    -webkit-transition-delay:0s;
    -o-transition-delay:0s;
    -ms-transition-delay:0s;
    transition-delay:0s;
}
.abt-main-iner1:after{
    -o-transition:all .5s linear .4s;
    -moz-transition:all .5s linear .4s;
    -ms-transition:all .5s linear .4s;
    -webkit-transition:all .5s linear .4s;
    transition:all .5s linear .4s;
}
.abt-main-iner1:hover::after{
    -moz-transition-delay:.1s;
    -webkit-transition-delay:.1s;
    -o-transition-delay:.1s;
    -ms-transition-delay:.1s;
    transition-delay:.1s;
}
.abt-main-iner1:hover .abt-iner-img{
  background: var(--white);
}
.abt-main-iner1:hover svg path{
      fill: revert-layer;
}
.abt-main-iner1:hover .inner-heading, .abt-main-iner1:hover .inner-para{
  color: var(--white);
  transition: unset;
}
.about-counter-box{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 100%;
  gap: 20px;
  padding: 15px 25px;
}
.about-counter-box h6{
  font-weight: 500;
}
.abt-iner-img{
  background: linear-gradient(180deg, #070395 0%, #00D7FE 100%);
  padding: 10px;
  border-radius: 50%;
  height: 85px;
  width: 85px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px
}
.abt-iner-img svg path{
  fill: #fff;
}
.about-img-main .abt-main-iner:nth-child(3) h2,.about-img-main .abt-main-iner:nth-child(3) h6{
  color: var(--white);
}
.abt-svg{
  position: absolute;
  right: 50px;
  z-index: -1;
      top: 25px;
}
.abt-bg-svg{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  z-index: -1;
}
#about-us .theme-btn-wrap{
  margin: unset;
}
#about-us .main-head{
  width: 75%;
}
.wpcf7 form .wpcf7-response-output{
      color: #fff;
}
.contac_form .wpcf7 form .wpcf7-response-output{
      color: #000;
}
/* Newsletter */
#Newsletter{
  position: relative;
  overflow: visible;
  z-index: 1;
}
#Newsletter .row{
padding: 50px 0;
}
#Newsletter::after{
  content: '';
  background: linear-gradient(92.1deg,var(--lightblue)  0%,  var(--darkblue)100%);
  padding: 25px 30px;
  inset: 0 0 0 10%;
  position: absolute;
  border-radius: 20px 0 0 20px;
  z-index: -2;
}
#Newsletter .container{
  position: relative;
}
#Newsletter .container::before{
  content: '';
  clip-path: polygon(2.383% 97.039%, 99.404% 97.039%, 99.404% 97.039%, 98.974% 96.401%, 97.759% 94.636%, 95.875% 91.974%, 93.438% 88.64%, 90.563% 84.862%, 87.364% 80.867%, 83.958% 76.883%, 80.459% 73.138%, 76.983% 69.857%, 73.645% 67.27%, 73.645% 67.27%, 69.544% 65.172%, 65.665% 64.331%, 61.954% 64.419%, 58.357% 65.109%, 54.82% 66.074%, 51.29% 66.987%, 47.713% 67.52%, 44.036% 67.346%, 40.205% 66.138%, 36.167% 63.569%, 36.167% 63.569%, 33.318% 61.14%, 30.71% 58.644%, 28.297% 56.039%, 26.032% 53.282%, 23.87% 50.331%, 21.764% 47.143%, 19.668% 43.675%, 17.534% 39.885%, 15.318% 35.73%, 12.973% 31.168%, 12.973% 31.168%, 11.331% 27.769%, 9.638% 23.994%, 7.948% 20.015%, 6.313% 16.005%, 4.785% 12.137%, 3.417% 8.584%, 2.262% 5.52%, 1.371% 3.117%, 0.798% 1.548%, 0.596% 0.987%, 0.596% 90.667%, 0.596% 90.667%, 0.596% 90.739%, 0.599% 90.942%, 0.608% 91.256%, 0.624% 91.66%, 0.652% 92.134%, 0.692% 92.66%, 0.749% 93.215%, 0.825% 93.781%, 0.922% 94.337%, 1.043% 94.863%, 1.043% 94.863%, 1.201% 95.379%, 1.373% 95.808%, 1.551% 96.158%, 1.729% 96.437%, 1.899% 96.653%, 2.054% 96.812%, 2.188% 96.923%, 2.292% 96.993%, 2.359% 97.029%, 2.383% 97.039%);
  background: linear-gradient(93.35deg, #070395 0.51%, #00D7FE 96.48%);
  height: 136%;
  position: absolute;
  left: -114px;
  top: -12px;
  z-index: 1;
  width: 70%;
  opacity: 10%;
  overflow: hidden;
}
.news-svg-btm{
  position: absolute;
  left: 165px;
  bottom: -20px;
  background: linear-gradient(92.14deg, #00D7FE -1.84%, #070395 100%);
  clip-path: polygon(100% 0%, 1.159% 0%, 1.159% 0%, 0.971% 0.081%, 0.792% 0.317%, 0.626% 0.693%, 0.474% 1.198%, 0.339% 1.819%, 0.224% 2.543%, 0.129% 3.357%, 0.059% 4.248%, 0.015% 5.204%, 0% 6.211%, 0% 93.573%, 0% 93.573%, 0.016% 94.604%, 0.062% 95.579%, 0.135% 96.486%, 0.233% 97.31%, 0.354% 98.039%, 0.494% 98.659%, 0.651% 99.157%, 0.822% 99.518%, 1.006% 99.731%, 1.198% 99.78%, 100% 81.677%, 100% 0%);
  width: 65%;
  height: 91%;
  opacity: 10%;
  z-index: -2;

}
/* TEstimonial */
#testimonial::after {
  content: '';
  background: linear-gradient(92.1deg, var(--darkblue) 0%, var(--lightblue) 100%);
  padding: 25px 30px;
  inset: 0 10% 0 0;
  position: absolute;
  border-radius: 0 20px 20px 0;
  z-index: -2;
  background-size: 400% 400%;
  animation: gradientMove 6s ease infinite;
}
@keyframes gradientMove {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
.test-heading-box{
  color: var(--white);
  display: flex;
  flex-direction: column;
  gap: 10px;

}
#testimonial .owl-stage-outer{
      padding: 5% 0;
}
.testimonial-box{
  background: #FFFFFF;
  padding: 20px;
  text-align: center;
  border-radius: 10px;
  position: relative;
  width: 90%;
  margin: 0 auto;
  color: #000;
}
.testimonial-box img{
  border-radius: 50%;
  height: 65px;
  width: 65px !important;
  object-fit: cover;
}
.test-content{
    font-size: 14px;
    line-height: 25px;
    font-weight: 400;
}
.test-title a{
  color: #000;
}
.testimonial-box::after{
  content: '';
  position: absolute;
  background: #FFFFFF;
  height: 103%;
  width: 103%;
  z-index: -1;
  border-radius: 10px;
  opacity: 10%;
  transform: rotate(4deg);
  left: -6px;
  top: -2px;
}
.custom-owl-nav{
      margin-top: 15%;
}
.test-shape1{
  clip-path: polygon(0% 0.648%, 99.257% 0.648%, 99.257% 0.648%, 98.824% 1.266%, 97.604% 2.974%, 95.712% 5.556%, 93.263% 8.794%, 90.375% 12.471%, 87.162% 16.371%, 83.74% 20.276%, 80.225% 23.969%, 76.733% 27.233%, 73.38% 29.851%, 73.38% 29.851%, 69.261% 32.004%, 65.364% 32.867%, 61.636% 32.777%, 58.023% 32.069%, 54.47% 31.078%, 50.924% 30.142%, 47.331% 29.594%, 43.638% 29.773%, 39.789% 31.013%, 35.732% 33.649%, 35.732% 33.649%, 32.87% 36.143%, 30.25% 38.704%, 27.826% 41.378%, 25.552% 44.207%, 23.38% 47.236%, 21.264% 50.508%, 19.158% 54.067%, 17.015% 57.957%, 14.789% 62.221%, 12.433% 66.904%, 12.433% 66.904%, 10.784% 70.392%, 9.083% 74.266%, 7.386% 78.35%, 5.743% 82.466%, 4.208% 86.436%, 2.834% 90.082%, 1.673% 93.227%, 0.779% 95.693%, 0.204% 97.303%, 0% 97.879%, 0% 0.648%);
  background: linear-gradient(99.42deg,  var(--pink) -0.2%, var(--lightblue) 100%);
  height: 100%;
  position: absolute;
  left: 0;
  top: -2px;
  z-index: 0;
  width: 43%;
  opacity: 30%;
}
#testimonial>.container{
  position: relative;
}
#testimonial>.container::after{
  content: '';
  clip-path: polygon(97.617% 97.769%, 0.596% 97.769%, 0.596% 97.769%, 1.026% 97.125%, 2.241% 95.345%, 4.125% 92.658%, 6.562% 89.295%, 9.437% 85.483%, 12.636% 81.453%, 16.042% 77.434%, 19.541% 73.655%, 23.017% 70.346%, 26.355% 67.735%, 26.355% 67.735%, 30.456% 65.619%, 34.335% 64.77%, 38.046% 64.859%, 41.643% 65.556%, 45.18% 66.529%, 48.71% 67.45%, 52.287% 67.988%, 55.964% 67.812%, 59.795% 66.594%, 63.833% 64.002%, 63.833% 64.002%, 66.682% 61.551%, 69.29% 59.033%, 71.703% 56.405%, 73.968% 53.624%, 76.13% 50.646%, 78.236% 47.43%, 80.332% 43.931%, 82.466% 40.108%, 84.682% 35.916%, 87.027% 31.313%, 87.027% 31.313%, 88.669% 27.884%, 90.362% 24.075%, 92.052% 20.061%, 93.687% 16.015%, 95.215% 12.113%, 96.583% 8.529%, 97.738% 5.437%, 98.629% 3.013%, 99.202% 1.43%, 99.404% 0.864%, 99.404% 91.34%, 99.404% 91.34%, 99.404% 91.413%, 99.401% 91.618%, 99.392% 91.934%, 99.376% 92.342%, 99.348% 92.821%, 99.308% 93.351%, 99.251% 93.911%, 99.175% 94.482%, 99.078% 95.043%, 98.957% 95.574%, 98.957% 95.574%, 98.799% 96.094%, 98.627% 96.527%, 98.449% 96.88%, 98.271% 97.161%, 98.101% 97.379%, 97.946% 97.54%, 97.812% 97.652%, 97.708% 97.722%, 97.641% 97.759%, 97.617% 97.769%);
  background: linear-gradient(93.35deg, #070395 0.51%, #146372 96.48%);
  height: 120%;
  position: absolute;
  right: -6%;
  bottom: -67px;
  z-index: 1;
  width: 70%;
  opacity: 10%;
  z-index: -1;
}
.testimonial-box:hover::after{
  transform: rotate(-4deg);
  background-color: var(--black);
  transition: 0.4s;
  opacity: 1;
}
.testimonial-box:hover img{
  transition: 1s;
  -webkit-transition: 0.70s;
  -moz-transition: 0.70s;
  -ms-transition: 0.70s;
  -o-transition: 0.70s;
  -webkit-transform: rotateY(360deg);
  -moz-transform: rotateY(360deg);
  -o-transform: rotateY(360deg);
  -ms-transform: rotateY(360deg);
  transform: rotateY(360deg);
}
#testimonial{
  overflow: visible;
}
.outer-test{
      position: absolute;
    right: 160px;
    bottom: -30px;
    background: linear-gradient(125.78deg, #070395 42.73%, #00D7FE 98.22%);
    opacity: 20%;
    width: 85%;
    height: 94%;
    z-index: -3;
    clip-path: polygon(0% 0.188%, 98.841% 0.188%, 98.841% 0.188%, 99.029% 0.243%, 99.208% 0.405%, 99.374% 0.663%, 99.526% 1.01%, 99.661% 1.437%, 99.777% 1.933%, 99.871% 2.492%, 99.941% 3.104%, 99.985% 3.76%, 100% 4.452%, 100% 95.731%, 100% 95.731%, 99.984% 96.446%, 99.937% 97.122%, 99.862% 97.749%, 99.762% 98.319%, 99.64% 98.821%, 99.498% 99.246%, 99.338% 99.585%, 99.164% 99.828%, 98.979% 99.966%, 98.784% 99.99%, 0% 81.886%, 0% 0.188%);
}
/* Faq */

#faq .accordion-button {
    background-color: var(--white);
    box-shadow: 0px 3px 6px 0px #00000026;
}

#faq .accordion-item{
  background: linear-gradient(90deg, #070395 0%, #00D7FE 100%);
  border: unset;
  margin-bottom: 20px;
  border-radius: 6px;
}
/* #faq .accordion-button.collapsed{
    background-color: #F2F2F2;
} */
#faq .accordion-button:not(.collapsed){
  background-color: transparent;
  box-shadow: unset;
  color: var(--white);
}
#faq .accordion-button{
  font: 500 16px / 20px var(--theme-font);
  color: #000;
  gap: 20px;
  padding: 15px 20px 15px 20px;
  border-radius: 5px;
}
 #faq  .accordion-button:not(.collapsed)::after{
  content: '\f077';
  font-family: "font awesome 6 free";
  font-weight: 900;
  font-size: 14px;
  background-image: unset !important;
  height: unset !important;
  width: unset !important;
  transition: unset;
  transform: unset !important;
}
.accordion-body{
    padding: 0px 20px 15px 20px;
}
.accordion-body p{
  font: 400 14px / 25px var(--theme-font);
  color: var(--white);
}

 #faq .accordion-button::after{
  content: '\f078';
  font-family: "font awesome 6 free";
  font-weight: 900;
  font-size: 14px;
  background-image: unset !important;
  height: unset !important;
  width: unset !important;
  transition: unset;
}
.faq-tab-wrap{
  background: linear-gradient(105.27deg, #070395 2.34%, #00D7FE 97.41%);
  padding: 25px 35px 25px 25px;
  border-radius: 10px;
  position: relative;
  z-index: 1;
}
.faq-tab-wrap h4{
    color: var(--white);
}
.faq-nav{
  gap: 15px;
  margin-top: 25px;
}
.faq-nav li button{
  font: 500 16px / 20px var(--theme-font);
  color: var(--white);
  padding: 10px 15px;
}
.faq-nav li .active{
  background: var(--white) !important;
  color: var(--black)  !important;
  width: 100%;
  display: flex;
  border-radius: 20px;
      box-shadow: 0px 3px 6px 0px #00000029;
}
.faq-nav  .nav-link:hover{
  color: var(--black);
}
#faq{
    padding-bottom: 116px;
    overflow: visible;
    margin-bottom: 2%;
}

#faq .faq-bg-svg{
  position: absolute;
  width: 100%;
}

.faq-top-svg{
  clip-path: polygon(4.526% 1.48%, 98.095% 1.48%, 98.095% 1.48%, 97.676% 2.105%, 96.494% 3.833%, 94.66% 6.442%, 92.287% 9.708%, 89.488% 13.408%, 86.374% 17.321%, 83.058% 21.223%, 79.652% 24.892%, 76.268% 28.105%, 73.018% 30.64%, 73.018% 30.64%, 69.026% 32.695%, 65.25% 33.519%, 61.637% 33.432%, 58.135% 32.756%, 54.692% 31.811%, 51.256% 30.917%, 47.774% 30.395%, 44.194% 30.565%, 40.465% 31.749%, 36.533% 34.265%, 36.533% 34.265%, 33.76% 36.645%, 31.221% 39.089%, 28.872% 41.641%, 26.667% 44.341%, 24.562% 47.232%, 22.512% 50.355%, 20.471% 53.752%, 18.395% 57.464%, 16.237% 61.534%, 13.954% 66.003%, 13.954% 66.003%, 12.355% 69.332%, 10.708% 73.03%, 9.062% 76.928%, 7.47% 80.856%, 5.983% 84.645%, 4.651% 88.125%, 3.526% 91.126%, 2.66% 93.48%, 2.102% 95.017%, 1.905% 95.567%, 1.905% 5.599%, 1.905% 5.599%, 1.906% 5.555%, 1.911% 5.43%, 1.926% 5.236%, 1.955% 4.981%, 2.003% 4.677%, 2.075% 4.334%, 2.174% 3.963%, 2.307% 3.573%, 2.478% 3.175%, 2.691% 2.78%, 2.691% 2.78%, 2.949% 2.402%, 3.208% 2.105%, 3.462% 1.879%, 3.704% 1.715%, 3.927% 1.603%, 4.125% 1.533%, 4.29% 1.495%, 4.417% 1.48%, 4.497% 1.478%, 4.526% 1.48%);
  background: linear-gradient(99.54deg, #070395 0%, #00D7FE 100%);
  opacity: 30%;
  width: 255px;
  height: 210px;
  position: absolute;
  top: 0;
  z-index: -1;
}
.faq-btm-svg{
  position: absolute;
  clip-path: polygon(95.333% 95.211%, 2.055% 95.211%, 2.055% 95.211%, 2.473% 94.589%, 3.651% 92.869%, 5.479% 90.274%, 7.845% 87.024%, 10.635% 83.342%, 13.739% 79.449%, 17.045% 75.567%, 20.441% 71.916%, 23.814% 68.719%, 27.054% 66.197%, 27.054% 66.197%, 31.033% 64.152%, 34.797% 63.333%, 38.399% 63.418%, 41.89% 64.091%, 45.323% 65.031%, 48.748% 65.921%, 52.219% 66.44%, 55.788% 66.271%, 59.505% 65.094%, 63.425% 62.59%, 63.425% 62.59%, 66.19% 60.222%, 68.721% 57.79%, 71.063% 55.251%, 73.26% 52.564%, 75.358% 49.688%, 77.402% 46.581%, 79.437% 43.201%, 81.507% 39.507%, 83.657% 35.457%, 85.934% 31.011%, 85.934% 31.011%, 87.527% 27.699%, 89.17% 24.019%, 90.81% 20.141%, 92.397% 16.232%, 93.88% 12.463%, 95.207% 9%, 96.329% 6.014%, 97.193% 3.672%, 97.749% 2.143%, 97.945% 1.596%, 97.945% 91.113%, 97.945% 91.113%, 97.944% 91.156%, 97.939% 91.28%, 97.924% 91.474%, 97.895% 91.727%, 97.847% 92.029%, 97.776% 92.371%, 97.676% 92.74%, 97.544% 93.128%, 97.374% 93.524%, 97.161% 93.917%, 97.161% 93.917%, 96.904% 94.293%, 96.646% 94.589%, 96.393% 94.813%, 96.152% 94.977%, 95.929% 95.088%, 95.732% 95.158%, 95.567% 95.196%, 95.441% 95.211%, 95.361% 95.213%, 95.333% 95.211%);
  background: linear-gradient(99.54deg, #00D7FE  0%, #070395 100%);
  opacity: 30%;
  width: 280px;
  height: 176px;
  right: -6px;
  z-index: -1;
  bottom: -8px;
}
/* documentation */
#documentation .nav-pills{
  background: linear-gradient(90deg, #070395 0%, #00D7FE 100%);
  padding: 7px;
  justify-content: center;
   border-radius: 10px;
}
#documentation .nav-item button{
  font:500 15px / 22px var(--theme-font);
  color: var(--white);
  padding: 8px 25px;
}
#documentation .nav-pills .nav-link.active{
    background: #FFFFFF;
    border-radius: 50px;
    color: var(--black);
}
.documentation-wrap {
  box-shadow: 0px 0px 10px 0px #00000029;
  margin: 3px;
  border-radius: 10px;
  padding: 20px;
  background: var(--white);
  position: relative;
  overflow: hidden;
      z-index: 1;
}
.documentation-wrap  h5{
      color: #000;
}
.document-sub-cat-post{
    font-family: Poppins;
    font-weight: 400;
    font-size: 15px;
    display: flex;
    align-items: baseline;
    color: #000;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.document-point{
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.document-sub-cat-post i{
    font-size: 13px;
}
.document-point h6 a{
  font-weight: 600;
      color: var(--black);
}
.documentation-cat-image{
    position: relative;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
        padding: 10px;
}
.documentation-cat-image::after{
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, #070395 0%, #00D7FE 100%);
  opacity: 20%;
  border-radius: 50%;
  z-index: -1;
}
#documentation .bg-svg{
  position: absolute;
  left: 0;
  top: 95px;
  right: 0;
  margin: 0 auto;
  width: 70%;
  z-index: -1;
}
.dark #documentation .bg-svg path,.dark .blog-svg path,.dark .abt-bg-svg path{
    opacity: 0.2;
}
#documentation{
  padding-bottom: 11%;
  padding-top: 6%;
}
.section-circle-svg{
  position: absolute;
  bottom: 0%;
  left: 15%;
  z-index: -1;
  animation: bouncess 4s ease-in-out 0s infinite alternate;
}
@-webkit-keyframes bouncess {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-40px);
  }
}
#documentation .theme-btn-wrap{
  position: relative;
  top: 40px;
}
.documentation-wrap  a{
  color: var(--black);
}
.single-cat-svg{
      position: absolute;
}
.documentation-wrap:hover .documentation-cat-image::after{
  background: linear-gradient(180deg, #070395 0%, #00D7FE 100%);
    opacity: 1;
}
.documentation-wrap:hover .documentation-cat-image svg path{
    fill: var(--white);
}
.documentation-wrap:hover h5{
  background: linear-gradient(180deg, var(--darkblue) 0%, var(--lightblue) 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
    letter-spacing: 0.5px;
    transition: 0.5s ease;
}

.documentation-wrap:after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;
  background: linear-gradient(180deg, #070395 0%, #00D7FE 100%);
  transition: all ease 0.4s;
  opacity: 1;
  border-radius: 10px;
  opacity: 20%;
  z-index: -1;
}
.documentation-wrap:hover:after {
  width: 100%;
  transition: all ease 0.4s;
}
 body.dark {
    background: #000;
    color: #fff;
  }
  .icon.dark{
        transform: rotate(-130deg);
  }
  /* Toggle container */
  .toggle {
    position: relative;
    width: 60px;
    height: 30px;
    background: #ddd;
    border-radius: 50px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 5px;
  }

  .toggle .icon {
    font-size: 20px;
    z-index: 1;
  }
  span.icon.dark{
    opacity: 0;
  }
  .active  span.icon.dark{
    opacity: 1;
  }
  /* Circle */
  .toggle .ball {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 24px;
    height: 24px;
    background: #000;
    border-radius: 50%;
    transition: transform 0.3s;
  }

  .toggle.active .ball {
    transform: translateX(30px);
    background: #fff;
  }
  .toggle.active .light-icon svg{
    opacity: 0;
  }
  .toggle.active {
        background: #262626;
  }

.home .header-inner {
    padding-top: 5px;
}
.title-box.banner-img{
    mask-image: url(assets/images/banner-mask.png);
    mask-repeat: no-repeat;
    mask-size: 100% 100%;
    position: relative;
    height: 100%;
    width: 95%;
    /* border-radius: 0 20px 30px 0; */
    background-size: 100% 100%;
    background-repeat: no-repeat;
    top: 8px;
}